简柏林 / thingskit-front · Commits

Commit 059e50ff6ff1268d91c0b9ddacc122e99ac16937

Authored by sqy
2 parents bb16c743 c34faebc

Merge branch 'main' into sqy_dev

Inline Side-by-side
Showing 9 changed files with 655 additions and 109 deletions
1 1 <template>
2 2 <div class="step3">
3 3 <template v-for="(item, index) in profileData" :key="item.id">
4   - <CollapseContainer class="border mb-8">
  4 + <CollapseContainer class="border mb-1">
5 5 <template #action>
6 6 <div @click="deleteAlarmRule(index)" class="cursor-pointer">
7 7 <DeleteOutlined style="font-size: 20px" class="mr-2" />
8 8 </div>
9 9 </template>
10 10 <div style="margin-left: -30px"> <BasicForm @register="registerForm" /></div>
11   - <CollapseContainer>
12   - <template #action> 高级设置 </template>
  11 + <CollapseContainer style="margin-top: -20px">
  12 + <template #action> </template>
13 13 <div style="margin-left: 10px">
14 14 <BasicForm @register="registerFormHighSetting">
15 15 <template #checkBox="{ model, field }">
... ... @@ -20,7 +20,7 @@
20 20 </CollapseContainer>
21 21 <p>创建报警规则</p>
22 22 <template v-for="(childItem, createIndex) in item.alarms" :key="childItem.id">
23   - <div class="aic mb-4" style="border: 1px solid #bfbfbf">
  23 + <div class="aic mb-1" style="border: 1px solid #bfbfbf">
24 24 <div class="w-3/4">
25 25 <div style="margin-left: -30px"
26 26 ><BasicForm @register="registerFormCreateAlarm"
... ... @@ -55,23 +55,29 @@
55 55 </div>
56 56 </div>
57 57 <div class="w-1/4 flex justify-center">
58   - <Tooltip title="移除">
  58 + <img
  59 + style="cursor: pointer"
  60 + @click="deleteCondition(index, createIndex)"
  61 + alt="移除"
  62 + src="../../../../assets/images/close.png"
  63 + />
  64 + <!-- <Tooltip title="移除">
59 65 <MinusCircleOutlined
60 66 style="font-size: 25px; color: #305680"
61 67 class="cursor-pointer"
62 68 @click="deleteCondition(index, createIndex)"
63 69 />
64   - </Tooltip>
  70 + </Tooltip> -->
65 71 </div>
66 72 </div>
67 73 </template>
68   - <a-button class="mt-5" @click="addCreateRole(index)"
  74 + <a-button style="border-radius: 10px" class="mt-5" @click="addCreateRole(index)"
69 75 ><PlusCircleOutlined />添加创建条件</a-button
70 76 >
71 77 <div style="height: 20px"></div>
72 78 <p>清除报警规则</p>
73 79 <template v-for="(childItem, createIndex) in item.clearAlarms" :key="childItem.id">
74   - <div class="aic mb-4" style="border: 1px solid #bfbfbf">
  80 + <div class="aic mb-1" style="border: 1px solid #bfbfbf">
75 81 <div class="w-3/4">
76 82 <div style="margin-left: 5px">
77 83 <p style="color: #f5594e" class="mt-4 ml-4"
... ... @@ -103,17 +109,23 @@
103 109 </div>
104 110 </div>
105 111 <div class="w-1/4 flex justify-center">
106   - <Tooltip title="移除">
  112 + <img
  113 + style="cursor: pointer"
  114 + @click="deleteClearCondition(index, createIndex)"
  115 + alt="移除"
  116 + src="../../../../assets/images/close.png"
  117 + />
  118 + <!-- <Tooltip title="移除">
107 119 <MinusCircleOutlined
108 120 style="font-size: 25px; color: #305680"
109 121 class="cursor-pointer"
110 122 @click="deleteClearCondition(index, createIndex)"
111 123 />
112   - </Tooltip>
  124 + </Tooltip> -->
113 125 </div>
114 126 </div>
115 127 </template>
116   - <a-button class="mt-5" @click="addClearRole(index)"
  128 + <a-button style="border-radius: 10px" class="mt-5" @click="addClearRole(index)"
117 129 ><PlusCircleOutlined />添加清除条件</a-button
118 130 >
119 131 </CollapseContainer>
... ... @@ -145,7 +157,7 @@
145 157 @register="registerModal3"
146 158 />
147 159
148   - <!-- 清除条件的 -->
  160 + <!-- 清除条件 -->
149 161 <!-- 详情模板 -->
150 162 <DetailTemplate
151 163 v-if="isRuleAlarmRuleConditions == 4"
... ... @@ -222,7 +234,9 @@
222 234 const ruleObj: any = ref({});
223 235 const ruleLastObj: any = ref({});
224 236 const enableObj: any = ref({});
  237 + const enableClearObj: any = ref({});
225 238 const additionalObj: any = ref({});
  239 + const addClearitionalObj: any = ref({});
