简柏林 / thingskit-front · Commits

Commit 6a225297fba72bbca5d5bf80d3a2fe6be34a517f

Authored by fengtao
1 parent d85b5ced

fix:修复场景联动新增问题

Inline Side-by-side
Showing 4 changed files with 207 additions and 146 deletions
@@ -39,15 +39,9 @@ @@ -39,15 +39,9 @@
39 alt="avatar" 39 alt="avatar"
40 /> 40 />
41 <div v-else> 41 <div v-else>
42 - <div style="margin-top: 30px"> 42 + <div style="margin-top: 5.2vh; margin-left: 3.35vw">
43 <PlusOutlined style="font-size: 30px" /> 43 <PlusOutlined style="font-size: 30px" />
44 </div> 44 </div>
45 - <div  
46 - class="ant-upload-text flex"  
47 - style="width: 280px; height: 130px; align-items: center"  
48 - >  
49 - 支持.PNG、.JPG、.SVG格式，建议尺寸为300px × 300px（及以上），大小不超过2M。</div  
50 - >  
51 </div> 45 </div>
52 </Upload> 46 </Upload>
53 </div> 47 </div>
@@ -23,10 +23,10 @@ @@ -23,10 +23,10 @@
23 23
24 export default defineComponent({ 24 export default defineComponent({
25 components: { CollapseContainer, BasicForm, [Input.name]: Input }, 25 components: { CollapseContainer, BasicForm, [Input.name]: Input },
26 - props: ['deviceInfo'], 26 + props: ['deviceInfo', 'editTriggerFather'],
27 setup(props) { 27 setup(props) {
28 const fieldValue: any = ref({}); 28 const fieldValue: any = ref({});
29 - const [registerTrigger, { getFieldsValue, updateSchema }] = useForm({ 29 + const [registerTrigger, { setFieldsValue, getFieldsValue, updateSchema }] = useForm({
30 labelWidth: 100, 30 labelWidth: 100,
31 schemas: useTriggerDrawerSchema, 31 schemas: useTriggerDrawerSchema,
32 actionColOptions: { span: 24 }, 32 actionColOptions: { span: 24 },
@@ -50,6 +50,13 @@ @@ -50,6 +50,13 @@
50 }); 50 });
51 } 51 }
52 ); 52 );
  53 + //回显数据
  54 + const setFieldsFormValueFun = () => {
  55 + setTimeout(() => {
  56 + setFieldsValue(props.editTriggerFather);
  57 + }, 100);
  58 + };
  59 + setFieldsFormValueFun();
53 //新增清空设备选择 60 //新增清空设备选择
54 const clearSelectDevice = () => { 61 const clearSelectDevice = () => {
55 updateSchema({ 62 updateSchema({
@@ -597,6 +597,7 @@ export const useActionDrawerSchema: FormSchema[] = [ @@ -597,6 +597,7 @@ export const useActionDrawerSchema: FormSchema[] = [
597 field: 'outTarget', 597 field: 'outTarget',
598 label: '', 598 label: '',
599 component: 'Select', 599 component: 'Select',
  600 + required: true,
600 componentProps: { 601 componentProps: {
601 placeholder: '设备输出', 602 placeholder: '设备输出',
602 options: [ 603 options: [
@@ -611,6 +612,7 @@ export const useActionDrawerSchema: FormSchema[] = [ @@ -611,6 +612,7 @@ export const useActionDrawerSchema: FormSchema[] = [
611 field: 'deviceId', 612 field: 'deviceId',
612 label: '', 613 label: '',
613 component: 'Select', 614 component: 'Select',
  615 + required: true,
614 componentProps: { 616 componentProps: {
615 placeholder: '请选择设备', 617 placeholder: '请选择设备',
616 }, 618 },
@@ -624,6 +626,8 @@ export const useActionDrawerSchema: FormSchema[] = [ @@ -624,6 +626,8 @@ export const useActionDrawerSchema: FormSchema[] = [
624 field: 'command', 626 field: 'command',
625 component: 'Input', 627 component: 'Input',
626 label: '', 628 label: '',
  629 + required: true,
  630 +
627 componentProps: { 631 componentProps: {
628 maxLength: 255, 632 maxLength: 255,
629 placeholder: '请输入下发指定', 633 placeholder: '请输入下发指定',
@@ -7,119 +7,131 @@ @@ -7,119 +7,131 @@
7 width="1000px" 7 width="1000px"
8 @ok="handleSubmit" 8 @ok="handleSubmit"
9 > 9 >
10 - <BasicForm @register="registerForm" />  
11 - <!-- 触发器 -->  
12 <div> 10 <div>
13 - <template v-for="(item, index) in addTriggerPushData" :key="index">  
14 - <span style="display: none">{{ item + index }}</span>  
15 - <span style="position: relative; top: 3.2vh; left: 0.3vw">触发器{{ index + 1 }}</span>  
16 - <div>  
17 - <AddTriggerForm :deviceInfo="getDeviceInfo" ref="refTriggerChild" />  
18 - </div>  
19 - <div style="height: 3vh"></div>  
20 - </template>  
21 - <div  
22 - style="  
23 - display: flex;  
24 - width: 11vw;  
25 - height: 4vh;  
26 - flex-direction: row;  
27 - justify-content: space-between;  
28 - "  
29 - >  
30 - <div style="display: flex; width: 4vw; height: 4vh">  
31 - <Button type="primary" style="border-radius: 10px" class="mt-5" @click="addTrigger"  
32 - >新增触发器</Button  
33 - >  
34 - </div>  
35 - <div style="display: flex; width: 4vw; height: 4vh">  
36 - <Button  
37 - type="default"  
38 - style="border-radius: 10px; background-color: rgba(237, 111, 111, 1)"  
39 - class="mt-5"  
40 - @click="removeTrigger"  
41 - >  
42 - <span style="color: white">删除</span></Button  
43 - > 11 + <BasicForm @register="registerForm" />
  12 + <!-- 触发器 -->
  13 + <div>
  14 + <template
  15 + v-for="(item, index) in isUpdate == false ? addTriggerPushData : editTriggerPushData"
  16 + :key="index"
  17 + >
  18 + <span style="display: none">{{ item + index }}</span>
  19 + <span style="position: relative; top: 3.2vh; left: 0.3vw">触发器{{ index + 1 }}</span>
  20 + <div v-if="isUpdate == true">
  21 + <AddTriggerForm
  22 + :editTriggerFather="item"
  23 + :deviceInfo="getDeviceInfo"
  24 + ref="refTriggerChild"
  25 + />
  26 + </div>
  27 + <div v-if="isUpdate == false">
  28 + <AddTriggerForm :deviceInfo="getDeviceInfo" ref="refTriggerChild" />
  29 + </div>
  30 + <div style="height: 3vh"></div>
  31 + </template>
  32 + <div
  33 + style="
  34 + display: flex;
  35 + width: 11vw;
  36 + height: 4vh;
  37 + flex-direction: row;
  38 + justify-content: space-between;
  39 + "
  40 + >
  41 + <div style="display: flex; width: 4vw; height: 4vh">
  42 + <Button type="primary" style="border-radius: 10px" class="mt-5" @click="addTrigger"
  43 + >新增触发器</Button
  44 + >
  45 + </div>
  46 + <div style="display: flex; width: 4vw; height: 4vh">
  47 + <Button
  48 + type="default"
  49 + style="border-radius: 10px; background-color: rgba(237, 111, 111, 1)"
  50 + class="mt-5"
  51 + @click="removeTrigger"
  52 + >
  53 + <span style="color: white">删除</span></Button
  54 + >
  55 + </div>
44 </div> 56 </div>
45 </div> 57 </div>
46 - </div>  
47 - <div style="height: 5vh"></div>  
48 - <!-- 执行条件 -->  
49 - <div>  
50 - <template v-for="(item, index) in addConditionPushData" :key="index">  
51 - <span style="display: none">{{ item + index }}</span>  
52 - <span style="position: relative; top: 3.2vh; left: 0.3vw">执行条件{{ index + 1 }}</span> 58 + <div style="height: 5vh"></div>
  59 + <!-- 执行条件 -->
  60 + <div>
  61 + <template v-for="(item, index) in addConditionPushData" :key="index">
  62 + <span style="display: none">{{ item + index }}</span>
  63 + <span style="position: relative; top: 3.2vh; left: 0.3vw">执行条件{{ index + 1 }}</span>
53 64
54 - <div>  
55 - <AddConditiForm :deviceInfo1="getDeviceInfo1" ref="refConditionChild" />  
56 - </div>  
57 - <div style="height: 3vh"></div>  
58 - </template>  
59 - <div  
60 - style="  
61 - display: flex;  
62 - width: 11vw;  
63 - height: 4vh;  
64 - flex-direction: row;  
65 - justify-content: space-between;  
66 - "  
67 - >  
68 - <div style="display: flex; width: 4vw; height: 4vh">  
69 - <Button type="primary" style="border-radius: 10px" class="mt-5" @click="addCondition"  
70 - >新增执行条件</Button  
71 - >  
72 - </div>  
73 - <div style="display: flex; width: 4vw; height: 4vh">  
74 - <Button  
75 - style="border-radius: 10px; background-color: rgba(237, 111, 111, 1)"  
76 - type="default"  
77 - class="mt-5"  
78 - @click="removeCondition"  
79 - >  
80 - <span style="color: white">删除</span></Button  
81 - > 65 + <div>
  66 + <AddConditiForm :deviceInfo1="getDeviceInfo1" ref="refConditionChild" />
  67 + </div>
  68 + <div style="height: 3vh"></div>
  69 + </template>
  70 + <div
  71 + style="
  72 + display: flex;
  73 + width: 11vw;
  74 + height: 4vh;
  75 + flex-direction: row;
  76 + justify-content: space-between;
  77 + "
  78 + >
  79 + <div style="display: flex; width: 4vw; height: 4vh">
  80 + <Button type="primary" style="border-radius: 10px" class="mt-5" @click="addCondition"
  81 + >新增执行条件</Button
  82 + >
  83 + </div>
  84 + <div style="display: flex; width: 4vw; height: 4vh">
  85 + <Button
  86 + style="border-radius: 10px; background-color: rgba(237, 111, 111, 1)"
  87 + type="default"
  88 + class="mt-5"
  89 + @click="removeCondition"
  90 + >
  91 + <span style="color: white">删除</span></Button
  92 + >
  93 + </div>
82 </div> 94 </div>
83 </div> 95 </div>
84 - </div>  
85 - <!-- 执行动作 -->  
86 - <div style="height: 5vh"></div>  
87 - <div>  
88 - <template v-for="(item, index) in addActionPushData" :key="index">  
89 - <span style="display: none">{{ item + index }}</span>  
90 - <span style="position: relative; top: 4.2vh; left: 0.65vw">执行动作{{ index + 1 }}</span> 96 + <!-- 执行动作 -->
  97 + <div style="height: 5vh"></div>
  98 + <div>
  99 + <template v-for="(item, index) in addActionPushData" :key="index">
  100 + <span style="display: none">{{ item + index }}</span>
  101 + <span style="position: relative; top: 4.2vh; left: 0.65vw">执行动作{{ index + 1 }}</span>
91 102
92 - <div>  
93 - <AddActionForm :deviceInfo2="getDeviceInfo2" ref="refActionChild" />  
94 - </div>  
95 - <div style="height: 3vh"></div>  
96 - </template>  
97 - <div  
98 - style="  
99 - display: flex;  
100 - width: 11vw;  
101 - height: 4vh;  
102 - flex-direction: row;  
103 - justify-content: space-between;  
104 - "  
105 - >  
106 - <div style="display: flex; width: 4vw; height: 4vh">  
107 - <Button type="primary" style="border-radius: 10px" class="mt-5" @click="addAction"  
108 - >新增执行动作</Button  
109 - >  
110 - </div>  
111 - <div style="display: flex; width: 4vw; height: 4vh">  
112 - <Button  
113 - style="border-radius: 10px; background-color: rgba(237, 111, 111, 1)"  
114 - type="default"  
115 - class="mt-5"  
116 - @click="removeAction"  
117 - >  
118 - <span style="color: white">删除</span></Button  
119 - > 103 + <div>
  104 + <AddActionForm :deviceInfo2="getDeviceInfo2" ref="refActionChild" />
  105 + </div>
  106 + <div style="height: 3vh"></div>
  107 + </template>
  108 + <div
  109 + style="
  110 + display: flex;
  111 + width: 11vw;
  112 + height: 4vh;
  113 + flex-direction: row;
  114 + justify-content: space-between;
  115 + "
  116 + >
  117 + <div style="display: flex; width: 4vw; height: 4vh">
  118 + <Button type="primary" style="border-radius: 10px" class="mt-5" @click="addAction"
  119 + >新增执行动作</Button
  120 + >
  121 + </div>
  122 + <div style="display: flex; width: 4vw; height: 4vh">
  123 + <Button
  124 + style="border-radius: 10px; background-color: rgba(237, 111, 111, 1)"
  125 + type="default"
  126 + class="mt-5"
  127 + @click="removeAction"
  128 + >
  129 + <span style="color: white">删除</span></Button
  130 + >
  131 + </div>
120 </div> 132 </div>
  133 + <div style="height: 5vh"></div>
121 </div> 134 </div>
122 - <div style="height: 5vh"></div>  
123 </div> 135 </div>
124 </BasicDrawer> 136 </BasicDrawer>
125 </template> 137 </template>
@@ -150,6 +162,7 @@ @@ -150,6 +162,7 @@
150 setup(_, { emit }) { 162 setup(_, { emit }) {
151 const { proxy } = getCurrentInstance(); 163 const { proxy } = getCurrentInstance();
152 const lastRefTriggerChildDataArray = ref<[]>([]); 164 const lastRefTriggerChildDataArray = ref<[]>([]);
  165 + const lastEditRefTriggerChildDataArray = ref<[]>([]);
153 const lastRefConditionChildDataArray = ref<[]>([]); 166 const lastRefConditionChildDataArray = ref<[]>([]);
154 const lastRefActionChildDataArray = ref<[]>([]); 167 const lastRefActionChildDataArray = ref<[]>([]);
155 const lastRefTriggerChildData: any = ref({}); 168 const lastRefTriggerChildData: any = ref({});
@@ -187,6 +200,8 @@ @@ -187,6 +200,8 @@
187 const addTriggerPushData = ref<[]>([]); 200 const addTriggerPushData = ref<[]>([]);
188 const addConditionPushData = ref<[]>([]); 201 const addConditionPushData = ref<[]>([]);
189 const addActionPushData = ref<[]>([]); 202 const addActionPushData = ref<[]>([]);
  203 + //edit data
  204 + const editTriggerPushData = ref<[]>([]);
190 const getChildData = ref(null); 205 const getChildData = ref(null);
191 const refTriggerChild = ref(null); 206 const refTriggerChild = ref(null);
192 const refConditionChild = ref(null); 207 const refConditionChild = ref(null);
@@ -201,6 +216,7 @@ @@ -201,6 +216,7 @@
201 const getDeviceInfo = ref(null); 216 const getDeviceInfo = ref(null);
202 const getDeviceInfo1 = ref(null); 217 const getDeviceInfo1 = ref(null);
203 const getDeviceInfo2 = ref(null); 218 const getDeviceInfo2 = ref(null);
  219 + const editReveiveData = ref<[]>([]);
204 220
205 const [registerForm, { resetFields, setFieldsValue, validateFields }] = useForm({ 221 const [registerForm, { resetFields, setFieldsValue, validateFields }] = useForm({
206 labelWidth: 120, 222 labelWidth: 120,
@@ -221,13 +237,17 @@ @@ -221,13 +237,17 @@
221 } catch (e) { 237 } catch (e) {
222 return e; 238 return e;
223 } 239 }
224 - } else { 240 + }
  241 + if (unref(isUpdate)) {
225 //编辑 242 //编辑
  243 + clearAllArrayFunc();
226 getId.value = data.record.id; 244 getId.value = data.record.id;
227 getTenantId.value = data.record.tenantId; 245 getTenantId.value = data.record.tenantId;
228 await setFieldsValue({ 246 await setFieldsValue({
229 ...data.record, 247 ...data.record,
230 }); 248 });
  249 + editReveiveData.value = data.record.triggers;
  250 + editTriggerPushData.value = editReveiveData.value;
231 } 251 }
232 }); 252 });
233 const getTitle = computed(() => (!unref(isUpdate) ? '新增场景联动' : '编辑场景联动')); 253 const getTitle = computed(() => (!unref(isUpdate) ? '新增场景联动' : '编辑场景联动'));
@@ -239,6 +259,7 @@ @@ -239,6 +259,7 @@
239 lastRefTriggerChildDataArray.value.length = 0; 259 lastRefTriggerChildDataArray.value.length = 0;
240 lastRefConditionChildDataArray.value.length = 0; 260 lastRefConditionChildDataArray.value.length = 0;
241 lastRefActionChildDataArray.value.length = 0; 261 lastRefActionChildDataArray.value.length = 0;
  262 + // lastEditRefTriggerChildDataArray.value.length = 0;
242 }; 263 };
243 const resetActionsAllArrayFunc = () => { 264 const resetActionsAllArrayFunc = () => {
244 try { 265 try {
@@ -286,29 +307,46 @@ @@ -286,29 +307,46 @@
286 }; 307 };
287 308
288 const getDefaultValue = () => { 309 const getDefaultValue = () => {
289 - refTriggerChildDataFunc();  
290 - refConditionChildDataFunc();  
291 - refActionChildDataFunc();  
292 - lastRefTriggerChildDataArray.value.push(refTriggerChildData.value as never);  
293 - lastRefConditionChildDataArray.value.push(refConditionChildData.value as never);  
294 - lastRefActionChildDataArray.value.push(refActionChildData.value as never);  
295 - //删除第一个  
296 - lastRefTriggerChildDataArray.value.shift();  
297 - lastRefConditionChildDataArray.value.shift();  
298 - lastRefActionChildDataArray.value.shift();  
299 - const triggersObj = {  
300 - triggers: lastRefTriggerChildDataArray.value,  
301 - };  
302 - const conditionsObj = {  
303 - conditions: lastRefConditionChildDataArray.value,  
304 - };  
305 - const actionsObj = {  
306 - actions: lastRefActionChildDataArray.value,  
307 - };  
308 - Object.assign(getAllFormData, triggersObj, conditionsObj, actionsObj);  
309 if (!unref(isUpdate)) { 310 if (!unref(isUpdate)) {
310 delete getAllFormData.id; 311 delete getAllFormData.id;
311 delete getAllFormData.getTenantId; 312 delete getAllFormData.getTenantId;
  313 + refTriggerChildDataFunc();
  314 + refConditionChildDataFunc();
  315 + refActionChildDataFunc();
  316 + lastRefTriggerChildDataArray.value.push(refTriggerChildData.value as never);
  317 + lastRefConditionChildDataArray.value.push(refConditionChildData.value as never);
  318 + lastRefActionChildDataArray.value.push(refActionChildData.value as never);
  319 + //删除第一个
  320 + lastRefTriggerChildDataArray.value.shift();
  321 + lastRefConditionChildDataArray.value.shift();
  322 + lastRefActionChildDataArray.value.shift();
  323 + const triggersObj = {
  324 + triggers: lastRefTriggerChildDataArray.value,
  325 + };
  326 + const conditionsObj = {
  327 + doConditions: lastRefConditionChildDataArray.value,
  328 + };
  329 + const actionsObj = {
  330 + doActions: lastRefActionChildDataArray.value,
  331 + };
  332 + Object.assign(getAllFormData, triggersObj, conditionsObj, actionsObj);
  333 + } else {
  334 + refTriggerChildDataFunc();
  335 + refConditionChildDataFunc();
  336 + refActionChildDataFunc();
  337 + lastEditRefTriggerChildDataArray.value.push(refTriggerChildData.value as never);
  338 + lastRefConditionChildDataArray.value.push(refConditionChildData.value as never);
  339 + lastRefActionChildDataArray.value.push(refActionChildData.value as never);
  340 + const triggersObj = {
  341 + triggers: lastEditRefTriggerChildDataArray.value,
  342 + };
  343 + const conditionsObj = {
  344 + doConditions: lastRefConditionChildDataArray.value,
  345 + };
  346 + const actionsObj = {
  347 + doActions: lastRefActionChildDataArray.value,
  348 + };
  349 + Object.assign(getAllFormData, triggersObj, conditionsObj, actionsObj);
312 } 350 }
313 }; 351 };
314 352
@@ -324,6 +362,9 @@ @@ -324,6 +362,9 @@
324 emit('success'); 362 emit('success');
325 } else { 363 } else {
326 getDefaultValue(); 364 getDefaultValue();
  365 + getValuesFormData = await validateFields();
  366 + if (!getValuesFormData) return;
  367 + Object.assign(getAllFormData, getValuesFormData);
327 getAllFormData.id = getId.value; 368 getAllFormData.id = getId.value;
328 getAllFormData.tenantId = getTenantId.value; 369 getAllFormData.tenantId = getTenantId.value;
329 await screenLinkPageUpdateApi(getAllFormData); 370 await screenLinkPageUpdateApi(getAllFormData);
@@ -335,18 +376,33 @@ @@ -335,18 +376,33 @@
335 376
336 //新增触发器 377 //新增触发器
337 const addTrigger = () => { 378 const addTrigger = () => {
338 - unref(addTriggerPushData).push(addTriggerData as never);  
339 - refTriggerChildDataFunc();  
340 - lastRefTriggerChildData.value = refTriggerChildData.value;  
341 - lastRefTriggerChildDataArray.value.push(lastRefTriggerChildData.value as never); 379 + if (!unref(isUpdate)) {
  380 + unref(addTriggerPushData).push(addTriggerData as never);
  381 + refTriggerChildDataFunc();
  382 + lastRefTriggerChildData.value = refTriggerChildData.value;
  383 + lastRefTriggerChildDataArray.value.push(lastRefTriggerChildData.value as never);
  384 + } else {
  385 + unref(editTriggerPushData).push(addTriggerData as never);
  386 + refTriggerChildDataFunc();
  387 + lastRefTriggerChildData.value = refTriggerChildData.value;
  388 + lastEditRefTriggerChildDataArray.value.push(lastRefTriggerChildData.value as never);
  389 + }
342 }; 390 };
343 const removeTrigger = () => { 391 const removeTrigger = () => {
344 - try {  
345 - unref(addTriggerPushData).splice(0, 1);  
346 - lastRefTriggerChildDataArray.value.splice(0, 1);  
347 - getAllFormData.triggers.splice(0, 1);  
348 - } catch (e) {  
349 - return e; 392 + if (!unref(isUpdate)) {
  393 + try {
  394 + unref(addTriggerPushData).splice(0, 1);
  395 + lastRefTriggerChildDataArray.value.splice(0, 1);
  396 + } catch (e) {
  397 + return e;
  398 + }
  399 + } else {
  400 + try {
  401 + unref(editTriggerPushData).splice(0, 1);
  402 + lastEditRefTriggerChildDataArray.value.splice(0, 1);
  403 + } catch (e) {
  404 + return e;
  405 + }
350 } 406 }
351 }; 407 };
352 408
@@ -361,7 +417,6 @@ @@ -361,7 +417,6 @@
361 try { 417 try {
362 unref(addConditionPushData).splice(0, 1); 418 unref(addConditionPushData).splice(0, 1);
363 lastRefConditionChildDataArray.value.splice(0, 1); 419 lastRefConditionChildDataArray.value.splice(0, 1);
364 - getAllFormData.conditions.splice(0, 1);  
365 } catch (e) { 420 } catch (e) {
366 return e; 421 return e;
367 } 422 }
@@ -383,13 +438,14 @@ @@ -383,13 +438,14 @@
383 try { 438 try {
384 unref(addActionPushData).splice(0, 1); 439 unref(addActionPushData).splice(0, 1);
385 lastRefActionChildDataArray.value.splice(0, 1); 440 lastRefActionChildDataArray.value.splice(0, 1);
386 - getAllFormData.actions.splice(0, 1);  
387 } catch (e) { 441 } catch (e) {
388 return e; 442 return e;
389 } 443 }
390 }; 444 };
391 445
392 return { 446 return {
  447 + editTriggerPushData,
  448 + isUpdate,
393 clearActionsAllDevice, 449 clearActionsAllDevice,
394 getDeviceInfo, 450 getDeviceInfo,
395 getDeviceInfo1, 451 getDeviceInfo1,