简柏林 / thingskit-front · Commits

Commit c3cb603f8c75fa828d9026890f4b92524119412b

Authored by sqy
1 parent cf368d5a

'refactor:重写场景联动'

Inline Side-by-side
Showing 10 changed files with 802 additions and 1189 deletions
@@ -44,23 +44,12 @@ export const screenLinkPageGetApi = (params?: ScreenLinkPageQueryParam) => { @@ -44,23 +44,12 @@ export const screenLinkPageGetApi = (params?: ScreenLinkPageQueryParam) => {
44 }; 44 };
45 45
46 /** 46 /**
47 - * 新增场景联动 47 + * 新增或更新场景联动
48 * @param params pageSize page name 48 * @param params pageSize page name
49 */ 49 */
50 -export const screenLinkPageAddApi = (params: ScreenAddModel) => { 50 +export const screenLinkPageAddApi = (params: ScreenAddModel, isUpdate: boolean) => {
51 return defHttp.post<ScreenAddModel>({ 51 return defHttp.post<ScreenAddModel>({
52 - url: ScreenManagerApi.SCREEN_ADD_URL,  
53 - params,  
54 - });  
55 -};  
56 -  
57 -/**  
58 - * 更新场景联动  
59 - * @param params pageSize page name  
60 - */  
61 -export const screenLinkPageUpdateApi = (params: ScreenUpdateModel) => {  
62 - return defHttp.post<ScreenUpdateModel>({  
63 - url: ScreenManagerApi.SCREEN_UPDATE_URL, 52 + url: isUpdate ? ScreenManagerApi.SCREEN_UPDATE_URL : ScreenManagerApi.SCREEN_ADD_URL,
64 params, 53 params,
65 }); 54 });
66 }; 55 };
@@ -73,7 +62,7 @@ export const screenLinkPageDeleteApi = (ids: string[]) => { @@ -73,7 +62,7 @@ export const screenLinkPageDeleteApi = (ids: string[]) => {
73 return defHttp.delete({ 62 return defHttp.delete({
74 url: ScreenManagerApi.SCREEN_DELETE_URL, 63 url: ScreenManagerApi.SCREEN_DELETE_URL,
75 data: { 64 data: {
76 - ids: ids, 65 + ids,
77 }, 66 },
78 }); 67 });
79 }; 68 };
  1 +<template>
  2 + <div>
  3 + <BasicDrawer
  4 + v-bind="$attrs"
  5 + @register="registerDrawer"
  6 + showFooter
  7 + @ok="handleSubmit"
  8 + width="100vw"
  9 + @close="handleClose"
  10 + :title="title"
  11 + >
  12 + <div>
  13 + <!-- 基础表单 -->
  14 + <BasicForm @register="registerForm" />
  15 + <!-- 基础表单 -->
  16 + <!-- 触发器-begin -->
  17 + <div>
  18 + <template v-for="(item, index) in triggerData" :key="item">
  19 + <Trigger
  20 + class="mt-4"
  21 + :triggerIndex="index"
  22 + :ref="skipUnwrap.triggerItemRefs"
  23 + @deleteTrigger="deleteTrigger"
  24 + />
  25 + </template>
  26 + <!-- 按钮 -->
  27 + <a-button type="primary" class="mt-4" @click="addTrigger"> 添加触发器</a-button>
  28 + <!-- 按钮 -->
  29 + </div>
  30 + <!-- 触发器-end -->
  31 +
  32 + <!-- 执行条件-begin -->
  33 + <div>
  34 + <template v-for="(item, index) in conditionData" :key="item">
  35 + <Condition
  36 + class="mt-4"
  37 + :conditionIndex="index"
  38 + :ref="skipUnwrap.conditionItemRefs"
  39 + @deleteCondition="deleteCondition"
  40 + />
  41 + </template>
  42 + <!-- 按钮 -->
  43 + <a-button type="primary" class="mt-4" @click="addCondition"> 添加执行条件</a-button>
  44 + <!-- 按钮 -->
  45 + </div>
  46 + <!-- 执行条件-end -->
  47 +
  48 + <!-- 执行动作-begin -->
  49 + <div>
  50 + <template v-for="(item, index) in actionData" :key="item">
  51 + <Action
  52 + class="mt-4"
  53 + :actionIndex="index"
  54 + :actionData="actionData"
  55 + :ref="skipUnwrap.actionItemRefs"
  56 + @deleteAction="deleteAction"
  57 + />
  58 + </template>
  59 +
  60 + <!-- 按钮 -->
  61 + <a-button type="primary" class="mt-4" @click="addAction"> 添加执行动作</a-button>
  62 + <!-- 按钮 -->
  63 + </div>
  64 + <!-- 执行动作-end -->
  65 + </div>
  66 + </BasicDrawer>
  67 + </div>
  68 +</template>
  69 +<script lang="ts">
  70 + import { defineComponent, ref, watch, unref, computed, nextTick } from 'vue';
  71 + import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  72 + import { formSchema, organizationId } from './config';
  73 + import { BasicForm, useForm } from '/@/components/Form';
  74 + import { formatTriggerData, formatConditionData } from './cpns/format-data';
  75 + import { useMessage } from '/@/hooks/web/useMessage';
  76 + import {
  77 + screenLinkPageAddApi,
  78 + screenLinkPageByDeptIdGetDevice,
  79 + } from '/@/api/ruleengine/ruleengineApi';
  80 + import Trigger from './cpns/Trigger.vue';
  81 + import Condition from './cpns/Condition.vue';
  82 + import Action from './cpns/Action.vue';
  83 + export default defineComponent({
  84 + name: 'SceneLinkAgeDrawer',
  85 + components: {
  86 + BasicDrawer,
  87 + BasicForm,
  88 + Trigger,
  89 + Condition,
  90 + Action,
  91 + },
  92 + emits: ['register', 'success'],
  93 + setup(_, { emit }) {
  94 + const { createMessage } = useMessage();
  95 + const triggerData = ref([]);
  96 + const conditionData = ref([]);
  97 + const actionData = ref([]);
  98 + const skipUnwrap = {
  99 + triggerItemRefs: ref([]),
  100 + conditionItemRefs: ref([]),
  101 + actionItemRefs: ref([]),
  102 + };
  103 + const title = computed(() => `${isUpdate.value ? '编辑' : '新增'}场景联动`);
  104 + let getTriggerFormValue = ref([]);
  105 + let getConditionFormValue = ref([]);
  106 + let getActionFormValue = ref([]);
  107 + const editEntryIdData = ref([]);
  108 + const isUpdate = ref(false);
  109 + const id = ref(undefined);
  110 + const tenantId = ref(undefined);
  111 + const [registerForm, { resetFields, validate, setFieldsValue }] = useForm({
  112 + labelWidth: 120,
  113 + schemas: formSchema,
  114 + showActionButtonGroup: false,
  115 + });
  116 + const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
  117 + setDrawerProps({ confirmLoading: false });
  118 + isUpdate.value = data.isUpdate;
  119 + if (!unref(isUpdate)) {
  120 + resetFields();
  121 + //初始化执行动作
  122 + actionData.value = [Date.now()];
  123 + } else {
  124 + // 取值
  125 + const {
  126 + id: recordId,
  127 + tenantId: recordTenantId,
  128 + organizationId,
  129 + triggers,
  130 + doConditions,
  131 + doActions,
  132 + } = data.record;
  133 + // 赋值
  134 + await setFieldsValue(data.record);
  135 + id.value = recordId;
  136 + tenantId.value = recordTenantId;
  137 + // 获取当前组织下的设备列表
  138 + const options = await screenLinkPageByDeptIdGetDevice({
  139 + organizationId,
  140 + });
  141 + // 生成回显时对应得组件数量
  142 + triggerData.value = [...new Array(triggers.length).keys()];
  143 + conditionData.value = [...new Array(doConditions.length).keys()];
  144 + actionData.value = [...new Array(doActions.length).keys()];
  145 + // 回显设备列表
  146 + editEntryIdData.value = options.items.map((v) => {
  147 + return {
  148 + value: v.tbDeviceId,
  149 + label: v.name,
  150 + };
  151 + });
  152 + nextTick(() => {
  153 + setEditFields(skipUnwrap.triggerItemRefs, editEntryIdData);
  154 + setEditFields(skipUnwrap.conditionItemRefs, editEntryIdData);
  155 + setEditFields(skipUnwrap.actionItemRefs, editEntryIdData);
  156 + });
  157 +
  158 + // 回显触发器数据---此处是个闭包!
  159 + triggers.forEach((trigger, index) => {
  160 + nextTick(() => {
  161 + unref(skipUnwrap.triggerItemRefs)[index].setFieldsFormValueFun({
  162 + triggerType: trigger.triggerType,
  163 + entityId: trigger.entityId,
  164 + type1: trigger.triggerCondition?.condition[0]?.key?.type,
  165 + type2: trigger.triggerCondition?.condition[0]?.key?.key,
  166 + operation: trigger.triggerCondition?.condition[0]?.predicate?.operation,
  167 + value: trigger.triggerCondition?.condition[0]?.predicate?.value?.defaultValue,
  168 + });
  169 + });
  170 + });
  171 +
  172 + doConditions.forEach((item, index) => {
  173 + nextTick(() => {
  174 + unref(skipUnwrap.conditionItemRefs)[index].setFieldsFormValueFun({
  175 + triggerType: item?.triggerType,
  176 + entityId: item?.entityId,
  177 + type: item.triggerCondition?.condition[0].key.key,
  178 + operation: item?.triggerCondition?.condition[0]?.predicate?.operation,
  179 + value: item?.triggerCondition?.condition[0]?.predicate?.value?.defaultValue,
  180 + });
  181 + });
  182 + });
  183 +
  184 + doActions.forEach((item, index) => {
  185 + nextTick(() => {
  186 + unref(skipUnwrap.actionItemRefs)[index].setFieldsFormValueFun({
  187 + outTarget: item.outTarget,
  188 + deviceId: item.deviceId,
  189 + });
  190 + unref(skipUnwrap.actionItemRefs)[index].setJsonValue(item.doContext.params);
  191 + });
  192 + });
  193 + }
  194 + });
  195 +
  196 + // 设置设备的options
  197 + const setEditFields = (linkAge, deviceList) => {
  198 + unref(linkAge).map((item) => {
  199 + item.updateFieldDeviceId(deviceList);
  200 + });
  201 + };
  202 + // 监听组织变化更新设备列表
  203 + const deviceList = ref([]);
  204 + watch(organizationId, async (newValue: string) => {
  205 + if (!newValue) return;
  206 + const { items } = await screenLinkPageByDeptIdGetDevice({ organizationId: newValue });
  207 + deviceList.value = items.map((item) => ({ label: item.name, value: item.tbDeviceId }));
  208 + setFields(skipUnwrap.triggerItemRefs, true);
  209 + setFields(skipUnwrap.conditionItemRefs, true);
  210 + setFields(skipUnwrap.actionItemRefs, true);
  211 + });
  212 +
  213 + // 根据上面组织变化动态改变触发器，执行条件,执行动作的设备值
  214 + function setFields(linkAge, isOrganizationChange = false) {
  215 + unref(linkAge).map((item) => {
  216 + isOrganizationChange && item.resetFieldsValueFunc();
  217 + item.updateFieldDeviceId(deviceList);
  218 + });
  219 + }
  220 +
  221 + // 添加触发器
  222 + const addTrigger = () => {
  223 + unref(triggerData).push(Date.now());
  224 + nextTick(() => {
  225 + setFields(skipUnwrap.triggerItemRefs);
  226 + });
  227 + };
  228 + // 添加执行条件
  229 + const addCondition = () => {
  230 + unref(conditionData).push(Date.now());
  231 + nextTick(() => {
  232 + setFields(skipUnwrap.conditionItemRefs);
  233 + });
  234 + };
  235 + // 添加执行动作
  236 + const addAction = () => {
  237 + unref(actionData).push(Date.now());
  238 + nextTick(() => {
  239 + setFields(skipUnwrap.actionItemRefs);
  240 + });
  241 + };
  242 +
  243 + /**
  244 + * 获取触发器、执行条件、执行动作表单值--多个
  245 + */
  246 + const getFormValueFunc = () => {
  247 + getTriggerFormValue.value = unref(skipUnwrap.triggerItemRefs)?.map((item) => {
  248 + return formatTriggerData(item.getFieldsValueFunc());
  249 + });
  250 + getConditionFormValue.value = unref(skipUnwrap.conditionItemRefs).map((item) => {
  251 + return formatConditionData(item.getFieldsValueFunc());
  252 + });
  253 + getActionFormValue.value = unref(skipUnwrap.actionItemRefs).map((item) => {
  254 + return item.getFieldsValueFunc();
  255 + });
  256 + };
  257 + const handleSubmit = async () => {
  258 + let basicFormValue = await validate();
  259 + if (!basicFormValue) return;
  260 + for (const item of unref(skipUnwrap.actionItemRefs)) {
  261 + const valid = await item.validateForm();
  262 + if (!valid) return;
  263 + }
  264 + try {
  265 + setDrawerProps({ confirmLoading: true });
  266 + getFormValueFunc();
  267 + const postAddOrEditData = {
  268 + ...basicFormValue,
  269 + triggers: unref(getTriggerFormValue),
  270 + doConditions: unref(getConditionFormValue),
  271 + doActions: unref(getActionFormValue),
  272 + ...{
  273 + id: unref(id),
  274 + tenantId: unref(tenantId),
  275 + },
  276 + };
  277 + await screenLinkPageAddApi(postAddOrEditData, unref(isUpdate));
  278 + createMessage.success(`${unref(isUpdate) ? '编辑' : '新增'}成功`);
  279 + closeDrawer();
  280 + handleClose();
  281 + emit('success');
  282 + } finally {
  283 + setDrawerProps({ confirmLoading: false });
  284 + }
  285 + };
  286 +
  287 + // 删除
  288 + const deleteTrigger = (triggerIndex: number) => {
  289 + unref(triggerData).splice(triggerIndex, 1);
  290 + };
  291 + const deleteCondition = (conditionIndex: number) => {
  292 + unref(conditionData).splice(conditionIndex, 1);
  293 + };
  294 + const deleteAction = (actionIndex: number) => {
  295 + unref(actionData).splice(actionIndex, 1);
  296 + };
  297 + const handleClose = () => {
  298 + id.value = undefined;
  299 + tenantId.value = undefined;
  300 + organizationId.value = undefined;
  301 + getTriggerFormValue.value = [];
  302 + getConditionFormValue.value = [];
  303 + getActionFormValue.value = [];
  304 + triggerData.value = [];
  305 + conditionData.value = [];
  306 + actionData.value = [];
  307 + unref(skipUnwrap.triggerItemRefs).map((item) => {
  308 + item.resetFieldsValueFunc();
  309 + });
  310 + unref(skipUnwrap.conditionItemRefs).map((item) => {
  311 + item.resetFieldsValueFunc();
  312 + });
  313 + unref(skipUnwrap.actionItemRefs).map((item) => {
  314 + item.resetFieldsValueFunc();
  315 + });
  316 + };
  317 +
  318 + return {
  319 + title,
  320 + isUpdate,
  321 + registerDrawer,
  322 + registerForm,
  323 + // 添加 or 删除 触发器,条件,动作
  324 + triggerData,
  325 + conditionData,
  326 + actionData,
  327 + addCondition,
  328 + addTrigger,
  329 + addAction,
  330 + deleteTrigger,
  331 + deleteCondition,
  332 + deleteAction,
  333 + // Refs引用
  334 + skipUnwrap,
  335 + handleSubmit,
  336 + handleClose,
  337 + };
  338 + },
  339 + });
  340 +</script>
  1 +import { ref, h } from 'vue';
