132 lines
4.0 KiB
Vue
132 lines
4.0 KiB
Vue
<template>
|
|
<q-field labelColor="primary" class="condition-object" dense outlined :label="label" :disable="disabled"
|
|
:clearable="isSelected">
|
|
<template v-slot:control>
|
|
<!-- <q-chip color="primary" text-color="white" v-if="isSelected && selectedObject.objectType==='field'" :dense="true" class="selected-obj">
|
|
{{ selectedObject.name }}
|
|
</q-chip>
|
|
<q-chip color="info" text-color="white" v-if="isSelected && selectedObject.objectType==='variable'" :dense="true" class="selected-obj">
|
|
{{ selectedObject.name.name }}
|
|
</q-chip> -->
|
|
{{ selectedObject?.sharedText }}
|
|
</template>
|
|
<template v-slot:append>
|
|
<q-icon name="search" class="cursor-pointer" @click="showDg" />
|
|
</template>
|
|
</q-field>
|
|
<show-dialog v-model:visible="show" name="設定項目" @close="closeDg" min-width="400px">
|
|
<!-- <template v-slot:toolbar>
|
|
<q-input dense debounce="200" v-model="filter" placeholder="検索" clearable>
|
|
<template v-slot:before>
|
|
<q-icon name="search" />
|
|
</template>
|
|
</q-input>
|
|
</template>
|
|
<condition-objects ref="appDg" name="フィールド" type="single" :filter="filter" :appId="store.appInfo?.appId" :vars="vars"></condition-objects>
|
|
-->
|
|
<DynamicItemInput v-model:selectedObject="selectedObject" :canInput="config.canInput"
|
|
:buttonsConfig="config.buttonsConfig" :appId="store.appInfo?.appId" />
|
|
</show-dialog>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { defineComponent, reactive, ref, watchEffect, computed } from 'vue';
|
|
import ShowDialog from '../ShowDialog.vue';
|
|
// import ConditionObjects from '../ConditionObjects.vue';
|
|
import DynamicItemInput from '../DynamicItemInput/DynamicItemInput.vue';
|
|
import { useFlowEditorStore } from '../../stores/flowEditor';
|
|
import { IActionFlow, IActionNode, IActionVariable } from '../../types/ActionTypes';
|
|
export default defineComponent({
|
|
name: 'ConditionObject',
|
|
components: {
|
|
ShowDialog,
|
|
DynamicItemInput,
|
|
// ConditionObjects
|
|
},
|
|
props: {
|
|
disabled: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
label: {
|
|
type: String,
|
|
default: undefined
|
|
},
|
|
config: {
|
|
type: Object,
|
|
default: () => {
|
|
return {
|
|
canInput: false,
|
|
buttonsConfig: [
|
|
{ label: 'フィールド', color: 'primary', type: 'FieldAdd' },
|
|
{ label: '変数', color: 'green', type: 'VariableAdd' },
|
|
]
|
|
};
|
|
}
|
|
},
|
|
modelValue: {
|
|
type: Object,
|
|
default: null
|
|
},
|
|
},
|
|
setup(props, { emit }) {
|
|
// const appDg = ref();
|
|
const show = ref(false);
|
|
const selectedObject = ref(props.modelValue);
|
|
const store = useFlowEditorStore();
|
|
// const sharedText = ref(''); // 共享的文本状态
|
|
const isSelected = computed(() => {
|
|
return selectedObject?.value?.sharedText !== '';
|
|
});
|
|
// const isSelected = computed(()=>{
|
|
// return selectedObject.value!==null && typeof selectedObject.value === 'object' && ('name' in selectedObject.value)
|
|
// });
|
|
let vars: IActionVariable[] = [];
|
|
if (store.currentFlow !== undefined && store.activeNode !== undefined) {
|
|
vars = store.currentFlow.getVarNames(store.activeNode);
|
|
}
|
|
// const filter=ref('');
|
|
const showDg = () => {
|
|
show.value = true;
|
|
};
|
|
|
|
const closeDg = (val: string) => {
|
|
if (val == 'OK') {
|
|
// selectedObject.value = appDg.value.selected[0];
|
|
}
|
|
};
|
|
|
|
watchEffect(() => {
|
|
emit('update:modelValue', selectedObject.value);
|
|
});
|
|
|
|
return {
|
|
store,
|
|
// appDg,
|
|
show,
|
|
showDg,
|
|
closeDg,
|
|
selectedObject,
|
|
vars: reactive(vars),
|
|
isSelected,
|
|
buttonsConfig: [
|
|
{ label: 'フィールド', color: 'primary', type: 'FieldAdd' },
|
|
{ label: '変数', color: 'green', type: 'VariableAdd' },
|
|
]
|
|
// filter
|
|
};
|
|
}
|
|
});
|
|
</script>
|
|
<style lang="scss">
|
|
.condition-object {
|
|
min-width: 200px;
|
|
max-height: 40px;
|
|
margin: 0 2px;
|
|
}
|
|
|
|
.selected-obj {
|
|
margin: 0 2px;
|
|
}
|
|
</style>
|