update: 优化场景联动过滤条件中的columns

This commit is contained in:
xieyonghong 2023-03-16 20:14:47 +08:00
parent f8fb98df44
commit a277fe1cb6
8 changed files with 79 additions and 29 deletions

View File

@ -94,8 +94,8 @@ export const useSceneStore = defineStore('scene', () => {
const branchesLength = branches.length; const branchesLength = branches.length;
if ( if (
triggerType === 'device' && triggerType === 'device' &&
((branchesLength === 1 && !!branches[0]?.when?.length) || // 有一组数据并且when有值 ((branchesLength === 1 && branches[0]?.when?.length) || // 有一组数据并且when有值
(branchesLength > 1 && !branches[branchesLength - 1]?.when?.length)) // 有多组否则数据并且最后一组when有值 (branchesLength > 1 && branches[branchesLength - 1]?.when?.length)) // 有多组否则数据并且最后一组when有值
) { ) {
branches.push(null); branches.push(null);
} }

View File

@ -82,6 +82,7 @@ import ParamsDropdown, { DoubleParamsDropdown } from '../../components/ParamsDro
import { inject } from 'vue' import { inject } from 'vue'
import { useSceneStore } from 'store/scene' import { useSceneStore } from 'store/scene'
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import { flattenDeep, set } from 'lodash-es'
const sceneStore = useSceneStore() const sceneStore = useSceneStore()
const { data: formModel } = storeToRefs(sceneStore) const { data: formModel } = storeToRefs(sceneStore)
@ -207,12 +208,32 @@ const mouseout = () => {
} }
} }
const columnSelect = () => { const handleOptionsColumnsValue = (termsColumns: any[], _options: any) => {
formModel.value.branches![props.branchName].then[props.thenName].actions[props.name].options!.termsColumns = termsColumns
const flatten = new Set(flattenDeep(termsColumns))
let newColumns = [...flatten.values()]
if (_options?.otherColumns) {
newColumns = [..._options?.otherColumns, ...newColumns]
}
formModel.value.branches![props.branchName].then[props.thenName].actions[props.name].options!.columns = newColumns
}
const columnSelect = (e: any) => {
paramsValue.termType = 'eq' paramsValue.termType = 'eq'
paramsValue.value = { paramsValue.value = {
source: tabsOptions.value[0].key, source: tabsOptions.value[0].key,
value: undefined value: undefined
} }
const columns = e.metadata === true ? [e.column] : []
const _options = formModel.value.branches![props.branchName].then[props.thenName].actions[props.actionName].options
const termsColumns = _options?.termsColumns || []
set(
termsColumns,
[props.termsName, props.name],
columns
)
handleOptionsColumnsValue(termsColumns, _options)
emit('update:value', { ...paramsValue }) emit('update:value', { ...paramsValue })
} }
@ -245,6 +266,14 @@ const termAdd = () => {
const onDelete = () => { const onDelete = () => {
formModel.value.branches?.[props.branchName]?.then?.[props.thenName]?.actions?.[props.actionName].terms?.[props.termsName].terms?.splice(props.name, 1) formModel.value.branches?.[props.branchName]?.then?.[props.thenName]?.actions?.[props.actionName].terms?.[props.termsName].terms?.splice(props.name, 1)
const _options = formModel.value.branches![props.branchName].then[props.thenName].actions[props.name].options
const termsColumns = _options?.termsColumns || []
set(
termsColumns,
[props.termsName, props.name],
[]
)
handleOptionsColumnsValue(termsColumns, _options)
} }
nextTick(() => { nextTick(() => {

View File

@ -58,7 +58,7 @@ import { storeToRefs } from 'pinia'
import { useSceneStore } from 'store/scene' import { useSceneStore } from 'store/scene'
import DropdownButton from '../../components/DropdownButton' import DropdownButton from '../../components/DropdownButton'
import FilterItem from './FilterCondition.vue' import FilterItem from './FilterCondition.vue'
import { isArray } from 'lodash-es' import { flattenDeep, isArray, set } from 'lodash-es'
import { provide } from 'vue' import { provide } from 'vue'
import { randomString } from '@/utils/utils' import { randomString } from '@/utils/utils'
import { useParams } from '@/views/rule-engine/Scene/Save/util' import { useParams } from '@/views/rule-engine/Scene/Save/util'
@ -66,8 +66,6 @@ import { useParams } from '@/views/rule-engine/Scene/Save/util'
const sceneStore = useSceneStore() const sceneStore = useSceneStore()
const { data: formModel } = storeToRefs(sceneStore) const { data: formModel } = storeToRefs(sceneStore)
const props = defineProps({ const props = defineProps({
isFirst: { isFirst: {
type: Boolean, type: Boolean,
@ -103,9 +101,7 @@ const { columnOptions } = useParams({
branch: props.branchName, branch: props.branchName,
branchGroup: props.thenName, branchGroup: props.thenName,
action: props.actionName action: props.actionName
}, [ })
formModel.value.branches![props.branchName].then[props.thenName].actions[props.actionName]
])
provide('filter-params', columnOptions) provide('filter-params', columnOptions)
@ -123,6 +119,16 @@ const mouseout = () => {
showDelete.value = false showDelete.value = false
} }
const handleOptionsColumnsValue = (termsColumns: any[], _options: any) => {
formModel.value.branches![props.branchName].then[props.thenName].actions[props.name].options!.termsColumns = termsColumns
const flatten = new Set(flattenDeep(termsColumns))
let newColumns = [...flatten.values()]
if (_options?.otherColumns) {
newColumns = [..._options?.otherColumns, ...newColumns]
}
formModel.value.branches![props.branchName].then[props.thenName].actions[props.name].options!.columns = newColumns
}
const addTerms = () => { const addTerms = () => {
const item: any = { const item: any = {
type: 'and', type: 'and',
@ -154,6 +160,13 @@ const onDelete = () => {
.then[props.thenName] .then[props.thenName]
.actions[props.actionName] .actions[props.actionName]
.terms?.splice(props.name, 1) .terms?.splice(props.name, 1)
const _options = formModel.value.branches![props.branchName].then[props.thenName].actions[props.actionName].options
const termsColumns = _options?.termsColumns || []
if (_options?.termsColumns) {
termsColumns.splice(props.name, 1)
handleOptionsColumnsValue(termsColumns, _options)
}
} }
const rules = [ const rules = [

View File

@ -446,6 +446,11 @@ const termsOptions = computed(() => {
}); });
const onDelete = () => { const onDelete = () => {
if (props.name !== 0 && !props.parallel) { // options.termsColumnsterms
_data.value.branches![props.branchesName].then[props.thenName].actions[props.name - 1].options!.termsColumns = []
_data.value.branches![props.branchesName].then[props.thenName].actions[props.name - 1].options!.terms = []
_data.value.branches![props.branchesName].then[props.thenName].actions[props.name - 1].terms = []
}
emit('delete'); emit('delete');
}; };
@ -453,11 +458,16 @@ const onClose = () => {
visible.value = false; visible.value = false;
}; };
const onSave = (data: ActionsType, options?: any) => { const onSave = (data: ActionsType, options: any) => {
emit('update', data, options); const { key, terms } = _data.value.branches![props.branchesName].then?.[props.thenName].actions?.[props.name]
// setTimeout(() => { const actionItem: ActionsType = {
// getParams(); ...data,
// }, 10); options,
key,
terms
}
_data.value.branches![props.branchesName].then[props.thenName].actions.splice(props.name, 1, actionItem)
visible.value = false; visible.value = false;
}; };

View File

@ -11,7 +11,6 @@
:isLast="index === actions.length - 1" :isLast="index === actions.length - 1"
:options="item.options" :options="item.options"
@delete="_delete(item.key || '')" @delete="_delete(item.key || '')"
@update="(data, options) => _update(data, options, item)"
/> />
</template> </template>
<div class="actions-add-list" :class="{ 'border': props.actions.length }"> <div class="actions-add-list" :class="{ 'border': props.actions.length }">
@ -37,7 +36,6 @@ import { PropType } from 'vue';
import { ActionsType, ParallelType } from '../../../typings'; import { ActionsType, ParallelType } from '../../../typings';
import Modal from '../Modal/index.vue'; import Modal from '../Modal/index.vue';
import Item from './Item.vue'; import Item from './Item.vue';
import { pick } from 'lodash';
import { useSceneStore } from '@/store/scene'; import { useSceneStore } from '@/store/scene';
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
@ -98,9 +96,7 @@ const _delete = (_key: string) => {
emit('delete', _key) emit('delete', _key)
} }
const _update = (data: ActionsType, options: any, item: any) => { const _update = () => {
const olData = pick(item, ['terms']);
emit('add', {...olData, ...data, options})
visible.value = false visible.value = false
} }
</script> </script>

View File

@ -131,7 +131,8 @@ const onOk = () => {
emit( emit(
'save', 'save',
{ {
...props.data, // ...props.data,
key: props.data.key,
executor: 'alarm', executor: 'alarm',
alarm: { mode: values.type }, alarm: { mode: values.type },
}, },

View File

@ -130,13 +130,14 @@ const onDelete = (_key: string, _parallel: boolean) => {
const onAdd = (actionItem: any, _parallel: boolean) => { const onAdd = (actionItem: any, _parallel: boolean) => {
const thenName = props.thenOptions.findIndex(item => item.parallel === _parallel) const thenName = props.thenOptions.findIndex(item => item.parallel === _parallel)
if (thenName !== -1) { // if (thenName !== -1) { //
const cacheAction = props.thenOptions[thenName].actions // const cacheAction = props.thenOptions[thenName].actions
const indexOf = cacheAction?.findIndex(item => item.key === actionItem.key) || -1 // const indexOf = cacheAction?.findIndex(item => item.key === actionItem.key) || -1
if (indexOf !== -1) { // if (indexOf !== -1) {
FormModel.value.branches?.[props.name].then?.[thenName].actions.splice(indexOf, 1, actionItem) // FormModel.value.branches?.[props.name].then?.[thenName].actions.splice(indexOf, 1, actionItem)
} else { // } else {
FormModel.value.branches?.[props.name].then?.[thenName].actions.push(actionItem) // FormModel.value.branches?.[props.name].then?.[thenName].actions.push(actionItem)
} // }
FormModel.value.branches?.[props.name].then?.[thenName].actions.push(actionItem)
} else { // } else { //
const newThenItem = { const newThenItem = {
parallel: _parallel, parallel: _parallel,

View File

@ -27,7 +27,7 @@ export const getParams = (params: Params, sceneModel: FormModelType): Promise<an
/** /**
* @param params * @param params
*/ */
export const useParams = (params: Params, effect: any[] = []) => { export const useParams = (params: Params) => {
const sceneStore = useSceneStore() const sceneStore = useSceneStore()
const { data: formModel } = storeToRefs(sceneStore) const { data: formModel } = storeToRefs(sceneStore)
const columnOptions = ref<any[]>([]) const columnOptions = ref<any[]>([])
@ -38,7 +38,7 @@ export const useParams = (params: Params, effect: any[] = []) => {
} }
watchEffect(() => { watchEffect(() => {
if (effect[0]) { if (formModel.value.branches![params.branch].then[params.branchGroup].actions[params.action]) {
handleParams() handleParams()
} }
}) })