1 import { BasicColumn, FormSchema } from '/@/components/Table'; 2 import { BasicColumn, FormSchema } from '/@/components/Table';
2 -import { ref } from 'vue';  
3 import { 3 import {
4 screenLinkOrganizationGetApi, 4 screenLinkOrganizationGetApi,
5 screenLinkPagePutApi, 5 screenLinkPagePutApi,
6 } from '/@/api/ruleengine/ruleengineApi'; 6 } from '/@/api/ruleengine/ruleengineApi';
7 -import { h } from 'vue';  
8 import { Switch } from 'ant-design-vue'; 7 import { Switch } from 'ant-design-vue';
9 import { useMessage } from '/@/hooks/web/useMessage'; 8 import { useMessage } from '/@/hooks/web/useMessage';
10 import { copyTransFun } from '/@/utils/fnUtils'; 9 import { copyTransFun } from '/@/utils/fnUtils';
@@ -36,25 +35,10 @@ export enum AttrAndWenDuEnum { @@ -36,25 +35,10 @@ export enum AttrAndWenDuEnum {
36 IS_CONDITION_SHIDU = 'NUMERIC1', 35 IS_CONDITION_SHIDU = 'NUMERIC1',
37 IS_TYPE2 = 'type2', 36 IS_TYPE2 = 'type2',
38 } 37 }
39 -export const isType2 = (type: string) => {  
40 - return type === AttrAndWenDuEnum.IS_TYPE2;  
41 -};  
42 -  
43 -export const isConditionShiDu = (type: string) => {  
44 - return type === AttrAndWenDuEnum.IS_CONDITION_SHIDU;  
45 -};  
46 -export const isConditionWenDu = (type: string) => {  
47 - return type === AttrAndWenDuEnum.IS_CONDITION_WENDU;  
48 -};  
49 -  
50 -export const isShiDu = (type: string) => {  
51 - return type === AttrAndWenDuEnum.IS_SHIDU;  
52 -};  
53 38
54 -export const isWenDu = (type: string) => {  
55 - return type === AttrAndWenDuEnum.IS_WENDU_ACT; 39 +export const isUpAndDown = (type: string) => {
  40 + return type === AttributeActionEnum.IS_UP_DOWN_ACT;
56 }; 41 };
57 -  
58 export const isTimeAll = (type: string) => { 42 export const isTimeAll = (type: string) => {
59 return type === TriggerEnum.IS_TIME_ACT; 43 return type === TriggerEnum.IS_TIME_ACT;
60 }; 44 };
@@ -63,10 +47,6 @@ export const isMsg = (type: string) => { @@ -63,10 +47,6 @@ export const isMsg = (type: string) => {
63 return type === TriggerEnum.IS_MSG_NOTIFY; 47 return type === TriggerEnum.IS_MSG_NOTIFY;
64 }; 48 };
65 49
66 -export const isUpAndDown = (type: string) => {  
67 - return type === AttributeActionEnum.IS_UP_DOWN_ACT;  
68 -};  
69 -  
70 export const isDevice = (type: string) => { 50 export const isDevice = (type: string) => {
71 return type === TriggerEnum.IS_DEVICE_ACT; 51 return type === TriggerEnum.IS_DEVICE_ACT;
72 }; 52 };
@@ -82,14 +62,27 @@ export const isScene = (type: string) => { @@ -82,14 +62,27 @@ export const isScene = (type: string) => {
82 export const isHand = (type: string) => { 62 export const isHand = (type: string) => {
83 return type === TriggerEnum.IS_HAND_ACT; 63 return type === TriggerEnum.IS_HAND_ACT;
84 }; 64 };
  65 +export const isType2 = (type: string) => {
  66 + return type === AttrAndWenDuEnum.IS_TYPE2;
  67 +};
  68 +
  69 +export const isConditionShiDu = (type: string) => {
  70 + return type === AttrAndWenDuEnum.IS_CONDITION_SHIDU;
  71 +};
  72 +export const isConditionWenDu = (type: string) => {
  73 + return type === AttrAndWenDuEnum.IS_CONDITION_WENDU;
  74 +};
  75 +
  76 +export const isShiDu = (type: string) => {
  77 + return type === AttrAndWenDuEnum.IS_SHIDU;
  78 +};
  79 +
  80 +export const isWenDu = (type: string) => {
  81 + return type === AttrAndWenDuEnum.IS_WENDU_ACT;
  82 +};
85 83
86 export const columns: BasicColumn[] = [ 84 export const columns: BasicColumn[] = [
87 { 85 {
88 - title: '创建时间',  
89 - dataIndex: 'createTime',  
90 - width: 180,  
91 - },  
92 - {  
93 title: '场景联动名称', 86 title: '场景联动名称',
94 dataIndex: 'name', 87 dataIndex: 'name',
95 width: 200, 88 width: 200,
@@ -97,7 +90,7 @@ export const columns: BasicColumn[] = [ @@ -97,7 +90,7 @@ export const columns: BasicColumn[] = [
97 { 90 {
98 title: '触发方式', 91 title: '触发方式',
99 dataIndex: 'triggerType', 92 dataIndex: 'triggerType',
100 - format: (text: string, record: Recordable) => { 93 + format: (_: string, record: Recordable) => {
101 return record.triggers[0]?.triggerType == 'DEVICE_TRIGGER' 94 return record.triggers[0]?.triggerType == 'DEVICE_TRIGGER'
102 ? '设备触发' 95 ? '设备触发'
103 : record.triggers[0]?.triggerType == 'SCHEDULE_TRIGGER' 96 : record.triggers[0]?.triggerType == 'SCHEDULE_TRIGGER'
@@ -131,12 +124,9 @@ export const columns: BasicColumn[] = [ @@ -131,12 +124,9 @@ export const columns: BasicColumn[] = [
131 if (record.status == 1) { 124 if (record.status == 1) {
132 createMessage.success(`已启用`); 125 createMessage.success(`已启用`);
133 } else { 126 } else {
134 - createMessage.error('已禁用'); 127 + createMessage.success('已禁用');
135 } 128 }
136 }) 129 })
137 - .catch(() => {  
138 - createMessage.error('已禁用');  
139 - })  
140 .finally(() => { 130 .finally(() => {
141 record.pendingStatus = false; 131 record.pendingStatus = false;
142 }); 132 });
@@ -149,10 +139,13 @@ export const columns: BasicColumn[] = [ @@ -149,10 +139,13 @@ export const columns: BasicColumn[] = [
149 dataIndex: 'description', 139 dataIndex: 'description',
150 width: 200, 140 width: 200,
151 }, 141 },
  142 + {
  143 + title: '创建时间',
  144 + dataIndex: 'createTime',
  145 + width: 180,
  146 + },
152 ]; 147 ];
153 -  
154 -export const changeOriginId = ref(null);  
155 - 148 +export const organizationId = ref('');
156 export const formSchema: FormSchema[] = [ 149 export const formSchema: FormSchema[] = [
157 { 150 {
158 field: 'name', 151 field: 'name',
@@ -160,6 +153,7 @@ export const formSchema: FormSchema[] = [ @@ -160,6 +153,7 @@ export const formSchema: FormSchema[] = [
160 colProps: { span: 24 }, 153 colProps: { span: 24 },
161 required: true, 154 required: true,
162 component: 'Input', 155 component: 'Input',
  156 +
163 componentProps: { 157 componentProps: {
164 maxLength: 36, 158 maxLength: 36,
165 placeholder: '请输入场景联动名称', 159 placeholder: '请输入场景联动名称',
@@ -171,28 +165,15 @@ export const formSchema: FormSchema[] = [ @@ -171,28 +165,15 @@ export const formSchema: FormSchema[] = [
171 label: '所属组织', 165 label: '所属组织',
172 colProps: { span: 24 }, 166 colProps: { span: 24 },
173 component: 'ApiTreeSelect', 167 component: 'ApiTreeSelect',
174 - componentProps: ({ formModel, formActionType }) => {  
175 - return {  
176 - api: async () => {  
177 - const data = await screenLinkOrganizationGetApi();  
178 - copyTransFun(data as any as any[]);  
179 - return data;  
180 - },  
181 - onChange: async (v) => {  
182 - if (v == undefined) {  
183 - formModel.entityId = undefined;  
184 - const { updateSchema } = formActionType;  
185 - updateSchema({  
186 - field: 'entityId',  
187 - componentProps: {  
188 - options: undefined,  
189 - },  
190 - });  
191 - } else {  
192 - changeOriginId.value = v;  
193 - }  
194 - },  
195 - }; 168 + componentProps: {
  169 + api: async () => {
  170 + const data = await screenLinkOrganizationGetApi();
  171 + copyTransFun(data as any as any[]);
  172 + return data;
  173 + },
  174 + onChange(value) {
  175 + organizationId.value = value;
  176 + },
196 }, 177 },
197 }, 178 },
198 { 179 {
@@ -237,7 +218,7 @@ export const searchFormSchema: FormSchema[] = [ @@ -237,7 +218,7 @@ export const searchFormSchema: FormSchema[] = [
237 label: '状态', 218 label: '状态',
238 component: 'Select', 219 component: 'Select',
239 componentProps: { 220 componentProps: {
240 - placeholder: '请选择', 221 + placeholder: '请选择状态',
241 options: [ 222 options: [
242 { label: '已启用', value: '1' }, 223 { label: '已启用', value: '1' },
243 { label: '未启用', value: '0' }, 224 { label: '未启用', value: '0' },
@@ -256,9 +237,9 @@ export const useTriggerDrawerSchema: FormSchema[] = [ @@ -256,9 +237,9 @@ export const useTriggerDrawerSchema: FormSchema[] = [
256 placeholder: '设备触发', 237 placeholder: '设备触发',
257 options: [ 238 options: [
258 { label: '设备触发', value: 'DEVICE_TRIGGER' }, 239 { label: '设备触发', value: 'DEVICE_TRIGGER' },
259 - { label: '定时触发', value: 'SCHEDULE_TRIGGER' },  
260 - { label: '场景触发', value: 'SCENE_TRIGGER' },  
261 - { label: '手动触发', value: 'HAND_ACT' }, 240 + // { label: '定时触发', value: 'SCHEDULE_TRIGGER' },
  241 + // { label: '场景触发', value: 'SCENE_TRIGGER' },
  242 + // { label: '手动触发', value: 'HAND_ACT' },
262 ], 243 ],
263 }, 244 },
264 colProps: { span: 12 }, 245 colProps: { span: 12 },
@@ -270,39 +251,21 @@ export const useTriggerDrawerSchema: FormSchema[] = [ @@ -270,39 +251,21 @@ export const useTriggerDrawerSchema: FormSchema[] = [
270 componentProps: { 251 componentProps: {
271 placeholder: '请选择设备', 252 placeholder: '请选择设备',
272 }, 253 },
273 - ifShow: ({ values }) =>  
274 - !isTime(Reflect.get(values, 'triggerType')) &&  
275 - !isScene(Reflect.get(values, 'triggerType')) &&  
276 - !isHand(Reflect.get(values, 'triggerType')),  
277 - colProps: {  
278 - span: 12,  
279 - },  
280 - },  
281 - {  
282 - field: 'entityId1',  
283 - component: 'Input',  
284 - label: '',  
285 - componentProps: {  
286 - maxLength: 255,  
287 - placeholder: '请输入Cron表达式',  
288 - }, 254 + ifShow: ({ values }) => isDevice(values.triggerType),
289 colProps: { 255 colProps: {
290 span: 12, 256 span: 12,
291 }, 257 },
292 - ifShow: ({ values }) => isTimeAll(Reflect.get(values, 'triggerType')),  
293 }, 258 },
294 { 259 {
295 field: 'type1', 260 field: 'type1',
296 label: '', 261 label: '',
297 component: 'Select', 262 component: 'Select',
298 componentProps: { 263 componentProps: {
299 - placeholder: '属性触发', 264 + placeholder: '属性触发方式',
300 options: [{ label: '属性触发', value: 'TIME_SERIES' }], 265 options: [{ label: '属性触发', value: 'TIME_SERIES' }],
301 }, 266 },
302 - ifShow: ({ values }) =>  
303 - !isTime(Reflect.get(values, 'triggerType')) &&  
304 - !isScene(Reflect.get(values, 'triggerType')) &&  
305 - !isHand(Reflect.get(values, 'triggerType')), 267 + ifShow: ({ values }) => isDevice(values.triggerType),
  268 + dynamicDisabled: ({ values }) => !values.entityId,
306 colProps: { span: 12 }, 269 colProps: { span: 12 },
307 }, 270 },
308 { 271 {
@@ -311,15 +274,9 @@ export const useTriggerDrawerSchema: FormSchema[] = [ @@ -311,15 +274,9 @@ export const useTriggerDrawerSchema: FormSchema[] = [
311 component: 'Select', 274 component: 'Select',
312 componentProps: { 275 componentProps: {
313 placeholder: '请选择属性', 276 placeholder: '请选择属性',
314 - onChange(v) {  
315 - console.log(v);  
316 - },  
317 }, 277 },
318 - ifShow: ({ values }) =>  
319 - !isTime(Reflect.get(values, 'triggerType')) &&  
320 - !isScene(Reflect.get(values, 'triggerType')) &&  
321 - !isHand(Reflect.get(values, 'triggerType')) &&  
322 - isUpAndDown(Reflect.get(values, 'type1')), 278 + ifShow: ({ values }) => isDevice(values.triggerType),
  279 + dynamicDisabled: ({ values }) => !values.type1,
323 colProps: { span: 12 }, 280 colProps: { span: 12 },
324 }, 281 },
325 { 282 {
@@ -327,7 +284,7 @@ export const useTriggerDrawerSchema: FormSchema[] = [ @@ -327,7 +284,7 @@ export const useTriggerDrawerSchema: FormSchema[] = [
327 label: '', 284 label: '',
328 component: 'Select', 285 component: 'Select',
329 componentProps: { 286 componentProps: {
330 - placeholder: '', 287 + placeholder: '请选择比较模式',
331 options: [ 288 options: [
332 { label: '=', value: 'EQUAL' }, 289 { label: '=', value: 'EQUAL' },
333 { label: '<', value: 'LESS' }, 290 { label: '<', value: 'LESS' },
@@ -336,48 +293,39 @@ export const useTriggerDrawerSchema: FormSchema[] = [ @@ -336,48 +293,39 @@ export const useTriggerDrawerSchema: FormSchema[] = [
336 { label: '>=', value: 'GREATER_OR_EQUAL' }, 293 { label: '>=', value: 'GREATER_OR_EQUAL' },
337 ], 294 ],
338 }, 295 },
339 - ifShow: ({ values }) => isType2(Reflect.get(values, 'type2')),  
340 - show: ({ values }) =>  
341 - !isTime(Reflect.get(values, 'triggerType')) &&  
342 - !isScene(Reflect.get(values, 'triggerType')) &&  
343 - !isHand(Reflect.get(values, 'triggerType')), 296 + show: ({ values }) => isDevice(values.triggerType),
  297 + dynamicDisabled: ({ values }) => !values.type2,
344 colProps: { span: 12 }, 298 colProps: { span: 12 },
345 }, 299 },
346 { 300 {
347 field: 'value', 301 field: 'value',
348 - component: 'Input',  
349 label: '', 302 label: '',
350 - defaultValue: 0, 303 + component: 'Input',
351 componentProps: { 304 componentProps: {
352 maxLength: 16, 305 maxLength: 16,
353 placeholder: '请输入比较值', 306 placeholder: '请输入比较值',
354 }, 307 },
355 - ifShow: ({ values }) => isType2(Reflect.get(values, 'type2')),  
356 - show: ({ values }) =>  
357 - !isTime(Reflect.get(values, 'triggerType')) &&  
358 - !isScene(Reflect.get(values, 'triggerType')) &&  
359 - !isHand(Reflect.get(values, 'triggerType')), 308 + show: ({ values }) => isDevice(values.triggerType),
  309 + dynamicDisabled: ({ values }) => !values.operation,
360 colProps: { 310 colProps: {
361 span: 12, 311 span: 12,
362 }, 312 },
363 }, 313 },
364 - // {  
365 - // field: 'sceneLinkageId',  
366 - // label: '',  
367 - // component: 'Select',  
368 - // colProps: {  
369 - // span: 12,  
370 - // },  
371 - // componentProps: {  
372 - // placeholder: '请选择场景',  
373 - // options: [  
374 - // { label: '场景触发器1', value: '' },  
375 - // { label: '场景触发器2', value: '' },  
376 - // ],  
377 - // },  
378 - // ifShow: ({ values }) => isScene(Reflect.get(values, 'triggerType')),  
379 - // }, 314 + {
  315 + field: 'entityId1',
  316 + label: '',
  317 + component: 'Input',
  318 + componentProps: {
  319 + maxLength: 255,
  320 + placeholder: '请输入Cron表达式',
  321 + },
  322 + colProps: {
  323 + span: 12,
  324 + },
  325 + ifShow: ({ values }) => values.triggerType === TriggerEnum.IS_TIME_ACT,
  326 + },
380 ]; 327 ];
  328 +// !!!----------------------------------------------------^_^------------------------------------------------------------!!!
381 329
382 export const useConditionDrawerSchema: FormSchema[] = [ 330 export const useConditionDrawerSchema: FormSchema[] = [
383 { 331 {
@@ -385,10 +333,10 @@ export const useConditionDrawerSchema: FormSchema[] = [ @@ -385,10 +333,10 @@ export const useConditionDrawerSchema: FormSchema[] = [
385 label: '', 333 label: '',
386 component: 'Select', 334 component: 'Select',
387 componentProps: { 335 componentProps: {
388 - placeholder: '设备状态', 336 + placeholder: '设备触发',
389 options: [ 337 options: [
390 { label: '设备触发', value: 'DEVICE_TRIGGER' }, 338 { label: '设备触发', value: 'DEVICE_TRIGGER' },
391 - { label: '时间范围', value: 'SCHEDULE_TRIGGER' }, 339 + // { label: '时间范围', value: 'SCHEDULE_TRIGGER' },
392 ], 340 ],
393 }, 341 },
394 colProps: { span: 12 }, 342 colProps: { span: 12 },
@@ -402,48 +350,20 @@ export const useConditionDrawerSchema: FormSchema[] = [ @@ -402,48 +350,20 @@ export const useConditionDrawerSchema: FormSchema[] = [
402 placeholder: '请选择设备', 350 placeholder: '请选择设备',
403 }; 351 };
404 }, 352 },
405 - ifShow: ({ values }) => !isTimeAll(Reflect.get(values, 'triggerType')),  
406 - colProps: {  
407 - span: 12,  
408 - },  
409 - },  
410 - {  
411 - field: 'createTime',  
412 - component: 'DatePicker',  
413 - label: '',  
414 - componentProps: {  
415 - placeholder: '请选择起始时间',  
416 - },  
417 - colProps: {  
418 - span: 12,  
419 - },  
420 - ifShow: ({ values }) => isTimeAll(Reflect.get(values, 'triggerType')),  
421 - },  
422 - {  
423 - field: 'updateTime',  
424 - component: 'DatePicker',  
425 - label: '',  
426 - componentProps: {  
427 - placeholder: '请选择结束时间',  
428 - }, 353 + ifShow: ({ values }) => isDevice(values.triggerType),
429 colProps: { 354 colProps: {
430 span: 12, 355 span: 12,
431 }, 356 },
432 - ifShow: ({ values }) => isTimeAll(Reflect.get(values, 'triggerType')),  
433 }, 357 },
434 { 358 {
435 field: 'type', 359 field: 'type',
436 label: '', 360 label: '',
437 component: 'Select', 361 component: 'Select',
438 - componentProps() {  
439 - return {  
440 - placeholder: '请选择属性',  
441 - onChange(v) {  
442 - console.log(v);  
443 - },  
444 - }; 362 + componentProps: {
  363 + placeholder: '请选择属性',
445 }, 364 },
446 - ifShow: ({ values }) => !isTimeAll(Reflect.get(values, 'triggerType')), 365 + ifShow: ({ values }) => isDevice(values.triggerType),
  366 + dynamicDisabled: ({ values }) => !values.entityId,
447 colProps: { span: 12 }, 367 colProps: { span: 12 },
448 }, 368 },
449 { 369 {
@@ -451,7 +371,7 @@ export const useConditionDrawerSchema: FormSchema[] = [ @@ -451,7 +371,7 @@ export const useConditionDrawerSchema: FormSchema[] = [
451 label: '', 371 label: '',
452 component: 'Select', 372 component: 'Select',
453 componentProps: { 373 componentProps: {
454 - placeholder: '', 374 + placeholder: '请选择比较模式',
455 options: [ 375 options: [
456 { label: '=', value: 'EQUAL' }, 376 { label: '=', value: 'EQUAL' },
457 { label: '<', value: 'LESS' }, 377 { label: '<', value: 'LESS' },
@@ -460,24 +380,53 @@ export const useConditionDrawerSchema: FormSchema[] = [ @@ -460,24 +380,53 @@ export const useConditionDrawerSchema: FormSchema[] = [
460 { label: '>=', value: 'GREATER_OR_EQUAL' }, 380 { label: '>=', value: 'GREATER_OR_EQUAL' },
461 ], 381 ],
462 }, 382 },
463 - ifShow: false, 383 + show: ({ values }) => isDevice(values.triggerType),
  384 + dynamicDisabled: ({ values }) => !values.type,
464 colProps: { span: 12 }, 385 colProps: { span: 12 },
465 }, 386 },
466 { 387 {
467 field: 'value', 388 field: 'value',
468 - component: 'Input',  
469 label: '', 389 label: '',
  390 + component: 'Input',
470 componentProps: { 391 componentProps: {
471 maxLength: 16, 392 maxLength: 16,
472 placeholder: '请输入比较值', 393 placeholder: '请输入比较值',
473 }, 394 },
474 - ifShow: false, 395 + show: ({ values }) => isDevice(values.triggerType),
  396 + dynamicDisabled: ({ values }) => !values.operation,
475 colProps: { 397 colProps: {
476 span: 12, 398 span: 12,
477 }, 399 },
478 }, 400 },
  401 + // {
  402 + // field: 'createTime',
  403 + // component: 'DatePicker',
  404 + // label: 'createTime',
  405 + // componentProps: {
  406 + // placeholder: '请选择起始时间',
  407 + // },
  408 + // colProps: {
  409 + // span: 12,
  410 + // },
  411 + // ifShow: ({ values }) => isTimeAll(values.triggerType),
  412 + // },
  413 + // {
  414 + // field: 'updateTime',
  415 + // component: 'DatePicker',
  416 + // label: 'updateTime',
  417 + // componentProps: {
  418 + // placeholder: '请选择结束时间',
  419 + // },
  420 + // colProps: {
  421 + // span: 12,
  422 + // },
  423 + // ifShow: ({ values }) => isTimeAll(values.triggerType),
  424 + // },
479 ]; 425 ];
480 - 426 +enum ActionEnum {
  427 + DEVICE_OUT = 'DEVICE_OUT',
  428 +}
  429 +const isDeviceOut = (type: string) => type === ActionEnum.DEVICE_OUT;
481 export const useActionDrawerSchema: FormSchema[] = [ 430 export const useActionDrawerSchema: FormSchema[] = [
482 { 431 {
483 field: 'outTarget', 432 field: 'outTarget',
@@ -488,8 +437,8 @@ export const useActionDrawerSchema: FormSchema[] = [ @@ -488,8 +437,8 @@ export const useActionDrawerSchema: FormSchema[] = [
488 placeholder: '设备输出', 437 placeholder: '设备输出',
489 options: [ 438 options: [
490 { label: '设备输出', value: 'DEVICE_OUT' }, 439 { label: '设备输出', value: 'DEVICE_OUT' },
491 - { label: '消息通知', value: 'MSG_NOTIFY' },  
492 - { label: '场景联动', value: 'SCENE_TRIGGER' }, 440 + // { label: '消息通知', value: 'MSG_NOTIFY' },
  441 + // { label: '场景联动', value: 'SCENE_TRIGGER' },
493 ], 442 ],
494 }, 443 },
495 colProps: { span: 12 }, 444 colProps: { span: 12 },
@@ -497,12 +446,12 @@ export const useActionDrawerSchema: FormSchema[] = [ @@ -497,12 +446,12 @@ export const useActionDrawerSchema: FormSchema[] = [
497 { 446 {
498 field: 'deviceId', 447 field: 'deviceId',
499 label: '', 448 label: '',
  449 + required: true,
500 component: 'Select', 450 component: 'Select',
501 componentProps: { 451 componentProps: {
502 placeholder: '请选择设备', 452 placeholder: '请选择设备',
503 }, 453 },
504 - ifShow: ({ values }) =>  
505 - !isScene(Reflect.get(values, 'outTarget')) && !isMsg(Reflect.get(values, 'outTarget')), 454 + ifShow: ({ values }) => isDeviceOut(values.outTarget),
506 colProps: { 455 colProps: {
507 span: 12, 456 span: 12,
508 }, 457 },
@@ -511,86 +460,67 @@ export const useActionDrawerSchema: FormSchema[] = [ @@ -511,86 +460,67 @@ export const useActionDrawerSchema: FormSchema[] = [
511 field: 'doContext', 460 field: 'doContext',
512 component: 'InputTextArea', 461 component: 'InputTextArea',
513 label: '', 462 label: '',
514 - // defaultValue:  
515 - // '{"method": "setDOValue","params": {"devID": "492S211218028819","data": {"DO1": 1}}}',  
516 componentProps: { 463 componentProps: {
517 maxLength: 255, 464 maxLength: 255,
518 - placeholder: '请输入下发指定',  
519 }, 465 },
520 - ifShow: ({ values }) =>  
521 - !isScene(Reflect.get(values, 'outTarget')) && !isMsg(Reflect.get(values, 'outTarget')), 466 + slot: 'doContext',
  467 + show: ({ values }) => isDeviceOut(values.outTarget),
522 colProps: { 468 colProps: {
523 span: 12, 469 span: 12,
524 }, 470 },
525 }, 471 },
526 // { 472 // {
527 - // field: 'no',  
528 - // component: 'InputTextArea', 473 + // field: 'wu2',
  474 + // component: 'Input',
529 // label: '', 475 // label: '',
530 - // defaultValue:  
531 - // '(可复制)下发指定格式(JSON格式：{"method": "setDOValue","params": {"devID": "492S211218028819","data": {"DO1": 1}})',  
532 // componentProps: { 476 // componentProps: {
533 - // maxLength: 255,  
534 - // disabled: true, 477 + // placeholder: '暂不实现',
535 // }, 478 // },
536 - // ifShow: ({ values }) =>  
537 - // !isScene(Reflect.get(values, 'outTarget')) && !isMsg(Reflect.get(values, 'outTarget')),  
538 // colProps: { 479 // colProps: {
539 // span: 12, 480 // span: 12,
540 // }, 481 // },
  482 + // ifShow: ({ values }) => isMsg(Reflect.get(values, 'outTarget')),
  483 + // },
  484 + // {
  485 + // field: 'wu3',
  486 + // label: '',
  487 + // component: 'Input',
  488 + // componentProps: {
  489 + // placeholder: '无',
  490 + // style: {
  491 + // visibility: 'hidden',
  492 + // },
  493 + // },
  494 + // colProps: { span: 12 },
  495 + // ifShow: ({ values }) => isMsg(Reflect.get(values, 'outTarget')),
  496 + // },
  497 + // {
  498 + // field: 'entityId',
  499 + // label: '',
  500 + // component: 'Select',
  501 + // colProps: {
  502 + // span: 12,
  503 + // },
  504 + // componentProps: {
  505 + // placeholder: '请选择场景',
  506 + // options: [
  507 + // { label: '场景触发器1', value: '1' },
  508 + // { label: '场景触发器2', value: '2' },
  509 + // ],
  510 + // },
  511 + // ifShow: ({ values }) => isScene(Reflect.get(values, 'outTarget')),
  512 + // },
  513 + // {
  514 + // field: 'wu4',
  515 + // label: '',
  516 + // component: 'Input',
  517 + // componentProps: {
  518 + // placeholder: '无',
  519 + // style: {
  520 + // visibility: 'hidden',
  521 + // },
  522 + // },
  523 + // colProps: { span: 12 },
  524 + // ifShow: ({ values }) => isScene(Reflect.get(values, 'outTarget')),
541 // }, 525 // },
542 - {  
543 - field: 'wu2',  
544 - component: 'Input',  
545 - label: '',  
546 - componentProps: {  
547 - placeholder: '暂不实现',  
548 - },  
549 - colProps: {  
550 - span: 12,  
551 - },  
552 - ifShow: ({ values }) => isMsg(Reflect.get(values, 'outTarget')),  
553 - },  
554 - {  
555 - field: 'wu3',  
556 - label: '',  
557 - component: 'Input',  
558 - componentProps: {  
559 - placeholder: '无',  
560 - style: {  
561 - visibility: 'hidden',  
562 - },  
563 - },  
564 - colProps: { span: 12 },  
565 - ifShow: ({ values }) => isMsg(Reflect.get(values, 'outTarget')),  
566 - },  
567 - {  
568 - field: 'entityId',  
569 - label: '',  
570 - component: 'Select',  
571 - colProps: {  
572 - span: 12,  
573 - },  
574 - componentProps: {  
575 - placeholder: '请选择场景',  
576 - options: [  
577 - { label: '场景触发器1', value: '1' },  
578 - { label: '场景触发器2', value: '2' },  
579 - ],  
580 - },  
581 - ifShow: ({ values }) => isScene(Reflect.get(values, 'outTarget')),  
582 - },  
583 - {  
584 - field: 'wu4',  
585 - label: '',  
586 - component: 'Input',  
587 - componentProps: {  
588 - placeholder: '无',  
589 - style: {  
590 - visibility: 'hidden',  
591 - },  
592 - },  
593 - colProps: { span: 12 },  
594 - ifShow: ({ values }) => isScene(Reflect.get(values, 'outTarget')),  
595 - },  
596 ]; 526 ];
1 <template> 1 <template>
2 - <CollapseContainer class="prefixRedDot" style="background-color: #eeeeee">  
3 - <div style="position: relative">  
4 - <BasicForm  
5 - :labelWidth="100"  
6 - :showResetButton="false"  
7 - :showSubmitButton="false"  
8 - :emptySpan="10"  
9 - @register="registerAction"  
10 - />  
11 - </div> 2 + <CollapseContainer style="background-color: #eeeeee" :title="`执行动作 ${actionIndex + 1}`">
  3 + <template #action>
  4 + <Tooltip title="移除" v-if="actionData.length > 1">
  5 + <Icon
  6 + icon="fluent:delete-off-20-regular"
  7 + size="20"
  8 + class="mr-2 cursor-pointer"
  9 + @click="handleDelete(actionIndex)"
  10 + />
  11 + </Tooltip>
  12 + </template>
  13 + <BasicForm @register="registerAction">
  14 + <template #doContext>
  15 + <div class="flex">
  16 + <div ref="jsoneditorRef" style="height: 100%; width: 100%"></div>
  17 + <Tooltip
  18 + title='{"method":"setDOValue","params":{"devID":"492S211218028819","data":{"DO1":1}}}'
  19 + class="ml-2"
  20 + >
  21 + <QuestionCircleOutlined style="font-size: 1rem"
  22 + /></Tooltip>
  23 + </div>
  24 + </template>
  25 + </BasicForm>
12 </CollapseContainer> 26 </CollapseContainer>
13 </template> 27 </template>
14 <script lang="ts"> 28 <script lang="ts">
15 - import { defineComponent, reactive, ref } from 'vue'; 29 + import { defineComponent, ref, onMounted, nextTick, unref } from 'vue';
16 import { CollapseContainer } from '/@/components/Container/index'; 30 import { CollapseContainer } from '/@/components/Container/index';
17 import { BasicForm, useForm } from '/@/components/Form/index'; 31 import { BasicForm, useForm } from '/@/components/Form/index';
18 - import { Input } from 'ant-design-vue'; 32 + import { Tooltip } from 'ant-design-vue';
  33 + import { Icon } from '/@/components/Icon';
19 import { useActionDrawerSchema } from '../config'; 34 import { useActionDrawerSchema } from '../config';
  35 + import jsoneditor from 'jsoneditor';
  36 + import 'jsoneditor/dist/jsoneditor.min.css';
  37 + import { Tooltip } from 'ant-design-vue';
  38 + import { QuestionCircleOutlined } from '@ant-design/icons-vue';
20 39
21 export default defineComponent({ 40 export default defineComponent({
22 - components: { CollapseContainer, BasicForm, [Input.name]: Input },  
23 - props: ['bindActionFather', 'bindActionEntryIdFather'],  
24 - setup(props) {  
25 - let fieldValue = reactive({});  
26 - const option = ref<[]>([]);  
27 - const [registerAction, { setFieldsValue, getFieldsValue, resetFields, updateSchema }] =  
28 - useForm({  
29 - labelWidth: 100,  
30 - schemas: useActionDrawerSchema,  
31 - actionColOptions: { span: 24 },  
32 - });  
33 - const getFieldsValueFunc = () => {  
34 - fieldValue = getFieldsValue();  
35 - return fieldValue;  
36 - };  
37 - const resetFieldsValueFunc = () => {  
38 - resetFields();  
39 - };  
40 - const updateFieldDeviceId = (v) => {  
41 - if (v.length == 0 || v.length > 0) {  
42 - option.value = v;  
43 - updateSchema({  
44 - field: 'deviceId',  
45 - componentProps: {  
46 - options: option.value,  
47 - },  
48 - });  
49 - } else if (v.length == undefined) {  
50 - setTimeout(() => {  
51 - updateSchema({  
52 - field: 'deviceId',  
53 - componentProps: {  
54 - options: v.item,  
55 - },  
56 - });  
57 - }, 10);  
58 - }  
59 - };  
60 -  
61 - //回显数据  
62 - const setFieldsFormValueFun = () => {  
63 - if (props.bindActionFather !== 1) {  
64 - setTimeout(() => {  
65 - setFieldsValue(props.bindActionFather);  
66 - }, 10);  
67 - }  
68 - };  
69 - setFieldsFormValueFun();  
70 - const editSelectDevice = () => {  
71 - if (props.bindActionEntryIdFather !== 1) {  
72 - setTimeout(() => {  
73 - updateSchema({  
74 - field: 'deviceId',  
75 - componentProps: {  
76 - options: props.bindActionEntryIdFather,  
77 - },  
78 - });  
79 - }, 10);  
80 - } 41 + components: { CollapseContainer, BasicForm, Tooltip, Icon, Tooltip, QuestionCircleOutlined },
  42 + props: {
  43 + actionIndex: {
  44 + type: Number,
  45 + required: true,
  46 + },
  47 + actionData: {
  48 + type: Array,
  49 + default: () => [],
  50 + },
  51 + },
  52 + emits: ['deleteAction'],
  53 + setup(props, { emit }) {
  54 + const [
  55 + registerAction,
  56 + { getFieldsValue, resetFields, updateSchema, setFieldsValue, validate },
  57 + ] = useForm({
  58 + schemas: useActionDrawerSchema,
  59 + showActionButtonGroup: false,
  60 + });
  61 + const getFieldsValueFunc = () => ({
  62 + ...getFieldsValue(),
  63 + doContext: unref(jsonInstance.value).get(),
  64 + });
  65 + const setFieldsFormValueFun = (fieldsValue) => {
  66 + setFieldsValue(fieldsValue);
81 }; 67 };
82 - editSelectDevice();  
83 - //新增清空设备选择  
84 - const clearSelectDevice = () => { 68 + const resetFieldsValueFunc = () => resetFields();
  69 + const updateFieldDeviceId = (deviceList) => {
85 updateSchema({ 70 updateSchema({
86 field: 'deviceId', 71 field: 'deviceId',
87 componentProps: { 72 componentProps: {
88 - options: [], 73 + options: deviceList,
89 }, 74 },
90 }); 75 });
91 }; 76 };
  77 + const validateForm = () => {
  78 + return validate();
  79 + };
  80 + const handleDelete = (actionIndex) => {
  81 + emit('deleteAction', actionIndex);
  82 + };
  83 +
  84 + // json 以及初始化JSON
  85 + const jsoneditorRef = ref();
  86 + const jsonValue = ref({});
  87 + const jsonInstance = ref();
  88 + onMounted(() => {
  89 + nextTick(() => {
  90 + let options = {
  91 + mode: 'code',
  92 + mainMenuBar: false,
  93 + statusBar: false,
  94 + onError(err) {
  95 + alert('EF1 ->' + err.toString());
  96 + },
  97 + };
  98 + let editor = new jsoneditor(jsoneditorRef.value, options);
  99 + editor.set(jsonValue.value);
  100 + jsonInstance.value = editor;
  101 + });
  102 + });
  103 +
  104 + const getJsonValue = () => unref(jsonInstance).get();
  105 + const setJsonValue = (Json) => {
  106 + nextTick(() => {
  107 + unref(jsonInstance).set(Json);
  108 + });
  109 + };
92 return { 110 return {
93 updateFieldDeviceId, 111 updateFieldDeviceId,
94 - clearSelectDevice,  
95 - editSelectDevice,  
96 resetFieldsValueFunc, 112 resetFieldsValueFunc,
97 getFieldsValueFunc, 113 getFieldsValueFunc,
  114 + validateForm,
98 registerAction, 115 registerAction,
  116 + handleDelete,
  117 + setFieldsFormValueFun,
  118 + jsoneditorRef,
  119 + jsonInstance,
  120 + getJsonValue,
  121 + setJsonValue,
99 }; 122 };
100 }, 123 },
101 }); 124 });
102 </script> 125 </script>
103 126
104 -<style lang="less">  
105 - .prefixRedDot:before {  
106 - content: '* ';  
107 - color: red;  
108 - vertical-align: middle;  
109 - display: inline-block;  
110 - position: relative;  
111 - top: 1vh;  
112 - left: 5px; 127 +<style>
  128 + .jsoneditor {
  129 + border: none;
113 } 130 }
114 </style> 131 </style>
1 <template> 1 <template>
2 - <CollapseContainer style="background-color: #eeeeee">  
3 - <div style="position: relative">  
4 - <BasicForm  
5 - :labelWidth="100"  
6 - :emptySpan="10"  
7 - :showResetButton="false"  
8 - :showSubmitButton="false"  
9 - @register="registerCondition"  
10 - />  
11 - </div> 2 + <CollapseContainer style="background-color: #eeeeee" :title="`执行条件 ${conditionIndex + 1}`">
  3 + <template #action>
  4 + <Tooltip title="移除">
  5 + <Icon
  6 + icon="fluent:delete-off-20-regular"
  7 + size="20"
  8 + class="mr-2 cursor-pointer"
  9 + @click="handleDelete(conditionIndex)"
  10 + />
  11 + </Tooltip>
  12 + </template>
  13 + <BasicForm @register="registerCondition" />
12 </CollapseContainer> 14 </CollapseContainer>
13 </template> 15 </template>
14 <script lang="ts"> 16 <script lang="ts">
15 - import { defineComponent, reactive, ref } from 'vue'; 17 + import { defineComponent } from 'vue';
16 import { CollapseContainer } from '/@/components/Container/index'; 18 import { CollapseContainer } from '/@/components/Container/index';
17 import { BasicForm, useForm } from '/@/components/Form/index'; 19 import { BasicForm, useForm } from '/@/components/Form/index';
18 - import { Input } from 'ant-design-vue'; 20 + import { Tooltip } from 'ant-design-vue';
19 import { useConditionDrawerSchema } from '../config'; 21 import { useConditionDrawerSchema } from '../config';
20 import { screenLinkPageByDeviceIdGetAttribut } from '/@/api/ruleengine/ruleengineApi'; 22 import { screenLinkPageByDeviceIdGetAttribut } from '/@/api/ruleengine/ruleengineApi';
  23 + import { Icon } from '/@/components/Icon';
21 24
22 export default defineComponent({ 25 export default defineComponent({
23 - components: { CollapseContainer, BasicForm, [Input.name]: Input },  
24 - props: ['bindConditionFather', 'bindConditionEntryIdFather'],  
25 - setup(props) {  
26 - let fieldValue = reactive({});  
27 - const option = ref<[]>([]);  
28 - const [registerCondition, { setFieldsValue, getFieldsValue, updateSchema, resetFields }] = 26 + components: { CollapseContainer, BasicForm, Tooltip, Icon },
  27 + props: {
  28 + conditionIndex: {
  29 + type: Number,
  30 + required: true,
  31 + },
  32 + },
  33 + emits: ['deleteCondition'],
  34 + setup(props, { emit }) {
  35 + const [registerCondition, { getFieldsValue, updateSchema, resetFields, setFieldsValue }] =
29 useForm({ 36 useForm({
30 - labelWidth: 100,  
31 schemas: useConditionDrawerSchema, 37 schemas: useConditionDrawerSchema,
32 - actionColOptions: { span: 24 }, 38 + showActionButtonGroup: false,
33 }); 39 });
34 - const getFieldsValueFunc = () => {  
35 - fieldValue = getFieldsValue();  
36 - return fieldValue;  
37 - };  
38 - const resetFieldsValueFunc = () => {  
39 - resetFields();  
40 - };  
41 - const updateFieldDeviceId = (v) => {  
42 - if (v.length == 0 || v.length > 0) {  
43 - option.value = v;  
44 - updateSchema({  
45 - field: 'entityId',  
46 - componentProps: {  
47 - options: option.value,  
48 - onChange(e) {  
49 - if (e) {  
50 - setTimeout(() => {  
51 - updateFieldAttributeFunc(e);  
52 - }, 10);  
53 - }  
54 - }, 40 + const getFieldsValueFunc = () => getFieldsValue();
  41 + const resetFieldsValueFunc = () => resetFields();
  42 + const updateFieldDeviceId = (deviceList: any[]) => {
  43 + updateSchema({
  44 + field: 'entityId',
  45 + componentProps: {
  46 + options: deviceList,
  47 + onChange(e) {
  48 + if (e) {
  49 + updateFieldAttributeFunc(e);
  50 + }
55 }, 51 },
56 - });  
57 - } else if (v.length == undefined) {  
58 - setTimeout(() => {  
59 - updateSchema({  
60 - field: 'entityId',  
61 - componentProps: {  
62 - options: v.item,  
63 - onChange(e) {  
64 - if (e) {  
65 - setTimeout(() => {  
66 - updateFieldAttributeFunc(e);  
67 - }, 10);  
68 - }  
69 - },  
70 - },  
71 - });  
72 - }, 10);  
73 - } 52 + },
  53 + });
74 }; 54 };
75 const updateFieldAttributeFunc = async (e) => { 55 const updateFieldAttributeFunc = async (e) => {
76 const data1 = await screenLinkPageByDeviceIdGetAttribut('DEVICE', e); 56 const data1 = await screenLinkPageByDeviceIdGetAttribut('DEVICE', e);
@@ -80,76 +60,42 @@ @@ -80,76 +60,42 @@
80 value: m, 60 value: m,
81 }; 61 };
82 }); 62 });
83 - setTimeout(() => {  
84 - updateSchema({  
85 - field: 'type',  
86 - componentProps() {  
87 - return {  
88 - placeholder: '请选择属性',  
89 - options: data,  
90 - onChange(e) {  
91 - if (e) {  
92 - updateSchema([  
93 - {  
94 - field: 'operation',  
95 - ifShow: true,  
96 - },  
97 - {  
98 - field: 'value',  
99 - ifShow: true,  
100 - },  
101 - ]);  
102 - } else {  
103 - updateSchema([  
104 - {  
105 - field: 'operation',  
106 - ifShow: false,  
107 - },  
108 - {  
109 - field: 'value',  
110 - ifShow: false,  
111 - },  
112 - ]);  
113 - }  
114 - },  
115 - };  
116 - },  
117 - });  
118 - }, 10);  
119 - };  
120 - const clearSelectAttribute = () => {  
121 updateSchema({ 63 updateSchema({
122 field: 'type', 64 field: 'type',
123 componentProps: { 65 componentProps: {
124 - options: [], 66 + placeholder: '请选择属性',
  67 + options: data,
  68 + onChange(e) {
  69 + if (e) {
  70 + updateSchema([
  71 + {
  72 + field: 'operation',
  73 + ifShow: true,
  74 + },
  75 + {
  76 + field: 'value',
  77 + ifShow: true,
  78 + },
  79 + ]);
  80 + } else {
  81 + updateSchema([
  82 + {
  83 + field: 'operation',
  84 + ifShow: false,
  85 + },
  86 + {
  87 + field: 'value',
  88 + ifShow: false,
  89 + },
  90 + ]);
  91 + }
  92 + },
125 }, 93 },
126 }); 94 });
127 }; 95 };
128 - //回显数据  
129 - const setFieldsFormValueFun = () => {  
130 - if (props.bindConditionFather !== 1) {  
131 - setTimeout(() => {  
132 - setFieldsValue(props.bindConditionFather);  
133 - setFieldsValue({  
134 - type:  
135 - props.bindConditionFather?.triggerCondition?.condition[0]?.valueType == 'NUMERIC'  
136 - ? 'NUMERIC1'  
137 - : 'NUMERIC2',  
138 - operation1:  
139 - props.bindConditionFather?.triggerCondition?.condition[0]?.predicate?.operation,  
140 - operation2:  
141 - props.bindConditionFather?.triggerCondition?.condition[0]?.predicate?.operation,  
142 - value1:  
143 - props.bindConditionFather?.triggerCondition?.condition[0]?.predicate?.value  
144 - ?.defaultValue,  
145 - value2:  
146 - props.bindConditionFather?.triggerCondition?.condition[0]?.predicate?.value  
147 - ?.defaultValue,  
148 - });  
149 - }, 100);  
150 - } 96 + const setFieldsFormValueFun = (fieldsValue) => {
  97 + setFieldsValue(fieldsValue);
151 }; 98 };
152 - setFieldsFormValueFun();  
153 const editSelectDevice = () => { 99 const editSelectDevice = () => {
154 if (props.bindConditionEntryIdFather !== 1) { 100 if (props.bindConditionEntryIdFather !== 1) {
155 setTimeout(() => { 101 setTimeout(() => {
@@ -162,25 +108,19 @@ @@ -162,25 +108,19 @@
162 }, 100); 108 }, 100);
163 } 109 }
164 }; 110 };
165 - editSelectDevice();  
166 - //新增清空设备选择  
167 - const clearSelectDevice = () => {  
168 - updateSchema({  
169 - field: 'entityId',  
170 - componentProps: {  
171 - options: [],  
172 - },  
173 - });  
174 - };  
175 111
  112 + const handleDelete = (conditionIndex) => {
  113 + emit('deleteCondition', conditionIndex);
  114 + };
176 return { 115 return {
177 updateFieldDeviceId, 116 updateFieldDeviceId,
178 - clearSelectDevice,  
179 editSelectDevice, 117 editSelectDevice,
180 getFieldsValueFunc, 118 getFieldsValueFunc,
181 registerCondition, 119 registerCondition,
182 resetFieldsValueFunc, 120 resetFieldsValueFunc,
183 - clearSelectAttribute, 121 + handleDelete,
  122 +
  123 + setFieldsFormValueFun,
184 }; 124 };
185 }, 125 },
186 }); 126 });
1 -export const formatTriggerData = (m) => { 1 +export const formatTriggerData = (triggerData) => {
  2 + const { triggerType, entityId, type1, type2, operation, value } = triggerData;
2 return { 3 return {
3 - triggerType: m?.triggerType,  
4 - entityId: m?.entityId || m?.entityId1 || m?.entityId2, 4 + triggerType,
  5 + entityId,
5 triggerCondition: { 6 triggerCondition: {
6 condition: [ 7 condition: [
7 { 8 {
8 key: { 9 key: {
9 - key: m.type2 == null ? 'CO2' : m.type2,  
10 - type: m.type1 == null ? 'TIME_SERIES' : m.type1, 10 + type: type1,
  11 + key: type2,
11 }, 12 },
12 valueType: 'NUMERIC', 13 valueType: 'NUMERIC',
13 predicate: { 14 predicate: {
14 type: 'NUMERIC', 15 type: 'NUMERIC',
  16 + operation: operation,
15 value: { 17 value: {
16 - defaultValue: Number(m.value), 18 + defaultValue: Number(value),
17 }, 19 },
18 - operation: m.operation == null ? 'EQUAL' : m.operation,  
19 }, 20 },
20 }, 21 },
21 ], 22 ],
@@ -26,25 +27,25 @@ export const formatTriggerData = (m) => { @@ -26,25 +27,25 @@ export const formatTriggerData = (m) => {
26 }; 27 };
27 }; 28 };
28 29
29 -export const formatConditionData = (m) => { 30 +export const formatConditionData = (conditionData) => {
  31 + const { triggerType, entityId, type, operation, value } = conditionData;
30 return { 32 return {
31 - triggerType: m?.triggerType,  
32 - entityId: m?.entityId, 33 + triggerType,
  34 + entityId,
33 triggerCondition: { 35 triggerCondition: {
34 condition: [ 36 condition: [
35 { 37 {
36 key: { 38 key: {
37 - key: m.type == null ? 'CO2' : m.type, 39 + key: type,
38 type: 'TIME_SERIES', 40 type: 'TIME_SERIES',
39 }, 41 },
40 valueType: 'NUMERIC', 42 valueType: 'NUMERIC',
41 - // value: {},  
42 predicate: { 43 predicate: {
43 type: 'NUMERIC', 44 type: 'NUMERIC',
44 value: { 45 value: {
45 - defaultValue: Number(m.value) == null ? 0 : Number(m.value), 46 + defaultValue: Number(value),
46 }, 47 },
47 - operation: m.operation, 48 + operation: operation,
48 }, 49 },
49 }, 50 },
50 ], 51 ],
1 <template> 1 <template>
2 <div> 2 <div>
3 - <CollapseContainer style="background-color: #eeeeee">  
4 - <div>  
5 - <BasicForm  
6 - :labelWidth="100"  
7 - :showResetButton="false"  
8 - :showSubmitButton="false"  
9 - :emptySpan="10"  
10 - @register="registerForm"  
11 - />  
12 - </div> 3 + <CollapseContainer style="background-color: #eee" :title="`触发器 ${triggerIndex + 1}`">
  4 + <template #action>
  5 + <Tooltip title="移除">
  6 + <Icon
  7 + icon="fluent:delete-off-20-regular"
  8 + size="20"
  9 + class="mr-2 cursor-pointer"
  10 + @click="handleDelete(triggerIndex)"
  11 + />
  12 + </Tooltip>
  13 + </template>
  14 + <BasicForm @register="registerForm" />
13 </CollapseContainer> 15 </CollapseContainer>
14 </div> 16 </div>
15 </template> 17 </template>
16 <script lang="ts"> 18 <script lang="ts">
17 - import { defineComponent, reactive, ref } from 'vue'; 19 + import { defineComponent } from 'vue';
18 import { CollapseContainer } from '/@/components/Container/index'; 20 import { CollapseContainer } from '/@/components/Container/index';
19 import { BasicForm, useForm } from '/@/components/Form/index'; 21 import { BasicForm, useForm } from '/@/components/Form/index';
20 - import { Input } from 'ant-design-vue'; 22 + import { Icon } from '/@/components/Icon';
  23 + import { Tooltip } from 'ant-design-vue';
21 import { useTriggerDrawerSchema } from '../config'; 24 import { useTriggerDrawerSchema } from '../config';
22 import { screenLinkPageByDeviceIdGetAttribut } from '/@/api/ruleengine/ruleengineApi'; 25 import { screenLinkPageByDeviceIdGetAttribut } from '/@/api/ruleengine/ruleengineApi';
23 -  
24 export default defineComponent({ 26 export default defineComponent({
25 - components: { CollapseContainer, BasicForm, [Input.name]: Input },  
26 - props: ['bindTriggerFather', 'bindTriggerEntryIdFather'],  
27 - setup(props) {  
28 - let fieldValue = reactive({});  
29 - const option = ref<[]>([]);  
30 - const data = ref<[]>([]);  
31 - const [registerForm, { setFieldsValue, resetFields, getFieldsValue, updateSchema }] = useForm( 27 + components: { CollapseContainer, BasicForm, Icon, Tooltip },
  28 + props: {
  29 + triggerIndex: {
  30 + type: Number,
  31 + required: true,
  32 + },
  33 + },
  34 + emits: ['deleteTrigger'],
  35 + setup(props, { emit }) {
  36 + const [registerForm, { resetFields, getFieldsValue, updateSchema, setFieldsValue }] = useForm(
32 { 37 {
33 - labelWidth: 100,  
34 schemas: useTriggerDrawerSchema, 38 schemas: useTriggerDrawerSchema,
35 - actionColOptions: { span: 24 }, 39 + showActionButtonGroup: false,
36 } 40 }
37 ); 41 );
38 - const getFieldsValueFunc = () => {  
39 - fieldValue = getFieldsValue();  
40 - return fieldValue;  
41 - };  
42 - const updateFieldDeviceId = (v) => {  
43 - if (v.length == 0 || v.length > 0) {  
44 - option.value = v;  
45 - updateSchema({  
46 - field: 'entityId',  
47 - componentProps: {  
48 - options: option.value,  
49 - onChange(e) {  
50 - if (e) {  
51 - setTimeout(() => {  
52 - updateFieldAttributeFunc(e);  
53 - }, 10);  
54 - }  
55 - }, 42 + const getFieldsValueFunc = () => getFieldsValue();
  43 +
  44 + const updateFieldDeviceId = (deviceList: any[]) => {
  45 + updateSchema({
  46 + field: 'entityId',
  47 + componentProps: {
  48 + options: deviceList,
  49 + onChange(e) {
  50 + if (e) {
  51 + updateFieldAttributeFunc(e);
  52 + }
56 }, 53 },
57 - });  
58 - } else if (v.length == undefined) {  
59 - setTimeout(() => {  
60 - updateSchema({  
61 - field: 'entityId',  
62 - componentProps: {  
63 - options: v.item,  
64 - onChange(e) {  
65 - if (e) {  
66 - setTimeout(() => {  
67 - updateFieldAttributeFunc(e);  
68 - }, 10);  
69 - }  
70 - },  
71 - },  
72 - });  
73 - }, 10);  
74 - } 54 + },
  55 + });
75 }; 56 };
76 const updateFieldAttributeFunc = async (e) => { 57 const updateFieldAttributeFunc = async (e) => {
77 const data1 = await screenLinkPageByDeviceIdGetAttribut('DEVICE', e); 58 const data1 = await screenLinkPageByDeviceIdGetAttribut('DEVICE', e);
78 - data.value = data1.map((m) => { 59 + const options = data1.map((m) => {
79 return { 60 return {
80 label: m, 61 label: m,
81 value: m, 62 value: m,
@@ -85,9 +66,9 @@ @@ -85,9 +66,9 @@
85 field: 'type2', 66 field: 'type2',
86 componentProps: { 67 componentProps: {
87 placeholder: '请选择属性', 68 placeholder: '请选择属性',
88 - options: data.value,  
89 - onChange(e) {  
90 - if (e) { 69 + options,
  70 + onChange(value) {
  71 + if (value) {
91 updateSchema([ 72 updateSchema([
92 { 73 {
93 field: 'operation', 74 field: 'operation',
@@ -98,109 +79,62 @@ @@ -98,109 +79,62 @@
98 ifShow: true, 79 ifShow: true,
99 }, 80 },
100 ]); 81 ]);
101 - } else {  
102 - updateSchema([  
103 - {  
104 - field: 'operation',  
105 - ifShow: false,  
106 - },  
107 - {  
108 - field: 'value',  
109 - ifShow: false,  
110 - },  
111 - ]); 82 + setFieldsValue({
  83 + operation: '',
  84 + value: '',
  85 + });
  86 + return;
112 } 87 }
113 - },  
114 - },  
115 - });  
116 - };  
117 - const updateOperatorAndValue = () => {  
118 - updateSchema([  
119 - {  
120 - field: 'operation',  
121 - ifShow: false,  
122 - },  
123 - {  
124 - field: 'value',  
125 - ifShow: false,  
126 - },  
127 - ]);  
128 - };  
129 - const resetFieldsValueFunc = () => {  
130 - resetFields();  
131 - };  
132 - //回显数据  
133 - const setFieldsFormValueFun = () => {  
134 - if (props.bindTriggerFather != 1) {  
135 - setTimeout(() => {  
136 - setFieldsValue(props.bindTriggerFather);  
137 - setFieldsValue({  
138 - entityId1: props.bindTriggerFather.entityId,  
139 - entityId2: props.bindTriggerFather.entityId,  
140 - type1: props.bindTriggerFather?.triggerCondition?.condition[0]?.key?.type,  
141 - type2: props.bindTriggerFather?.triggerCondition?.condition[0]?.key?.key,  
142 - operation:  
143 - props.bindTriggerFather?.triggerCondition?.condition[0]?.predicate?.operation,  
144 - value:  
145 - props.bindTriggerFather?.triggerCondition?.condition[0]?.predicate?.value  
146 - ?.defaultValue,  
147 - });  
148 - if (props.bindTriggerFather?.triggerCondition?.condition[0]?.key?.key) {  
149 updateSchema([ 88 updateSchema([
150 { 89 {
151 field: 'operation', 90 field: 'operation',
152 - ifShow: true, 91 + ifShow: false,
153 }, 92 },
154 { 93 {
155 field: 'value', 94 field: 'value',
156 - ifShow: true, 95 + ifShow: false,
157 }, 96 },
158 ]); 97 ]);
159 - }  
160 - }, 1);  
161 - }  
162 - };  
163 - setFieldsFormValueFun();  
164 - //新增清空设备选择  
165 - const clearSelectDevice = () => {  
166 - updateSchema({  
167 - field: 'entityId',  
168 - componentProps: {  
169 - options: [], 98 + setFieldsValue({
  99 + operation: '',
  100 + value: '',
  101 + });
  102 + },
170 }, 103 },
171 }); 104 });
172 }; 105 };
173 - const clearSelectAttribute = () => {  
174 - updateSchema({  
175 - field: 'type2',  
176 - componentProps: {  
177 - options: [],  
178 - },  
179 - }); 106 +
  107 + const resetFieldsValueFunc = () => resetFields();
  108 + // 回显数据函数
  109 + const setFieldsFormValueFun = (fieldsValue) => {
  110 + setFieldsValue(fieldsValue);
180 }; 111 };
  112 +
181 const editSelectDevice = () => { 113 const editSelectDevice = () => {
182 if (props.bindTriggerEntryIdFather != 1) { 114 if (props.bindTriggerEntryIdFather != 1) {
183 - setTimeout(() => {  
184 - updateSchema({  
185 - field: 'entityId',  
186 - componentProps: {  
187 - options: props.bindTriggerEntryIdFather,  
188 - },  
189 - });  
190 - }, 100); 115 + updateSchema({
  116 + field: 'entityId',
  117 + componentProps: {
  118 + options: props.bindTriggerEntryIdFather,
  119 + },
  120 + });
191 } 121 }
192 }; 122 };
193 - editSelectDevice(); 123 + // editSelectDevice();
  124 +
  125 + const handleDelete = (triggerIndex) => {
  126 + emit('deleteTrigger', triggerIndex);
  127 + };
194 return { 128 return {
195 - updateOperatorAndValue,  
196 - clearSelectAttribute,  
197 updateFieldAttributeFunc, 129 updateFieldAttributeFunc,
198 updateFieldDeviceId, 130 updateFieldDeviceId,
199 resetFieldsValueFunc, 131 resetFieldsValueFunc,
200 - clearSelectDevice,  
201 editSelectDevice, 132 editSelectDevice,
202 getFieldsValueFunc, 133 getFieldsValueFunc,
203 registerForm, 134 registerForm,
  135 + handleDelete,
  136 +
  137 + setFieldsFormValueFun,
204 }; 138 };
205 }, 139 },
206 }); 140 });
1 -export interface IAddTrigger {  
2 - triggerType: string;  
3 - entityId: string;  
4 - touchWay: string;  
5 - attributeChoose: string;  
6 - compare: string;  
7 - value: string;  
8 -}  
9 -  
10 -export interface IAddCondition {  
11 - triggerType: string;  
12 - entityId: string;  
13 - createTime: string;  
14 - updateTime: string;  
15 - compare: string;  
16 - value: string;  
17 -}  
18 -  
19 -export interface IAddAction {  
20 - outTarget: string;  
21 - deviceId: string;  
22 - command: string;  
23 - sceneLinkageId: string;  
24 -}  
1 <template> 1 <template>
2 <div> 2 <div>
3 - <BasicTable  
4 - @register="registerTable"  
5 - @selection-change="useSelectionChange"  
6 - :rowSelection="{ type: 'checkbox' }"  
7 - > 3 + <BasicTable @register="registerTable">
8 <template #toolbar> 4 <template #toolbar>
9 <a-button v-if="isTenant || isCustomer || isPlatform" type="primary" @click="handleAdd"> 5 <a-button v-if="isTenant || isCustomer || isPlatform" type="primary" @click="handleAdd">
10 新增场景联动 6 新增场景联动
@@ -52,21 +48,18 @@ @@ -52,21 +48,18 @@
52 import { defineComponent, ref, computed } from 'vue'; 48 import { defineComponent, ref, computed } from 'vue';
53 import { BasicTable, useTable, TableAction } from '/@/components/Table'; 49 import { BasicTable, useTable, TableAction } from '/@/components/Table';
54 import { useDrawer } from '/@/components/Drawer'; 50 import { useDrawer } from '/@/components/Drawer';
55 - import SceneLinkAgeDrawer from './useDrawer.vue';  
56 - import { columns, searchFormSchema } from './config';  
57 - import { useMessage } from '/@/hooks/web/useMessage';  
58 import { screenLinkPageGetApi, screenLinkPageDeleteApi } from '/@/api/ruleengine/ruleengineApi'; 51 import { screenLinkPageGetApi, screenLinkPageDeleteApi } from '/@/api/ruleengine/ruleengineApi';
59 import { useBatchDelete } from '/@/hooks/web/useBatchDelete'; 52 import { useBatchDelete } from '/@/hooks/web/useBatchDelete';
60 import { RoleEnum } from '/@/enums/roleEnum'; 53 import { RoleEnum } from '/@/enums/roleEnum';
61 - import { usePermission } from '/@/hooks/web/usePermission';  
62 import { useUserStore } from '/@/store/modules/user'; 54 import { useUserStore } from '/@/store/modules/user';
  55 + import { columns, searchFormSchema } from './config';
  56 + import SceneLinkAgeDrawer from './SceneLinkAgeDrawer.vue';
63 57
64 export default defineComponent({ 58 export default defineComponent({
65 - name: 'Index', 59 + name: 'LinkEdge',
66 components: { BasicTable, SceneLinkAgeDrawer, TableAction }, 60 components: { BasicTable, SceneLinkAgeDrawer, TableAction },
67 - emits: ['default', 'registerTable', 'registerDrawer', 'register'], 61 +
68 setup() { 62 setup() {
69 - const { hasPermission } = usePermission();  
70 const userStore = useUserStore(); 63 const userStore = useUserStore();
71 const isTenant = computed(() => userStore.getRoleList.includes(RoleEnum.TENANT_ADMIN)); 64 const isTenant = computed(() => userStore.getRoleList.includes(RoleEnum.TENANT_ADMIN));
72 const isCustomer = computed(() => userStore.getRoleList.includes(RoleEnum.CUSTOMER_USER)); 65 const isCustomer = computed(() => userStore.getRoleList.includes(RoleEnum.CUSTOMER_USER));
@@ -77,10 +70,9 @@ @@ -77,10 +70,9 @@
77 screenLinkPageDeleteApi, 70 screenLinkPageDeleteApi,
78 handleSuccess 71 handleSuccess
79 ); 72 );
80 - let selectedRowKeys: Array<string> = []; 73 +
81 const [registerDrawer, { openDrawer }] = useDrawer(); 74 const [registerDrawer, { openDrawer }] = useDrawer();
82 - const { createMessage } = useMessage();  
83 - const [registerTable, { reload, getSelectRowKeys }] = useTable({ 75 + const [registerTable, { reload }] = useTable({
84 title: '场景联动列表', 76 title: '场景联动列表',
85 api: screenLinkPageGetApi, 77 api: screenLinkPageGetApi,
86 columns, 78 columns,
@@ -108,32 +100,12 @@ @@ -108,32 +100,12 @@
108 }); 100 });
109 } 101 }
110 102
111 - const useSelectionChange = () => {  
112 - selectedRowKeys = getSelectRowKeys();  
113 - };  
114 -  
115 - async function handleToolbarDel() {  
116 - await screenLinkPageDeleteApi(selectedRowKeys);  
117 - createMessage.success('删除成功');  
118 - reload();  
119 - }  
120 -  
121 function handleEdit(record: Recordable) { 103 function handleEdit(record: Recordable) {
122 openDrawer(true, { 104 openDrawer(true, {
123 record, 105 record,
124 isUpdate: true, 106 isUpdate: true,
125 }); 107 });
126 } 108 }
127 - async function handleDelete(record: Recordable) {  
128 - try {  
129 - let ids = [record.id];  
130 - await screenLinkPageDeleteApi(ids);  
131 - createMessage.success('删除成功');  
132 - reload();  
133 - } catch (e) {  
134 - return e;  
135 - }  
136 - }  
137 function handleSuccess() { 109 function handleSuccess() {
138 reload(); 110 reload();
139 } 111 }
@@ -142,16 +114,11 @@ @@ -142,16 +114,11 @@
142 isSysadmin, 114 isSysadmin,
143 isCustomer, 115 isCustomer,
144 isTenant, 116 isTenant,
145 - RoleEnum,  
146 - hasPermission,  
147 sceneLinkAgeDrawerRef, 117 sceneLinkAgeDrawerRef,
148 - useSelectionChange,  
149 registerTable, 118 registerTable,
150 registerDrawer, 119 registerDrawer,
151 handleAdd, 120 handleAdd,
152 - handleToolbarDel,  
153 handleEdit, 121 handleEdit,
154 - handleDelete,  
155 handleSuccess, 122 handleSuccess,
156 hasBatchDelete, 123 hasBatchDelete,
157 handleDeleteOrBatchDelete, 124 handleDeleteOrBatchDelete,
@@ -160,4 +127,25 @@ @@ -160,4 +127,25 @@
160 }); 127 });
161 </script> 128 </script>
162 129
163 -<style lang="less" scoped></style> 130 +<!-- <script setup lang="ts">
  131 + import { ref, onMounted } from 'vue';
  132 + const refList = ref([]);
  133 + const list = ref(['张三', '李四', '王五', '赵牛']);
  134 + onMounted(() => {
  135 + console.log(refList.value);
  136 + });
  137 + let flag = 0;
  138 + const add = () => {
  139 + refList.value = [];
  140 + list.value.push(`哈哈${flag++}`);
  141 + console.log(refList.value);
  142 + };
  143 +</script>
  144 +<template>
  145 + <div>
  146 + <template v-for="item in list" :key="item">
  147 + <div :ref="(el) => refList.push(el)">{{ item }}</div>
  148 + </template>
  149 + <a-button @click="add" type="primary" class="ml-4 mt-4">添加元素</a-button>
  150 + </div>
  151 +</template> -->
1 -<template>  
2 - <div>  
3 - <BasicDrawer  
4 - v-bind="$attrs"  
5 - @register="registerDrawer"  
6 - showFooter  
7 - width="50vw"  
8 - @ok="handleSubmit(drawerStatus)"  
9 - @close="handleClose"  
10 - >  
11 - <div>  
12 - <!-- 基础表单 -->  
13 - <BasicForm @register="registerForm" />  
14 - <!-- 基础表单 -->  
15 - <!-- 触发器 -->  
16 - <div style="border-radius: 4px">  
17 - <template  
18 - v-for="(item, index) in !drawerStatus ? triggerData : editTriggerData"  
19 - :key="index"  
20 - >  
21 - <span style="display: none">{{ item + index }}</span>  
22 - <span style="position: relative; top: 3.2vh; left: 0.6vw">触发器 {{ index + 1 }}</span>  
23 - <useTriggerCpn  
24 - ref="triggerBindRef"  
25 - :bindTriggerFather="!drawerStatus ? 1 : item"  
26 - :bindTriggerEntryIdFather="!drawerStatus ? 1 : getTriggerFatherEntryIdData"  
27 - />  
28 - </template>  
29 - <!-- 按钮 -->  
30 - <div  
31 - style="  
32 - display: flex;  
33 - width: 11vw;  
34 - height: 4vh;  
35 - flex-direction: row;  
36 - justify-content: space-between;  
37 - "  
38 - >  
39 - <div style="display: flex; width: 4vw; height: 4vh">  
40 - <Button  
41 - type="primary"  
42 - style="border-radius: 2px"  
43 - class="mt-5"  
44 - @click="triggerClickAdd(drawerStatus)"  
45 - >触发器</Button  
46 - >  
47 - </div>  
48 - <div style="display: flex; width: 4vw; height: 4vh">  
49 - <Button  
50 - v-if="triggerData.length !== 0 || editTriggerData.length !== 0"  
51 - type="default"  
52 - style="border-radius: 2px; background-color: rgba(237, 111, 111, 1)"  
53 - class="mt-5"  
54 - @click="triggerClickRemove(drawerStatus)"  
55 - >  
56 - <span style="color: white">删除</span></Button  
57 - >  
58 - </div>  
59 - </div>  
60 - <!-- 按钮 -->  
61 - </div>  
62 - <!-- 触发器 -->  
63 - <div style="height: 5vh"></div>  
64 - <!-- 执行条件 -->  
65 - <div style="border-radius: 4px">  
66 - <template  
67 - v-for="(item, index) in !drawerStatus ? conditionData : editConditionData"  
68 - :key="index"  
69 - >  
70 - <span style="display: none">{{ item + index }}</span>  
71 - <span style="position: relative; top: 3.2vh; left: 0.6vw"  
72 - >执行条件 {{ index + 1 }}</span  
73 - >  
74 - <useConditionCpn  
75 - ref="conditionBindRef"  
76 - :bindConditionFather="!drawerStatus ? 1 : item"  
77 - :bindConditionEntryIdFather="!drawerStatus ? 1 : getConditionFatherEntryIdData"  
78 - />  
79 - </template>  
80 - <!-- 按钮 -->  
81 - <div  
82 - style="  
83 - display: flex;  
84 - width: 11vw;  
85 - height: 4vh;  
86 - flex-direction: row;  
87 - justify-content: space-between;  
88 - "  
89 - >  
90 - <div style="display: flex; width: 4vw; height: 4vh">  
91 - <Button  
92 - type="primary"  
93 - style="border-radius: 2px"  
94 - class="mt-5"  
95 - @click="conditionClickAdd(drawerStatus)"  
96 - >执行条件</Button  
97 - >  
98 - </div>  
99 - <div style="display: flex; width: 4vw; height: 4vh">  
100 - <Button  
101 - v-if="conditionData.length !== 0 || editConditionData.length !== 0"  
102 - type="default"  
103 - style="border-radius: 2px; background-color: rgba(237, 111, 111, 1)"  
104 - class="mt-5"  
105 - @click="conditionClickRemove(drawerStatus)"  
106 - >  
107 - <span style="color: white">删除</span></Button  
108 - >  
109 - </div>  
110 - </div>  
111 - <!-- 按钮 -->  
112 - </div>  
113 - <!-- 执行条件 -->  
114 - <div style="height: 5vh"></div>  
115 - <!-- 执行动作 -->  
116 - <div style="border-radius: 4px">  
117 - <template  
118 - v-for="(item, index) in !drawerStatus ? actionData : editActionData"  
119 - :key="index"  
120 - >  
121 - <span style="display: none">{{ item + index }}</span>  
122 - <span style="position: relative; top: 3.6vh; left: 1vw">执行动作 {{ index + 1 }}</span>  
123 - <useActionCpn  
124 - ref="actionBindRef"  
125 - :bindActionFather="!drawerStatus ? 1 : item"  
126 - :bindActionEntryIdFather="!drawerStatus ? 1 : getActionFatherEntryIdData"  
127 - />  
128 - </template>  
129 - <!-- 按钮 -->  
130 - <div  
131 - style="  
132 - display: flex;  
133 - width: 11vw;  
134 - height: 4vh;  
135 - flex-direction: row;  
136 - justify-content: space-between;  
137 - "  
138 - >  
139 - <div style="display: flex; width: 4vw; height: 4vh">  
140 - <Button  
141 - type="primary"  
142 - style="border-radius: 2px"  
143 - class="mt-5"  
144 - @click="actionClickAdd(drawerStatus)"  
145 - >执行动作</Button  
146 - >  
147 - </div>  
148 - <div style="display: flex; width: 4vw; height: 4vh">  
149 - <Button  
150 - v-if="actionData.length !== 0 || editActionData.length !== 0"  
151 - type="default"  
152 - style="border-radius: 2px; background-color: rgba(237, 111, 111, 1)"  
153 - class="mt-5"  
154 - @click="actionClickRemove(drawerStatus)"  
155 - >  
156 - <span style="color: white">删除</span></Button  
157 - >  
158 - </div>  
159 - </div>  
160 - <!-- 按钮 -->  
161 - </div>  
162 - <!-- 执行动作 -->  
163 - </div>  
164 - </BasicDrawer>  
165 - </div>  
166 -</template>  
167 -<script lang="ts">  
168 - import { defineComponent, reactive, ref, getCurrentInstance, watch } from 'vue';  
169 - import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';  
170 - import { formSchema, changeOriginId } from './config';  
171 - import { BasicForm, useForm } from '/@/components/Form';  
172 - import useTriggerCpn from './cpns/trigger.vue';  
173 - import useConditionCpn from './cpns/condition.vue';  
174 - import useActionCpn from './cpns/action.vue';  
175 - import { Button } from '/@/components/Button';  
176 - import { formatTriggerData, formatConditionData } from './cpns/format-data/index';  
177 - import { useMessage } from '/@/hooks/web/useMessage';  
178 - import {  
179 - screenLinkPageAddApi,  
180 - screenLinkPageByDeptIdGetDevice,  
181 - screenLinkPageUpdateApi,  
182 - } from '/@/api/ruleengine/ruleengineApi';  
183 -  
184 - export default defineComponent({  
185 - name: 'ConfigDrawer',  
186 - components: {  
187 - BasicDrawer,  
188 - BasicForm,  
189 - useTriggerCpn,  
190 - useConditionCpn,  
191 - useActionCpn,  
192 - Button,  
193 - },  
194 - emits: ['register', 'success'],  
195 - setup(_, { emit }) {  
196 - const { proxy } = getCurrentInstance() as any;  
197 - const { createMessage } = useMessage();  
198 - const triggerData = reactive([]);  
199 - const conditionData = reactive([]);  
200 - const actionData = reactive([1]);  
201 - const triggerBindRef = ref(null);  
202 - const conditionBindRef = ref(null);  
203 - const actionBindRef = ref(null);  
204 - let getTriggerFormValue: any = reactive({});  
205 - let getConditionFormValue: any = reactive({});  
206 - let getActionFormValue: any = reactive({});  
207 - const drawerStatus = ref(true);  
208 - let postAddOrEditData: any = reactive({});  
209 - let concatTrigger: any = reactive([]);  
210 - let concatCondition: any = reactive([]);  
211 - let concatAction: any = reactive([]);  
212 - let optionsItemDeviceId: any = ref([]);  
213 - let editTriggerData: any = ref([]);  
214 - let editConditionData: any = ref([]);  
215 - let editActionData: any = ref([]);  
216 - let getTriggerFatherEntryIdData: any = reactive([]);  
217 - let getConditionFatherEntryIdData: any = reactive([]);  
218 - let getActionFatherEntryIdData: any = reactive([]);  
219 - const editEntryIdData: any = ref([]);  
220 - const getId = ref('');  
221 - const getTenantId = ref('');  
222 - const [registerForm, { resetFields, validate, setFieldsValue }] = useForm({  
223 - labelWidth: 120,  
224 - schemas: formSchema,  
225 - showActionButtonGroup: false,  
226 - });  
227 - const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {  
228 - setDrawerProps({ confirmLoading: false });  
229 - drawerStatus.value = data.isUpdate;  
230 - if (!drawerStatus.value) {  
231 - triggerData.length = 0;  
232 - conditionData.length = 0;  
233 - actionData.length = 0;  
234 - resetFields();  
235 - defaultAddAction();  
236 - try {  
237 - proxy.$refs.triggerBindRef?.resetFieldsValueFunc();  
238 - proxy.$refs.triggerBindRef?.clearSelectDevice();  
239 - proxy.$refs.triggerBindRef?.clearSelectAttribute();  
240 - proxy.$refs.conditionBindRef?.resetFieldsValueFunc();  
241 - proxy.$refs.conditionBindRef?.clearSelectDevice();  
242 - proxy.$refs.conditionBindRef?.clearSelectAttribute();  
243 - proxy.$refs.actionBindRef?.clearSelectDevice();  
244 - proxy.$refs.actionBindRef.resetFieldsValueFunc();  
245 - } catch {}  
246 - } else {  
247 - emit('success');  
248 - editTriggerData.value.length = 0;  
249 - editConditionData.value.length = 0;  
250 - editActionData.value.length = 0;  
251 - editEntryIdData.value.length = 0;  
252 - await setFieldsValue({  
253 - ...data.record,  
254 - });  
255 - getId.value = data.record.id;  
256 - getTenantId.value = data.record.tenantId;  
257 - editTriggerData.value = data.record.triggers;  
258 - editConditionData.value = data.record.doConditions;  
259 - editActionData.value = data.record.doActions;  
260 - const options = await screenLinkPageByDeptIdGetDevice({  
261 - organizationId: data.record.organizationId,  
262 - });  
263 - data.record.triggers.forEach((f1) => {  
264 - options.items?.forEach((f2) => {  
265 - if (f2.tbDeviceId == f1.entityId) {  
266 - getTriggerFatherEntryIdData.push({  
267 - value: f2.tbDeviceId,  
268 - label: f2.name,  
269 - } as never);  
270 - }  
271 - });  
272 - });  
273 - data.record.doConditions.forEach((f1) => {  
274 - options.items?.forEach((f2) => {  
275 - if (f2.tbDeviceId == f1.entityId) {  
276 - getConditionFatherEntryIdData.push({  
277 - value: f2.tbDeviceId,  
278 - label: f2.name,  
279 - } as never);  
280 - }  
281 - });  
282 - });  
283 - data.record.doActions.forEach((f1) => {  
284 - options.items?.forEach((f2) => {  
285 - if (f2.tbDeviceId == f1.deviceId) {  
286 - getActionFatherEntryIdData.push({  
287 - value: f2.tbDeviceId,  
288 - label: f2.name,  
289 - } as never);  
290 - }  
291 - });  
292 - });  
293 - editEntryIdData.value = options.items.map((v) => {  
294 - return {  
295 - value: v.tbDeviceId,  
296 - label: v.name,  
297 - };  
298 - });  
299 - setTimeout(() => {  
300 - proxy.$refs.triggerBindRef?.updateFieldDeviceId(editEntryIdData.value);  
301 - proxy.$refs.conditionBindRef?.updateFieldDeviceId(editEntryIdData.value);  
302 - proxy.$refs.actionBindRef?.updateFieldDeviceId(editEntryIdData.value);  
303 - }, 10);  
304 - }  
305 - });  
306 - watch(changeOriginId, async (newV: string) => {  
307 - const result = await screenLinkPageByDeptIdGetDevice({ organizationId: newV });  
308 - optionsItemDeviceId.value = result.items.map((v) => {  
309 - return {  
310 - value: v.tbDeviceId,  
311 - label: v.name,  
312 - };  
313 - });  
314 - setTimeout(() => {  
315 - proxy.$refs.triggerBindRef?.updateFieldDeviceId(optionsItemDeviceId.value);  
316 - proxy.$refs.conditionBindRef?.updateFieldDeviceId(optionsItemDeviceId.value);  
317 - proxy.$refs.actionBindRef?.updateFieldDeviceId(optionsItemDeviceId.value);  
318 - }, 10);  
319 - });  
320 -  
321 - /**  
322 - * 获取触发器表单值  
323 - */  
324 - const getTriggerFormValueFunc = () => {  
325 - try {  
326 - getTriggerFormValue = proxy.$refs.triggerBindRef.getFieldsValueFunc();  
327 - } catch {}  
328 - };  
329 - const triggerClickAdd = (e) => {  
330 - if (!e) {  
331 - getTriggerFormValueFunc();  
332 - triggerData.push(getTriggerFormValue as never);  
333 - setTimeout(() => {  
334 - proxy.$refs.triggerBindRef?.updateFieldDeviceId(optionsItemDeviceId.value);  
335 - }, 10);  
336 - } else {  
337 - //TODO  
338 - editTriggerData.value.push(getTriggerFormValue);  
339 - }  
340 - };  
341 - const triggerClickRemove = (e) => {  
342 - if (!e) {  
343 - triggerData.pop();  
344 - } else {  
345 - editTriggerData.value.pop();  
346 - }  
347 - };  
348 -  
349 - /**  
350 - * 获取执行条件表单值  
351 - */  
352 - const getConditionFormValueFunc = () => {  
353 - try {  
354 - getConditionFormValue = proxy.$refs.conditionBindRef.getFieldsValueFunc();  
355 - } catch {}  
356 - };  
357 - const conditionClickAdd = (e) => {  
358 - if (!e) {  
359 - getConditionFormValueFunc();  
360 - conditionData.push(getConditionFormValue as never);  
361 - setTimeout(() => {  
362 - proxy.$refs.conditionBindRef?.updateFieldDeviceId(optionsItemDeviceId.value);  
363 - }, 10);  
364 - } else {  
365 - //TODO  
366 - }  
367 - };  
368 - const conditionClickRemove = (e) => {  
369 - if (!e) {  
370 - conditionData.pop();  
371 - } else {  
372 - editConditionData.value.pop();  
373 - }  
374 - };  
375 -  
376 - /**  
377 - * 获取执行动作表单值  
378 - */  
379 - const getActionFormValueFunc = () => {  
380 - try {  
381 - getActionFormValue = proxy.$refs.actionBindRef.getFieldsValueFunc();  
382 - } catch {}  
383 - };  
384 - //默认新增执行动作  
385 - const defaultAddAction = () => {  
386 - if (actionData.length == 0) {  
387 - actionClickAdd(false);  
388 - }  
389 - };  
390 - const actionClickAdd = (e) => {  
391 - if (!e) {  
392 - getActionFormValueFunc();  
393 - actionData.push(getActionFormValue as never);  
394 - setTimeout(() => {  
395 - proxy.$refs.actionBindRef?.updateFieldDeviceId(optionsItemDeviceId.value);  
396 - }, 10);  
397 - } else {  
398 - //TODO  
399 - }  
400 - };  
401 - const actionClickRemove = (e) => {  
402 - if (!e) {  
403 - actionData.pop();  
404 - } else {  
405 - editActionData.value.pop();  
406 - }  
407 - };  
408 - const submitOrEditFunc = (e) => {  
409 - if (!e) {  
410 - getTriggerFormValueFunc();  
411 - concatTrigger = triggerData.concat(getTriggerFormValue);  
412 - //去除第一个空对象  
413 - concatTrigger.shift();  
414 - concatTrigger = concatTrigger.map((m) => formatTriggerData(m));  
415 - getConditionFormValueFunc();  
416 - concatCondition = conditionData.concat(getConditionFormValue);  
417 - //去除第一个空对象  
418 - concatCondition.shift();  
419 - concatCondition = concatCondition.map((m) => formatConditionData(m));  
420 - getActionFormValueFunc();  
421 - concatAction = actionData.concat(getActionFormValue);  
422 - // 去除第一个空对象;  
423 - concatAction.shift();  
424 - } else {  
425 - //TODO  
426 - }  
427 - };  
428 -  
429 - const handleSubmit = async (e) => {  
430 - let basicFormValue = await validate();  
431 - if (!basicFormValue) return;  
432 - if (!e) {  
433 - submitOrEditFunc(e);  
434 - let isKongNum = 0;  
435 - concatAction.forEach((f) => {  
436 - isKongNum = Object.keys(f).length;  
437 - });  
438 - if (concatAction.length == 1 && isKongNum == 0)  
439 - return createMessage.error('请填写执行动作');  
440 - postAddOrEditData = {  
441 - ...basicFormValue,  
442 - ...{  
443 - triggers: concatTrigger,  
444 - },  
445 - ...{  
446 - doConditions: concatCondition,  
447 - },  
448 - ...{  
449 - doActions: concatAction,  
450 - },  
451 - };  
452 - await screenLinkPageAddApi(postAddOrEditData);  
453 - createMessage.success('新增成功');  
454 - closeDrawer();  
455 - emit('success');  
456 - } else {  
457 - submitOrEditFunc(e);  
458 - postAddOrEditData = {  
459 - ...basicFormValue,  
460 - ...{ id: getId.value },  
461 - ...{ tenantId: getTenantId.value },  
462 - };  
463 - await screenLinkPageUpdateApi(postAddOrEditData);  
464 - createMessage.success('编辑成功');  
465 - closeDrawer();  
466 - emit('success');  
467 - }  
468 - };  
469 - const handleClose = () => {  
470 - closeDrawer();  
471 - };  
472 -  
473 - return {  
474 - registerDrawer,  
475 - registerForm,  
476 - triggerData,  
477 - triggerClickAdd,  
478 - triggerClickRemove,  
479 - conditionClickAdd,  
480 - conditionClickRemove,  
481 - actionClickAdd,  
482 - actionClickRemove,  
483 - triggerBindRef,  
484 - conditionBindRef,  
485 - actionBindRef,  
486 - handleSubmit,  
487 - handleClose,  
488 - drawerStatus,  
489 - conditionData,  
490 - actionData,  
491 - editTriggerData,  
492 - editConditionData,  
493 - editActionData,  
494 - getTriggerFatherEntryIdData,  
495 - getConditionFatherEntryIdData,  
496 - getActionFatherEntryIdData,  
497 - };  
498 - },  
499 - });  
500 -</script>  
501 -  
502 -<style lang="less" scoped></style>