40 lines
1.1 KiB
Vue
40 lines
1.1 KiB
Vue
<template>
|
|
<q-page>
|
|
<div class="flowchart">
|
|
<q-btn @click="showCondition()" class="q-mt-md" color="primary" icon="mdi-plus">条件エディタ表示</q-btn>
|
|
</div>
|
|
<condition-editor v-model:show="show" v-model:conditionTree="tree"></condition-editor>
|
|
<q-code>{{conditionString}}</q-code>
|
|
</q-page>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import {ref,reactive,computed} from 'vue';
|
|
import ConditionEditor from '../components/ConditionEditor/ConditionEditor.vue';
|
|
import { useFlowEditorStore } from 'stores/flowEditor';
|
|
import { ConditionTree,GroupNode,ConditionNode,LogicalOperator,Operator } from 'app/src/types/Conditions';
|
|
|
|
const store = useFlowEditorStore();
|
|
const tree = reactive(new ConditionTree());
|
|
const newNode = new ConditionNode({},Operator.Equal,'',tree.root);
|
|
tree.addNode(tree.root,newNode);
|
|
|
|
const show =ref(false);
|
|
const showCondition=()=>{
|
|
show.value=true;
|
|
}
|
|
const conditionString = computed(()=>{
|
|
return tree.buildConditionString(tree.root);
|
|
});
|
|
store.setApp({
|
|
appId:'146',
|
|
name:'トリトン管理部日報'
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.flowchart {
|
|
padding-top: 10px;
|
|
}
|
|
</style>
|