226 240 const isWhereTypeValue = ref(null);
227 241 const ruleTemplateData: any = ref(null);
228 242 const enableTemplateData: any = ref(null);
... ... @@ -415,7 +429,7 @@
415 429 }
416 430 });
417 431 ruleTemplateData.value = `
418   - 键名:${v.key}...操作:${findRuleByValue?.label}...值:${v.value1}
  432 + 键名:${v.key1}...操作:${findRuleByValue?.label}...值:${v.value1}
419 433 `;
420 434
421 435 ruleLastObj.value = v1;
... ... @@ -443,7 +457,7 @@
443 457 {
444 458 key: {
445 459 type: ruleObj.value?.type,
446   - key: ruleObj.value?.key,
  460 + key: ruleObj.value?.key1,
447 461 },
448 462 valueType: ruleObj.value.type1,
449 463 predicate,
... ... @@ -466,7 +480,7 @@
466 480 };
467 481 //启用规则
468 482 const getAllClearFieldsEnabFunc = (v) => {
469   - enableObj.value = v;
  483 + enableClearObj.value = v;
470 484 const findDay = [
471 485 {
472 486 label: '星期一',
... ... @@ -533,7 +547,7 @@
533 547 }
534 548 });
535 549 ruleClearTemplateData.value = `
536   - 键名:${v.key}...操作:${findRuleByValue?.label}...值:${v.value1}
  550 + 键名:${v.key1}...操作:${findRuleByValue?.label}...值:${v.value1}
537 551 `;
538 552
539 553 ruleLastObj.value = v1;
... ... @@ -561,7 +575,7 @@
561 575 {
562 576 key: {
563 577 type: ruleObj.value?.type,
564   - key: ruleObj.value?.key,
  578 + key: ruleObj.value?.key1,
565 579 },
566 580 valueType: ruleObj.value.type1,
567 581 predicate,
... ... @@ -572,11 +586,21 @@
572 586 const getValueConditon = {
573 587 condition: getCondition,
574 588 };
575   - Object.assign(additionalObj.value, getValueConditon);
  589 + Object.assign(addClearitionalObj.value, getValueConditon);
576 590 };
577   -
578 591 const handleFormStep3toStep4Next = async () => {
579 592 try {
  593 + const scheduleClearValue = {
  594 + type: enableClearObj.value.schedule,
  595 + daysOfWeek: enableClearObj.value.daysOfWeek,
  596 + // endsOn: enableClearObj.value.endsOn,
  597 + // startsOn: enableClearObj.value.startOn,
  598 + timezone: enableClearObj.value.timezone,
  599 + };
  600 + const getClearSchedule = {
  601 + schedule: scheduleClearValue,
  602 + };
  603 + const getClearAdditionalProp = Object.assign({}, detailObj.value, getClearSchedule);
580 604 const scheduleValue = {
581 605 type: enableObj.value.schedule,
582 606 daysOfWeek: enableObj.value.daysOfWeek,
... ... @@ -595,8 +619,8 @@
595 619 );
596 620 const getScheduleAndClearAlarmDetails = Object.assign(
597 621 {},
598   - getAdditionalProp,
599   - additionalObj.value
  622 + getClearAdditionalProp,
  623 + addClearitionalObj.value
600 624 );
601 625 const getIsWhereTypeValue: any = isWhereTypeValue.value;
602 626 const getAdditionalPropObj = {
... ... @@ -735,11 +759,13 @@
735 759 }
736 760 .border {
737 761 border: 1px solid #bfbfbf;
  762 + border-radius: 10px;
738 763 }
739 764
740 765 .aic {
741 766 display: flex;
742 767 align-items: center;
  768 + border-radius: 10px;
743 769 }
744 770
745 771 :deep(.vben-collapse-container__header) {
... ...
... ... @@ -30,10 +30,10 @@ export const isTimeAll = (type: string) => {
30 30 return type === TriggerEnum.IS_SCENE_ACT;
31 31 };
32 32
33   -export const columns: BasicColumn[] = [
  33 +export const keyColumns: BasicColumn[] = [
34 34 {
35 35 title: '键名',
36   - dataIndex: 'key',
  36 + dataIndex: 'key1',
37 37 width: 200,
38 38 },
39 39 {
... ... @@ -45,19 +45,48 @@ export const columns: BasicColumn[] = [
45 45 export const columnsView: BasicColumn[] = [
46 46 {
47 47 title: '键名',
48   - dataIndex: 'key',
  48 + dataIndex: 'key1',
49 49 width: 200,
50 50 },
51 51 {
52   - title: '键类型',
53   - dataIndex: 'type',
  52 + title: '操作',
  53 + dataIndex: 'operation',
  54 + width: 200,
  55 + format: (text: string, record: Recordable) => {
  56 + const findDay = [
  57 + { label: '等于', value: 'EQUAL' },
  58 + { label: '不等于', value: 'NOT_EQUAL' },
  59 + { label: '开始于', value: 'STARTS_WITH' },
  60 + { label: '结束于', value: 'ENDS_WITH' },
  61 + { label: '包含', value: 'CONTAINS' },
  62 + { label: '不包含', value: 'NOT_CONTAINS' },
  63 + { label: '等于', value: 'EQUAL' },
  64 + { label: '不等于', value: 'NOT_EQUAL' },
  65 + { label: '大于', value: 'GREATER' },
  66 + { label: '小于', value: 'LESS' },
  67 + { label: '大于或等于', value: 'GREATER_OR_EQUAL' },
  68 + { label: '小于或等于', value: 'LESS_OR_EQUAL' },
  69 + ];
  70 + const findRuleByValue = findDay.find((f) => {
  71 + if (f.value == record.operation) {
  72 + return f.label;
  73 + }
  74 + });
  75 + if (findRuleByValue) {
  76 + return findRuleByValue.label;
  77 + }
  78 + },
  79 + },
  80 + {
  81 + title: '值',
  82 + dataIndex: 'value1',
54 83 width: 200,
55 84 },
56 85 ];
57 86
58 87 export const DescDetailSchema: DescItem[] = [
59 88 {
60   - field: 'key',
  89 + field: 'key1',
61 90 label: '键名',
62 91 },
63 92 {
... ... @@ -96,6 +125,9 @@ export const formSchema: FormSchema[] = [
96 125 ],
97 126 },
98 127 ifShow: ({ values }) => isWenDu(Reflect.get(values, 'conditionType')),
  128 + show: ({ values }) => {
  129 + return !!values.field5;
  130 + },
99 131 },
100 132 {
101 133 field: 'sourceAttribute',
... ... @@ -106,6 +138,9 @@ export const formSchema: FormSchema[] = [
106 138 placeholder: '源属性',
107 139 },
108 140 ifShow: ({ values }) => isWenDu(Reflect.get(values, 'conditionType')),
  141 + show: ({ values }) => {
  142 + return !!values.field5;
  143 + },
109 144 },
110 145 {
111 146 field: 'sourceType',
... ... @@ -122,6 +157,9 @@ export const formSchema: FormSchema[] = [
122 157 ],
123 158 },
124 159 ifShow: ({ values }) => isTimeAll(Reflect.get(values, 'conditionType')),
  160 + show: ({ values }) => {
  161 + return !!values.field6;
  162 + },
125 163 },
126 164 {
127 165 field: 'sourceAttribute',
... ... @@ -132,6 +170,9 @@ export const formSchema: FormSchema[] = [
132 170 placeholder: '源属性',
133 171 },
134 172 ifShow: ({ values }) => isTimeAll(Reflect.get(values, 'conditionType')),
  173 + show: ({ values }) => {
  174 + return !!values.field6;
  175 + },
135 176 },
136 177 {
137 178 field: 'defaultValue',
... ... @@ -142,6 +183,29 @@ export const formSchema: FormSchema[] = [
142 183 placeholder: '请输入持续时间值（请输入数字）',
143 184 },
144 185 ifShow: ({ values }) => isWenDu(Reflect.get(values, 'conditionType')),
  186 + show: ({ values }) => {
  187 + return !values.field5;
  188 + },
  189 + },
  190 + {
  191 + field: 'field5',
  192 + component: 'Switch',
  193 + label: '切换到动态值',
  194 + colProps: {
  195 + span: 8,
  196 + },
  197 + labelWidth: 200,
  198 + ifShow: ({ values }) => isWenDu(Reflect.get(values, 'conditionType')),
  199 + },
  200 + {
  201 + field: 'field6',
  202 + component: 'Switch',
  203 + label: '切换到动态值',
  204 + colProps: {
  205 + span: 8,
  206 + },
  207 + labelWidth: 200,
  208 + ifShow: ({ values }) => isTimeAll(Reflect.get(values, 'conditionType')),
145 209 },
146 210 {
147 211 field: 'unit',
... ... @@ -165,10 +229,13 @@ export const formSchema: FormSchema[] = [
165 229 colProps: { span: 24 },
166 230 component: 'Input',
167 231 componentProps: {
168   - placeholder: '请输入事件计数值必填（请输入数字）',
  232 + placeholder: '请输入事件计数值（应在1到2147483637之间）',
169 233 },
170 234 rules: [{ message: '事件计数应在1到2147483637之间', trigger: 'blur' }],
171 235 ifShow: ({ values }) => isTimeAll(Reflect.get(values, 'conditionType')),
  236 + show: ({ values }) => {
  237 + return !values.field6;
  238 + },
172 239 },
173 240 {
174 241 field: 'inherit',
... ...
1 1 import { FormSchema } from '/@/components/Table';
  2 +import { ref } from 'vue';
  3 +
  4 +export const isWhereType: any = ref(null);
2 5
3 6 /**
4 7 * 所使用的枚举值
... ... @@ -57,7 +60,7 @@ export const formSchema: FormSchema[] = [
57 60 },
58 61 },
59 62 {
60   - field: 'key',
  63 + field: 'key1',
61 64 label: '键名',
62 65 colProps: { span: 24 },
63 66 component: 'Input',
... ... @@ -74,7 +77,7 @@ export const formSchema: FormSchema[] = [
74 77 ifShow: ({ values }) => isShiDu(Reflect.get(values, 'type')),
75 78 },
76 79 {
77   - field: 'key',
  80 + field: 'key1',
78 81 label: '键名',
79 82 colProps: { span: 24 },
80 83 component: 'Input',
... ... @@ -89,7 +92,7 @@ export const formSchema: FormSchema[] = [
89 92 ifShow: ({ values }) => isWenDu(Reflect.get(values, 'type')),
90 93 },
91 94 {
92   - field: 'key',
  95 + field: 'key1',
93 96 label: '键名',
94 97 colProps: { span: 24 },
95 98 component: 'Input',
... ... @@ -111,6 +114,9 @@ export const formSchema: FormSchema[] = [
111 114 { label: '布尔值', value: 'BOOLEAN' },
112 115 { label: '日期时间', value: 'COMPLEX' },
113 116 ],
  117 + onChange: (v) => {
  118 + isWhereType.value = v;
  119 + },
114 120 },
115 121 },
116 122 {
... ... @@ -132,6 +138,69 @@ export const formSchema: FormSchema[] = [
132 138 ifShow: ({ values }) => isString(Reflect.get(values, 'type1')),
133 139 },
134 140 {
  141 + field: '',
  142 + label: '大小写',
  143 + component: 'Checkbox',
  144 + colProps: { span: 24 },
  145 + renderComponentContent: '忽略大小写',
  146 + ifShow: ({ values }) => isString(Reflect.get(values, 'type1')),
  147 + },
  148 + {
  149 + field: 'sourceType',
  150 + label: '动态源类型',
  151 + colProps: { span: 24 },
  152 + component: 'Select',
  153 + componentProps: {
  154 + placeholder: '请选择动态源类型',
  155 + options: [
  156 + { label: '无动态值', value: '' },
  157 + { label: '当前租户', value: 'CURRENT_TENANT' },
  158 + { label: '当前客户', value: 'CURRENT_CUSTOMER' },
  159 + { label: '当前设备', value: 'CURRENT_DEVICE' },
  160 + ],
  161 + },
  162 + ifShow: ({ values }) => isString(Reflect.get(values, 'type1')),
  163 + show: ({ values }) => {
  164 + return !!values.field5;
  165 + },
  166 + },
  167 + {
  168 + field: 'sourceAttribute',
  169 + label: '源属性',
  170 + colProps: { span: 24 },
  171 + component: 'Input',
  172 + componentProps: {
  173 + placeholder: '请输入源属性',
  174 + },
  175 + ifShow: ({ values }) => isString(Reflect.get(values, 'type1')),
  176 + show: ({ values }) => {
  177 + return !!values.field5;
  178 + },
  179 + },
  180 + {
  181 + field: 'value1',
  182 + label: '默认值',
  183 + colProps: { span: 24 },
  184 + component: 'Input',
  185 + componentProps: {
  186 + placeholder: '请输入默认值(数字)',
  187 + },
  188 + ifShow: ({ values }) => isString(Reflect.get(values, 'type1')),
  189 + show: ({ values }) => {
  190 + return !values.field5;
  191 + },
  192 + },
  193 + {
  194 + field: 'field5',
  195 + component: 'Switch',
  196 + label: '切换到动态值',
  197 + colProps: {
  198 + span: 8,
  199 + },
  200 + labelWidth: 200,
  201 + ifShow: ({ values }) => isString(Reflect.get(values, 'type1')),
  202 + },
  203 + {
135 204 field: 'operation',
136 205 label: '操作',
137 206 colProps: { span: 24 },
... ... @@ -149,6 +218,63 @@ export const formSchema: FormSchema[] = [
149 218 },
150 219 ifShow: ({ values }) => isNumeric(Reflect.get(values, 'type1')),
151 220 },
  221 +
  222 + {
  223 + field: 'sourceType',
  224 + label: '动态源类型',
  225 + colProps: { span: 24 },
  226 + component: 'Select',
  227 + componentProps: {
  228 + placeholder: '请选择动态源类型',
  229 + options: [
  230 + { label: '无动态值', value: '' },
  231 + { label: '当前租户', value: 'CURRENT_TENANT' },
  232 + { label: '当前客户', value: 'CURRENT_CUSTOMER' },
  233 + { label: '当前设备', value: 'CURRENT_DEVICE' },
  234 + ],
  235 + },
  236 + ifShow: ({ values }) => isNumeric(Reflect.get(values, 'type1')),
  237 + show: ({ values }) => {
  238 + return !!values.field6;
  239 + },
  240 + },
  241 + {
  242 + field: 'sourceAttribute',
  243 + label: '源属性',
  244 + colProps: { span: 24 },
  245 + component: 'Input',
  246 + componentProps: {
  247 + placeholder: '请输入源属性',
  248 + },
  249 + ifShow: ({ values }) => isNumeric(Reflect.get(values, 'type1')),
  250 + show: ({ values }) => {
  251 + return !!values.field6;
  252 + },
  253 + },
  254 + {
  255 + field: 'value1',
  256 + label: '值',
  257 + colProps: { span: 24 },
  258 + component: 'Input',
  259 + componentProps: {
  260 + placeholder: '请输入值(数字)',
  261 + },
  262 + ifShow: ({ values }) => isNumeric(Reflect.get(values, 'type1')),
  263 + show: ({ values }) => {
  264 + return !values.field6;
  265 + },
  266 + },
  267 + {
  268 + field: 'field6',
  269 + component: 'Switch',
  270 + label: '切换到动态值',
  271 + colProps: {
  272 + span: 8,
  273 + },
  274 + labelWidth: 200,
  275 + ifShow: ({ values }) => isNumeric(Reflect.get(values, 'type1')),
  276 + },
  277 +
152 278 {
153 279 field: 'operation',
154 280 label: '操作',
... ... @@ -164,6 +290,58 @@ export const formSchema: FormSchema[] = [
164 290 ifShow: ({ values }) => isBoolean(Reflect.get(values, 'type1')),
165 291 },
166 292 {
  293 + field: '',
  294 + label: '默认值',
  295 + component: 'Checkbox',
  296 + renderComponentContent: '真',
  297 + ifShow: ({ values }) => isBoolean(Reflect.get(values, 'type1')),
  298 + show: ({ values }) => {
  299 + return !values.field7;
  300 + },
  301 + },
  302 + {
  303 + field: 'field7',
  304 + component: 'Switch',
  305 + label: '切换到动态值',
  306 + colProps: {
  307 + span: 8,
  308 + },
  309 + labelWidth: 200,
  310 + ifShow: ({ values }) => isBoolean(Reflect.get(values, 'type1')),
  311 + },
  312 + {
  313 + field: 'sourceType',
  314 + label: '动态源类型',
  315 + colProps: { span: 24 },
  316 + component: 'Select',
  317 + componentProps: {
  318 + placeholder: '请选择动态源类型',
  319 + options: [
  320 + { label: '无动态值', value: '' },
  321 + { label: '当前租户', value: 'CURRENT_TENANT' },
  322 + { label: '当前客户', value: 'CURRENT_CUSTOMER' },
  323 + { label: '当前设备', value: 'CURRENT_DEVICE' },
  324 + ],
  325 + },
  326 + ifShow: ({ values }) => isBoolean(Reflect.get(values, 'type1')),
  327 + show: ({ values }) => {
  328 + return !!values.field7;
  329 + },
  330 + },
  331 + {
  332 + field: 'sourceAttribute',
  333 + label: '源属性',
  334 + colProps: { span: 24 },
  335 + component: 'Input',
  336 + componentProps: {
  337 + placeholder: '请输入源属性',
  338 + },
  339 + ifShow: ({ values }) => isBoolean(Reflect.get(values, 'type1')),
  340 + show: ({ values }) => {
  341 + return !!values.field7;
  342 + },
  343 + },
  344 + {
167 345 field: 'operation',
168 346 label: '操作',
169 347 colProps: { span: 24 },
... ... @@ -182,12 +360,78 @@ export const formSchema: FormSchema[] = [
182 360 ifShow: ({ values }) => isComplex(Reflect.get(values, 'type1')),
183 361 },
184 362 {
185   - field: 'value1',
186   - label: '默认值',
  363 + field: '',
  364 + component: 'DatePicker',
  365 + label: '请选择日期',
  366 + colProps: {
  367 + span: 12,
  368 + },
  369 + ifShow: ({ values }) => isComplex(Reflect.get(values, 'type1')),
  370 + show: ({ values }) => {
  371 + return !values.field8;
  372 + },
  373 + },
  374 + {
  375 + field: '',
  376 + component: 'TimePicker',
  377 + label: '请选择时间',
  378 + colProps: {
  379 + span: 8,
  380 + },
  381 + ifShow: ({ values }) => isComplex(Reflect.get(values, 'type1')),
  382 + show: ({ values }) => {
  383 + return !values.field8;
  384 + },
  385 + },
  386 + {
  387 + field: 'field8',
  388 + component: 'Switch',
  389 + label: '切换到动态值',
  390 + colProps: {
  391 + span: 8,
  392 + },
  393 + labelWidth: 200,
  394 + ifShow: ({ values }) => isComplex(Reflect.get(values, 'type1')),
  395 + },
  396 + {
  397 + field: 'sourceType',
  398 + label: '动态源类型',
  399 + colProps: { span: 24 },
  400 + component: 'Select',
  401 + componentProps: {
  402 + placeholder: '请选择动态源类型',
  403 + options: [
  404 + { label: '无动态值', value: '' },
  405 + { label: '当前租户', value: 'CURRENT_TENANT' },
  406 + { label: '当前客户', value: 'CURRENT_CUSTOMER' },
  407 + { label: '当前设备', value: 'CURRENT_DEVICE' },
  408 + ],
  409 + },
  410 + ifShow: ({ values }) => isComplex(Reflect.get(values, 'type1')),
  411 + show: ({ values }) => {
  412 + return !!values.field8;
  413 + },
  414 + },
  415 + {
  416 + field: 'sourceAttribute',
  417 + label: '源属性',
187 418 colProps: { span: 24 },
188 419 component: 'Input',
189 420 componentProps: {
190   - placeholder: '请输入默认值(数字)',
  421 + placeholder: '请输入源属性',
  422 + },
  423 + ifShow: ({ values }) => isComplex(Reflect.get(values, 'type1')),
  424 + show: ({ values }) => {
  425 + return !!values.field8;
191 426 },
192 427 },
  428 + // {
  429 + // field: 'value1',
  430 + // label: '默认值',
  431 + // colProps: { span: 24 },
  432 + // component: 'Input',
  433 + // componentProps: {
  434 + // placeholder: '请输入默认值(数字)',
  435 + // },
  436 + // },
193 437 ];
... ...
  1 +import { FormSchema } from '/@/components/Table';
  2 +
  3 +export const formSchema: FormSchema[] = [
  4 + {
  5 + field: 'type',
  6 + label: '操作',
  7 + colProps: { span: 24 },
  8 + component: 'Select',
  9 + componentProps: {
  10 + placeholder: '请选择操作',
  11 + options: [
  12 + { label: '和', value: '和' },
  13 + { label: '或', value: '或' },
  14 + ],
  15 + },
  16 + },
  17 +];
... ...
  1 +<template>
  2 + <BasicModal
  3 + v-bind="$attrs"
  4 + width="55rem"
  5 + @register="registerAdd"
  6 + :title="getTitle"
  7 + @ok="handleSubmit"
  8 + @cancel="handleCancel"
  9 + >
  10 + <BasicForm :showResetButton="false" :showSubmitButton="false" @register="registerForm" />
  11 + </BasicModal>
  12 +</template>
  13 +<script lang="ts">
  14 + import { defineComponent, ref, computed, unref } from 'vue';
  15 + import { BasicModal, useModalInner } from '/@/components/Modal';
  16 + import { BasicForm, useForm } from '/@/components/Form';
  17 + import { formSchema } from './config';
  18 +
  19 + export default defineComponent({
  20 + name: 'index',
  21 + components: { BasicModal, BasicForm },
  22 + emits: ['success', 'register'],
  23 + setup(_, { emit }) {
  24 + const isUpdate = ref(true);
  25 + const getValue: any = ref({});
  26 + const setId: any = ref(1);
  27 + const getTitle = computed(() => (!unref(isUpdate) ? '新增复合筛选器' : '编辑复合筛选器'));
  28 + const [registerForm, { getFieldsValue, setFieldsValue, resetFields }] = useForm({
  29 + labelWidth: 120,
  30 + schemas: formSchema,
  31 + });
  32 + const [registerAdd, { closeModal }] = useModalInner(async (data) => {
  33 + isUpdate.value = !!data?.isUpdate;
  34 + if (!unref(isUpdate)) {
  35 + resetFields();
  36 + }
  37 + if (unref(isUpdate)) {
  38 + setFieldsValue({
  39 + ...data.record,
  40 + });
  41 + }
  42 + });
  43 + const handleSubmit = () => {
  44 + if (!unref(isUpdate)) {
  45 + getValue.value = getFieldsValue();
  46 + setId.value += 1;
  47 + getValue.value.id = setId.value;
  48 + } else {
  49 + getValue.value = getFieldsValue();
  50 + setId.value += 1000;
  51 + getValue.value.id = setId.value;
  52 + }
  53 + emit('success', getValue.value);
  54 + closeModal();
  55 + };
  56 + const handleCancel = () => {
  57 + return;
  58 + };
  59 + return {
  60 + registerForm,
  61 + handleCancel,
  62 + handleSubmit,
  63 + registerAdd,
  64 + getTitle,
  65 + };
  66 + },
  67 + });
  68 +</script>
... ...
... ... @@ -8,34 +8,95 @@
8 8 @cancel="handleCancel"
9 9 >
10 10 <BasicForm :showResetButton="false" :showSubmitButton="false" @register="registerForm" />
  11 + <template v-if="getIsWhereType">
  12 + <div><p style="text-align: center">未配置筛选器</p></div>
  13 + <div><p style="text-align: left">筛选器</p></div>
  14 + <div style="width: 50vw; height: 5vh; display: flex; justify-content: space-between">
  15 + <div style="width: 5vw; height: 2vh">
  16 + <p v-for="(item, index) in n" :key="index">和</p>
  17 + </div>
  18 + <div style="width: 45vw; height: 2vh">
  19 + <BasicForm
  20 + :showActionButtonGroup="false"
  21 + @register="registerFilter"
  22 + @submit="handleSubmit"
  23 + >
  24 + <template #add="{ field }">
  25 + <Button v-if="Number(field) === 0" @click="add">添加</Button>
  26 + <Button v-if="Number(field) === 0" @click="handleAdd">添加复合器</Button>
  27 + <!-- <Button v-if="Number(field) === 0" @click="handleEdit">编辑复合器</Button> -->
  28 + <Button v-if="field > 0" @click="del(field)">-</Button>
  29 + </template>
  30 + </BasicForm>
  31 + </div>
  32 + </div>
  33 + <AddkeyValueModal @register="registerModal" />
  34 + </template>
11 35 </BasicModal>
12 36 </template>
13 37 <script lang="ts">
14   - import { defineComponent, ref, computed, unref } from 'vue';
  38 + import { defineComponent, ref, computed, unref, watch } from 'vue';
15 39 import { BasicModal, useModalInner } from '/@/components/Modal';
  40 + import { useModal } from '/@/components/Modal';
16 41 import { BasicForm, useForm } from '/@/components/Form';
17   - import { formSchema } from './config';
  42 + import { formSchema, isWhereType } from './config';
  43 + import { Button } from '/@/components/Button';
  44 + import AddkeyValueModal from './cpns/index.vue';
18 45
19 46 export default defineComponent({
20 47 name: 'index',
21   - components: { BasicModal, BasicForm },
  48 + components: { BasicModal, BasicForm, Button, AddkeyValueModal },
22 49 emits: ['success', 'register'],
23 50 setup(_, { emit }) {
  51 + const getIsWhereType: any = ref(null);
24 52 const isUpdate = ref(true);
25   - const getValue: any = ref(null);
  53 + const getValue: any = ref({});
  54 + const setId: any = ref(1);
26 55 const getTitle = computed(() => (!unref(isUpdate) ? '新增键名筛选器' : '编辑键名筛选器'));
27 56 const [registerForm, { getFieldsValue, setFieldsValue, resetFields }] = useForm({
28 57 labelWidth: 120,
29 58 schemas: formSchema,
30 59 });
  60 + const [registerFilter, { appendSchemaByField, removeSchemaByFiled }] = useForm({
  61 + schemas: [
  62 + {
  63 + field: 'field0a',
  64 + component: 'Input',
  65 + label: '字段0',
  66 + colProps: {
  67 + span: 8,
  68 + },
  69 + required: true,
  70 + },
  71 + {
  72 + field: 'field0b',
  73 + component: 'Input',
  74 + label: '字段0',
  75 + colProps: {
  76 + span: 8,
  77 + },
  78 + required: true,
  79 + },
  80 + {
  81 + field: '0',
  82 + component: 'Input',
  83 + label: ' ',
  84 + colProps: {
  85 + span: 8,
  86 + },
  87 + slot: 'add',
  88 + },
  89 + ],
  90 + labelWidth: 100,
  91 + actionColOptions: { span: 24 },
  92 + });
31 93 const [register, { closeModal }] = useModalInner(async (data) => {
32 94 isUpdate.value = !!data?.isUpdate;
33 95 if (!unref(isUpdate)) {
34   - console.log('新增键名筛选器');
35 96 resetFields();
  97 + getIsWhereType.value = 100;
36 98 }
37 99 if (unref(isUpdate)) {
38   - console.log('编辑键名筛选器');
39 100 setFieldsValue({
40 101 ...data.record,
41 102 });
... ... @@ -43,14 +104,110 @@
43 104 });
44 105
45 106 const handleSubmit = () => {
46   - getValue.value = getFieldsValue();
  107 + if (!unref(isUpdate)) {
  108 + getValue.value = getFieldsValue();
  109 + setId.value += 1;
  110 + getValue.value.id = setId.value;
  111 + } else {
  112 + getValue.value = getFieldsValue();
  113 + setId.value += 1000;
  114 + getValue.value.id = setId.value;
  115 + }
47 116 emit('success', getValue.value);
48 117 closeModal();
49 118 };
50 119 const handleCancel = () => {
51 120 return;
52 121 };
  122 +
  123 + const n = ref(1);
  124 +
  125 + function add() {
  126 + appendSchemaByField(
  127 + {
  128 + field: `field${n.value}a`,
  129 + component: 'Input',
  130 + label: '字段' + n.value,
  131 + colProps: {
  132 + span: 8,
  133 + },
  134 + required: true,
  135 + },
  136 + ''
  137 + );
  138 + appendSchemaByField(
  139 + {
  140 + field: `field${n.value}b`,
  141 + component: 'Input',
  142 + label: '字段' + n.value,
  143 + colProps: {
  144 + span: 8,
  145 + },
  146 + required: true,
  147 + },
  148 + ''
  149 + );
  150 +
  151 + appendSchemaByField(
  152 + {
  153 + field: `${n.value}`,
  154 + component: 'Input',
  155 + label: ' ',
  156 + colProps: {
  157 + span: 8,
  158 + },
  159 + slot: 'add',
  160 + },
  161 + ''
  162 + );
  163 + n.value++;
  164 + }
  165 +
  166 + function del(field) {
  167 + removeSchemaByFiled([`field${field}a`, `field${field}b`, `${field}`]);
  168 + n.value--;
  169 + }
  170 + watch(isWhereType, (v) => {
  171 + switch (v) {
  172 + console.log(v)
  173 + case 'STRING':
  174 + getIsWhereType.value = v;
  175 + break;
  176 + case 'NUMERIC':
  177 + getIsWhereType.value = v;
  178 + break;
  179 + case 'BOOLEAN':
  180 + getIsWhereType.value = v;
  181 + break;
  182 + case 'COMPLEX':
  183 + getIsWhereType.value = v;
  184 + break;
  185 + }
  186 + });
  187 + const [registerModal, { openModal }] = useModal();
  188 + //复合器弹窗
  189 + const addPlusIfEdit = ref(1);
  190 + const handleAdd = () => {
  191 + openModal(true, {
  192 + isUpdate: false,
  193 + addPlusIfEdit: addPlusIfEdit.value++,
  194 + });
  195 + };
  196 + const handleEdit = () => {
  197 + openModal(true, {
  198 + isUpdate: true,
  199 + });
  200 + };
  201 +
53 202 return {
  203 + getIsWhereType,
  204 + registerModal,
  205 + handleEdit,
  206 + handleAdd,
  207 + n,
  208 + add,
  209 + del,
  210 + registerFilter,
54 211 registerForm,
55 212 handleCancel,
56 213 handleSubmit,
... ...
... ... @@ -7,7 +7,13 @@
7 7 @ok="handleSubmit"
8 8 >
9 9 <CollapseContainer title="键名筛选器" class="border mb-8">
10   - <BasicTable :resizeHeightOffset="200" @register="registerTable" :dataSource="getTableApiData">
  10 + <BasicTable
  11 + :showIndexColumn="false"
  12 + :resizeHeightOffset="200"
  13 + @register="registerTable"
  14 + :dataSource="getTableApiData"
  15 + >
  16 + >
11 17 <template #toolbar>
12 18 <a-button type="primary" @click="handleAddKey"> 新增键名筛选器 </a-button>
13 19 </template>
... ... @@ -39,6 +45,7 @@
39 45 :columns="columnsView"
40 46 :dataSource="detailData"
41 47 :pagination="false"
  48 + :showIndexColumn="false"
42 49 />
43 50 </CollapseContainer>
44 51 <BasicForm :showResetButton="false" :showSubmitButton="false" @register="registerForm" />
... ... @@ -49,7 +56,7 @@
49 56 import { defineComponent, ref, computed, unref } from 'vue';
50 57 import { BasicModal, useModalInner } from '/@/components/Modal';
51 58 import { BasicForm, useForm } from '/@/components/Form';
52   - import { formSchema, columns, DescDetailSchema, columnsView } from './config';
  59 + import { formSchema, keyColumns, DescDetailSchema, columnsView } from './config';
53 60 import { CollapseContainer } from '/@/components/Container/index';
54 61 import { BasicTable, useTable, TableAction } from '/@/components/Table';
55 62 import { useModal } from '/@/components/Modal';
... ... @@ -69,8 +76,9 @@
69 76 setup(_, { emit }) {
70 77 const getTableApiData: any = ref([]);
71 78 const detailData: any = ref([]);
72   - const receiveData: any = ref(null);
  79 + const receiveData: any = ref({});
73 80 const lastValues: any = ref(null);
  81 + const addOrUpdateData: any = ref(null);
74 82 const isUpdate = ref(true);
75 83 const [registerForm, { getFieldsValue, resetFields }] = useForm({
76 84 labelWidth: 120,
... ... @@ -83,10 +91,11 @@
83 91 });
84 92 const [registerTable, { reload }] = useTable({
85 93 title: '键名筛选器',
86   - columns,
  94 + columns: keyColumns,
87 95 bordered: true,
88 96 showIndexColumn: false,
89 97 pagination: false,
  98 + autoCreateKey: true,
90 99 actionColumn: {
91 100 width: 180,
92 101 title: '操作',
... ... @@ -94,12 +103,11 @@
94 103 slots: { customRender: 'action' },
95 104 },
96 105 });
97   -
98 106 const handleSubmit = () => {
99   - if (unref(isUpdate.value)) {
100   - const values = getFieldsValue();
101   - getTableApiData.value.push(values);
102   - detailData.value.push(values);
  107 + if (!unref(isUpdate)) {
  108 + addOrUpdateData.value = getFieldsValue();
  109 + getTableApiData.value.push(addOrUpdateData.value);
  110 + detailData.value.push(addOrUpdateData.value);
103 111 }
104 112 lastValues.value = getFieldsValue();
105 113 emit('getAllFieldsRule', receiveData.value, lastValues.value);
... ... @@ -122,29 +130,38 @@
122 130 isUpdate: true,
123 131 record,
124 132 });
  133 + const newFilterArray = getTableApiData.value.filter((item) => item.id !== record.id);
  134 + getTableApiData.value = newFilterArray;
  135 + const newFilterViewArray = detailData.value.filter((item) => item.id !== record.id);
  136 + detailData.value = newFilterViewArray;
  137 + reload();
125 138 };
126 139 const handleDelete = (record: Recordable) => {
127   - console.log(record);
128   - getTableApiData.value.splice(0, 1);
129   - detailData.value.splice(0, 1);
  140 + const newFilterArray = getTableApiData.value.filter((item) => item.id !== record.id);
  141 + getTableApiData.value = newFilterArray;
  142 + const newFilterViewArray = detailData.value.filter((item) => item.id !== record.id);
  143 + detailData.value = newFilterViewArray;
130 144 reload();
131 145 };
132 146 const handleSuccess = (v) => {
133 147 receiveData.value = v;
134 148 setTimeout(() => {
135   - doFunc();
  149 + useWaitFunc();
136 150 }, 10);
137 151 };
138   - const doFunc = () => {
139   - getTableApiData.value.push(receiveData.value);
140   - detailData.value.push(receiveData.value);
  152 + const useWaitFunc = () => {
  153 + if (unref(getTableApiData.value)) {
  154 + getTableApiData.value.push(receiveData.value);
  155 + detailData.value.push(receiveData.value);
  156 + }
  157 + reload();
141 158 };
142 159 return {
  160 + detailData,
  161 + getTableApiData,
143 162 resetDataFunc,
144 163 columnsView,
145 164 DescDetailSchema,
146   - detailData,
147   - getTableApiData,
148 165 handleSuccess,
149 166 handleEdit,
150 167 handleDelete,
... ...
1   -{
2   - "name": "设备测试3",
3   - "defaultRuleChainId": "354c7210-5d97-11ec-8ac9-f38ed935ea2a",
4   - "description": "设备测试3",
5   - "transportType": "CoAP",
6   - "profileData": {
7   - "alarms": [
8   - {
9   - "alarmType": "设备测试3",
10   - "propagate": true,
11   - "propagateRelationTypes": [
12   - "设备测试3"
13   - ],
14   - "createRules": {
15   - "MAJOR": {
16   - "alarmDetails": "设备测试3",
17   - "schedule": {
18   - "type": "ANY_TIME"
19   - },
20   - "condition": {
21   - "condition": [
22   - {
23   - "key": {
24   - "type": "TIME_SERIES",
25   - "key": "CO2"
26   - },
27   - "valueType": "COMPLEX",
28   - "predicate": {
29   - "operation": "LESS_OR_EQUAL",
30   - "value": {
31   - "defaultValue": 2
32   - },
33   - "type": "COMPLEX"
34   - }
35   - }
36   - ],
37   - "spec": {
38   - "type": "DURATION"
39   - }
40   - }
41   - }
42   - }
43   - }
44   - ]
45   - },
46   - "alarmProfile": {
47   - "alarmContactId": "a3004ddd-db8f-487c-aea0-4f6f3efc59a9",
48   - "messageMode": "PHONE_MESSAGE"
49   - }
50   -}