Commit d383b52e0505fd42595b960decd301b798456579
Merge branch 'ft-dev' into 'main'
feat:新增数据管理数据转换,refractor:重构部分设备配置代码 See merge request huang/yun-teng-iot-front!112
Showing
25 changed files
with
1530 additions
and
1138 deletions
1 | +<template> | |
2 | + <div> | |
3 | + <BasicModal | |
4 | + v-bind="$attrs" | |
5 | + @register="registerDrawer" | |
6 | + showFooter | |
7 | + width="1000px" | |
8 | + @ok="handleSubmit" | |
9 | + > | |
10 | + <div class="step-form-form"> | |
11 | + <a-steps :current="current"> | |
12 | + <a-step title="选择转换方式" /> | |
13 | + <a-step title="完善配置参数" /> | |
14 | + </a-steps> | |
15 | + </div> | |
16 | + <div> | |
17 | + <div v-show="current === 0"> <TransferConfigMode @next="handleNext" /></div> | |
18 | + <div v-show="current === 1"> <TransferConfigParams @prev="handlePrev" /></div> | |
19 | + </div> | |
20 | + </BasicModal> | |
21 | + </div> | |
22 | +</template> | |
23 | +<script lang="ts"> | |
24 | + import { defineComponent, ref, computed, unref } from 'vue'; | |
25 | + import { BasicModal, useModalInner } from '/@/components/Modal'; | |
26 | + import { Steps } from 'ant-design-vue'; | |
27 | + import TransferConfigMode from './cpns/transferConfigMode.vue'; | |
28 | + import TransferConfigParams from './cpns/transferConfigParams.vue'; | |
29 | + | |
30 | + export default defineComponent({ | |
31 | + name: 'ConfigDrawer', | |
32 | + components: { | |
33 | + BasicModal, | |
34 | + [Steps.name]: Steps, | |
35 | + [Steps.Step.name]: Steps.Step, | |
36 | + TransferConfigMode, | |
37 | + TransferConfigParams, | |
38 | + }, | |
39 | + setup() { | |
40 | + const isUpdate = ref(true); | |
41 | + const getTitle = computed(() => (!unref(isUpdate) ? '新增转换配置' : '编辑数据转换')); | |
42 | + const current = ref(0); | |
43 | + | |
44 | + const [registerDrawer] = useModalInner(async (data) => { | |
45 | + isUpdate.value = !!data?.isUpdate; | |
46 | + current.value = 0; | |
47 | + }); | |
48 | + const handleNext = () => { | |
49 | + current.value++; | |
50 | + }; | |
51 | + const handlePrev = () => { | |
52 | + current.value--; | |
53 | + }; | |
54 | + const handleSubmit = () => {}; | |
55 | + return { | |
56 | + registerDrawer, | |
57 | + handleSubmit, | |
58 | + getTitle, | |
59 | + current, | |
60 | + handleNext, | |
61 | + handlePrev, | |
62 | + }; | |
63 | + }, | |
64 | + }); | |
65 | +</script> | ... | ... |
src/views/datamanager/datatransfer/config.ts
0 → 100644
1 | +import { BasicColumn, FormSchema } from '/@/components/Table'; | |
2 | + | |
3 | +export const columns: BasicColumn[] = [ | |
4 | + { | |
5 | + title: '数据转换名称', | |
6 | + dataIndex: 'name', | |
7 | + width: 200, | |
8 | + }, | |
9 | + { | |
10 | + title: '途径', | |
11 | + dataIndex: 'name1', | |
12 | + width: 200, | |
13 | + }, | |
14 | + { | |
15 | + title: '状态', | |
16 | + dataIndex: 'status', | |
17 | + width: 120, | |
18 | + }, | |
19 | + { | |
20 | + title: '描述', | |
21 | + dataIndex: 'description', | |
22 | + width: 200, | |
23 | + }, | |
24 | + { | |
25 | + title: '创建时间', | |
26 | + dataIndex: 'createTime', | |
27 | + width: 180, | |
28 | + }, | |
29 | +]; | |
30 | + | |
31 | +export const searchFormSchema: FormSchema[] = [ | |
32 | + { | |
33 | + field: 'name', | |
34 | + label: '名称', | |
35 | + component: 'Input', | |
36 | + colProps: { span: 8 }, | |
37 | + componentProps: { | |
38 | + maxLength: 36, | |
39 | + placeholder: '请输入名称', | |
40 | + }, | |
41 | + }, | |
42 | + { | |
43 | + field: 'status', | |
44 | + label: '状态', | |
45 | + component: 'Select', | |
46 | + componentProps: { | |
47 | + placeholder: '请选择状态', | |
48 | + options: [ | |
49 | + { label: '已启用', value: '1' }, | |
50 | + { label: '未启用', value: '0' }, | |
51 | + ], | |
52 | + }, | |
53 | + colProps: { span: 4 }, | |
54 | + }, | |
55 | +]; | ... | ... |
1 | +import { FormSchema } from '/@/components/Form'; | |
2 | + | |
3 | +export const modeForm: FormSchema[] = [ | |
4 | + { | |
5 | + field: '', | |
6 | + label: '', | |
7 | + component: 'Select', | |
8 | + componentProps: { | |
9 | + placeholder: '请选择转换方式', | |
10 | + options: [ | |
11 | + { label: 'KafKA', value: 'KafKA' }, | |
12 | + { label: 'RabbitMq', value: 'RabbitMq' }, | |
13 | + { label: 'Api调用', value: 'Api调用' }, | |
14 | + { label: 'MQTT', value: 'MQTT' }, | |
15 | + ], | |
16 | + }, | |
17 | + colProps: { span: 13 }, | |
18 | + }, | |
19 | +]; | |
20 | + | |
21 | +export const modeKafkaForm: FormSchema[] = [ | |
22 | + { | |
23 | + field: '', | |
24 | + label: '名称', | |
25 | + colProps: { span: 13 }, | |
26 | + required: true, | |
27 | + component: 'Input', | |
28 | + componentProps: { | |
29 | + maxLength: 255, | |
30 | + placeholder: '请输入名称', | |
31 | + }, | |
32 | + }, | |
33 | + { | |
34 | + field: '', | |
35 | + label: 'Topic', | |
36 | + colProps: { span: 13 }, | |
37 | + required: true, | |
38 | + component: 'Input', | |
39 | + componentProps: { | |
40 | + maxLength: 255, | |
41 | + placeholder: '请输入Topic pattern', | |
42 | + }, | |
43 | + }, | |
44 | + { | |
45 | + field: '', | |
46 | + label: 'Bootstrap', | |
47 | + colProps: { span: 13 }, | |
48 | + component: 'Input', | |
49 | + componentProps: { | |
50 | + maxLength: 255, | |
51 | + placeholder: '请输入Bootstrap servers', | |
52 | + }, | |
53 | + }, | |
54 | + { | |
55 | + field: '', | |
56 | + label: 'Automati', | |
57 | + colProps: { span: 13 }, | |
58 | + component: 'Input', | |
59 | + componentProps: { | |
60 | + maxLength: 255, | |
61 | + placeholder: '请输入Automatically retry times if fails', | |
62 | + }, | |
63 | + }, | |
64 | + { | |
65 | + field: '', | |
66 | + label: 'Produces', | |
67 | + colProps: { span: 13 }, | |
68 | + component: 'Input', | |
69 | + componentProps: { | |
70 | + maxLength: 255, | |
71 | + placeholder: '请输入Produces batch size in bytes', | |
72 | + }, | |
73 | + }, | |
74 | + { | |
75 | + field: '', | |
76 | + label: 'Client', | |
77 | + colProps: { span: 13 }, | |
78 | + component: 'Input', | |
79 | + componentProps: { | |
80 | + maxLength: 255, | |
81 | + placeholder: '请输入Client buffer max size in bytes', | |
82 | + }, | |
83 | + }, | |
84 | + { | |
85 | + field: '', | |
86 | + label: 'Number', | |
87 | + colProps: { span: 13 }, | |
88 | + component: 'Input', | |
89 | + componentProps: { | |
90 | + maxLength: 255, | |
91 | + placeholder: '请输入Number of acknowledgments', | |
92 | + }, | |
93 | + }, | |
94 | + { | |
95 | + field: '', | |
96 | + component: 'Select', | |
97 | + label: 'Number', | |
98 | + colProps: { span: 13 }, | |
99 | + componentProps: { | |
100 | + placeholder: '请选择Number of acknowledgments', | |
101 | + options: [ | |
102 | + { label: 'all', value: 'all' }, | |
103 | + { label: '-1', value: '-1' }, | |
104 | + { label: '0', value: '0' }, | |
105 | + { label: '1', value: '1' }, | |
106 | + ], | |
107 | + }, | |
108 | + }, | |
109 | + { | |
110 | + field: '', | |
111 | + label: 'Key', | |
112 | + colProps: { span: 13 }, | |
113 | + required: true, | |
114 | + component: 'Input', | |
115 | + componentProps: { | |
116 | + maxLength: 255, | |
117 | + placeholder: '请输入Key serializer', | |
118 | + }, | |
119 | + }, | |
120 | + { | |
121 | + field: '', | |
122 | + label: 'Value', | |
123 | + colProps: { span: 13 }, | |
124 | + required: true, | |
125 | + component: 'Input', | |
126 | + componentProps: { | |
127 | + maxLength: 255, | |
128 | + placeholder: '请输入Value serializer', | |
129 | + }, | |
130 | + }, | |
131 | + { | |
132 | + field: '', | |
133 | + label: '', | |
134 | + colProps: { span: 13 }, | |
135 | + component: 'Checkbox', | |
136 | + renderComponentContent: ' Add Message metadata key-value pairs to Kafka record headers ', | |
137 | + }, | |
138 | + { | |
139 | + field: '', | |
140 | + label: '说明', | |
141 | + colProps: { span: 13 }, | |
142 | + component: 'Input', | |
143 | + componentProps: { | |
144 | + maxLength: 255, | |
145 | + placeholder: '请输入说明', | |
146 | + }, | |
147 | + }, | |
148 | +]; | ... | ... |
1 | +<template> | |
2 | + <div class="step2"> <BasicForm :showSubmitButton="false" @register="register" /> </div> | |
3 | +</template> | |
4 | +<script lang="ts"> | |
5 | + import { defineComponent } from 'vue'; | |
6 | + import { BasicForm, useForm } from '/@/components/Form'; | |
7 | + import { modeKafkaForm } from './config'; | |
8 | + | |
9 | + import { Alert, Divider, Descriptions } from 'ant-design-vue'; | |
10 | + | |
11 | + export default defineComponent({ | |
12 | + components: { | |
13 | + BasicForm, | |
14 | + [Alert.name]: Alert, | |
15 | + [Divider.name]: Divider, | |
16 | + [Descriptions.name]: Descriptions, | |
17 | + [Descriptions.Item.name]: Descriptions.Item, | |
18 | + }, | |
19 | + emits: ['next', 'prev', 'register'], | |
20 | + setup(_, { emit }) { | |
21 | + const [register, { validate, setFieldsValue, resetFields }] = useForm({ | |
22 | + labelWidth: 80, | |
23 | + schemas: modeKafkaForm, | |
24 | + actionColOptions: { | |
25 | + span: 14, | |
26 | + }, | |
27 | + resetButtonOptions: { | |
28 | + text: '上一步', | |
29 | + }, | |
30 | + | |
31 | + resetFunc: customResetFunc, | |
32 | + submitFunc: customSubmitFunc, | |
33 | + }); | |
34 | + const setStepTwoFieldsValueFunc = (v) => { | |
35 | + setFieldsValue(v); | |
36 | + }; | |
37 | + const customClearStepTwoValueFunc = () => { | |
38 | + resetFields(); | |
39 | + }; | |
40 | + async function customResetFunc() { | |
41 | + emit('prev'); | |
42 | + } | |
43 | + async function customSubmitFunc() { | |
44 | + try { | |
45 | + const values = await validate(); | |
46 | + emit('next', values); | |
47 | + } catch (error) { | |
48 | + } finally { | |
49 | + } | |
50 | + } | |
51 | + return { register, setStepTwoFieldsValueFunc, customClearStepTwoValueFunc }; | |
52 | + }, | |
53 | + }); | |
54 | +</script> | |
55 | +<style lang="less" scoped> | |
56 | + .step2 { | |
57 | + } | |
58 | +</style> | ... | ... |
1 | +<template> | |
2 | + <div class="step2"> <BasicForm :showSubmitButton="false" @register="register" /> </div> | |
3 | +</template> | |
4 | +<script lang="ts"> | |
5 | + import { defineComponent } from 'vue'; | |
6 | + import { BasicForm, useForm } from '/@/components/Form'; | |
7 | + import { modeKafkaForm } from './config'; | |
8 | + | |
9 | + import { Alert, Divider, Descriptions } from 'ant-design-vue'; | |
10 | + | |
11 | + export default defineComponent({ | |
12 | + components: { | |
13 | + BasicForm, | |
14 | + [Alert.name]: Alert, | |
15 | + [Divider.name]: Divider, | |
16 | + [Descriptions.name]: Descriptions, | |
17 | + [Descriptions.Item.name]: Descriptions.Item, | |
18 | + }, | |
19 | + emits: ['next', 'prev', 'register'], | |
20 | + setup(_, { emit }) { | |
21 | + const [register, { validate, setFieldsValue, resetFields }] = useForm({ | |
22 | + labelWidth: 80, | |
23 | + schemas: modeKafkaForm, | |
24 | + actionColOptions: { | |
25 | + span: 14, | |
26 | + }, | |
27 | + resetButtonOptions: { | |
28 | + text: '上一步', | |
29 | + }, | |
30 | + | |
31 | + resetFunc: customResetFunc, | |
32 | + submitFunc: customSubmitFunc, | |
33 | + }); | |
34 | + const setStepTwoFieldsValueFunc = (v) => { | |
35 | + setFieldsValue(v); | |
36 | + }; | |
37 | + const customClearStepTwoValueFunc = () => { | |
38 | + resetFields(); | |
39 | + }; | |
40 | + async function customResetFunc() { | |
41 | + emit('prev'); | |
42 | + } | |
43 | + async function customSubmitFunc() { | |
44 | + try { | |
45 | + const values = await validate(); | |
46 | + emit('next', values); | |
47 | + } catch (error) { | |
48 | + } finally { | |
49 | + } | |
50 | + } | |
51 | + return { register, setStepTwoFieldsValueFunc, customClearStepTwoValueFunc }; | |
52 | + }, | |
53 | + }); | |
54 | +</script> | |
55 | +<style lang="less" scoped> | |
56 | + .step2 { | |
57 | + } | |
58 | +</style> | ... | ... |
1 | +<template> | |
2 | + <div class="step2"> <BasicForm :showSubmitButton="false" @register="register" /> </div> | |
3 | +</template> | |
4 | +<script lang="ts"> | |
5 | + import { defineComponent } from 'vue'; | |
6 | + import { BasicForm, useForm } from '/@/components/Form'; | |
7 | + import { modeKafkaForm } from './config'; | |
8 | + | |
9 | + import { Alert, Divider, Descriptions } from 'ant-design-vue'; | |
10 | + | |
11 | + export default defineComponent({ | |
12 | + components: { | |
13 | + BasicForm, | |
14 | + [Alert.name]: Alert, | |
15 | + [Divider.name]: Divider, | |
16 | + [Descriptions.name]: Descriptions, | |
17 | + [Descriptions.Item.name]: Descriptions.Item, | |
18 | + }, | |
19 | + emits: ['next', 'prev', 'register'], | |
20 | + setup(_, { emit }) { | |
21 | + const [register, { validate, setFieldsValue, resetFields }] = useForm({ | |
22 | + labelWidth: 80, | |
23 | + schemas: modeKafkaForm, | |
24 | + actionColOptions: { | |
25 | + span: 14, | |
26 | + }, | |
27 | + resetButtonOptions: { | |
28 | + text: '上一步', | |
29 | + }, | |
30 | + | |
31 | + resetFunc: customResetFunc, | |
32 | + submitFunc: customSubmitFunc, | |
33 | + }); | |
34 | + const setStepTwoFieldsValueFunc = (v) => { | |
35 | + setFieldsValue(v); | |
36 | + }; | |
37 | + const customClearStepTwoValueFunc = () => { | |
38 | + resetFields(); | |
39 | + }; | |
40 | + async function customResetFunc() { | |
41 | + emit('prev'); | |
42 | + } | |
43 | + async function customSubmitFunc() { | |
44 | + try { | |
45 | + const values = await validate(); | |
46 | + emit('next', values); | |
47 | + } catch (error) { | |
48 | + } finally { | |
49 | + } | |
50 | + } | |
51 | + return { register, setStepTwoFieldsValueFunc, customClearStepTwoValueFunc }; | |
52 | + }, | |
53 | + }); | |
54 | +</script> | |
55 | +<style lang="less" scoped> | |
56 | + .step2 { | |
57 | + } | |
58 | +</style> | ... | ... |
1 | +<template> | |
2 | + <div class="step2"> <BasicForm :showSubmitButton="false" @register="register" /> </div> | |
3 | +</template> | |
4 | +<script lang="ts"> | |
5 | + import { defineComponent } from 'vue'; | |
6 | + import { BasicForm, useForm } from '/@/components/Form'; | |
7 | + import { modeKafkaForm } from './config'; | |
8 | + | |
9 | + import { Alert, Divider, Descriptions } from 'ant-design-vue'; | |
10 | + | |
11 | + export default defineComponent({ | |
12 | + components: { | |
13 | + BasicForm, | |
14 | + [Alert.name]: Alert, | |
15 | + [Divider.name]: Divider, | |
16 | + [Descriptions.name]: Descriptions, | |
17 | + [Descriptions.Item.name]: Descriptions.Item, | |
18 | + }, | |
19 | + emits: ['next', 'prev', 'register'], | |
20 | + setup(_, { emit }) { | |
21 | + const [register, { validate, setFieldsValue, resetFields }] = useForm({ | |
22 | + labelWidth: 80, | |
23 | + schemas: modeKafkaForm, | |
24 | + actionColOptions: { | |
25 | + span: 14, | |
26 | + }, | |
27 | + resetButtonOptions: { | |
28 | + text: '上一步', | |
29 | + }, | |
30 | + | |
31 | + resetFunc: customResetFunc, | |
32 | + submitFunc: customSubmitFunc, | |
33 | + }); | |
34 | + const setStepTwoFieldsValueFunc = (v) => { | |
35 | + setFieldsValue(v); | |
36 | + }; | |
37 | + const customClearStepTwoValueFunc = () => { | |
38 | + resetFields(); | |
39 | + }; | |
40 | + async function customResetFunc() { | |
41 | + emit('prev'); | |
42 | + } | |
43 | + async function customSubmitFunc() { | |
44 | + try { | |
45 | + const values = await validate(); | |
46 | + emit('next', values); | |
47 | + } catch (error) { | |
48 | + } finally { | |
49 | + } | |
50 | + } | |
51 | + return { register, setStepTwoFieldsValueFunc, customClearStepTwoValueFunc }; | |
52 | + }, | |
53 | + }); | |
54 | +</script> | |
55 | +<style lang="less" scoped> | |
56 | + .step2 { | |
57 | + } | |
58 | +</style> | ... | ... |
1 | +<template> | |
2 | + <div class="step1"> | |
3 | + <div class="step1-form"> | |
4 | + <div> | |
5 | + <BasicForm @register="register" /> | |
6 | + </div> | |
7 | + </div> | |
8 | + </div> | |
9 | +</template> | |
10 | +<script lang="ts"> | |
11 | + import { defineComponent } from 'vue'; | |
12 | + import { BasicForm, useForm } from '/@/components/Form'; | |
13 | + import { modeForm } from './config'; | |
14 | + import { Select, Input, Divider } from 'ant-design-vue'; | |
15 | + | |
16 | + export default defineComponent({ | |
17 | + components: { | |
18 | + BasicForm, | |
19 | + [Select.name]: Select, | |
20 | + [Input.name]: Input, | |
21 | + [Input.Group.name]: Input.Group, | |
22 | + [Divider.name]: Divider, | |
23 | + }, | |
24 | + emits: ['next', 'resetFunc', 'register'], | |
25 | + setup(_, { emit }) { | |
26 | + const [register, { validate, setFieldsValue, resetFields }] = useForm({ | |
27 | + labelWidth: 100, | |
28 | + schemas: modeForm, | |
29 | + actionColOptions: { | |
30 | + span: 14, | |
31 | + }, | |
32 | + showResetButton: false, | |
33 | + submitButtonOptions: { | |
34 | + text: '下一步', | |
35 | + }, | |
36 | + submitFunc: customSubmitFunc, | |
37 | + }); | |
38 | + //提交数据 | |
39 | + async function customSubmitFunc() { | |
40 | + try { | |
41 | + const values = await validate(); | |
42 | + emit('next', values); | |
43 | + } catch (error) {} | |
44 | + } | |
45 | + //回显数据 | |
46 | + const setStepOneFieldsValueFunc = (v) => { | |
47 | + setFieldsValue(v); | |
48 | + }; | |
49 | + | |
50 | + //清空数据 | |
51 | + const customResetStepOneFunc = () => { | |
52 | + resetFields(); | |
53 | + }; | |
54 | + return { | |
55 | + register, | |
56 | + setStepOneFieldsValueFunc, | |
57 | + customResetStepOneFunc, | |
58 | + }; | |
59 | + }, | |
60 | + }); | |
61 | +</script> | |
62 | +<style lang="less" scoped> | |
63 | + .step1 { | |
64 | + &-form { | |
65 | + width: 800px; | |
66 | + height: 300px; | |
67 | + margin: 15px auto; | |
68 | + } | |
69 | + | |
70 | + h3 { | |
71 | + margin: 0 0 12px; | |
72 | + font-size: 16px; | |
73 | + line-height: 32px; | |
74 | + color: @text-color; | |
75 | + } | |
76 | + | |
77 | + h4 { | |
78 | + margin: 0 0 4px; | |
79 | + font-size: 14px; | |
80 | + line-height: 22px; | |
81 | + color: @text-color; | |
82 | + } | |
83 | + | |
84 | + p { | |
85 | + color: @text-color; | |
86 | + } | |
87 | + .device-icon-style { | |
88 | + :deep .ant-upload-select-picture-card { | |
89 | + display: inherit; | |
90 | + float: none; | |
91 | + width: 8.6vw; | |
92 | + height: 17vh; | |
93 | + margin-right: 8px; | |
94 | + text-align: center; | |
95 | + vertical-align: top; | |
96 | + background-color: #fafafa; | |
97 | + border: 1px dashed #d9d9d9; | |
98 | + cursor: pointer; | |
99 | + transition: border-color 0.3s ease; | |
100 | + } | |
101 | + } | |
102 | + } | |
103 | + | |
104 | + .pay-select { | |
105 | + width: 20%; | |
106 | + } | |
107 | + | |
108 | + .pay-input { | |
109 | + width: 70%; | |
110 | + } | |
111 | +</style> | ... | ... |
1 | +<template> | |
2 | + <div class="step2"> <BasicForm :showSubmitButton="false" @register="register" /> </div> | |
3 | +</template> | |
4 | +<script lang="ts"> | |
5 | + import { defineComponent } from 'vue'; | |
6 | + import { BasicForm, useForm } from '/@/components/Form'; | |
7 | + import { modeKafkaForm } from './config'; | |
8 | + | |
9 | + import { Alert, Divider, Descriptions } from 'ant-design-vue'; | |
10 | + | |
11 | + export default defineComponent({ | |
12 | + components: { | |
13 | + BasicForm, | |
14 | + [Alert.name]: Alert, | |
15 | + [Divider.name]: Divider, | |
16 | + [Descriptions.name]: Descriptions, | |
17 | + [Descriptions.Item.name]: Descriptions.Item, | |
18 | + }, | |
19 | + emits: ['next', 'prev', 'register'], | |
20 | + setup(_, { emit }) { | |
21 | + const [register, { validate, setFieldsValue, resetFields }] = useForm({ | |
22 | + labelWidth: 80, | |
23 | + schemas: modeKafkaForm, | |
24 | + actionColOptions: { | |
25 | + span: 14, | |
26 | + }, | |
27 | + resetButtonOptions: { | |
28 | + text: '上一步', | |
29 | + }, | |
30 | + | |
31 | + resetFunc: customResetFunc, | |
32 | + submitFunc: customSubmitFunc, | |
33 | + }); | |
34 | + const setStepTwoFieldsValueFunc = (v) => { | |
35 | + setFieldsValue(v); | |
36 | + }; | |
37 | + const customClearStepTwoValueFunc = () => { | |
38 | + resetFields(); | |
39 | + }; | |
40 | + async function customResetFunc() { | |
41 | + emit('prev'); | |
42 | + } | |
43 | + async function customSubmitFunc() { | |
44 | + try { | |
45 | + const values = await validate(); | |
46 | + emit('next', values); | |
47 | + } catch (error) { | |
48 | + } finally { | |
49 | + } | |
50 | + } | |
51 | + return { register, setStepTwoFieldsValueFunc, customClearStepTwoValueFunc }; | |
52 | + }, | |
53 | + }); | |
54 | +</script> | |
55 | +<style lang="less" scoped> | |
56 | + .step2 { | |
57 | + } | |
58 | +</style> | ... | ... |
src/views/datamanager/datatransfer/index.vue
0 → 100644
1 | +<template> | |
2 | + <div> | |
3 | + <BasicTable @register="registerTable" :rowSelection="{ type: 'checkbox' }"> | |
4 | + <template #toolbar> | |
5 | + <a-button type="primary" @click="handleAdd"> 添加转换 </a-button> | |
6 | + <a-button style="background-color: rgba(237, 111, 111, 1)" type="default"> | |
7 | + <span style="color: white">删除</span> | |
8 | + </a-button> | |
9 | + </template> | |
10 | + <template #action="{ record }"> | |
11 | + <TableAction | |
12 | + :actions="[ | |
13 | + { | |
14 | + label: '编辑', | |
15 | + icon: 'clarity:note-edit-line', | |
16 | + }, | |
17 | + { | |
18 | + label: '警用', | |
19 | + icon: 'clarity:note-edit-line', | |
20 | + }, | |
21 | + { | |
22 | + label: '删除', | |
23 | + icon: 'ant-design:delete-outlined', | |
24 | + color: 'error', | |
25 | + popConfirm: { | |
26 | + title: '是否确认删除', | |
27 | + confirm: handleDelete.bind(null, record), | |
28 | + }, | |
29 | + }, | |
30 | + ]" | |
31 | + /> | |
32 | + </template> | |
33 | + </BasicTable> | |
34 | + <div> | |
35 | + <DataTransferDrawer @register="registerModal" @success="handleSuccess" /> | |
36 | + </div> | |
37 | + </div> | |
38 | +</template> | |
39 | +<script lang="ts"> | |
40 | + import { defineComponent } from 'vue'; | |
41 | + import { BasicTable, useTable, TableAction } from '/@/components/Table'; | |
42 | + import { columns, searchFormSchema } from './config'; | |
43 | + import { useModal } from '/@/components/Modal'; | |
44 | + import DataTransferDrawer from './addDataTransferDrawer.vue'; | |
45 | + | |
46 | + export default defineComponent({ | |
47 | + name: 'Index', | |
48 | + components: { BasicTable, TableAction, DataTransferDrawer }, | |
49 | + setup() { | |
50 | + const [registerModal, { openModal }] = useModal(); | |
51 | + const [registerTable, { reload }] = useTable({ | |
52 | + title: '场景联动列表', | |
53 | + clickToRowSelect: false, | |
54 | + columns, | |
55 | + formConfig: { | |
56 | + labelWidth: 120, | |
57 | + schemas: searchFormSchema, | |
58 | + }, | |
59 | + rowKey: 'id', | |
60 | + useSearchForm: true, | |
61 | + showTableSetting: true, | |
62 | + bordered: true, | |
63 | + showIndexColumn: false, | |
64 | + actionColumn: { | |
65 | + width: 180, | |
66 | + title: '操作', | |
67 | + dataIndex: 'action', | |
68 | + slots: { customRender: 'action' }, | |
69 | + fixed: 'right', | |
70 | + }, | |
71 | + }); | |
72 | + | |
73 | + //新增 | |
74 | + const handleAdd = () => { | |
75 | + openModal(true, { | |
76 | + isUpdate: false, | |
77 | + }); | |
78 | + }; | |
79 | + const handleDelete = (record: Recordable) => { | |
80 | + console.log(record); | |
81 | + }; | |
82 | + const handleSuccess = () => { | |
83 | + reload(); | |
84 | + }; | |
85 | + | |
86 | + return { | |
87 | + registerTable, | |
88 | + handleAdd, | |
89 | + handleDelete, | |
90 | + registerModal, | |
91 | + handleSuccess, | |
92 | + }; | |
93 | + }, | |
94 | + }); | |
95 | +</script> | |
96 | + | |
97 | +<style lang="less" scoped></style> | ... | ... |
src/views/device/profile/1 copy.json
deleted
100644 → 0
1 | -{ | |
2 | - "id": "", | |
3 | - "name": "6", | |
4 | - "transportType": "DEFAULT", | |
5 | - "profileData": { | |
6 | - "alarms": [ | |
7 | - { | |
8 | - "id": "05f99082-3941-467d-999a-7ab5eb7bac46", | |
9 | - "alarmType": "6", | |
10 | - "propagate": true, | |
11 | - "propagateRelationTypes": ["6"], | |
12 | - "createRules": { | |
13 | - "MAJOR": { | |
14 | - "alarmDetails": "CO2过高", | |
15 | - "schedule": { | |
16 | - "type": "ANY_TIME", | |
17 | - "timezone": "Asia/Shanghai (UTC+08:00)" | |
18 | - }, | |
19 | - "condition": [ | |
20 | - { | |
21 | - "key": { | |
22 | - "type": "TIME_SERIES", | |
23 | - "key": "100" | |
24 | - }, | |
25 | - "valueType": "NUMERIC", | |
26 | - "value": "100", | |
27 | - "predicate": { | |
28 | - "type": "NUMERIC", | |
29 | - "operation": "NOT_EQUAL", | |
30 | - "value": { | |
31 | - "defaultValue": "100" | |
32 | - } | |
33 | - } | |
34 | - } | |
35 | - ] | |
36 | - }, | |
37 | - "MINOR": { | |
38 | - "alarmDetails": "CO过高", | |
39 | - "schedule": { | |
40 | - "type": "ANY_TIME", | |
41 | - "timezone": "Asia/Shanghai (UTC+08:00)" | |
42 | - }, | |
43 | - "condition": [ | |
44 | - { | |
45 | - "key": { | |
46 | - "type": "TIME_SERIES", | |
47 | - "key": "2000" | |
48 | - }, | |
49 | - "valueType": "NUMERIC", | |
50 | - "value": "2000", | |
51 | - "predicate": { | |
52 | - "type": "NUMERIC", | |
53 | - "operation": "EQUAL", | |
54 | - "value": { | |
55 | - "defaultValue": "2000" | |
56 | - } | |
57 | - } | |
58 | - } | |
59 | - ] | |
60 | - } | |
61 | - }, | |
62 | - "clearRule": { | |
63 | - "schedule": { | |
64 | - "type": "ANY_TIME", | |
65 | - "timezone": "Asia/Shanghai (UTC+08:00)" | |
66 | - }, | |
67 | - "condition": [ | |
68 | - { | |
69 | - "key": { | |
70 | - "type": "TIME_SERIES", | |
71 | - "key": "123" | |
72 | - }, | |
73 | - "valueType": "NUMERIC", | |
74 | - "value": "123", | |
75 | - "predicate": { | |
76 | - "type": "NUMERIC", | |
77 | - "operation": "GREATER_OR_EQUAL", | |
78 | - "value": { | |
79 | - "defaultValue": "123" | |
80 | - } | |
81 | - } | |
82 | - }, | |
83 | - { | |
84 | - "key": { | |
85 | - "type": "TIME_SERIES", | |
86 | - "key": "456" | |
87 | - }, | |
88 | - "valueType": "NUMERIC", | |
89 | - "value": "456", | |
90 | - "predicate": { | |
91 | - "type": "NUMERIC", | |
92 | - "operation": "LESS", | |
93 | - "value": { | |
94 | - "defaultValue": "456" | |
95 | - } | |
96 | - } | |
97 | - } | |
98 | - ], | |
99 | - "alarmDetails": "CO3过低" | |
100 | - } | |
101 | - } | |
102 | - ] | |
103 | - }, | |
104 | - "alarmProfile": { | |
105 | - "alarmContactId": "224a312c-4f52-41ef-9dce-2aac69ec2e85,8aff39c6-af9c-416a-b110-601183e39da0", | |
106 | - "messageMode": "EMAIL_MESSAGE" | |
107 | - } | |
108 | -} |
src/views/device/profile/1.json
deleted
100644 → 0
1 | -{ | |
2 | - "id": "5445f670-8946-11ec-ac19-e398562c8b61", | |
3 | - "name": "一氧化碳检测", | |
4 | - "enabled": false, | |
5 | - "description": "针对一氧化碳有害气体检测", | |
6 | - "tenantId": "de10f9e0-8892-11ec-ac19-e398562c8b61", | |
7 | - "profileData": { | |
8 | - "configuration": { | |
9 | - "type": "DEFAULT" | |
10 | - }, | |
11 | - "transportConfiguration": { | |
12 | - "type": "DEFAULT" | |
13 | - }, | |
14 | - "provisionConfiguration": { | |
15 | - "type": "DISABLED", | |
16 | - "provisionDeviceSecret": null | |
17 | - }, | |
18 | - "alarms": [ | |
19 | - { | |
20 | - "id": "5d11af7e-71ce-44ef-b34b-6b1a2425f25c", | |
21 | - "alarmType": "气体浓度告警", | |
22 | - "createRules": { | |
23 | - "MAJOR": { | |
24 | - "condition": { | |
25 | - "condition": [ | |
26 | - { | |
27 | - "key": { | |
28 | - "type": "TIME_SERIES", | |
29 | - "key": "CO" | |
30 | - }, | |
31 | - "valueType": "NUMERIC", | |
32 | - "value": null, | |
33 | - "predicate": { | |
34 | - "type": "NUMERIC", | |
35 | - "operation": "GREATER", | |
36 | - "value": { | |
37 | - "defaultValue": 100, | |
38 | - "userValue": null, | |
39 | - "dynamicValue": null | |
40 | - } | |
41 | - } | |
42 | - } | |
43 | - ], | |
44 | - "spec": { | |
45 | - "type": "SIMPLE" | |
46 | - } | |
47 | - }, | |
48 | - "schedule": { | |
49 | - "type": "ANY_TIME" | |
50 | - }, | |
51 | - "alarmDetails": "告警", | |
52 | - "dashboardId": null | |
53 | - }, | |
54 | - "MINOR": { | |
55 | - "condition": { | |
56 | - "condition": [ | |
57 | - { | |
58 | - "key": { | |
59 | - "type": "TIME_SERIES", | |
60 | - "key": "CO" | |
61 | - }, | |
62 | - "valueType": "NUMERIC", | |
63 | - "value": null, | |
64 | - "predicate": { | |
65 | - "type": "NUMERIC", | |
66 | - "operation": "GREATER", | |
67 | - "value": { | |
68 | - "defaultValue": 100, | |
69 | - "userValue": null, | |
70 | - "dynamicValue": null | |
71 | - } | |
72 | - } | |
73 | - } | |
74 | - ], | |
75 | - "spec": { | |
76 | - "type": "SIMPLE" | |
77 | - } | |
78 | - }, | |
79 | - "schedule": { | |
80 | - "type": "ANY_TIME" | |
81 | - }, | |
82 | - "alarmDetails": "告警", | |
83 | - "dashboardId": null | |
84 | - } | |
85 | - }, | |
86 | - "clearRule": { | |
87 | - "condition": { | |
88 | - "condition": [ | |
89 | - { | |
90 | - "key": { | |
91 | - "type": "TIME_SERIES", | |
92 | - "key": "CO" | |
93 | - }, | |
94 | - "valueType": "NUMERIC", | |
95 | - "value": null, | |
96 | - "predicate": { | |
97 | - "type": "NUMERIC", | |
98 | - "operation": "LESS_OR_EQUAL", | |
99 | - "value": { | |
100 | - "defaultValue": 100, | |
101 | - "userValue": null, | |
102 | - "dynamicValue": null | |
103 | - } | |
104 | - } | |
105 | - } | |
106 | - ], | |
107 | - "spec": { | |
108 | - "type": "SIMPLE" | |
109 | - } | |
110 | - }, | |
111 | - "schedule": { | |
112 | - "type": "ANY_TIME" | |
113 | - }, | |
114 | - "alarmDetails": "清除告警", | |
115 | - "dashboardId": null | |
116 | - }, | |
117 | - "propagate": true, | |
118 | - "propagateRelationTypes": ["CO"] | |
119 | - } | |
120 | - ] | |
121 | - }, | |
122 | - "defaultRuleChainId": "de8bf640-8892-11ec-ac19-e398562c8b61", | |
123 | - "alarmProfile": { | |
124 | - "id": "e822cccb-7f00-487e-9ece-790f4d145947", | |
125 | - "creator": "b75f1c80-0f94-4a06-84ef-253962bbfe9e", | |
126 | - "createTime": "2022-02-09 09:19:29", | |
127 | - "enabled": false, | |
128 | - "tenantId": "de10f9e0-8892-11ec-ac19-e398562c8b61", | |
129 | - "alarmContactId": "8aff39c6-af9c-416a-b110-601183e39da0", | |
130 | - "deviceProfileId": "5445f670-8946-11ec-ac19-e398562c8b61", | |
131 | - "messageMode": "PHONE_MESSAGE" | |
132 | - }, | |
133 | - "defaultQueueName": "Main" | |
134 | -} |
1 | 1 | <template> |
2 | - <BasicModal | |
3 | - v-bind="$attrs" | |
4 | - width="55rem" | |
5 | - @register="register" | |
6 | - :title="getTitle" | |
7 | - @ok="handleSubmit" | |
8 | - @cancel="handleCancel" | |
9 | - > | |
10 | - <div class="step-form-form"> | |
11 | - <a-steps :current="current" @change="handleChange"> | |
12 | - <a-step title="设备配置" /> | |
13 | - <a-step title="传输配置" /> | |
14 | - <a-step title="告警配置" /> | |
15 | - <a-step title="告警通知" /> | |
16 | - </a-steps> | |
17 | - </div> | |
18 | - <div class="mt-5"> | |
19 | - <div v-show="current === 0"> | |
20 | - <DeviceProfileStep1 ref="DeviceProfileStep1Ref" @next="handleStepNext1" | |
21 | - /></div> | |
2 | + <div> | |
3 | + <BasicModal | |
4 | + v-bind="$attrs" | |
5 | + width="55rem" | |
6 | + @register="register" | |
7 | + :title="getTitle" | |
8 | + @ok="handleSubmit" | |
9 | + @cancel="handleCancel" | |
10 | + :showOkBtn="isShowOkBtnFalse" | |
11 | + > | |
12 | + <div class="step-form-form"> | |
13 | + <a-steps :current="current"> | |
14 | + <a-step title="设备配置" /> | |
15 | + <a-step title="传输配置" /> | |
16 | + <a-step title="告警配置" /> | |
17 | + <a-step title="告警通知" /> | |
18 | + </a-steps> | |
19 | + </div> | |
20 | + <div class="mt-5"> | |
21 | + <div v-show="current === 0"> | |
22 | + <DeviceProfileStep1 ref="DeviceProfileStep1Ref" @next="handleStepNext1" | |
23 | + /></div> | |
22 | 24 | |
23 | - <div v-show="current === 1"> | |
24 | - <DeviceProfileStep2 | |
25 | - ref="DeviceProfileStep2Ref" | |
26 | - @prev="handleStepPrev" | |
27 | - @next="handleStep2Next" | |
28 | - /></div> | |
25 | + <div v-show="current === 1"> | |
26 | + <DeviceProfileStep2 | |
27 | + ref="DeviceProfileStep2Ref" | |
28 | + @prev="handleStepPrev" | |
29 | + @next="handleStep2Next" | |
30 | + /></div> | |
29 | 31 | |
30 | - <div v-show="current === 2"> | |
31 | - <DeviceProfileStep3 | |
32 | - ref="DeviceProfileStep3Ref" | |
33 | - @prev="handleStepPrev" | |
34 | - @next="handleStep3Next" | |
35 | - @redo="handleRedo" | |
36 | - /></div> | |
37 | - <div v-show="current === 3"> | |
38 | - <DeviceProfileStep4 ref="DeviceProfileStep4Ref" @prev="handleStepPrev" /> | |
32 | + <div v-show="current === 2"> | |
33 | + <DeviceProfileStep3 | |
34 | + ref="DeviceProfileStep3Ref" | |
35 | + @prev="handleStepPrev" | |
36 | + @next="handleStep3Next" | |
37 | + @redo="handleRedo" | |
38 | + :getAllStepThreeData="editData" | |
39 | + :isAddOrEdit="isStatus" | |
40 | + :isShowAddRule="isShowRule" | |
41 | + /></div> | |
42 | + <div v-show="current === 3"> | |
43 | + <DeviceProfileStep4 ref="DeviceProfileStep4Ref" @prev="handleStepPrev" /> | |
44 | + </div> | |
39 | 45 | </div> |
40 | - </div> | |
41 | - </BasicModal> | |
46 | + </BasicModal> | |
47 | + </div> | |
42 | 48 | </template> |
43 | 49 | <script lang="ts"> |
44 | 50 | import { defineComponent, ref, computed, unref, getCurrentInstance, reactive } from 'vue'; |
... | ... | @@ -74,19 +80,25 @@ |
74 | 80 | 'handleStep2Next', |
75 | 81 | ], |
76 | 82 | setup(_, { emit }) { |
83 | + const { proxy } = getCurrentInstance(); | |
77 | 84 | const DeviceProfileStep1Ref = ref(null); |
78 | 85 | const DeviceProfileStep2Ref = ref(null); |
79 | 86 | const DeviceProfileStep3Ref = ref(null); |
80 | 87 | const DeviceProfileStep4Ref = ref(null); |
81 | 88 | const { createMessage } = useMessage(); |
82 | - // const getStepData = ref(null); | |
83 | - const { proxy } = getCurrentInstance(); | |
84 | 89 | const postDeviceConfogData: any = ref({}); |
85 | 90 | const getStepOneData: any = ref({}); |
86 | 91 | const getStepTwoData: any = ref({}); |
87 | 92 | const getStepThreeData = ref([]); |
88 | - const editEchoData: any = ref(null); | |
89 | - const alarmProfileData: any = ref({}); | |
93 | + const editData = ref({}); | |
94 | + let getBackendData = reactive({}); | |
95 | + let getStepFourData = reactive({}); | |
96 | + const alarmProfileData = reactive({ | |
97 | + alarmProfile: { | |
98 | + alarmContactId: '', | |
99 | + messageMode: '', | |
100 | + }, | |
101 | + }); | |
90 | 102 | const isGetStepThreeData = reactive({ |
91 | 103 | profileData: { |
92 | 104 | alarms: [], |
... | ... | @@ -94,50 +106,70 @@ |
94 | 106 | }); |
95 | 107 | const postEditId = ref(''); |
96 | 108 | const current = ref(0); |
97 | - const isUpdate = ref(true); | |
98 | - const getTitle = computed(() => (!unref(isUpdate) ? '新增设备配置' : '编辑设备配置')); | |
99 | - const handleChange = (v) => { | |
100 | - console.log(v); | |
101 | - }; | |
109 | + const isUpdate = ref(0); | |
110 | + const getAlarmContactId = ref(''); | |
111 | + const getMessageMode = ref(''); | |
112 | + const isStatus: any = ref(null); | |
113 | + const isShowOkBtnFalse = ref(true); | |
114 | + const isShowRule = ref(true); | |
115 | + | |
116 | + const getTitle = computed(() => | |
117 | + isUpdate.value == 1 ? '新增设备配置' : isUpdate.value == 2 ? '编辑设备配置' : '设备配置详情' | |
118 | + ); | |
119 | + const getViewTitle = computed(() => (!unref(isShowOkBtnFalse) ? '设备配置详情' : '')); | |
102 | 120 | const [register, { closeModal }] = useModalInner(async (data) => { |
103 | - isUpdate.value = !!data?.isUpdate; | |
104 | - if (!unref(isUpdate)) { | |
121 | + isUpdate.value = data.isUpdate; | |
122 | + if (isUpdate.value == 1) { | |
123 | + isShowRule.value = true; | |
124 | + isShowOkBtnFalse.value = true; | |
105 | 125 | current.value = 0; |
126 | + isStatus.value = !data.isUpdate; | |
127 | + //清空第一步数据 | |
128 | + proxy.$refs.DeviceProfileStep1Ref.customResetStepOneFunc(); | |
129 | + proxy.$refs.DeviceProfileStep3Ref.clearAllRegisterFormFunc(); | |
130 | + //报警详细信息 | |
131 | + proxy.$refs.DeviceProfileStep3Ref.setRegisterFormChangeDetailFunc({ | |
132 | + isEditStatus: false, | |
133 | + stepThreeData: {}, | |
134 | + }); | |
135 | + } else if (isUpdate.value == 2) { | |
136 | + isShowRule.value = true; | |
137 | + isShowOkBtnFalse.value = true; | |
138 | + current.value = 0; | |
139 | + isStatus.value = data.isUpdate; | |
140 | + //清空第一步数据 | |
141 | + proxy.$refs.DeviceProfileStep1Ref.customResetStepOneFunc(); | |
142 | + //回显第一步数据 | |
143 | + proxy.$refs.DeviceProfileStep1Ref.setStepOneFieldsValueFunc({ | |
144 | + name: data.record.name, | |
145 | + defaultRuleChainId: data.record.defaultRuleChainId, | |
146 | + defaultQueueName: data.record.defaultQueueName, | |
147 | + description: data.record.description, | |
148 | + }); | |
106 | 149 | proxy.$refs.DeviceProfileStep3Ref.clearProfileDataFunc(); |
107 | 150 | proxy.$refs.DeviceProfileStep3Ref.addAlarmRule(); |
108 | - // proxy.$refs.DeviceProfileStep4Ref.customResetAndFunc(); | |
109 | - | |
110 | - switch (current.value) { | |
111 | - case 0: | |
112 | - proxy.$refs.DeviceProfileStep1Ref.customResetFunc(); | |
113 | - proxy.$refs.DeviceProfileStep1Ref.resetIconFunc(); | |
114 | - break; | |
115 | - case 1: | |
116 | - proxy.$refs.DeviceProfileStep2Ref.customResetAndFunc(); | |
117 | - break; | |
118 | - case 2: | |
119 | - proxy.$refs.DeviceProfileStep3Ref.resetRegisterFormFunc(); | |
120 | - proxy.$refs.DeviceProfileStep3Ref.resetRegisterFormHighSettingmFunc(); | |
121 | - proxy.$refs.DeviceProfileStep3Ref.resetRegisterFormCreateAlarmFunc(); | |
122 | - break; | |
123 | - case 3: | |
124 | - proxy.$refs.DeviceProfileStep4Ref.customResetAndFunc(); | |
125 | - break; | |
126 | - } | |
127 | - } | |
128 | - if (unref(isUpdate)) { | |
151 | + postEditId.value = data.record.id; | |
152 | + getBackendData = await deviceConfigGetDetail(postEditId.value); | |
153 | + editData.value = getBackendData; | |
154 | + } else if (isUpdate.value == 3) { | |
155 | + isShowRule.value = false; | |
156 | + isShowOkBtnFalse.value = false; | |
129 | 157 | current.value = 0; |
158 | + isStatus.value = data.isUpdate; | |
159 | + //清空第一步数据 | |
160 | + proxy.$refs.DeviceProfileStep1Ref.customResetStepOneFunc(); | |
161 | + //回显第一步数据 | |
162 | + proxy.$refs.DeviceProfileStep1Ref.setStepOneFieldsValueFunc({ | |
163 | + name: data.record.name, | |
164 | + defaultRuleChainId: data.record.defaultRuleChainId, | |
165 | + defaultQueueName: data.record.defaultQueueName, | |
166 | + description: data.record.description, | |
167 | + }); | |
130 | 168 | proxy.$refs.DeviceProfileStep3Ref.clearProfileDataFunc(); |
131 | 169 | proxy.$refs.DeviceProfileStep3Ref.addAlarmRule(); |
132 | 170 | postEditId.value = data.record.id; |
133 | - const getBackendData = await deviceConfigGetDetail(postEditId.value); | |
134 | - editEchoData.value = { ...getBackendData }; | |
135 | - switch (current.value) { | |
136 | - case 0: | |
137 | - proxy.$refs.DeviceProfileStep1Ref.resetFieldsFunc(editEchoData.value); | |
138 | - proxy.$refs.DeviceProfileStep1Ref.editIconFunc(editEchoData.value.icon); | |
139 | - break; | |
140 | - } | |
171 | + getBackendData = await deviceConfigGetDetail(postEditId.value); | |
172 | + editData.value = getBackendData; | |
141 | 173 | } |
142 | 174 | }); |
143 | 175 | function handleStepPrev() { |
... | ... | @@ -147,166 +179,129 @@ |
147 | 179 | current.value++; |
148 | 180 | getStepOneData.value = v; |
149 | 181 | getStepOneData.value.icon = v1; |
150 | - if (unref(isUpdate)) { | |
151 | - proxy.$refs.DeviceProfileStep2Ref.resetFieldsFunc({ | |
152 | - transportType: editEchoData.value.profileData.transportConfiguration.type, | |
182 | + if (isUpdate.value == 1) { | |
183 | + // return setTimeout(() => { | |
184 | + // proxy.$refs.DeviceProfileStep2Ref.customClearStepTwoValueFunc(); | |
185 | + // }, 10); | |
186 | + } else if (isUpdate.value == 2) { | |
187 | + return proxy.$refs.DeviceProfileStep2Ref.setStepTwoFieldsValueFunc({ | |
188 | + transportType: editData.value?.profileData.transportConfiguration.type, | |
189 | + }); | |
190 | + } else if (isUpdate.value == 3) { | |
191 | + return proxy.$refs.DeviceProfileStep2Ref.setStepTwoFieldsValueFunc({ | |
192 | + transportType: editData.value?.profileData.transportConfiguration.type, | |
153 | 193 | }); |
154 | - } else { | |
155 | - // proxy.$refs.DeviceProfileStep2Ref.customResetAndFunc(); | |
156 | 194 | } |
157 | 195 | } |
158 | 196 | function handleStep2Next(v) { |
159 | 197 | current.value++; |
160 | 198 | getStepTwoData.value = v; |
161 | - if (unref(isUpdate)) { | |
162 | - proxy.$refs.DeviceProfileStep3Ref.retryRegisterFormFunc({ | |
163 | - alarmType: editEchoData.value.profileData.alarms[0].alarmType, | |
199 | + | |
200 | + if (isUpdate.value == 1) { | |
201 | + proxy.$refs.DeviceProfileStep3Ref.initAddAlarmRuleFunc(); | |
202 | + proxy.$refs.DeviceProfileStep3Ref.resetRegisterFormCreateAlarmFunc(); | |
203 | + } else if (isUpdate.value == 2) { | |
204 | + proxy.$refs.DeviceProfileStep3Ref.setAlaramTypeFormFunc({ | |
205 | + alarmType: editData.value?.profileData.alarms[0].alarmType, | |
164 | 206 | }); |
165 | - proxy.$refs.DeviceProfileStep3Ref.retryRegisterFormHighSettingmFunc({ | |
166 | - propagate: editEchoData.value.profileData.alarms[0].propagate, | |
167 | - propagateRelationTypes: | |
168 | - editEchoData.value.profileData?.alarms[0].propagateRelationTypes[0], | |
207 | + proxy.$refs.DeviceProfileStep3Ref.setTransmitAlarmFormFunc({ | |
208 | + propagate: editData.value?.profileData.alarms[0].propagate, | |
209 | + propagateRelationTypes: editData.value?.profileData.alarms[0].propagateRelationTypes[0], | |
210 | + }); | |
211 | + //回显报警详细信息 | |
212 | + proxy.$refs.DeviceProfileStep3Ref.setRegisterFormChangeDetailFunc({ | |
213 | + isEditStatus: true, | |
214 | + stepThreeData: editData.value?.profileData.alarms[0].createRules, | |
215 | + stepThreeClearData: editData.value?.profileData.alarms[0].clearRule, | |
169 | 216 | }); |
170 | - const getKey = Object.keys(editEchoData.value.profileData?.alarms[0].createRules); | |
171 | - proxy.$refs.DeviceProfileStep3Ref.retryRegisterFormCreateAlarmFunc({ | |
172 | - default: getKey[0], | |
217 | + proxy.$refs.DeviceProfileStep3Ref.setRegisterFormClearChangeDetailFunc({ | |
218 | + alarmDetails: editData.value?.profileData.alarms[0].clearRule.alarmDetails, | |
173 | 219 | }); |
174 | - const findDay = [ | |
175 | - { label: '等于', value: 'EQUAL' }, | |
176 | - { label: '不等于', value: 'NOT_EQUAL' }, | |
177 | - { label: '开始于', value: 'STARTS_WITH' }, | |
178 | - { label: '结束于', value: 'ENDS_WITH' }, | |
179 | - { label: '包含', value: 'CONTAINS' }, | |
180 | - { label: '不包含', value: 'NOT_CONTAINS' }, | |
181 | - { label: '等于', value: 'EQUAL' }, | |
182 | - { label: '不等于', value: 'NOT_EQUAL' }, | |
183 | - { label: '大于', value: 'GREATER' }, | |
184 | - { label: '小于', value: 'LESS' }, | |
185 | - { label: '大于或等于', value: 'GREATER_OR_EQUAL' }, | |
186 | - { label: '小于或等于', value: 'LESS_OR_EQUAL' }, | |
187 | - ]; | |
188 | - const findRuleByValue = findDay.find((f) => { | |
189 | - if ( | |
190 | - f.value == | |
191 | - editEchoData.value.profileData?.alarms[0].createRules[getKey[0]].condition | |
192 | - .condition[0].predicate.operation | |
193 | - ) { | |
194 | - return f.label; | |
195 | - } | |
220 | + //回显创建报警规则和清除报警规则 | |
221 | + } else if (isUpdate.value == 3) { | |
222 | + proxy.$refs.DeviceProfileStep3Ref.setAlaramTypeFormFunc({ | |
223 | + alarmType: editData.value?.profileData.alarms[0].alarmType, | |
196 | 224 | }); |
197 | - const findClearRuleByValue = findDay.find((f) => { | |
198 | - if ( | |
199 | - f.value == | |
200 | - editEchoData.value.profileData?.alarms[0].clearRule.condition.condition[0].predicate | |
201 | - .operation | |
202 | - ) { | |
203 | - return f.label; | |
204 | - } | |
225 | + proxy.$refs.DeviceProfileStep3Ref.setTransmitAlarmFormFunc({ | |
226 | + propagate: editData.value?.profileData.alarms[0].propagate, | |
227 | + propagateRelationTypes: editData.value?.profileData.alarms[0].propagateRelationTypes[0], | |
205 | 228 | }); |
206 | - proxy.$refs.DeviceProfileStep3Ref.retryRulesFormDataFunc( | |
207 | - ` | |
208 | - 键名:${ | |
209 | - editEchoData.value.profileData?.alarms[0].createRules[getKey[0]].condition | |
210 | - .condition[0].key.key | |
211 | - }...操作:${findRuleByValue?.label}...值:${ | |
212 | - editEchoData.value.profileData?.alarms[0].createRules[getKey[0]].condition | |
213 | - .condition[0].predicate.value.defaultValue | |
214 | - } | |
215 | - ` | |
216 | - ); | |
217 | - proxy.$refs.DeviceProfileStep3Ref.retryEnableFormDataFunc(`始终启用`); | |
229 | + //回显报警详细信息 | |
218 | 230 | proxy.$refs.DeviceProfileStep3Ref.setRegisterFormChangeDetailFunc({ |
219 | - alarmDetails: | |
220 | - editEchoData.value.profileData?.alarms[0].createRules[getKey[0]].alarmDetails, | |
231 | + isEditStatus: true, | |
232 | + stepThreeData: editData.value?.profileData.alarms[0].createRules, | |
233 | + stepThreeClearData: editData.value?.profileData.alarms[0].clearRule, | |
221 | 234 | }); |
222 | - | |
223 | - //清除报警 | |
224 | - proxy.$refs.DeviceProfileStep3Ref.retryRulesClearFormDataFunc( | |
225 | - ` | |
226 | - 键名:${editEchoData.value.profileData?.alarms[0].clearRule.condition.condition[0].key.key}...操作:${findClearRuleByValue?.label}...值:${editEchoData.value.profileData?.alarms[0].clearRule.condition.condition[0].predicate.value.defaultValue} | |
227 | - ` | |
228 | - ); | |
229 | - proxy.$refs.DeviceProfileStep3Ref.retryEnableClearFormDataFunc(`始终启用`); | |
230 | 235 | proxy.$refs.DeviceProfileStep3Ref.setRegisterFormClearChangeDetailFunc({ |
231 | - alarmDetails: editEchoData.value.profileData?.alarms[0].clearRule.alarmDetails, | |
236 | + alarmDetails: editData.value?.profileData.alarms[0].clearRule.alarmDetails, | |
232 | 237 | }); |
233 | - } else { | |
234 | - try { | |
235 | - proxy.$refs.DeviceProfileStep3Ref.resetRegisterFormFunc(); | |
236 | - proxy.$refs.DeviceProfileStep3Ref.resetRegisterFormHighSettingmFunc(); | |
237 | - proxy.$refs.DeviceProfileStep3Ref.resetRegisterFormCreateAlarmFunc(); | |
238 | - proxy.$refs.DeviceProfileStep3Ref.resetRulesFormDataFunc(); | |
239 | - proxy.$refs.DeviceProfileStep3Ref.resetEnableFormDataFunc(); | |
240 | - proxy.$refs.DeviceProfileStep3Ref.resetTemplateFormDataFunc(); | |
241 | - proxy.$refs.DeviceProfileStep3Ref.resetRulesClearFormDataFunc(); | |
242 | - proxy.$refs.DeviceProfileStep3Ref.resetEnableClearFormDataFunc(); | |
243 | - proxy.$refs.DeviceProfileStep3Ref.resetTemplateClearFormDataFunc(); | |
244 | - proxy.$refs.DeviceProfileStep3Ref.resetRegisterFormChangeDetailFunc(); | |
245 | - proxy.$refs.DeviceProfileStep3Ref.resetRegisterFormClearChangeDetailFunc(); | |
246 | - } catch (e) {} | |
238 | + //回显创建报警规则和清除报警规则 | |
247 | 239 | } |
248 | 240 | } |
249 | 241 | function handleStep3Next(v) { |
250 | 242 | current.value++; |
251 | 243 | getStepThreeData.value = v; |
252 | - try { | |
253 | - if (unref(isUpdate)) { | |
254 | - try { | |
255 | - proxy.$refs.DeviceProfileStep4Ref.resetFieldsFunc({ | |
256 | - id: editEchoData.value.alarmProfile.id, | |
257 | - messageMode: editEchoData.value.alarmProfile.messageMode, | |
258 | - }); | |
259 | - } catch (e) { | |
260 | - return e; | |
261 | - } | |
262 | - } else { | |
263 | - try { | |
264 | - proxy.$refs.DeviceProfileStep4Ref.resetFieldsFunc({ | |
265 | - id: '', | |
266 | - messageMode: '', | |
267 | - }); | |
268 | - } catch (e) { | |
269 | - return e; | |
270 | - } | |
271 | - } | |
272 | - } catch (e) { | |
273 | - return e; | |
244 | + if (isUpdate.value == 1) { | |
245 | + // try { | |
246 | + // setTimeout(() => { | |
247 | + // proxy.$refs.DeviceProfileStep4Ref.clearAlaramContactAndNoticeMethodFunc(); | |
248 | + // }, 500); | |
249 | + // } catch (e) { | |
250 | + // return e; | |
251 | + // } | |
252 | + } else if (isUpdate.value == 2) { | |
253 | + proxy.$refs.DeviceProfileStep4Ref.setAlaramContactAndNoticeMethodFunc({ | |
254 | + alarmContactId: editData.value?.alarmProfile.alarmContactId.split(','), | |
255 | + messageMode: editData.value?.alarmProfile.messageMode.split(','), | |
256 | + }); | |
257 | + } else if (isUpdate.value == 3) { | |
258 | + proxy.$refs.DeviceProfileStep4Ref.setAlaramContactAndNoticeMethodFunc({ | |
259 | + alarmContactId: editData.value?.alarmProfile.alarmContactId.split(','), | |
260 | + messageMode: editData.value?.alarmProfile.messageMode.split(','), | |
261 | + }); | |
274 | 262 | } |
275 | 263 | } |
276 | 264 | function handleRedo() { |
277 | 265 | current.value = 0; |
278 | 266 | } |
267 | + | |
279 | 268 | const handleSubmit = async () => { |
280 | - if (!unref(isUpdate)) { | |
269 | + if (isUpdate.value == 1) { | |
281 | 270 | isGetStepThreeData.profileData.alarms = getStepThreeData.value; |
282 | - alarmProfileData.value.alarmProfile = | |
283 | - await proxy.$refs.DeviceProfileStep4Ref.getAllFields(); | |
284 | - alarmProfileData.value.alarmProfile.alarmContactId.shift(); | |
285 | - alarmProfileData.value.alarmProfile.messageMode.shift(); | |
271 | + getStepFourData = await proxy.$refs.DeviceProfileStep4Ref.getAllFields(); | |
272 | + const getJoinAlarmContactIdData = getStepFourData.alarmContactId.join(','); | |
273 | + const getJoinMessageModeData = getStepFourData.messageMode.join(','); | |
274 | + getAlarmContactId.value = getJoinAlarmContactIdData; | |
275 | + getMessageMode.value = getJoinMessageModeData; | |
276 | + alarmProfileData.alarmProfile.alarmContactId = getAlarmContactId.value; | |
277 | + alarmProfileData.alarmProfile.messageMode = getMessageMode.value; | |
286 | 278 | Object.assign( |
287 | 279 | postDeviceConfogData.value, |
288 | 280 | getStepOneData.value, |
289 | 281 | getStepTwoData.value, |
290 | 282 | isGetStepThreeData, |
291 | - alarmProfileData.value | |
283 | + alarmProfileData | |
292 | 284 | ); |
293 | 285 | await deviceConfigAddOrEdit(postDeviceConfogData.value); |
294 | 286 | createMessage.success('新增设备配置成功'); |
295 | 287 | closeModal(); |
296 | 288 | emit('success'); |
297 | - } | |
298 | - if (unref(isUpdate)) { | |
289 | + } else if (isUpdate.value == 2) { | |
299 | 290 | postDeviceConfogData.value.id = postEditId.value; |
300 | 291 | isGetStepThreeData.profileData.alarms = getStepThreeData.value; |
301 | - | |
302 | - alarmProfileData.value.alarmProfile = | |
303 | - await proxy.$refs.DeviceProfileStep4Ref.getAllFields(); | |
292 | + getStepFourData = await proxy.$refs.DeviceProfileStep4Ref.getAllFields(); | |
293 | + const getJoinAlarmContactIdData = getStepFourData.alarmContactId.join(','); | |
294 | + const getJoinMessageModeData = getStepFourData.messageMode.join(','); | |
295 | + getAlarmContactId.value = getJoinAlarmContactIdData; | |
296 | + getMessageMode.value = getJoinMessageModeData; | |
297 | + alarmProfileData.alarmProfile.alarmContactId = getAlarmContactId.value; | |
298 | + alarmProfileData.alarmProfile.messageMode = getMessageMode.value; | |
304 | 299 | Object.assign( |
305 | 300 | postDeviceConfogData.value, |
306 | 301 | getStepOneData.value, |
307 | 302 | getStepTwoData.value, |
308 | - alarmProfileData.value, | |
309 | - isGetStepThreeData | |
303 | + isGetStepThreeData, | |
304 | + alarmProfileData | |
310 | 305 | ); |
311 | 306 | await deviceConfigAddOrEdit(postDeviceConfogData.value); |
312 | 307 | createMessage.success('编辑设备配置成功'); |
... | ... | @@ -314,22 +309,25 @@ |
314 | 309 | emit('success'); |
315 | 310 | } |
316 | 311 | }; |
312 | + | |
317 | 313 | const handleCancel = () => { |
318 | 314 | closeModal(); |
319 | 315 | }; |
320 | 316 | return { |
321 | - handleChange, | |
317 | + isShowRule, | |
318 | + isShowOkBtnFalse, | |
319 | + isStatus, | |
322 | 320 | DeviceProfileStep2Ref, |
323 | 321 | DeviceProfileStep3Ref, |
324 | 322 | DeviceProfileStep4Ref, |
325 | 323 | DeviceProfileStep1Ref, |
326 | - editEchoData, | |
327 | - // getStepData, | |
324 | + editData, | |
328 | 325 | handleStep3Next, |
329 | 326 | handleSubmit, |
330 | 327 | handleCancel, |
331 | 328 | register, |
332 | 329 | getTitle, |
330 | + getViewTitle, | |
333 | 331 | current, |
334 | 332 | handleStepPrev, |
335 | 333 | handleStepNext1, | ... | ... |
... | ... | @@ -45,7 +45,7 @@ |
45 | 45 | /> |
46 | 46 | </template> |
47 | 47 | </BasicTable> |
48 | - <DeviceProfileModal v-if="isJudgeStatus" @register="registerModal" @success="handleSuccess" /> | |
48 | + <DeviceProfileModal @register="registerModal" @success="handleSuccess" /> | |
49 | 49 | <DeviceConfigDetail |
50 | 50 | ref="deviceDetailRef" |
51 | 51 | @register="registerModalDetail" |
... | ... | @@ -73,9 +73,9 @@ |
73 | 73 | const { proxy } = getCurrentInstance(); |
74 | 74 | const deviceDetailRef = ref(null); |
75 | 75 | let selectedRowKeys: string[] = reactive([]); |
76 | - let isJudgeStatus = ref(true); | |
77 | 76 | const getPathUrl = ref(''); |
78 | 77 | const getPathUrlName = ref(''); |
78 | + | |
79 | 79 | const { createMessage } = useMessage(); |
80 | 80 | const [registerModal, { openModal }] = useModal(); |
81 | 81 | const [registerModalDetail, { openModal: openModalDetail }] = useModal(); |
... | ... | @@ -95,7 +95,7 @@ |
95 | 95 | bordered: true, |
96 | 96 | showIndexColumn: false, |
97 | 97 | actionColumn: { |
98 | - width: 180, | |
98 | + width: 200, | |
99 | 99 | title: '操作', |
100 | 100 | dataIndex: 'action', |
101 | 101 | slots: { customRender: 'action' }, |
... | ... | @@ -156,20 +156,26 @@ |
156 | 156 | function handleCreate() { |
157 | 157 | setTimeout(() => { |
158 | 158 | openModal(true, { |
159 | - isUpdate: false, | |
159 | + isUpdate: 1, | |
160 | 160 | }); |
161 | 161 | }, 100); |
162 | - isJudgeStatus.value = true; | |
163 | 162 | } |
164 | 163 | |
165 | 164 | function handleEdit(record: Recordable) { |
166 | 165 | setTimeout(() => { |
167 | 166 | openModal(true, { |
168 | 167 | record, |
169 | - isUpdate: true, | |
168 | + isUpdate: 2, | |
169 | + }); | |
170 | + }, 100); | |
171 | + } | |
172 | + async function handleDetailView(record: Recordable) { | |
173 | + setTimeout(() => { | |
174 | + openModal(true, { | |
175 | + record, | |
176 | + isUpdate: 3, | |
170 | 177 | }); |
171 | 178 | }, 100); |
172 | - isJudgeStatus.value = true; | |
173 | 179 | } |
174 | 180 | const useSelectionChange = () => { |
175 | 181 | selectedRowKeys = getSelectRowKeys(); |
... | ... | @@ -188,17 +194,6 @@ |
188 | 194 | }); |
189 | 195 | } |
190 | 196 | |
191 | - async function handleDetailView(record: Recordable) { | |
192 | - openModalDetail(true, { | |
193 | - record, | |
194 | - isUpdate: false, | |
195 | - }); | |
196 | - setTimeout(() => { | |
197 | - // proxy.$refs.deviceDetailRef.resetFieldsContactFunc(); | |
198 | - }, 2000); | |
199 | - isJudgeStatus.value = false; | |
200 | - } | |
201 | - | |
202 | 197 | // function defaultHeader({ filename, bookType }: ExportModalResult) { |
203 | 198 | // // 默认Object.keys(data[0])作为header |
204 | 199 | // jsonToSheetXlsx({ |
... | ... | @@ -231,7 +226,6 @@ |
231 | 226 | // defaultHeader, |
232 | 227 | useSelectionChange, |
233 | 228 | handleTableDel, |
234 | - isJudgeStatus, | |
235 | 229 | tableListRef, |
236 | 230 | loadDataSuccess, |
237 | 231 | handleImport, | ... | ... |
src/views/device/profile/step/1.json
deleted
100644 → 0
1 | -{ | |
2 | - "name": "2", | |
3 | - "icon": "", | |
4 | - "transportType": "DEFAULT", | |
5 | - "profileData": { | |
6 | - "alarms": [ | |
7 | - { | |
8 | - "createRules": { | |
9 | - "MAJOR": { | |
10 | - "alarmDetails": "2", | |
11 | - "schedule": { | |
12 | - "type": "ANY_TIME", | |
13 | - "timezone": "Asia/Shanghai (UTC+08:00)" | |
14 | - }, | |
15 | - "condition": { | |
16 | - "type": "TIME_SERIES", | |
17 | - "key1": "2", | |
18 | - "type1": "NUMERIC", | |
19 | - "id": 2 | |
20 | - } | |
21 | - }, | |
22 | - "WARNING": { | |
23 | - "alarmDetails": "3", | |
24 | - "schedule": { | |
25 | - "type": "ANY_TIME", | |
26 | - "timezone": "Asia/Shanghai (UTC+08:00)" | |
27 | - }, | |
28 | - "condition": { | |
29 | - "type": "TIME_SERIES", | |
30 | - "key1": "3", | |
31 | - "type1": "NUMERIC", | |
32 | - "operation": "LESS", | |
33 | - "value1": "3", | |
34 | - "id": 2 | |
35 | - } | |
36 | - } | |
37 | - }, | |
38 | - "clearRule": { | |
39 | - "schedule": { | |
40 | - "type": "ANY_TIME", | |
41 | - "timezone": "Asia/Shanghai (UTC+08:00)" | |
42 | - }, | |
43 | - "condition": { | |
44 | - "type": "TIME_SERIES", | |
45 | - "key1": "4", | |
46 | - "type1": "NUMERIC", | |
47 | - "operation": "GREATER_OR_EQUAL", | |
48 | - "value1": "4", | |
49 | - "id": 2 | |
50 | - }, | |
51 | - "alarmDetails": "4" | |
52 | - }, | |
53 | - "id": "d8dbd518-5c72-4a2e-ab27-56fca5f6fa8d", | |
54 | - "alarmType": "2", | |
55 | - "propagate": true, | |
56 | - "propagateRelationTypes": [ | |
57 | - "2" | |
58 | - ] | |
59 | - } | |
60 | - ] | |
61 | - }, | |
62 | - "alarmProfile": { | |
63 | - "alarmContactId": [], | |
64 | - "messageMode": [ | |
65 | - "PHONE_MESSAGE" | |
66 | - ] | |
67 | - } | |
68 | -} | |
\ No newline at end of file |
... | ... | @@ -72,7 +72,6 @@ |
72 | 72 | emits: ['next', 'resetFunc', 'register'], |
73 | 73 | setup(_, { emit }) { |
74 | 74 | const { createMessage } = useMessage(); |
75 | - | |
76 | 75 | const [register, { validate, setFieldsValue, resetFields }] = useForm({ |
77 | 76 | labelWidth: 100, |
78 | 77 | schemas: step1Schemas, |
... | ... | @@ -85,7 +84,8 @@ |
85 | 84 | }, |
86 | 85 | submitFunc: customSubmitFunc, |
87 | 86 | }); |
88 | - const resetFieldsFunc = (v) => { | |
87 | + //回显数据 | |
88 | + const setStepOneFieldsValueFunc = (v) => { | |
89 | 89 | setFieldsValue(v); |
90 | 90 | }; |
91 | 91 | const peresonalPic = ref(); |
... | ... | @@ -127,15 +127,16 @@ |
127 | 127 | emit('next', values, peresonalPic.value); |
128 | 128 | } catch (error) {} |
129 | 129 | } |
130 | - const customResetFunc = async () => { | |
131 | - await resetFields(); | |
130 | + //清空数据 | |
131 | + const customResetStepOneFunc = () => { | |
132 | + resetFields(); | |
132 | 133 | }; |
133 | 134 | return { |
134 | 135 | editIconFunc, |
135 | 136 | resetIconFunc, |
136 | 137 | register, |
137 | - resetFieldsFunc, | |
138 | - customResetFunc, | |
138 | + setStepOneFieldsValueFunc, | |
139 | + customResetStepOneFunc, | |
139 | 140 | uploadApi, |
140 | 141 | peresonalPic, |
141 | 142 | beforeUploadqrcodePic, | ... | ... |
... | ... | @@ -34,11 +34,11 @@ |
34 | 34 | resetFunc: customResetFunc, |
35 | 35 | submitFunc: customSubmitFunc, |
36 | 36 | }); |
37 | - const resetFieldsFunc = (v) => { | |
37 | + const setStepTwoFieldsValueFunc = (v) => { | |
38 | 38 | setFieldsValue(v); |
39 | 39 | }; |
40 | - const customResetAndFunc = async () => { | |
41 | - await resetFields(); | |
40 | + const customClearStepTwoValueFunc = () => { | |
41 | + resetFields(); | |
42 | 42 | }; |
43 | 43 | async function customResetFunc() { |
44 | 44 | emit('prev'); |
... | ... | @@ -51,7 +51,7 @@ |
51 | 51 | } finally { |
52 | 52 | } |
53 | 53 | } |
54 | - return { register, resetFieldsFunc, customResetAndFunc }; | |
54 | + return { register, setStepTwoFieldsValueFunc, customClearStepTwoValueFunc }; | |
55 | 55 | }, |
56 | 56 | }); |
57 | 57 | </script> | ... | ... |
... | ... | @@ -15,7 +15,7 @@ |
15 | 15 | </div> |
16 | 16 | </template> |
17 | 17 | <!-- 移除按钮 --> |
18 | - <!-- 传递报警和报警类型 --> | |
18 | + <!-- 报警类型和传递报警--> | |
19 | 19 | <div style="margin-top: -15px; margin-left: 10px"> |
20 | 20 | <div class="alert-type" style="margin-left: -50px; margin-top: -10px"> |
21 | 21 | <BasicForm @register="registerForm" |
... | ... | @@ -37,81 +37,137 @@ |
37 | 37 | <!-- 创建报警规则 --> |
38 | 38 | <div style="margin-top: -57px"> |
39 | 39 | <p style="margin-left: 10px; font-size: medium">创建报警规则</p> |
40 | - <template v-for="(childItem, createIndex) in item.alarms" :key="childItem.id"> | |
41 | - <span style="display: none">{{ childItem }}</span> | |
42 | - <!-- 报警添加条件 --> | |
40 | + <template | |
41 | + v-for="(childItem, createIndex) in getStepThreeEditStatus | |
42 | + ? getFilterStepThreeEditArr | |
43 | + : item.alarms" | |
44 | + :key="childItem.id" | |
45 | + > | |
43 | 46 | <div> |
44 | - <!-- 报警启用规则 --> | |
45 | - <EnableRule | |
46 | - v-if="isRuleAlarmRuleConditions === 2" | |
47 | - ref="getChildData2" | |
48 | - @getAllFieldsEnab="getAllFieldsEnabFunc" | |
49 | - @register="registerModal2" | |
50 | - /> | |
51 | - <!-- 报警规则条件 --> | |
52 | - <AlarmRuleConditions | |
53 | - v-if="isRuleAlarmRuleConditions === 3" | |
54 | - ref="getChildData3" | |
55 | - @getAllFieldsRule="getAllFieldsRuleFunc" | |
56 | - @register="registerModal3" | |
57 | - /> | |
58 | - </div> | |
59 | - <!-- 添加条件按钮 --> | |
60 | - <div class="aic" style="border: 1px solid #bfbfbf"> | |
61 | - <div class="w-3/4" style="margin-left: 40px"> | |
62 | - <!-- 报警严重程度 --> | |
63 | - <div style="margin-left: 10px; margin-top: 20px" | |
64 | - ><BasicForm @register="registerFormCreateAlarm" /> | |
65 | - </div> | |
66 | - <!-- 报警严重程度 --> | |
67 | - | |
68 | - <div style="margin-left: 5px; margin-top: -50px"> | |
69 | - <div style="color: #f5594e" class="ml-4" | |
70 | - >报警规则条件: | |
71 | - <Button | |
72 | - style="margin-left: 4px" | |
73 | - size="small" | |
74 | - type="primary" | |
75 | - @click="handleOpenAlaramRuleConditions" | |
76 | - >添加</Button | |
77 | - > | |
78 | - <!-- <p>{{ ruleTemplateData }}</p> --> | |
47 | + <span style="display: none">{{ childItem }}</span> | |
48 | + <!-- 报警添加条件 --> | |
49 | + <div> | |
50 | + <!-- 报警启用规则 --> | |
51 | + <EnableRule | |
52 | + v-if="isRuleAlarmRuleConditions === 2" | |
53 | + ref="getChildData2" | |
54 | + @getAllFieldsEnab="getAllFieldsEnabFunc" | |
55 | + @register="registerModal2" | |
56 | + /> | |
57 | + <!-- 报警规则条件 --> | |
58 | + <AlarmRuleConditions | |
59 | + v-if="isRuleAlarmRuleConditions === 3" | |
60 | + ref="getChildData3" | |
61 | + @getAllFieldsRule="getAllFieldsRuleFunc" | |
62 | + @register="registerModal3" | |
63 | + /> | |
64 | + </div> | |
65 | + <!-- 添加条件按钮 --> | |
66 | + <div class="aic" style="border: 1px solid #bfbfbf"> | |
67 | + <div class="w-3/4" style="margin-left: 40px"> | |
68 | + <!-- 报警严重程度 --> | |
69 | + <div style="margin-left: 10px; margin-top: 20px" | |
70 | + ><BasicForm @register="registerFormCreateAlarm" /> | |
79 | 71 | </div> |
80 | - <div style="white-space: wrap; margin-top: 25px" class="mt-4 ml-4" | |
81 | - >报警启用规则: | |
82 | - <Button | |
83 | - style="margin-left: 4px" | |
84 | - size="small" | |
85 | - type="primary" | |
86 | - @click="handleOpenEnableRule" | |
87 | - >添加</Button | |
88 | - > | |
89 | - <!-- <p>{{ enableTemplateData }}</p> --> | |
90 | - <div | |
91 | - class="mt-4 ml-4" | |
92 | - style="margin-left: 0px; position: relative; margin-top: 25px" | |
93 | - >报警详情模板: | |
94 | - <div style="position: absolute; top: -5px; left: 106px; width: 581px"> | |
95 | - <BasicForm @register="registerFormChangeDetail" /> | |
96 | - </div> | |
72 | + <!-- 报警严重程度 --> | |
73 | + | |
74 | + <div style="margin-left: 5px; margin-top: -50px"> | |
75 | + <div style="color: #f5594e" class="ml-4" | |
76 | + >报警规则条件: | |
77 | + <Button | |
78 | + style="margin-left: 4px" | |
79 | + size="small" | |
80 | + type="primary" | |
81 | + @click="handleOpenAlaramRuleConditions" | |
82 | + >添加</Button | |
83 | + > | |
84 | + | |
85 | + <template | |
86 | + v-for="(v2, index2) in getStepThreeEditStatus | |
87 | + ? getFilterStepThreeEditArr | |
88 | + : fliterTempRuleConditionTempArr" | |
89 | + :key="index2" | |
90 | + > | |
91 | + <p v-if="index2 == createIndex && !getStepThreeEditStatus" | |
92 | + >报警规则条件:{{ | |
93 | + v2.predicate.operation == 'EQUAL' | |
94 | + ? v2.key.key + '等于' + v2.predicate.value.defaultValue | |
95 | + : v2.predicate.operation == 'STARTS_WITH' | |
96 | + ? v2.key.key + '开始于' + v2.predicate.value.defaultValue | |
97 | + : v2.predicate.operation == 'ENDS_WITH' | |
98 | + ? v2.key.key + '结束于' + v2.predicate.value.defaultValue | |
99 | + : v2.predicate.operation == 'NOT_CONTAINS' | |
100 | + ? v2.key.key + '不包含' + v2.predicate.value.defaultValue | |
101 | + : v2.predicate.operation == 'NOT_EQUAL' | |
102 | + ? v2.key.key + '不等于' + v2.predicate.value.defaultValue | |
103 | + : v2.predicate.operation == 'GREATER' | |
104 | + ? v2.key.key + '大于' + v2.predicate.value.defaultValue | |
105 | + : v2.predicate.operation == 'LESS' | |
106 | + ? v2.key.key + '小于' + v2.predicate.value.defaultValue | |
107 | + : v2.predicate.operation == 'GREATER_OR_EQUAL' | |
108 | + ? v2.key.key + '大于或等于' + v2.predicate.value.defaultValue | |
109 | + : v2.key.key + '小于或等于' + v2.predicate.value.defaultValue | |
110 | + }}</p | |
111 | + > | |
112 | + <p v-if="index2 == createIndex && getStepThreeEditStatus" | |
113 | + >报警规则条件:{{ openRuleConditionComp(v2) }}</p | |
114 | + > | |
115 | + </template> | |
97 | 116 | </div> |
98 | - <div style="margin-top: 25px; position: relative"> | |
99 | - <div style="margin-left: -14px"> | |
100 | - <BasicForm @register="dashboardForm" /> | |
117 | + <div style="white-space: wrap; margin-top: 25px" class="mt-4 ml-4" | |
118 | + >报警启用规则: | |
119 | + <Button | |
120 | + style="margin-left: 4px" | |
121 | + size="small" | |
122 | + type="primary" | |
123 | + @click="handleOpenEnableRule" | |
124 | + >添加</Button | |
125 | + > | |
126 | + <template | |
127 | + v-for="(v1, index1) in getStepThreeEditStatus | |
128 | + ? getFilterStepThreeEditArr | |
129 | + : fliterTempOpenRuleTempArr" | |
130 | + :key="index1" | |
131 | + > | |
132 | + <p v-if="index1 == createIndex && !getStepThreeEditStatus" | |
133 | + >启用方式:{{ | |
134 | + v1.type == 'ANY_TIME' | |
135 | + ? '始终启用' | |
136 | + : v1.type == 'SPECIFIC_TIME' | |
137 | + ? '定时启用' | |
138 | + : '自定义启用' | |
139 | + }}</p | |
140 | + > | |
141 | + <p v-if="index1 == createIndex && getStepThreeEditStatus"> | |
142 | + 启用方式:{{ openRuleComp(v1) }} | |
143 | + </p> | |
144 | + </template> | |
145 | + <div | |
146 | + class="mt-4 ml-4" | |
147 | + style="margin-left: 0px; position: relative; margin-top: 25px" | |
148 | + >报警详情模板: | |
149 | + <div style="position: absolute; top: -5px; left: 106px; width: 581px"> | |
150 | + <BasicForm @register="registerFormChangeDetail" /> | |
151 | + </div> | |
152 | + </div> | |
153 | + <div style="margin-top: 25px; position: relative"> | |
154 | + <div style="margin-left: -14px"> | |
155 | + <BasicForm @register="dashboardForm" /> | |
156 | + </div> | |
101 | 157 | </div> |
102 | 158 | </div> |
103 | 159 | </div> |
104 | - </div> | |
105 | - <div | |
106 | - class="remove-type" | |
107 | - style="display: inline-block; position: relative; top: -257px; left: 757px" | |
108 | - > | |
109 | - <img | |
110 | - style="cursor: pointer" | |
111 | - @click="deleteCondition(index, createIndex)" | |
112 | - alt="移除" | |
113 | - src="../../../../assets/images/close.png" | |
114 | - /> | |
160 | + <div | |
161 | + class="remove-type" | |
162 | + style="display: inline-block; position: relative; top: -257px; left: 757px" | |
163 | + > | |
164 | + <img | |
165 | + style="cursor: pointer" | |
166 | + @click="deleteCondition(index, createIndex)" | |
167 | + alt="移除" | |
168 | + src="../../../../assets/images/close.png" | |
169 | + /> | |
170 | + </div> | |
115 | 171 | </div> |
116 | 172 | </div> |
117 | 173 | </div> |
... | ... | @@ -161,7 +217,40 @@ |
161 | 217 | @click="handleOpenClearAlaramRuleConditions" |
162 | 218 | >添加</Button |
163 | 219 | > |
164 | - <!-- <p>{{ ruleClearTemplateData }}</p> --> | |
220 | + | |
221 | + <template | |
222 | + v-for="(v4, index4) in getStepThreeEditStatus | |
223 | + ? getFilterStepThreeEditClearArr | |
224 | + : fliterClearTempRuleConditionTempArr" | |
225 | + :key="index4" | |
226 | + > | |
227 | + <span style="display: none">{{ index4 }}</span> | |
228 | + | |
229 | + <p v-if="!getStepThreeEditStatus" | |
230 | + >报警规则条件:{{ | |
231 | + v4.predicate.operation == 'EQUAL' | |
232 | + ? v4.key.key + '等于' + v4.predicate.value.defaultValue | |
233 | + : v4.predicate.operation == 'STARTS_WITH' | |
234 | + ? v4.key.key + '开始于' + v4.predicate.value.defaultValue | |
235 | + : v4.predicate.operation == 'ENDS_WITH' | |
236 | + ? v4.key.key + '结束于' + v4.predicate.value.defaultValue | |
237 | + : v4.predicate.operation == 'NOT_CONTAINS' | |
238 | + ? v4.key.key + '不包含' + v4.predicate.value.defaultValue | |
239 | + : v4.predicate.operation == 'NOT_EQUAL' | |
240 | + ? v4.key.key + '不等于' + v4.predicate.value.defaultValue | |
241 | + : v4.predicate.operation == 'GREATER' | |
242 | + ? v4.key.key + '大于' + v4.predicate.value.defaultValue | |
243 | + : v4.predicate.operation == 'LESS' | |
244 | + ? v4.key.key + '小于' + v4.predicate.value.defaultValue | |
245 | + : v4.predicate.operation == 'GREATER_OR_EQUAL' | |
246 | + ? v4.key.key + '大于或等于' + v4.predicate.value.defaultValue | |
247 | + : v4.key.key + '小于或等于' + v4.predicate.value.defaultValue | |
248 | + }}</p | |
249 | + > | |
250 | + <p v-if="getStepThreeEditStatus" | |
251 | + >报警规则条件:{{ openClearRuleConditionComp(v4) }}</p | |
252 | + > | |
253 | + </template> | |
165 | 254 | </div> |
166 | 255 | <div style="white-space: wrap; margin-top: 25px" class="mt-4 ml-4" |
167 | 256 | >报警启用规则: |
... | ... | @@ -172,7 +261,32 @@ |
172 | 261 | @click="handleOpenClearEnableRule" |
173 | 262 | >添加</Button |
174 | 263 | > |
175 | - <!-- <p>{{ enableClearTemplateData }}</p> --> | |
264 | + <template | |
265 | + v-for="(v3, index3) in getStepThreeEditStatus | |
266 | + ? getFilterStepThreeEditClearArr | |
267 | + : fliterClearTempOpenRuleTempArr" | |
268 | + :key="index3" | |
269 | + > | |
270 | + <span style="display: none">{{ index3 }}</span> | |
271 | + <p v-if="getStepThreeEditStatus" | |
272 | + >启用方式:{{ | |
273 | + v3?.schedule?.type == 'ANY_TIME' | |
274 | + ? '始终启用' | |
275 | + : v3?.schedule?.type == 'SPECIFIC_TIME' | |
276 | + ? '定时启用' | |
277 | + : '自定义启用' | |
278 | + }}</p | |
279 | + > | |
280 | + <p v-if="!getStepThreeEditStatus" | |
281 | + >启用方式:{{ | |
282 | + v3.type == 'ANY_TIME' | |
283 | + ? '始终启用' | |
284 | + : v3.type == 'SPECIFIC_TIME' | |
285 | + ? '定时启用' | |
286 | + : '自定义启用' | |
287 | + }}</p | |
288 | + > | |
289 | + </template> | |
176 | 290 | <div |
177 | 291 | class="mt-4 ml-4" |
178 | 292 | style="margin-left: 0px; position: relative; margin-top: 25px" |
... | ... | @@ -207,7 +321,7 @@ |
207 | 321 | </template> |
208 | 322 | |
209 | 323 | <script lang="ts"> |
210 | - import { defineComponent, ref, unref, getCurrentInstance, watch, reactive } from 'vue'; | |
324 | + import { defineComponent, ref, getCurrentInstance, watch, reactive } from 'vue'; | |
211 | 325 | import type { IProfileData } from './index.t'; |
212 | 326 | import { CollapseContainer } from '/@/components/Container/index'; |
213 | 327 | import { BasicForm, useForm } from '/@/components/Form'; |
... | ... | @@ -238,7 +352,8 @@ |
238 | 352 | Button, |
239 | 353 | }, |
240 | 354 | emits: ['prev', 'next', 'redo', 'handleFormStep3toStep4Next'], |
241 | - setup(_, { emit }) { | |
355 | + props: ['getAllStepThreeData', 'isAddOrEdit', 'isShowAddRule'], | |
356 | + setup(props, { emit }) { | |
242 | 357 | const { proxy } = getCurrentInstance(); |
243 | 358 | const changeGetDetailValue = ref({}); |
244 | 359 | const changeGetClearDetailValue = ref({}); |
... | ... | @@ -248,14 +363,10 @@ |
248 | 363 | const getChildData5 = ref(null); |
249 | 364 | const getChildData6 = ref(null); |
250 | 365 | const isRuleAlarmRuleConditions = ref(0); |
251 | - const detailObj: any = ref({}); | |
252 | - const detailClearObj: any = ref({}); | |
253 | - const ruleObj: any = ref({}); | |
254 | - const ruleLastObj: any = ref({}); | |
366 | + const ruleObj: any = ref<[]>([]); | |
367 | + const ruleLastObj: any = ref<[]>([]); | |
255 | 368 | const enableObj: any = ref({}); |
256 | 369 | const enableClearObj: any = ref({}); |
257 | - const additionalObj: any = ref({}); | |
258 | - const addClearitionalObj: any = ref({}); | |
259 | 370 | const isWhereTypeValue = ref(null); |
260 | 371 | const ruleTemplateData: any = ref(null); |
261 | 372 | const enableTemplateData: any = ref(null); |
... | ... | @@ -295,7 +406,7 @@ |
295 | 406 | ], |
296 | 407 | }); |
297 | 408 | //初始化创建条件 |
298 | - const initCreateRules = reactive({ | |
409 | + let initCreateRules = reactive({ | |
299 | 410 | id: Date.now() + Math.random() + '', |
300 | 411 | alarmType: '', |
301 | 412 | createRules: {}, |
... | ... | @@ -308,7 +419,7 @@ |
308 | 419 | const receiveRuleConditionTempArr = ref<[]>([]); |
309 | 420 | //创建条件总对象 |
310 | 421 | const createRulesObj = ref({}); |
311 | - const addCreateRulesObj = reactive({ | |
422 | + let addCreateRulesObj = reactive({ | |
312 | 423 | createRules: {}, |
313 | 424 | }); |
314 | 425 | const addChangeSeverity = ref({}); |
... | ... | @@ -316,7 +427,9 @@ |
316 | 427 | schedule: {}, |
317 | 428 | }); |
318 | 429 | let addNewRuleTem = reactive({ |
319 | - condition: {}, | |
430 | + condition: { | |
431 | + condition: {}, | |
432 | + }, | |
320 | 433 | }); |
321 | 434 | const refAlarmDetailTemplate = ref(null); |
322 | 435 | const tempDetailTempArr = ref<[]>([]); |
... | ... | @@ -325,8 +438,8 @@ |
325 | 438 | let addClearRule = reactive({}); |
326 | 439 | //总的alarms数据 |
327 | 440 | let allAlarms = ref<[]>([]); |
328 | - const getClearObj = ref({}); | |
329 | - const getAllObjTemp = ref({}); | |
441 | + let getClearObj = reactive({}); | |
442 | + let getAllObjTemp = reactive({}); | |
330 | 443 | //报警类型数据 |
331 | 444 | const alarmTypeGet = ref({}); |
332 | 445 | const propagateAndpropagateRelationTypes = reactive({ |
... | ... | @@ -340,27 +453,45 @@ |
340 | 453 | schedule: {}, |
341 | 454 | }); |
342 | 455 | let kongClearRuleConditionObj = reactive({ |
343 | - condition: {}, | |
456 | + condition: { | |
457 | + condition: {}, | |
458 | + }, | |
344 | 459 | }); |
345 | - // | |
346 | 460 | const kongDetail = ref({}); |
347 | 461 | let kongOpenRuleObj = reactive({ |
348 | 462 | schedule: {}, |
349 | 463 | }); |
350 | 464 | let kongRuleConditionObj = reactive({ |
351 | - condition: {}, | |
465 | + condition: { | |
466 | + condition: {}, | |
467 | + }, | |
352 | 468 | }); |
469 | + let fliterTempRuleConditionTempArr = ref<[]>([]); | |
470 | + let fliterTempOpenRuleTempArr = ref<[]>([]); | |
471 | + let fliterClearTempRuleConditionTempArr = ref<[]>([]); | |
472 | + let fliterClearTempOpenRuleTempArr = ref<[]>([]); | |
473 | + const getStepThreeEditStatus: any = ref(false); | |
474 | + const getStepThreeEditArr = ref<[]>([]); | |
475 | + const getFilterStepThreeEditArr = ref<[]>([]); | |
476 | + const getFilterStepThreeEditClearArr = ref<[]>([]); | |
477 | + const getFilterStepThreeClearDetailEditArr = ref<[]>([]); | |
478 | + let getIsShowAddRule = true; | |
479 | + // getIsShowAddRule.value = props.isShowAddRule; | |
480 | + // console.log(getIsShowAddRule.value); | |
481 | + setTimeout(() => { | |
482 | + getIsShowAddRule = props.isShowAddRule; | |
483 | + }, 100); | |
353 | 484 | |
354 | 485 | const log = (e) => { |
355 | 486 | console.log(e); |
356 | 487 | }; |
357 | 488 | //编辑清空操作 |
358 | 489 | const clearProfileDataFunc = () => { |
359 | - unref(profileData).splice(0, 1); | |
490 | + profileData.value.splice(0, 1); | |
360 | 491 | }; |
361 | 492 | //删除告警配置 |
362 | 493 | const deleteAlarmRule = (index: number) => { |
363 | - unref(profileData).splice(index, 1); | |
494 | + profileData.value.splice(index, 1); | |
364 | 495 | }; |
365 | 496 | // 上一步 |
366 | 497 | const prevStep = () => { |
... | ... | @@ -368,7 +499,13 @@ |
368 | 499 | }; |
369 | 500 | //添加报警规则 |
370 | 501 | const addAlarmRule = () => { |
371 | - unref(profileData).push(initProfileData); | |
502 | + profileData.value.push(initProfileData); | |
503 | + }; | |
504 | + //初始化添加一个报警规则 | |
505 | + const initAddAlarmRuleFunc = () => { | |
506 | + if (profileData.value.length === 0) { | |
507 | + profileData.value.push(initProfileData); | |
508 | + } | |
372 | 509 | }; |
373 | 510 | //TODO Mobile dashboard: |
374 | 511 | const [dashboardForm] = useForm({ |
... | ... | @@ -377,13 +514,13 @@ |
377 | 514 | showResetButton: false, |
378 | 515 | showSubmitButton: false, |
379 | 516 | }); |
380 | - // 表单部分 报警类型 | |
517 | + //报警类型 | |
381 | 518 | const [ |
382 | 519 | registerForm, |
383 | 520 | { |
384 | - setFieldsValue: setRegisterForm, | |
385 | - resetFields: resetRegisterForm, | |
386 | - getFieldsValue: validateRegisterForm, | |
521 | + setFieldsValue: setAlaramTypeValueFunc, | |
522 | + resetFields: clearAlaramTypeValueFunc, | |
523 | + getFieldsValue: validateAlaramTypeValueFunc, | |
387 | 524 | }, |
388 | 525 | ] = useForm({ |
389 | 526 | labelWidth: 120, |
... | ... | @@ -395,9 +532,9 @@ |
395 | 532 | const [ |
396 | 533 | registerFormHighSetting, |
397 | 534 | { |
398 | - setFieldsValue: setRegisterFormHighSetting, | |
399 | - resetFields: resetRegisterFormHighSetting, | |
400 | - getFieldsValue: validateRegisterFormHighSetting, | |
535 | + setFieldsValue: setTransmitAlarmFunc, | |
536 | + resetFields: clearTransmitAlarmFunc, | |
537 | + getFieldsValue: getTransmitAlarmFunc, | |
401 | 538 | }, |
402 | 539 | ] = useForm({ |
403 | 540 | labelWidth: 120, |
... | ... | @@ -459,35 +596,47 @@ |
459 | 596 | span: 24, |
460 | 597 | }, |
461 | 598 | }); |
462 | - //重置表单数据 | |
463 | - const resetRegisterFormFunc = () => { | |
464 | - resetRegisterForm(); | |
465 | - }; | |
466 | - const resetRegisterFormHighSettingmFunc = () => { | |
467 | - resetRegisterFormHighSetting(); | |
468 | - }; | |
599 | + | |
469 | 600 | const resetRegisterFormCreateAlarmFunc = () => { |
470 | 601 | resetRegisterFormCreateAlarm(); |
471 | 602 | }; |
472 | - const resetRulesFormDataFunc = () => { | |
473 | - ruleTemplateData.value = ``; | |
474 | - }; | |
475 | - const resetEnableFormDataFunc = () => { | |
476 | - enableTemplateData.value = ``; | |
477 | - }; | |
478 | - const resetTemplateFormDataFunc = () => { | |
479 | - detailTemplateData.value = ``; | |
480 | - }; | |
481 | - const resetRulesClearFormDataFunc = () => { | |
482 | - ruleClearTemplateData.value = ``; | |
603 | + //重置表单数据 | |
604 | + const clearAllRegisterFormFunc = () => { | |
605 | + setTimeout(() => { | |
606 | + clearAlaramTypeValueFunc(); | |
607 | + clearTransmitAlarmFunc(); | |
608 | + resetRegisterFormChangeDetailFunc(); | |
609 | + resetRegisterFormClearChangeDetailFunc(); | |
610 | + resetAllTemplateFunc(); | |
611 | + resetRegisterFormCreateAlarmFunc(); | |
612 | + }, 100); | |
483 | 613 | }; |
484 | - const resetEnableClearFormDataFunc = () => { | |
485 | - enableClearTemplateData.value = ``; | |
614 | + //重置报警启用规则-报警规则条件 | |
615 | + const resetAllTemplateFunc = () => { | |
616 | + fliterTempOpenRuleTempArr.value = []; | |
617 | + fliterTempRuleConditionTempArr.value = []; | |
618 | + fliterClearTempRuleConditionTempArr.value = []; | |
619 | + fliterClearTempOpenRuleTempArr.value = []; | |
620 | + allAlarms.value = []; | |
621 | + tempDetailTempArr.value = []; | |
622 | + addCreateRulesObj.createRules = {}; | |
623 | + profileData.value = []; | |
624 | + profileData.value.push(initProfileData); | |
625 | + initClearCreateRuleFunc(); | |
626 | + getFilterStepThreeEditArr.value = []; | |
627 | + getFilterStepThreeEditClearArr.value = []; | |
628 | + getStepThreeEditStatus.value = false; | |
486 | 629 | }; |
487 | - const resetTemplateClearFormDataFunc = () => { | |
488 | - detailClearTemplateData.value = ``; | |
630 | + const initClearCreateRuleFunc = () => { | |
631 | + profileData.value.forEach((f) => { | |
632 | + f.alarms = []; | |
633 | + if (f.alarms.length === 0) { | |
634 | + f.alarms.push(initCreateRules); | |
635 | + } | |
636 | + }); | |
489 | 637 | }; |
490 | - //修改详情模板 | |
638 | + | |
639 | + //重置详情模板数据 | |
491 | 640 | const resetRegisterFormChangeDetailFunc = () => { |
492 | 641 | resetRegisterFormChangeDetail(); |
493 | 642 | }; |
... | ... | @@ -496,38 +645,167 @@ |
496 | 645 | resetRegisterFormClearChangeDetail(); |
497 | 646 | }; |
498 | 647 | |
499 | - //回显表单数据 | |
500 | - const retryRegisterFormFunc = (v) => { | |
501 | - setRegisterForm(v); | |
648 | + //回显报警类型和传递报警数据 | |
649 | + const setAlaramTypeFormFunc = (v) => { | |
650 | + setAlaramTypeValueFunc(v); | |
502 | 651 | }; |
503 | - const retryRegisterFormHighSettingmFunc = (v) => { | |
504 | - setRegisterFormHighSetting(v); | |
652 | + const setTransmitAlarmFormFunc = (v) => { | |
653 | + setTransmitAlarmFunc(v); | |
505 | 654 | }; |
506 | - const retryRegisterFormCreateAlarmFunc = (v) => { | |
655 | + const setRegisterFormCreateAlarmFunc = (v) => { | |
507 | 656 | setRegisterFormCreateAlarm(v); |
508 | 657 | }; |
509 | - const retryRulesFormDataFunc = (v) => { | |
510 | - ruleTemplateData.value = v; | |
511 | - }; | |
512 | - const retryEnableFormDataFunc = (v) => { | |
513 | - enableTemplateData.value = v; | |
514 | - }; | |
515 | - const retryTemplateFormDataFunc = (v) => { | |
516 | - detailTemplateData.value = v; | |
517 | - }; | |
518 | - const retryRulesClearFormDataFunc = (v) => { | |
519 | - ruleClearTemplateData.value = v; | |
658 | + // | |
659 | + const optionsAlaram = [ | |
660 | + { | |
661 | + value: 'CRITICAL', | |
662 | + label: '危险', | |
663 | + }, | |
664 | + { | |
665 | + value: 'MAJOR', | |
666 | + label: '重要', | |
667 | + }, | |
668 | + { | |
669 | + value: 'MINOR', | |
670 | + label: '次要', | |
671 | + }, | |
672 | + { | |
673 | + value: 'WARNING', | |
674 | + label: '警告', | |
675 | + }, | |
676 | + { | |
677 | + value: 'INDETERMINATE', | |
678 | + label: '不确定', | |
679 | + }, | |
680 | + ]; | |
681 | + const openRuleComp = (v1) => { | |
682 | + let newOpenRuleComp = null; | |
683 | + optionsAlaram.forEach((f) => { | |
684 | + if ( | |
685 | + f.value === v1?.MAJOR || | |
686 | + v1?.MINOR || | |
687 | + v1?.INDETERMINATE || | |
688 | + v1?.CRITICAL || | |
689 | + v1?.WARNING | |
690 | + ) { | |
691 | + newOpenRuleComp = | |
692 | + v1?.MAJOR || | |
693 | + v1?.MINOR || | |
694 | + v1?.INDETERMINATE || | |
695 | + v1?.CRITICAL || | |
696 | + v1?.WARNING?.schedule?.type; | |
697 | + } | |
698 | + }); | |
699 | + return newOpenRuleComp?.schedule?.type == 'ANY_TIME' | |
700 | + ? '始终启用' | |
701 | + : newOpenRuleComp?.schedule?.type == 'SPECIFIC_TIME' | |
702 | + ? '定时启用' | |
703 | + : '自定义启用'; | |
520 | 704 | }; |
521 | - const retryEnableClearFormDataFunc = (v) => { | |
522 | - enableClearTemplateData.value = v; | |
705 | + const optionsOperation = [ | |
706 | + { label: '等于', value: 'EQUAL' }, | |
707 | + { label: '不等于', value: 'NOT_EQUAL' }, | |
708 | + { label: '开始于', value: 'STARTS_WITH' }, | |
709 | + { label: '结束于', value: 'ENDS_WITH' }, | |
710 | + { label: '包含', value: 'CONTAINS' }, | |
711 | + { label: '不包含', value: 'NOT_CONTAINS' }, | |
712 | + { label: '大于', value: 'GREATER' }, | |
713 | + { label: '小于', value: 'LESS' }, | |
714 | + { label: '大于或等于', value: 'GREATER_OR_EQUAL' }, | |
715 | + { label: '小于或等于', value: 'LESS_OR_EQUAL' }, | |
716 | + ]; | |
717 | + //清除报警规则 | |
718 | + const openClearRuleConditionComp = (v4) => { | |
719 | + try { | |
720 | + let clearRuleObj = {}; | |
721 | + v4.condition.condition?.forEach((f) => { | |
722 | + clearRuleObj = f; | |
723 | + }); | |
724 | + return clearRuleObj?.predicate?.operation == 'LESS_OR_EQUAL' | |
725 | + ? clearRuleObj?.key?.key + '小于或等于' + clearRuleObj?.predicate?.value?.defaultValue | |
726 | + : clearRuleObj?.predicate?.operation == 'EQUAL' | |
727 | + ? clearRuleObj?.key?.key + '等于' + clearRuleObj?.predicate?.value?.defaultValue | |
728 | + : clearRuleObj?.predicate?.operation == 'NOT_EQUAL' | |
729 | + ? clearRuleObj?.key?.key + '不等于' + clearRuleObj?.predicate?.value?.defaultValue | |
730 | + : clearRuleObj?.predicate?.operation == 'ENDS_WITH' | |
731 | + ? clearRuleObj?.key?.key + '结束于' + clearRuleObj?.predicate?.value?.defaultValue | |
732 | + : clearRuleObj?.predicate?.operation == 'CONTAINS' | |
733 | + ? clearRuleObj?.key?.key + '包含' + clearRuleObj?.predicate?.value?.defaultValue | |
734 | + : clearRuleObj?.predicate?.operation == 'GREATER' | |
735 | + ? clearRuleObj?.key?.key + '大于' + clearRuleObj?.predicate?.value?.defaultValue | |
736 | + : clearRuleObj?.predicate?.operation == 'LESS' | |
737 | + ? clearRuleObj?.key?.key + '小于' + clearRuleObj?.predicate?.value?.defaultValue | |
738 | + : clearRuleObj?.key?.key + '小于或等于' + clearRuleObj?.predicate?.value?.defaultValue; | |
739 | + } catch (e) { | |
740 | + return e; | |
741 | + } | |
523 | 742 | }; |
524 | - const retryTemplateClearFormDataFunc = (v) => { | |
525 | - detailClearTemplateData.value = v; | |
743 | + | |
744 | + const openRuleConditionComp = (v2) => { | |
745 | + try { | |
746 | + let openRuleConditObj = {}; | |
747 | + for (let i in v2) { | |
748 | + if (i == 'CRITICAL') { | |
749 | + openRuleConditObj = v2[i]; | |
750 | + } else if (i == 'MAJOR') { | |
751 | + openRuleConditObj = v2[i]; | |
752 | + } else if (i == 'MINOR') { | |
753 | + openRuleConditObj = v2[i]; | |
754 | + } else if (i == 'WARNING') { | |
755 | + openRuleConditObj = v2[i]; | |
756 | + } else if (i == 'INDETERMINATE') { | |
757 | + openRuleConditObj = v2[i]; | |
758 | + } | |
759 | + } | |
760 | + let createRuleObj = {}; | |
761 | + openRuleConditObj?.condition?.condition?.forEach((f) => { | |
762 | + createRuleObj = f; | |
763 | + }); | |
764 | + return createRuleObj?.predicate?.operation == 'LESS_OR_EQUAL' | |
765 | + ? createRuleObj?.key?.key + '小于或等于' + createRuleObj?.predicate?.value?.defaultValue | |
766 | + : createRuleObj?.predicate?.operation == 'EQUAL' | |
767 | + ? createRuleObj?.key?.key + '等于' + createRuleObj?.predicate?.value?.defaultValue | |
768 | + : createRuleObj?.predicate?.operation == 'NOT_EQUAL' | |
769 | + ? createRuleObj?.key?.key + '不等于' + createRuleObj?.predicate?.value?.defaultValue | |
770 | + : createRuleObj?.predicate?.operation == 'ENDS_WITH' | |
771 | + ? createRuleObj?.key?.key + '结束于' + createRuleObj?.predicate?.value?.defaultValue | |
772 | + : createRuleObj?.predicate?.operation == 'CONTAINS' | |
773 | + ? createRuleObj?.key?.key + '包含' + createRuleObj?.predicate?.value?.defaultValue | |
774 | + : createRuleObj?.predicate?.operation == 'GREATER' | |
775 | + ? createRuleObj?.key?.key + '大于' + createRuleObj?.predicate?.value?.defaultValue | |
776 | + : createRuleObj?.predicate?.operation == 'LESS' | |
777 | + ? createRuleObj?.key?.key + '小于' + createRuleObj?.predicate?.value?.defaultValue | |
778 | + : createRuleObj?.key?.key + | |
779 | + '小于或等于' + | |
780 | + createRuleObj?.predicate?.value?.defaultValue; | |
781 | + } catch (e) { | |
782 | + return e; | |
783 | + } | |
526 | 784 | }; |
527 | - //修改详情模板 | |
785 | + | |
786 | + //详情模板 | |
528 | 787 | const setRegisterFormChangeDetailFunc = (v) => { |
529 | - setRegisterFormChangeDetail(v); | |
788 | + if (v.isEditStatus) { | |
789 | + getFilterStepThreeEditArr.value = []; | |
790 | + getFilterStepThreeEditClearArr.value = []; | |
791 | + getStepThreeEditStatus.value = v.isEditStatus; | |
792 | + getStepThreeEditArr.value = v.stepThreeData; | |
793 | + if (getFilterStepThreeEditClearArr.value.length == 0) { | |
794 | + getFilterStepThreeEditClearArr.value.push(v.stepThreeClearData as never); | |
795 | + } | |
796 | + Object.keys(getStepThreeEditArr.value).forEach((v) => { | |
797 | + let o = {}; | |
798 | + o[v] = getStepThreeEditArr.value[v]; | |
799 | + getFilterStepThreeEditArr.value.push(o as never); | |
800 | + }); | |
801 | + console.log(getFilterStepThreeEditArr.value); | |
802 | + | |
803 | + // setRegisterFormChangeDetail({ | |
804 | + // alarmDetails: v.stepThreeData[0].createRules['MAJOR'].alarmDetails, | |
805 | + // }); | |
806 | + } | |
530 | 807 | }; |
808 | + | |
531 | 809 | //清除修改详情模板 |
532 | 810 | const setRegisterFormClearChangeDetailFunc = (v) => { |
533 | 811 | setRegisterFormClearChangeDetail(v); |
... | ... | @@ -544,23 +822,24 @@ |
544 | 822 | receiveOpenRuleTempArr.value = []; |
545 | 823 | receiveRuleConditionTempArr.value = []; |
546 | 824 | addNewOpenRule.schedule = {}; |
547 | - addNewRuleTem.condition = {}; | |
825 | + addNewRuleTem.condition.condition = {}; | |
548 | 826 | }; |
549 | 827 | |
550 | 828 | const getOpenRuleAndRuleCondition = () => { |
551 | 829 | addNewOpenRule.schedule = enableObj.value as never; |
552 | - addNewRuleTem.condition = ruleObj.value as never; | |
830 | + addNewRuleTem.condition.condition = ruleObj.value as never; | |
553 | 831 | tempOpenRuleTempArr.value.push(addNewOpenRule.schedule as never); |
554 | - tempRuleConditionTempArr.value.push(addNewRuleTem.condition as never); | |
832 | + tempRuleConditionTempArr.value.push(addNewRuleTem.condition.condition as never); | |
555 | 833 | }; |
834 | + | |
556 | 835 | const getClearOpenRuleAndRuleCondition = () => { |
557 | 836 | kongClearOpenRuleObj.schedule = enableClearObj.value as never; |
558 | - kongClearRuleConditionObj.condition = ruleLastObj.value as never; | |
837 | + kongClearRuleConditionObj.condition.condition = ruleLastObj.value as never; | |
559 | 838 | }; |
560 | 839 | |
561 | 840 | //传递报警数据 |
562 | 841 | const validateRegisterFormHighSettingFunc = () => { |
563 | - const val = validateRegisterFormHighSetting(); | |
842 | + const val = getTransmitAlarmFunc(); | |
564 | 843 | propagateAndpropagateRelationTypes.propagate = val.propagate; |
565 | 844 | propagateAndpropagateRelationTypes.propagateRelationTypes.push( |
566 | 845 | val.propagateRelationTypes as never |
... | ... | @@ -568,7 +847,7 @@ |
568 | 847 | }; |
569 | 848 | //报警类型数据 |
570 | 849 | const validateRegisterFormFunc = () => { |
571 | - const val1 = validateRegisterForm(); | |
850 | + const val1 = validateAlaramTypeValueFunc(); | |
572 | 851 | alarmTypeGet.value = val1; |
573 | 852 | }; |
574 | 853 | |
... | ... | @@ -576,7 +855,6 @@ |
576 | 855 | const addCreateRuleFunc = async () => { |
577 | 856 | getRegisterFormChangeDetailFunc(); |
578 | 857 | tempDetailTempArr.value.push(changeGetDetailValue.value as never); |
579 | - console.log(tempDetailTempArr.value); | |
580 | 858 | tempDetailTempArr.value.forEach((f1) => { |
581 | 859 | kongDetail.value = f1; |
582 | 860 | }); |
... | ... | @@ -589,10 +867,10 @@ |
589 | 867 | }); |
590 | 868 | |
591 | 869 | tempRuleConditionTempArr.value.forEach((f3) => { |
592 | - kongRuleConditionObj.condition = f3; | |
870 | + kongRuleConditionObj.condition.condition = f3; | |
593 | 871 | }); |
594 | 872 | |
595 | - createRulesObj.value[addChangeSeverity.value.default] = { | |
873 | + createRulesObj.value[addChangeSeverity.value?.default] = { | |
596 | 874 | ...kongDetail.value, |
597 | 875 | ...addNewOpenRule, |
598 | 876 | ...addNewRuleTem, |
... | ... | @@ -600,6 +878,7 @@ |
600 | 878 | ...kongRuleConditionObj, |
601 | 879 | }; |
602 | 880 | addCreateRulesObj.createRules = createRulesObj.value; |
881 | + initCreateRules.createRules = addCreateRulesObj; | |
603 | 882 | }; |
604 | 883 | |
605 | 884 | //清除报警规则 |
... | ... | @@ -612,292 +891,58 @@ |
612 | 891 | ...changeGetClearDetailValue.value, |
613 | 892 | }; |
614 | 893 | clearObj.clearRule = { ...addClearRule }; |
615 | - getClearObj.value = clearObj; | |
894 | + getClearObj = clearObj; | |
616 | 895 | }; |
617 | 896 | |
618 | 897 | // 添加创建条件 |
619 | 898 | const addCreateRole = async (index: number) => { |
620 | - unref(profileData)[index]?.alarms.push(initCreateRules); | |
899 | + profileData.value[index]?.alarms.push(initCreateRules); | |
621 | 900 | addCreateRuleFunc(); |
622 | 901 | }; |
623 | - // 删除‘创建条件’ | |
902 | + // 删除创建条件 | |
624 | 903 | const deleteCondition = (index: number, createIndex: number) => { |
625 | - unref(profileData)[index].alarms.splice(createIndex, 1); | |
904 | + profileData.value[index].alarms.splice(createIndex, 1); | |
626 | 905 | }; |
906 | + | |
627 | 907 | watch(isWhereType, (nV) => { |
628 | 908 | isWhereTypeValue.value = nV; |
629 | 909 | if (isWhereTypeValue.value == nV) { |
630 | 910 | isWhereTypeValueDisabled.value = true; |
631 | - } else { | |
632 | - // isWhereTypeValueDisabled.value = false; | |
633 | 911 | } |
634 | 912 | }); |
635 | 913 | |
636 | - //详情模板 | |
637 | - const getAllFieldsFunc = (v) => { | |
638 | - detailObj.value = v; | |
639 | - detailTemplateData.value = ` | |
640 | - 报警详细信息:${v.alarmDetails} | |
641 | - `; | |
642 | - }; | |
914 | + //报警规则 | |
643 | 915 | //启用规则 |
644 | 916 | const getAllFieldsEnabFunc = (v) => { |
645 | 917 | enableObj.value = v; |
646 | - const findDay = [ | |
647 | - { | |
648 | - label: '星期一', | |
649 | - value: '1', | |
650 | - }, | |
651 | - { | |
652 | - label: '星期二', | |
653 | - value: '2', | |
654 | - }, | |
655 | - { | |
656 | - label: '星期三', | |
657 | - value: '3', | |
658 | - }, | |
659 | - { | |
660 | - label: '星期四', | |
661 | - value: '4', | |
662 | - }, | |
663 | - { | |
664 | - label: '星期五', | |
665 | - value: '5', | |
666 | - }, | |
667 | - { | |
668 | - label: '星期六', | |
669 | - value: '6', | |
670 | - }, | |
671 | - { | |
672 | - label: '星期七', | |
673 | - value: '7', | |
674 | - }, | |
675 | - ]; | |
676 | - const findDayByValue = findDay.map((f, i) => { | |
677 | - try { | |
678 | - if (f.value == v.daysOfWeek[i]) { | |
679 | - return f.label; | |
680 | - } | |
681 | - } catch (e) { | |
682 | - return e; | |
683 | - } | |
684 | - }); | |
685 | - const findDayCustomByValue = findDay.map((f, i) => { | |
686 | - try { | |
687 | - if (f.value == v.daysOfWeek1[i]) { | |
688 | - return f.label; | |
689 | - } | |
690 | - } catch (e) { | |
691 | - return e; | |
692 | - } | |
693 | - }); | |
694 | - enableTemplateData.value = | |
695 | - v.schedule == 'ANY_TIME' | |
696 | - ? `始终启用` | |
697 | - : v.schedule == 'SPECIFIC_TIME' | |
698 | - ? ` | |
699 | - 开始时间:${v.startsOn},结束时间:${v.endsOn},天数:${findDayByValue} | |
700 | - ` | |
701 | - : `天数:${findDayCustomByValue},开始时间: ${v.startsOn1},结束时间:${v.endsOn1}`; | |
918 | + fliterTempOpenRuleTempArr.value.push(v as never); | |
702 | 919 | }; |
703 | 920 | //规则条件 |
704 | 921 | const getAllFieldsRuleFunc = (v) => { |
705 | 922 | ruleObj.value = v; |
706 | - console.log(v); | |
707 | - const findDay = [ | |
708 | - { label: '等于', value: 'EQUAL' }, | |
709 | - { label: '不等于', value: 'NOT_EQUAL' }, | |
710 | - { label: '开始于', value: 'STARTS_WITH' }, | |
711 | - { label: '结束于', value: 'ENDS_WITH' }, | |
712 | - { label: '包含', value: 'CONTAINS' }, | |
713 | - { label: '不包含', value: 'NOT_CONTAINS' }, | |
714 | - { label: '等于', value: 'EQUAL' }, | |
715 | - { label: '不等于', value: 'NOT_EQUAL' }, | |
716 | - { label: '大于', value: 'GREATER' }, | |
717 | - { label: '小于', value: 'LESS' }, | |
718 | - { label: '大于或等于', value: 'GREATER_OR_EQUAL' }, | |
719 | - { label: '小于或等于', value: 'LESS_OR_EQUAL' }, | |
720 | - ]; | |
721 | - const findRuleByValue = findDay.find((f) => { | |
722 | - if (f.value == v.operation) { | |
723 | - return f.label; | |
724 | - } | |
923 | + let splitRuleObj = {}; | |
924 | + ruleObj.value.forEach((f) => { | |
925 | + splitRuleObj = f; | |
725 | 926 | }); |
726 | - ruleTemplateData.value = ` | |
727 | - 键名:${v.key1} 操作:${findRuleByValue?.label} 值:${v.value1} | |
728 | - `; | |
729 | - | |
730 | - // ruleLastObj.value = v1; | |
731 | - const predicate = { | |
732 | - operation: ruleObj.value.operation, | |
733 | - value: { | |
734 | - defaultValue: Number(ruleObj.value.value1), | |
735 | - }, | |
736 | - type: ruleObj.value.type1, | |
737 | - }; | |
738 | - const spec1 = { | |
739 | - type: ruleLastObj.value.conditionType, | |
740 | - // unit: ruleLastObj.value.unit, | |
741 | - // predicate: { | |
742 | - // defaultValue: Number(ruleLastObj.value.defaultValue), | |
743 | - // dynamicValue: { | |
744 | - // sourceType: ruleLastObj.value.sourceType, | |
745 | - // sourceAttribute: ruleLastObj.value.sourceAttribute, | |
746 | - // inherit: ruleLastObj.value.inherit, | |
747 | - // }, | |
748 | - // }, | |
749 | - }; | |
750 | - const getCondition = { | |
751 | - condition: [ | |
752 | - { | |
753 | - key: { | |
754 | - type: ruleObj.value?.type, | |
755 | - key: ruleObj.value?.key1, | |
756 | - }, | |
757 | - valueType: ruleObj.value.type1, | |
758 | - predicate, | |
759 | - }, | |
760 | - ], | |
761 | - spec: spec1, | |
762 | - }; | |
763 | - const getValueConditon = { | |
764 | - condition: getCondition, | |
765 | - }; | |
766 | - Object.assign(additionalObj.value, getValueConditon); | |
767 | - }; | |
768 | - //清除条件 | |
769 | - //详情模板 | |
770 | - const getAllClearFieldsFunc = (v) => { | |
771 | - detailClearObj.value = v; | |
772 | - detailClearTemplateData.value = ` | |
773 | - 报警详细信息:${v.alarmDetails} | |
774 | - `; | |
927 | + fliterTempRuleConditionTempArr.value.push(splitRuleObj as never); | |
775 | 928 | }; |
929 | + //清除报警规则 | |
776 | 930 | //启用规则 |
777 | 931 | const getAllClearFieldsEnabFunc = (v) => { |
778 | 932 | enableClearObj.value = v; |
779 | - const findDay = [ | |
780 | - { | |
781 | - label: '星期一', | |
782 | - value: '1', | |
783 | - }, | |
784 | - { | |
785 | - label: '星期二', | |
786 | - value: '2', | |
787 | - }, | |
788 | - { | |
789 | - label: '星期三', | |
790 | - value: '3', | |
791 | - }, | |
792 | - { | |
793 | - label: '星期四', | |
794 | - value: '4', | |
795 | - }, | |
796 | - { | |
797 | - label: '星期五', | |
798 | - value: '5', | |
799 | - }, | |
800 | - { | |
801 | - label: '星期六', | |
802 | - value: '6', | |
803 | - }, | |
804 | - { | |
805 | - label: '星期七', | |
806 | - value: '7', | |
807 | - }, | |
808 | - ]; | |
809 | - const findDayByValue = findDay.map((f, i) => { | |
810 | - try { | |
811 | - if (f.value == v.daysOfWeek[i]) { | |
812 | - return f.label; | |
813 | - } | |
814 | - } catch (e) { | |
815 | - return e; | |
816 | - } | |
817 | - }); | |
818 | - const findDayCustomByValue = findDay.map((f, i) => { | |
819 | - try { | |
820 | - if (f.value == v.daysOfWeek1[i]) { | |
821 | - return f.label; | |
822 | - } | |
823 | - } catch (e) { | |
824 | - return e; | |
825 | - } | |
826 | - }); | |
827 | - enableClearTemplateData.value = | |
828 | - v.schedule == 'ANY_TIME' | |
829 | - ? `始终启用` | |
830 | - : v.schedule == 'SPECIFIC_TIME' | |
831 | - ? ` | |
832 | - 开始时间:${v.startsOn},结束时间:${v.endsOn},天数:${findDayByValue} | |
833 | - ` | |
834 | - : `天数:${findDayCustomByValue},开始时间: ${v.startsOn1},结束时间:${v.endsOn1}`; | |
933 | + fliterClearTempOpenRuleTempArr.value.push(v as never); | |
835 | 934 | }; |
836 | 935 | //规则条件 |
837 | 936 | const getAllClearFieldsRuleFunc = (v) => { |
838 | 937 | ruleLastObj.value = v; |
839 | - console.log(v); | |
840 | - | |
841 | - const findDay = [ | |
842 | - { label: '等于', value: 'EQUAL' }, | |
843 | - { label: '不等于', value: 'NOT_EQUAL' }, | |
844 | - { label: '开始于', value: 'STARTS_WITH' }, | |
845 | - { label: '结束于', value: 'ENDS_WITH' }, | |
846 | - { label: '包含', value: 'CONTAINS' }, | |
847 | - { label: '不包含', value: 'NOT_CONTAINS' }, | |
848 | - { label: '等于', value: 'EQUAL' }, | |
849 | - { label: '不等于', value: 'NOT_EQUAL' }, | |
850 | - { label: '大于', value: 'GREATER' }, | |
851 | - { label: '小于', value: 'LESS' }, | |
852 | - { label: '大于或等于', value: 'GREATER_OR_EQUAL' }, | |
853 | - { label: '小于或等于', value: 'LESS_OR_EQUAL' }, | |
854 | - ]; | |
855 | - const findRuleByValue = findDay.find((f) => { | |
856 | - if (f.value == v.operation) { | |
857 | - return f.label; | |
858 | - } | |
938 | + let splitRuleObj = {}; | |
939 | + ruleLastObj.value.forEach((f) => { | |
940 | + splitRuleObj = f; | |
859 | 941 | }); |
860 | - ruleClearTemplateData.value = ` | |
861 | - 键名:${v.key1} 操作:${findRuleByValue?.label} 值:${v.value1} | |
862 | - `; | |
863 | - | |
864 | - // ruleLastObj.value = v1; | |
865 | - const predicate = { | |
866 | - operation: ruleObj.value.operation, | |
867 | - value: { | |
868 | - defaultValue: Number(ruleObj.value.value1), | |
869 | - }, | |
870 | - type: ruleObj.value.type1, | |
871 | - }; | |
872 | - const spec1 = { | |
873 | - type: ruleLastObj.value.conditionType, | |
874 | - // unit: ruleLastObj.value.unit, | |
875 | - // predicate: { | |
876 | - // defaultValue: Number(ruleLastObj.value.defaultValue), | |
877 | - // dynamicValue: { | |
878 | - // sourceType: ruleLastObj.value.sourceType, | |
879 | - // sourceAttribute: ruleLastObj.value.sourceAttribute, | |
880 | - // inherit: ruleLastObj.value.inherit, | |
881 | - // }, | |
882 | - // }, | |
883 | - }; | |
884 | - const getCondition = { | |
885 | - condition: [ | |
886 | - { | |
887 | - key: { | |
888 | - type: ruleObj.value?.type, | |
889 | - key: ruleObj.value?.key1, | |
890 | - }, | |
891 | - valueType: ruleObj.value.type1, | |
892 | - predicate, | |
893 | - }, | |
894 | - ], | |
895 | - spec: spec1, | |
896 | - }; | |
897 | - const getValueConditon = { | |
898 | - condition: getCondition, | |
899 | - }; | |
900 | - Object.assign(addClearitionalObj.value, getValueConditon); | |
942 | + fliterClearTempRuleConditionTempArr.value.push(splitRuleObj as never); | |
943 | + // if (fliterClearTempRuleConditionTempArr.value.length == 0) { | |
944 | + // fliterClearTempRuleConditionTempArr.value = ruleLastObj.value; | |
945 | + // } | |
901 | 946 | }; |
902 | 947 | |
903 | 948 | //生成uuid |
... | ... | @@ -913,7 +958,7 @@ |
913 | 958 | }); |
914 | 959 | return uuid; |
915 | 960 | } |
916 | - const handleFormStep3toStep4Next = async () => { | |
961 | + const handleFormStep3toStep4Next = () => { | |
917 | 962 | try { |
918 | 963 | validateRegisterFormFunc(); |
919 | 964 | validateRegisterFormHighSettingFunc(); |
... | ... | @@ -923,19 +968,20 @@ |
923 | 968 | getRegisterFormChangeDetailFunc(); |
924 | 969 | addCreateRuleFunc(); |
925 | 970 | addClearAlaramRule(); |
926 | - console.log(addCreateRulesObj); | |
927 | - console.log(getClearObj.value); | |
928 | 971 | |
929 | - getAllObjTemp.value = { | |
930 | - ...addCreateRulesObj, | |
931 | - ...getClearObj.value, | |
932 | - ...objectId, | |
972 | + getAllObjTemp = { | |
933 | 973 | ...alarmTypeGet.value, |
934 | 974 | ...propagateAndpropagateRelationTypes, |
975 | + ...objectId, | |
935 | 976 | }; |
936 | - allAlarms.value.push(getAllObjTemp.value as never); | |
977 | + setTimeout(() => { | |
978 | + Object.assign(getAllObjTemp, addCreateRulesObj, getClearObj); | |
979 | + }, 10); | |
980 | + allAlarms.value.push(getAllObjTemp as never); | |
937 | 981 | emit('next', allAlarms.value); |
938 | - } catch (error) {} | |
982 | + } catch (e) { | |
983 | + return e; | |
984 | + } | |
939 | 985 | }; |
940 | 986 | |
941 | 987 | const [registerModal1, { openModal: openModal1 }] = useModal(); |
... | ... | @@ -954,6 +1000,9 @@ |
954 | 1000 | }, 50); |
955 | 1001 | }; |
956 | 1002 | const handleOpenEnableRule = () => { |
1003 | + // if (getStepThreeEditStatus.value == true) { | |
1004 | + // getStepThreeEditStatus.value = !getStepThreeEditStatus.value; | |
1005 | + // } | |
957 | 1006 | isRuleAlarmRuleConditions.value = 2; |
958 | 1007 | setTimeout(() => { |
959 | 1008 | openModal2(true); |
... | ... | @@ -993,7 +1042,7 @@ |
993 | 1042 | setTimeout(() => { |
994 | 1043 | openModal5(true); |
995 | 1044 | setTimeout(() => { |
996 | - proxy.$refs.getChildData2.resetDataFunc(); | |
1045 | + // proxy.$refs.getChildData2.resetDataFunc(); | |
997 | 1046 | }, 1000); |
998 | 1047 | }, 50); |
999 | 1048 | }; |
... | ... | @@ -1002,40 +1051,44 @@ |
1002 | 1051 | setTimeout(() => { |
1003 | 1052 | openModal6(true); |
1004 | 1053 | setTimeout(() => { |
1005 | - proxy.$refs.getChildData3.resetDataFunc(); | |
1054 | + // proxy.$refs.getChildData3.resetDataFunc(); | |
1006 | 1055 | }, 1000); |
1007 | 1056 | }, 50); |
1008 | 1057 | }; |
1009 | 1058 | |
1010 | 1059 | return { |
1060 | + getFilterStepThreeClearDetailEditArr, | |
1061 | + getIsShowAddRule, | |
1062 | + openRuleConditionComp, | |
1063 | + openClearRuleConditionComp, | |
1064 | + getFilterStepThreeEditClearArr, | |
1065 | + openRuleComp, | |
1066 | + getFilterStepThreeEditArr, | |
1067 | + getStepThreeEditStatus, | |
1068 | + getStepThreeEditArr, | |
1069 | + setRegisterFormCreateAlarmFunc, | |
1070 | + resetRegisterFormCreateAlarmFunc, | |
1071 | + initClearCreateRuleFunc, | |
1072 | + fliterTempOpenRuleTempArr, | |
1073 | + fliterTempRuleConditionTempArr, | |
1074 | + fliterClearTempOpenRuleTempArr, | |
1075 | + fliterClearTempRuleConditionTempArr, | |
1076 | + tempRuleConditionTempArr, | |
1077 | + tempOpenRuleTempArr, | |
1078 | + kongOpenRuleObj, | |
1079 | + allAlarms, | |
1080 | + initAddAlarmRuleFunc, | |
1011 | 1081 | getChildData5, |
1012 | 1082 | getChildData6, |
1013 | 1083 | refAlarmDetailTemplate, |
1014 | - resetRegisterFormChangeDetailFunc, | |
1015 | - resetRegisterFormClearChangeDetailFunc, | |
1016 | 1084 | setRegisterFormClearChangeDetailFunc, |
1017 | 1085 | setRegisterFormChangeDetailFunc, |
1018 | 1086 | registerFormChangeClearDetail, |
1019 | 1087 | registerFormChangeDetail, |
1020 | - resetEnableClearFormDataFunc, | |
1021 | - resetTemplateClearFormDataFunc, | |
1022 | - resetRulesClearFormDataFunc, | |
1023 | - resetEnableFormDataFunc, | |
1024 | - resetTemplateFormDataFunc, | |
1025 | - resetRulesFormDataFunc, | |
1026 | - retryEnableClearFormDataFunc, | |
1027 | - retryTemplateClearFormDataFunc, | |
1028 | - retryRulesClearFormDataFunc, | |
1029 | - retryEnableFormDataFunc, | |
1030 | - retryTemplateFormDataFunc, | |
1031 | - retryRulesFormDataFunc, | |
1032 | 1088 | clearProfileDataFunc, |
1033 | - retryRegisterFormFunc, | |
1034 | - retryRegisterFormHighSettingmFunc, | |
1035 | - retryRegisterFormCreateAlarmFunc, | |
1036 | - resetRegisterFormFunc, | |
1037 | - resetRegisterFormHighSettingmFunc, | |
1038 | - resetRegisterFormCreateAlarmFunc, | |
1089 | + setAlaramTypeFormFunc, | |
1090 | + setTransmitAlarmFormFunc, | |
1091 | + clearAllRegisterFormFunc, | |
1039 | 1092 | ruleClearTemplateData, |
1040 | 1093 | enableClearTemplateData, |
1041 | 1094 | detailClearTemplateData, |
... | ... | @@ -1048,10 +1101,8 @@ |
1048 | 1101 | dashboardForm, |
1049 | 1102 | getAllClearFieldsRuleFunc, |
1050 | 1103 | getAllClearFieldsEnabFunc, |
1051 | - getAllClearFieldsFunc, | |
1052 | 1104 | getAllFieldsRuleFunc, |
1053 | 1105 | getAllFieldsEnabFunc, |
1054 | - getAllFieldsFunc, | |
1055 | 1106 | getChildData1, |
1056 | 1107 | getChildData2, |
1057 | 1108 | getChildData3, | ... | ... |
1 | 1 | <template> |
2 | 2 | <div class="step-4"> |
3 | - <!-- <span>请选择告警通知联系人:</span> --> | |
4 | - <!-- <Tag v-for="(item, index) in 15" closable :key="index"> 冯涛+{{ item }}</Tag> --> | |
5 | 3 | <BasicForm :showSubmitButton="false" @register="register" /> |
6 | 4 | </div> |
7 | 5 | </template> |
8 | 6 | <script lang="ts"> |
9 | 7 | import { defineComponent, ref } from 'vue'; |
10 | - // import { Tag } from 'ant-design-vue'; | |
11 | 8 | import { BasicForm, useForm } from '/@/components/Form/index'; |
12 | 9 | import { alertContactsSchemas } from '../cpns/config'; |
13 | 10 | |
... | ... | @@ -28,11 +25,11 @@ |
28 | 25 | }, |
29 | 26 | resetFunc: customResetFunc, |
30 | 27 | }); |
31 | - const resetFieldsFunc = (v) => { | |
28 | + const setAlaramContactAndNoticeMethodFunc = (v) => { | |
32 | 29 | setFieldsValue(v); |
33 | 30 | }; |
34 | - const customResetAndFunc = () => { | |
35 | - resetFields(); | |
31 | + const clearAlaramContactAndNoticeMethodFunc = async () => { | |
32 | + await resetFields(); | |
36 | 33 | }; |
37 | 34 | async function customResetFunc() { |
38 | 35 | emit('prev'); |
... | ... | @@ -44,8 +41,8 @@ |
44 | 41 | return getV; |
45 | 42 | }; |
46 | 43 | return { |
47 | - customResetAndFunc, | |
48 | - resetFieldsFunc, | |
44 | + clearAlaramContactAndNoticeMethodFunc, | |
45 | + setAlaramContactAndNoticeMethodFunc, | |
49 | 46 | customResetFunc, |
50 | 47 | getAllFields, |
51 | 48 | register, | ... | ... |
src/views/device/profile/step/cpns/1 copy.json
deleted
100644 → 0
1 | -{ | |
2 | - "name": "1", | |
3 | - "defaultRuleChainId": "de8bf640-8892-11ec-ac19-e398562c8b61", | |
4 | - "defaultQueueName": "HighPriority", | |
5 | - "description": "1", | |
6 | - "icon": "", | |
7 | - "transportType": "DEFAULT", | |
8 | - "profileData": { | |
9 | - "alarms": [ | |
10 | - { | |
11 | - "createRules": { | |
12 | - "MAJOR": { | |
13 | - "alarmDetails": "1", | |
14 | - "schedule": { | |
15 | - "type": "ANY_TIME", | |
16 | - "timezone": "Asia/Shanghai (UTC+08:00)" | |
17 | - }, | |
18 | - "condition": { | |
19 | - "type": "TIME_SERIES", | |
20 | - "key1": "1", | |
21 | - "type1": "NUMERIC", | |
22 | - "operation": "GREATER_OR_EQUAL", | |
23 | - "value1": "1", | |
24 | - "id": 3 | |
25 | - } | |
26 | - }, | |
27 | - "MINOR": { | |
28 | - "alarmDetails": "2", | |
29 | - "schedule": { | |
30 | - "type": "ANY_TIME", | |
31 | - "timezone": "Asia/Shanghai (UTC+08:00)" | |
32 | - }, | |
33 | - "condition": { | |
34 | - "type": "TIME_SERIES", | |
35 | - "key1": "2", | |
36 | - "type1": "NUMERIC", | |
37 | - "operation": "GREATER", | |
38 | - "value1": "2", | |
39 | - "id": 2 | |
40 | - } | |
41 | - } | |
42 | - }, | |
43 | - "clearRule": { | |
44 | - "schedule": { | |
45 | - "type": "ANY_TIME", | |
46 | - "timezone": "Asia/Shanghai (UTC+08:00)" | |
47 | - }, | |
48 | - "condition": { | |
49 | - "type": "TIME_SERIES", | |
50 | - "key1": "3", | |
51 | - "type1": "NUMERIC", | |
52 | - "operation": "LESS_OR_EQUAL", | |
53 | - "value1": "3", | |
54 | - "id": 2 | |
55 | - }, | |
56 | - "alarmDetails": "3" | |
57 | - }, | |
58 | - "id": "a5043fdc-2ad0-4d7c-8a29-fa7e8e18fe8d", | |
59 | - "alarmType": "0", | |
60 | - "propagate": true, | |
61 | - "propagateRelationTypes": ["0"] | |
62 | - } | |
63 | - ] | |
64 | - }, | |
65 | - "alarmProfile": { | |
66 | - "alarmContactId": ["224a312c-4f52-41ef-9dce-2aac69ec2e85"], | |
67 | - "messageMode": ["PHONE_MESSAGE", "EMAIL_MESSAGE"] | |
68 | - } | |
69 | -} |
... | ... | @@ -68,19 +68,6 @@ export const formSchema: FormSchema[] = [ |
68 | 68 | maxLength: 255, |
69 | 69 | placeholder: '请输入键名', |
70 | 70 | }, |
71 | - dynamicRules: () => { | |
72 | - return [ | |
73 | - { | |
74 | - required: false, | |
75 | - validator: (_, value) => { | |
76 | - if (String(value).length > 255) { | |
77 | - return Promise.reject('字数不超过255个字'); | |
78 | - } | |
79 | - return Promise.resolve(); | |
80 | - }, | |
81 | - }, | |
82 | - ]; | |
83 | - }, | |
84 | 71 | |
85 | 72 | ifShow: ({ values }) => isShiDu(Reflect.get(values, 'type')), |
86 | 73 | }, |
... | ... | @@ -93,19 +80,7 @@ export const formSchema: FormSchema[] = [ |
93 | 80 | maxLength: 255, |
94 | 81 | placeholder: '请输入键名', |
95 | 82 | }, |
96 | - dynamicRules: () => { | |
97 | - return [ | |
98 | - { | |
99 | - required: false, | |
100 | - validator: (_, value) => { | |
101 | - if (String(value).length > 255) { | |
102 | - return Promise.reject('字数不超过255个字'); | |
103 | - } | |
104 | - return Promise.resolve(); | |
105 | - }, | |
106 | - }, | |
107 | - ]; | |
108 | - }, | |
83 | + | |
109 | 84 | ifShow: ({ values }) => isWenDu(Reflect.get(values, 'type')), |
110 | 85 | }, |
111 | 86 | { |
... | ... | @@ -117,19 +92,7 @@ export const formSchema: FormSchema[] = [ |
117 | 92 | maxLength: 255, |
118 | 93 | placeholder: '请输入键名', |
119 | 94 | }, |
120 | - dynamicRules: () => { | |
121 | - return [ | |
122 | - { | |
123 | - required: false, | |
124 | - validator: (_, value) => { | |
125 | - if (String(value).length > 255) { | |
126 | - return Promise.reject('字数不超过255个字'); | |
127 | - } | |
128 | - return Promise.resolve(); | |
129 | - }, | |
130 | - }, | |
131 | - ]; | |
132 | - }, | |
95 | + | |
133 | 96 | ifShow: ({ values }) => isTimeAll(Reflect.get(values, 'type')), |
134 | 97 | }, |
135 | 98 | { |
... | ... | @@ -215,7 +178,7 @@ export const formSchema: FormSchema[] = [ |
215 | 178 | component: 'Input', |
216 | 179 | componentProps: { |
217 | 180 | maxLength: 16, |
218 | - placeholder: '请输入默认值(数字)', | |
181 | + placeholder: '请输入值(数字)', | |
219 | 182 | }, |
220 | 183 | dynamicRules: () => { |
221 | 184 | return [ | ... | ... |
... | ... | @@ -48,6 +48,8 @@ |
48 | 48 | const isUpdate = ref(true); |
49 | 49 | const getValue: any = ref(null); |
50 | 50 | const setId: any = ref(1); |
51 | + const getKeyAndValArr = ref<[]>([]); | |
52 | + | |
51 | 53 | const getTitle = computed(() => (!unref(isUpdate) ? '新增键名筛选器' : '编辑键名筛选器')); |
52 | 54 | const [registerForm, { getFieldsValue, setFieldsValue, resetFields }] = useForm({ |
53 | 55 | labelWidth: 120, |
... | ... | @@ -100,18 +102,56 @@ |
100 | 102 | }); |
101 | 103 | |
102 | 104 | const handleSubmit = () => { |
105 | + let mapGetKeyAndValArr = []; | |
103 | 106 | if (!unref(isUpdate)) { |
104 | 107 | getValue.value = getFieldsValue(); |
108 | + getKeyAndValArr.value.push(getValue.value); | |
109 | + mapGetKeyAndValArr = getKeyAndValArr.value.map((m) => { | |
110 | + return { | |
111 | + key: { | |
112 | + type: m.type, | |
113 | + key: m.key1, | |
114 | + }, | |
115 | + valueType: m.type1, | |
116 | + value: m.value1, | |
117 | + predicate: { | |
118 | + type: m.type1, | |
119 | + operation: m.operation, | |
120 | + value: { | |
121 | + defaultValue: m.value1, | |
122 | + }, | |
123 | + }, | |
124 | + }; | |
125 | + }); | |
126 | + | |
105 | 127 | setId.value += 1; |
106 | 128 | getValue.value.id = setId.value; |
107 | 129 | // emit('success', getValue.value); |
108 | 130 | // closeModal(); |
109 | 131 | } else { |
110 | 132 | getValue.value = getFieldsValue(); |
133 | + getKeyAndValArr.value.push(getValue.value); | |
134 | + mapGetKeyAndValArr = getKeyAndValArr.value.map((m) => { | |
135 | + return { | |
136 | + key: { | |
137 | + type: m.type, | |
138 | + key: m.value1, | |
139 | + }, | |
140 | + valueType: m.type1, | |
141 | + value: m.value1, | |
142 | + predicate: { | |
143 | + type: m.type1, | |
144 | + operation: m.operation, | |
145 | + value: { | |
146 | + defaultValue: m.value1, | |
147 | + }, | |
148 | + }, | |
149 | + }; | |
150 | + }); | |
111 | 151 | setId.value += 9999; |
112 | 152 | getValue.value.id = setId.value; |
113 | 153 | } |
114 | - emit('success', getValue.value); | |
154 | + emit('success', mapGetKeyAndValArr, getValue.value); | |
115 | 155 | closeModal(); |
116 | 156 | }; |
117 | 157 | const handleCancel = () => { | ... | ... |
... | ... | @@ -114,6 +114,7 @@ |
114 | 114 | }, |
115 | 115 | emits: ['success', 'register', 'getAllFieldsRule', 'getLastAllFieldsRule'], |
116 | 116 | setup(_, { emit }) { |
117 | + let getKeyAndValueChildData = ref<[]>([]); | |
117 | 118 | const getTableApiData: any = ref([]); |
118 | 119 | const newFilterArray: any = ref([]); |
119 | 120 | const newFilterViewArray: any = ref([]); |
... | ... | @@ -155,7 +156,7 @@ |
155 | 156 | detailData.value.push(addOrUpdateData.value); |
156 | 157 | } |
157 | 158 | lastValues.value = getFieldsValue(); |
158 | - emit('getAllFieldsRule', receiveData.value, lastValues.value); | |
159 | + emit('getAllFieldsRule', getKeyAndValueChildData.value, lastValues.value); | |
159 | 160 | closeModal(); |
160 | 161 | }; |
161 | 162 | const resetDataFunc = () => { |
... | ... | @@ -188,8 +189,9 @@ |
188 | 189 | detailData.value = newFilterKeyViewArray.value; |
189 | 190 | reload(); |
190 | 191 | }; |
191 | - const handleSuccess = (v) => { | |
192 | - receiveData.value = v; | |
192 | + const handleSuccess = (v, v1) => { | |
193 | + getKeyAndValueChildData.value = v; | |
194 | + receiveData.value = v1; | |
193 | 195 | getTableApiData.value.push(receiveData.value); |
194 | 196 | detailData.value.push(receiveData.value); |
195 | 197 | setFunc(getTableApiData.value); | ... | ... |
src/views/device/profile/types/index.ts
deleted
100644 → 0
1 | -interface IConfiguration { | |
2 | - type?: string; | |
3 | -} | |
4 | -interface ITansportConfiguration { | |
5 | - type?: string; | |
6 | -} | |
7 | -interface provisionConfigurationD { | |
8 | - provisionDeviceSecret?: string; | |
9 | -} | |
10 | -type ICreateRule = {}; | |
11 | -type IClearRule = { | |
12 | - id: string; | |
13 | - alarmDetails: string; | |
14 | - dashboardId: { | |
15 | - id: string; | |
16 | - entityType: string; | |
17 | - }; | |
18 | - propagate: string; | |
19 | - propagateRelationTypes: string[]; | |
20 | - schedule: { | |
21 | - type: string; | |
22 | - }; | |
23 | - condition: object; | |
24 | -}; | |
25 | -interface IAlarms { | |
26 | - id: string; | |
27 | - alarmType: string; | |
28 | - createRules: ICreateRule; | |
29 | - // clearRule?: IClearRule[]; | |
30 | - propagate: boolean; | |
31 | - propagateRelationTypes: string[]; | |
32 | -} | |
33 | - | |
34 | -export interface IProfileData { | |
35 | - configuration?: IConfiguration; | |
36 | - transportConfiguration?: ITansportConfiguration; | |
37 | - provisionConfiguration?: provisionConfigurationD; | |
38 | - alarms?: IAlarms[]; | |
39 | - clearRule?: IClearRule[]; | |
40 | -} |