mirror of
https://github.com/dtomlinson91/anno-production-chain-renderer.git
synced 2025-12-22 06:15:45 +00:00
add latest
This commit is contained in:
@@ -83,11 +83,25 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { onMounted } from 'vue';
|
||||||
|
import mermaid from 'mermaid';
|
||||||
|
|
||||||
|
// Production Chain Data
|
||||||
import { productionChains } from './production-chains';
|
import { productionChains } from './production-chains';
|
||||||
|
|
||||||
// Components
|
// Components
|
||||||
import ChainTiers from 'components/ChainTiers.vue';
|
import ChainTiers from 'components/ChainTiers.vue';
|
||||||
import ProductionChain from 'components/ProductionChain.vue';
|
import ProductionChain from 'components/ProductionChain.vue';
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
mermaid.initialize({
|
||||||
|
startOnLoad: false,
|
||||||
|
logLevel: 'fatal',
|
||||||
|
securityLevel: 'loose',
|
||||||
|
theme: 'neutral',
|
||||||
|
flowchart: { htmlLabels: true }
|
||||||
|
});
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss"></style>
|
<style lang="scss"></style>
|
||||||
|
|||||||
@@ -3,8 +3,8 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { ref, watchEffect } from 'vue';
|
||||||
import mermaid from 'mermaid';
|
import mermaid from 'mermaid';
|
||||||
import { onMounted, ref, watchEffect } from 'vue';
|
|
||||||
|
|
||||||
// HTML Refs
|
// HTML Refs
|
||||||
const diagram = ref<HTMLInputElement | null>(null);
|
const diagram = ref<HTMLInputElement | null>(null);
|
||||||
@@ -15,17 +15,6 @@ const props = defineProps<{
|
|||||||
mermaidDefinition: string;
|
mermaidDefinition: string;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
// Mermaid
|
|
||||||
onMounted(() => {
|
|
||||||
mermaid.initialize({
|
|
||||||
startOnLoad: false,
|
|
||||||
logLevel: 'fatal',
|
|
||||||
securityLevel: 'loose',
|
|
||||||
theme: 'neutral',
|
|
||||||
flowchart: { htmlLabels: true }
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
watchEffect(() => {
|
watchEffect(() => {
|
||||||
if (diagram.value != null) {
|
if (diagram.value != null) {
|
||||||
mermaid.render(
|
mermaid.render(
|
||||||
|
|||||||
Reference in New Issue
Block a user