Commit d20550a7869966153d7630bbfcb6117ab0e48e72
Merge branch 'ft-dev' of http://git.yuntengiot.com/huang/yun-teng-iot-front into ft-dev
Showing
12 changed files
with
530 additions
and
243 deletions
src/api/personal/index.ts
0 → 100644
1 | +import { UploadApiResult } from './model/uploadModel'; | |
2 | +import { IPutPersonal } from './model/index'; | |
3 | +import { defHttp } from '/@/utils/http/axios'; | |
4 | +import { UploadFileParams } from '/#/axios'; | |
5 | + | |
6 | +enum API { | |
7 | + BaseUploadUrl = '/api/yt/oss/upload', | |
8 | + PutPersonalUrl = '/user', | |
9 | + GetPersonalUrl = '/user/', | |
10 | +} | |
11 | +/** | |
12 | + * @description: Upload interface | |
13 | + */ | |
14 | +export const uploadApi = ( | |
15 | + params: UploadFileParams, | |
16 | + onUploadProgress: (progressEvent: ProgressEvent) => void | |
17 | +) => { | |
18 | + return defHttp.uploadFile<UploadApiResult>( | |
19 | + { | |
20 | + url: API.BaseUploadUrl, | |
21 | + onUploadProgress, | |
22 | + }, | |
23 | + params | |
24 | + ); | |
25 | +}; | |
26 | + | |
27 | +export const personalGet = (id: string) => { | |
28 | + return defHttp.get({ | |
29 | + url: `${API.GetPersonalUrl}${id}`, | |
30 | + }); | |
31 | +}; | |
32 | + | |
33 | +export const personalPut = (params: IPutPersonal) => { | |
34 | + return defHttp.post<IPutPersonal>({ | |
35 | + url: API.PutPersonalUrl, | |
36 | + params, | |
37 | + }); | |
38 | +}; | ... | ... |
src/api/personal/model/index.ts
0 → 100644
1 | +export interface FileUploadResponse { | |
2 | + fileName: string; | |
3 | + fileDownloadUri: string; | |
4 | + fileType: string; | |
5 | + size: number; | |
6 | + fileStaticUri: string; | |
7 | +} | |
8 | + | |
9 | +export interface IPutPersonal { | |
10 | + accountExpireTime?: string; | |
11 | + activateToken?: string; | |
12 | + avatar?: string; | |
13 | + createTime?: string; | |
14 | + creator?: string; | |
15 | + deptId?: string; | |
16 | + email?: string; | |
17 | + enabled?: true; | |
18 | + hasPassword?: true; | |
19 | + id?: string; | |
20 | + level?: 0; | |
21 | + organizationIds?: [string]; | |
22 | + password?: string; | |
23 | + phoneNumber?: string; | |
24 | + realName?: string; | |
25 | + roleIds?: [string]; | |
26 | + roles?: [ | |
27 | + { | |
28 | + roleId: string; | |
29 | + roleName: string; | |
30 | + } | |
31 | + ]; | |
32 | + tenantId?: string; | |
33 | + tenantName?: string; | |
34 | + updateTime?: string; | |
35 | + updater?: string; | |
36 | + userStatusEnum?: string; | |
37 | + username?: string; | |
38 | +} | ... | ... |
src/api/personal/model/uploadModel.ts
0 → 100644
1 | +import { FormSchema } from '/@/components/Table'; | |
2 | + | |
3 | +export const formSchema: FormSchema[] = [ | |
4 | + { | |
5 | + field: 'creator', | |
6 | + label: '用户昵称', | |
7 | + colProps: { span: 13 }, | |
8 | + required: true, | |
9 | + component: 'Input', | |
10 | + componentProps: { | |
11 | + placeholder: '请输入用户昵称', | |
12 | + }, | |
13 | + }, | |
14 | + { | |
15 | + field: 'phoneNumber', | |
16 | + label: '手机号码', | |
17 | + colProps: { span: 13 }, | |
18 | + required: true, | |
19 | + component: 'Input', | |
20 | + componentProps: { | |
21 | + placeholder: '请输入手机号码', | |
22 | + }, | |
23 | + }, | |
24 | + { | |
25 | + field: 'email', | |
26 | + label: '邮箱', | |
27 | + colProps: { span: 13 }, | |
28 | + required: true, | |
29 | + component: 'Input', | |
30 | + componentProps: { | |
31 | + placeholder: '请输入邮箱', | |
32 | + }, | |
33 | + }, | |
34 | + { | |
35 | + field: 'enabled', | |
36 | + component: 'RadioGroup', | |
37 | + label: '性别', | |
38 | + colProps: { | |
39 | + span: 13, | |
40 | + }, | |
41 | + componentProps: { | |
42 | + options: [ | |
43 | + { | |
44 | + label: '男', | |
45 | + value: 'true', | |
46 | + }, | |
47 | + { | |
48 | + label: '女', | |
49 | + value: 'false', | |
50 | + }, | |
51 | + ], | |
52 | + }, | |
53 | + }, | |
54 | +]; | ... | ... |
1 | +<template> | |
2 | + <BasicModal | |
3 | + :useWrapper="true" | |
4 | + width="80vw" | |
5 | + :height="compHeight" | |
6 | + v-bind="$attrs" | |
7 | + @register="registerModal" | |
8 | + @ok="handleSubmit" | |
9 | + > | |
10 | + <div | |
11 | + style=" | |
12 | + height: 62vh; | |
13 | + width: 120vw; | |
14 | + display: flex; | |
15 | + flex-direction: row; | |
16 | + align-items: center; | |
17 | + justify-content: space-between; | |
18 | + " | |
19 | + > | |
20 | + <div style="width: 29vw; height: 62vh; border: 1px solid #e9edf6; box-shadow: 0 0 5px -5px"> | |
21 | + <div style="width: 29vw; height: 4vh; border: 1px solid #e9edf6" | |
22 | + ><p style="font-size: 17px; margin-top: 7px; margin-left: 10px">个人信息</p></div | |
23 | + > | |
24 | + <div class="change-avatar" style="text-align: center"> | |
25 | + <div class="mb-2">头像</div> | |
26 | + <CropperAvatar | |
27 | + :uploadApi="uploadApi" | |
28 | + :value="avatar" | |
29 | + btnText="更换头像" | |
30 | + :btnProps="{ preIcon: 'ant-design:cloud-upload-outlined' }" | |
31 | + @change="updateAvatar" | |
32 | + width="150" | |
33 | + /> | |
34 | + </div> | |
35 | + <Description | |
36 | + class="mt-8" | |
37 | + :column="1" | |
38 | + :schema="schema" | |
39 | + :bordered="true" | |
40 | + :data="getPersonalDetailValue" | |
41 | + @register="registerDesc" | |
42 | + /> | |
43 | + </div> | |
44 | + <div | |
45 | + style=" | |
46 | + width: 90vw; | |
47 | + height: 60vh; | |
48 | + border: 1px solid #e9edf6; | |
49 | + margin-top: -15px; | |
50 | + box-shadow: 0 0 5px -5px; | |
51 | + " | |
52 | + > | |
53 | + <div style="width: 90vw; height: 4vh; border: 1px solid #e9edf6" | |
54 | + ><p style="font-size: 17px; margin-top: 7px; margin-left: 20px">基本资料</p></div | |
55 | + > | |
56 | + <div style="margin-left: 20px"> | |
57 | + <BasicForm @register="registerForm" /> | |
58 | + </div> | |
59 | + </div> | |
60 | + </div> | |
61 | + </BasicModal> | |
62 | +</template> | |
63 | +<script lang="ts"> | |
64 | + import { defineComponent, ref, computed, onMounted } from 'vue'; | |
65 | + import { BasicModal, useModalInner } from '/@/components/Modal/index'; | |
66 | + import { BasicForm, useForm } from '/@/components/Form/index'; | |
67 | + import { formSchema } from './config'; | |
68 | + import { Description, DescItem, useDescription } from '/@/components/Description/index'; | |
69 | + import { CropperAvatar } from '/@/components/Cropper'; | |
70 | + import defaultImage from '/@/assets/images/logo.png'; | |
71 | + import { uploadApi, personalPut, personalGet } from '/@/api/personal/index'; | |
72 | + import { useMessage } from '/@/hooks/web/useMessage'; | |
73 | + import { USER_INFO_KEY } from '/@/enums/cacheEnum'; | |
74 | + import { getAuthCache } from '/@/utils/auth'; | |
75 | + | |
76 | + const schema: DescItem[] = [ | |
77 | + { | |
78 | + field: 'creator', | |
79 | + label: '用户名称:', | |
80 | + }, | |
81 | + { | |
82 | + field: 'phoneNumber', | |
83 | + label: '手机号码:', | |
84 | + }, | |
85 | + { | |
86 | + field: 'email', | |
87 | + label: '用户邮箱:', | |
88 | + }, | |
89 | + { | |
90 | + field: 'realName', | |
91 | + label: '用户昵称:', | |
92 | + }, | |
93 | + { | |
94 | + field: 'createTime', | |
95 | + label: '过期时间:', | |
96 | + }, | |
97 | + { | |
98 | + field: 'createTime', | |
99 | + label: '创建时间:', | |
100 | + }, | |
101 | + ]; | |
102 | + export default defineComponent({ | |
103 | + name: 'index', | |
104 | + components: { BasicModal, BasicForm, Description, CropperAvatar }, | |
105 | + setup() { | |
106 | + const userInfo = getAuthCache(USER_INFO_KEY); | |
107 | + const { createMessage } = useMessage(); | |
108 | + const getPersonalValue: any = ref({}); | |
109 | + const getPersonalDetailValue: any = ref({}); | |
110 | + const [registerDesc] = useDescription({ | |
111 | + title: '个人详情', | |
112 | + schema: schema, | |
113 | + }); | |
114 | + | |
115 | + const [registerModal] = useModalInner(); | |
116 | + const [registerForm, { validate }] = useForm({ | |
117 | + showActionButtonGroup: false, | |
118 | + schemas: formSchema, | |
119 | + }); | |
120 | + const avatar = computed(() => { | |
121 | + return defaultImage; | |
122 | + }); | |
123 | + const handleSubmit = async () => { | |
124 | + getPersonalValue.value = await validate(); | |
125 | + await personalPut(getPersonalValue.value); | |
126 | + createMessage.success('修改成功'); | |
127 | + }; | |
128 | + const updateAvatar = async (v) => { | |
129 | + console.log('v' + v); | |
130 | + await personalPut({ avatar: v }); | |
131 | + }; | |
132 | + const getPersonalDetail = async () => { | |
133 | + try { | |
134 | + const getUserInfo = await userInfo; | |
135 | + const getBackendData = await personalGet(getUserInfo.userId); | |
136 | + getPersonalDetailValue.value = getBackendData; | |
137 | + console.log(getPersonalDetailValue.value); | |
138 | + } catch (e) { | |
139 | + return e; | |
140 | + } | |
141 | + }; | |
142 | + onMounted(() => { | |
143 | + getPersonalDetail(); | |
144 | + }); | |
145 | + const compHeight = computed(() => { | |
146 | + return 1000; | |
147 | + }); | |
148 | + return { | |
149 | + uploadApi, | |
150 | + compHeight, | |
151 | + updateAvatar, | |
152 | + avatar, | |
153 | + handleSubmit, | |
154 | + getPersonalDetailValue, | |
155 | + registerDesc, | |
156 | + schema, | |
157 | + registerModal, | |
158 | + registerForm, | |
159 | + }; | |
160 | + }, | |
161 | + }); | |
162 | +</script> | |
163 | +<style lang="less"></style> | ... | ... |
... | ... | @@ -29,10 +29,16 @@ |
29 | 29 | :text="t('layout.header.dropdownItemLoginOut')" |
30 | 30 | icon="ion:power-outline" |
31 | 31 | /> |
32 | + <MenuItem | |
33 | + key="personal" | |
34 | + :text="t('layout.header.dropdownItemPersonal')" | |
35 | + icon="ion:build-outlined" | |
36 | + /> | |
32 | 37 | </Menu> |
33 | 38 | </template> |
34 | 39 | </Dropdown> |
35 | 40 | <LockAction @register="register" /> |
41 | + <PersonalChild @register="registerPersonal" /> | |
36 | 42 | </template> |
37 | 43 | <script lang="ts"> |
38 | 44 | // components |
... | ... | @@ -54,7 +60,7 @@ |
54 | 60 | |
55 | 61 | import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent'; |
56 | 62 | |
57 | - type MenuEvent = 'logout' | 'doc' | 'lock'; | |
63 | + type MenuEvent = 'logout' | 'doc' | 'lock' | 'personal'; | |
58 | 64 | |
59 | 65 | export default defineComponent({ |
60 | 66 | name: 'UserDropdown', |
... | ... | @@ -64,6 +70,7 @@ |
64 | 70 | MenuItem: createAsyncComponent(() => import('./DropMenuItem.vue')), |
65 | 71 | MenuDivider: Menu.Divider, |
66 | 72 | LockAction: createAsyncComponent(() => import('../lock/LockModal.vue')), |
73 | + PersonalChild: createAsyncComponent(() => import('../personal/index.vue')), | |
67 | 74 | }, |
68 | 75 | props: { |
69 | 76 | theme: propTypes.oneOf(['dark', 'light']), |
... | ... | @@ -80,6 +87,7 @@ |
80 | 87 | }); |
81 | 88 | |
82 | 89 | const [register, { openModal }] = useModal(); |
90 | + const [registerPersonal, { openModal: openModalPersonal }] = useModal(); | |
83 | 91 | |
84 | 92 | function handleLock() { |
85 | 93 | openModal(true); |
... | ... | @@ -106,10 +114,21 @@ |
106 | 114 | case 'lock': |
107 | 115 | handleLock(); |
108 | 116 | break; |
117 | + case 'personal': | |
118 | + openPersonalFunc(); | |
119 | + break; | |
109 | 120 | } |
110 | 121 | } |
111 | 122 | |
123 | + const openPersonalFunc = () => { | |
124 | + setTimeout(() => { | |
125 | + openModalPersonal(true); | |
126 | + }, 10); | |
127 | + }; | |
128 | + | |
112 | 129 | return { |
130 | + registerPersonal, | |
131 | + openPersonalFunc, | |
113 | 132 | prefixCls, |
114 | 133 | t, |
115 | 134 | getUserInfo, | ... | ... |
... | ... | @@ -158,25 +158,11 @@ |
158 | 158 | function handleRedo() { |
159 | 159 | current.value = 0; |
160 | 160 | } |
161 | - //用于生成uuid | |
162 | - function generateUUID() { | |
163 | - let d = new Date().getTime(); | |
164 | - if (window.performance && typeof window.performance.now === 'function') { | |
165 | - d += performance.now(); //use high-precision timer if available | |
166 | - } | |
167 | - let uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { | |
168 | - let r = (d + Math.random() * 16) % 16 | 0; | |
169 | - d = Math.floor(d / 16); | |
170 | - return (c == 'x' ? r : (r & 0x3) | 0x8).toString(16); | |
171 | - }); | |
172 | - return uuid; | |
173 | - } | |
174 | 161 | const handleSubmit = async () => { |
175 | 162 | if (!unref(isUpdate)) { |
176 | 163 | isGetStepThreeData.value.profileData = getStepThreeData.value; |
177 | 164 | alarmProfileData.value.alarmProfile = |
178 | 165 | await proxy.$refs.DeviceProfileStep4Ref.getAllFields(); |
179 | - alarmProfileData.value.alarmProfile.id = generateUUID(); | |
180 | 166 | Object.assign( |
181 | 167 | postDeviceConfogData.value, |
182 | 168 | getStepOneData.value, | ... | ... |
... | ... | @@ -10,62 +10,48 @@ |
10 | 10 | alt="移除" |
11 | 11 | src="../../../../assets/images/close.png" |
12 | 12 | /> |
13 | - <!-- <DeleteOutlined style="font-size: 20px" class="mr-2" /> --> | |
14 | 13 | </div> |
15 | 14 | </template> |
16 | 15 | <div class="alert-type" style="margin-left: -26px; margin-top: -10px"> |
17 | 16 | <BasicForm @register="registerForm" |
18 | 17 | /></div> |
19 | - <CollapseContainer style="margin-top: -20px"> | |
20 | - <template #action> </template> | |
21 | - <div style="margin-left: 10px; margin-top: -10px"> | |
22 | - <BasicForm @register="registerFormHighSetting"> | |
18 | + <div style="margin-top: -20px"> | |
19 | + <div style="margin-left: 20px; margin-top: -10px"> | |
20 | + <BasicForm | |
21 | + @register="registerFormHighSetting" | |
22 | + style="margin-left: 12px; margin-top: -10px" | |
23 | + > | |
23 | 24 | <template #checkBox="{ model, field }"> |
24 | 25 | <Checkbox v-model:checked="model[field]">传递报警</Checkbox> |
25 | 26 | </template> |
26 | 27 | </BasicForm> |
27 | 28 | </div> |
28 | - </CollapseContainer> | |
29 | + </div> | |
29 | 30 | <p>创建报警规则</p> |
30 | 31 | <template v-for="(childItem, createIndex) in item.alarms" :key="childItem.id"> |
31 | - <div class="aic mb-1" style="border: 1px solid #bfbfbf"> | |
32 | + <div class="aic" style="border: 1px solid #bfbfbf"> | |
32 | 33 | <div class="w-3/4"> |
33 | 34 | <div style="margin-left: -30px; margin-top: 20px" |
34 | 35 | ><BasicForm @register="registerFormCreateAlarm" /> |
35 | 36 | </div> |
36 | - <div style="margin-left: 5px"> | |
37 | - <div style="color: #f5594e" class="mt-4 ml-4" | |
37 | + <div style="margin-left: 5px; margin-top: -50px"> | |
38 | + <div style="color: #f5594e" class="ml-4" | |
38 | 39 | >报警规则条件: |
39 | 40 | <Button size="small" type="primary" @click="handleOpenAlaramRuleConditions" |
40 | 41 | >添加</Button |
41 | 42 | > |
42 | 43 | <p>{{ ruleTemplateData }}</p> |
43 | - <!-- <PlusOutlined | |
44 | - @click="handleOpenAlaramRuleConditions" | |
45 | - class="cursor-pointer ml-4" | |
46 | - style="font-size: 20px" | |
47 | - />{{ ruleTemplateData }} --> | |
48 | 44 | </div> |
49 | 45 | <div style="white-space: wrap" class="mt-4 ml-4" |
50 | 46 | >启用规则: |
51 | 47 | <Button size="small" type="primary" @click="handleOpenEnableRule">添加</Button> |
52 | 48 | <p>{{ enableTemplateData }}</p> |
53 | - <!-- <EditOutlined | |
54 | - @click="handleOpenEnableRule" | |
55 | - class="cursor-pointer ml-4" | |
56 | - style="font-size: 20px" | |
57 | - /> --> | |
58 | 49 | <div class="mt-4 ml-4" style="margin-left: 0px" |
59 | 50 | >详情模板: |
60 | 51 | <Button size="small" type="primary" @click="handleOpenDetailTemplate" |
61 | 52 | >添加</Button |
62 | 53 | > |
63 | 54 | <p>{{ detailTemplateData }}</p> |
64 | - <!-- <EditOutlined | |
65 | - @click="handleOpenDetailTemplate" | |
66 | - class="cursor-pointer ml-4" | |
67 | - style="font-size: 20px" | |
68 | - /> --> | |
69 | 55 | </div> |
70 | 56 | <div style="margin-left: 0px; position: relative"> |
71 | 57 | <BasicForm @register="dashboardForm" /> |
... | ... | @@ -74,7 +60,7 @@ |
74 | 60 | </div> |
75 | 61 | <div |
76 | 62 | class="remove-type" |
77 | - style="display: inline-block; position: relative; top: -304px; left: 800px" | |
63 | + style="display: inline-block; position: relative; top: -237px; left: 800px" | |
78 | 64 | > |
79 | 65 | <img |
80 | 66 | style="cursor: pointer" |
... | ... | @@ -82,13 +68,6 @@ |
82 | 68 | alt="移除" |
83 | 69 | src="../../../../assets/images/close.png" |
84 | 70 | /> |
85 | - <!-- <Tooltip title="移除"> | |
86 | - <MinusCircleOutlined | |
87 | - style="font-size: 25px; color: #305680" | |
88 | - class="cursor-pointer" | |
89 | - @click="deleteCondition(index, createIndex)" | |
90 | - /> | |
91 | - </Tooltip> --> | |
92 | 71 | </div> |
93 | 72 | </div> |
94 | 73 | </div> |
... | ... | @@ -98,7 +77,10 @@ |
98 | 77 | > |
99 | 78 | <div style="height: 20px"></div> |
100 | 79 | <p>清除报警规则</p> |
101 | - <template v-for="(childItem, createIndex) in item.clearAlarms" :key="childItem.id"> | |
80 | + <template | |
81 | + v-for="(childClearItem, createIndex) in item.alarms[0].clearRule" | |
82 | + :key="childClearItem.id" | |
83 | + > | |
102 | 84 | <div class="aic mb-1" style="border: 1px solid #bfbfbf"> |
103 | 85 | <div class="w-3/4"> |
104 | 86 | <div style="margin-left: 5px"> |
... | ... | @@ -108,11 +90,6 @@ |
108 | 90 | >添加</Button |
109 | 91 | > |
110 | 92 | <p>{{ ruleClearTemplateData }}</p> |
111 | - <!-- <PlusOutlined | |
112 | - @click="handleOpenClearAlaramRuleConditions" | |
113 | - class="cursor-pointer ml-4" | |
114 | - style="font-size: 20px" | |
115 | - /> --> | |
116 | 93 | </div> |
117 | 94 | <div style="white-space: wrap" class="mt-4 ml-4" |
118 | 95 | >启用规则: |
... | ... | @@ -120,49 +97,21 @@ |
120 | 97 | >添加</Button |
121 | 98 | > |
122 | 99 | <p>{{ enableClearTemplateData }}</p> |
123 | - <!-- <EditOutlined | |
124 | - @click="handleOpenClearEnableRule" | |
125 | - class="cursor-pointer ml-4" | |
126 | - style="font-size: 20px" | |
127 | - /> --> | |
128 | 100 | <div class="mt-4 ml-4" style="margin-left: 0px" |
129 | 101 | >详情模板: |
130 | 102 | <Button size="small" type="primary" @click="handleOpenClearDetailTemplate" |
131 | 103 | >添加</Button |
132 | 104 | > |
133 | 105 | <p>{{ detailClearTemplateData }}</p> |
134 | - <!-- <EditOutlined | |
135 | - @click="handleOpenClearDetailTemplate" | |
136 | - class="cursor-pointer ml-4" | |
137 | - style="font-size: 20px" | |
138 | - /> --> | |
139 | 106 | </div> |
140 | 107 | <div style="margin-left: 0px"> |
141 | 108 | <BasicForm @register="dashboardForm" /> |
142 | 109 | </div> |
143 | 110 | </div> |
144 | 111 | </div> |
145 | - <!-- <div class="w-1/4 flex justify-center"> | |
146 | - <img | |
147 | - style="cursor: pointer" | |
148 | - @click="deleteClearCondition(index, createIndex)" | |
149 | - alt="移除" | |
150 | - src="../../../../assets/images/close.png" | |
151 | - /> | |
152 | - <Tooltip title="移除"> | |
153 | - <MinusCircleOutlined | |
154 | - style="font-size: 25px; color: #305680" | |
155 | - class="cursor-pointer" | |
156 | - @click="deleteClearCondition(index, createIndex)" | |
157 | - /> | |
158 | - </Tooltip> | |
159 | - </div> --> | |
160 | 112 | </div> |
161 | 113 | </div> |
162 | 114 | </template> |
163 | - <!-- <a-button style="border-radius: 10px" class="mt-5" @click="addClearRole(index)" | |
164 | - ><PlusCircleOutlined />添加清除条件</a-button | |
165 | - > --> | |
166 | 115 | </CollapseContainer> |
167 | 116 | </template> |
168 | 117 | </div> |
... | ... | @@ -217,7 +166,7 @@ |
217 | 166 | |
218 | 167 | <script lang="ts"> |
219 | 168 | import { defineComponent, ref, unref, getCurrentInstance, watch } from 'vue'; |
220 | - import type { alarmListItem } from '../types/index'; | |
169 | + import type { IProfileData } from '../types/index'; | |
221 | 170 | import { CollapseContainer } from '/@/components/Container/index'; |
222 | 171 | import { BasicForm, useForm } from '/@/components/Form'; |
223 | 172 | import { |
... | ... | @@ -227,13 +176,7 @@ |
227 | 176 | dashboardFormScheme, |
228 | 177 | isWhereType, |
229 | 178 | } from './data'; |
230 | - import { | |
231 | - DeleteOutlined, | |
232 | - // MinusCircleOutlined, | |
233 | - PlusCircleOutlined, | |
234 | - PlusOutlined, | |
235 | - EditOutlined, | |
236 | - } from '@ant-design/icons-vue'; | |
179 | + import { PlusCircleOutlined } from '@ant-design/icons-vue'; | |
237 | 180 | import { Checkbox } from 'ant-design-vue'; |
238 | 181 | import { useModal } from '/@/components/Modal'; |
239 | 182 | import DetailTemplate from './cpns/detailtemplate/index.vue'; |
... | ... | @@ -241,17 +184,14 @@ |
241 | 184 | import AlarmRuleConditions from './cpns/alarmruleconditions/index.vue'; |
242 | 185 | import { Button } from '/@/components/Button'; |
243 | 186 | |
187 | + export const isWhereTypeValueDisabled = ref(false); | |
188 | + | |
244 | 189 | export default defineComponent({ |
245 | 190 | components: { |
246 | 191 | BasicForm, |
247 | 192 | CollapseContainer, |
248 | - DeleteOutlined, | |
249 | - // MinusCircleOutlined, | |
250 | 193 | PlusCircleOutlined, |
251 | - PlusOutlined, | |
252 | - EditOutlined, | |
253 | 194 | Checkbox, |
254 | - // Tooltip, | |
255 | 195 | DetailTemplate, |
256 | 196 | EnableRule, |
257 | 197 | AlarmRuleConditions, |
... | ... | @@ -283,34 +223,7 @@ |
283 | 223 | const enableClearTemplateData: any = ref(null); |
284 | 224 | const detailClearTemplateData: any = ref(null); |
285 | 225 | //告警列表 |
286 | - let profileData = ref<alarmListItem[]>([ | |
287 | - // { | |
288 | - // configuration: {}, | |
289 | - // transportConfiguration: {}, | |
290 | - // provisionConfiguration: { | |
291 | - // provisionDeviceSecret: '', | |
292 | - // }, | |
293 | - // alarms: [ | |
294 | - // { | |
295 | - // id: Date.now() + Math.random(), | |
296 | - // alarmType: '', | |
297 | - // createRules: {}, | |
298 | - // clearRule: {}, | |
299 | - // propagate: true, | |
300 | - // propagateRelationTypes: [''], | |
301 | - // }, | |
302 | - // ], | |
303 | - // clearAlarms: [ | |
304 | - // { | |
305 | - // id: Date.now() + Math.random(), | |
306 | - // alarmType: '', | |
307 | - // clearRules: {}, | |
308 | - // propagate: true, | |
309 | - // propagateRelationTypes: [''], | |
310 | - // }, | |
311 | - // ], | |
312 | - // }, | |
313 | - ]); | |
226 | + let profileData = ref<IProfileData[]>([]); | |
314 | 227 | const log = (e) => { |
315 | 228 | console.log(e); |
316 | 229 | }; |
... | ... | @@ -324,35 +237,44 @@ |
324 | 237 | }; |
325 | 238 | |
326 | 239 | const addAlarmRule = () => { |
327 | - // console.log(profileData.value.alarms.length) | |
328 | 240 | unref(profileData).push({ |
329 | - configuration: {}, | |
330 | - transportConfiguration: {}, | |
241 | + configuration: { | |
242 | + type: '', | |
243 | + }, | |
244 | + transportConfiguration: { | |
245 | + type: '', | |
246 | + }, | |
331 | 247 | provisionConfiguration: { |
332 | 248 | provisionDeviceSecret: '', |
333 | 249 | }, |
334 | 250 | alarms: [ |
335 | 251 | { |
336 | - id: Date.now() + Math.random(), | |
252 | + id: Date.now() + Math.random() + '', | |
337 | 253 | alarmType: '', |
338 | 254 | createRules: {}, |
339 | - clearRule: {}, | |
340 | - propagate: true, | |
341 | - propagateRelationTypes: [''], | |
342 | - }, | |
343 | - ], | |
344 | - clearAlarms: [ | |
345 | - { | |
346 | - id: Date.now() + Math.random(), | |
347 | - alarmType: '', | |
348 | - clearRules: {}, | |
349 | - propagate: true, | |
255 | + clearRule: [ | |
256 | + { | |
257 | + id: Date.now() + Math.random() + '', | |
258 | + alarmDetails: '', | |
259 | + dashboardId: { | |
260 | + id: '', | |
261 | + entityType: '', | |
262 | + }, | |
263 | + propagate: '', | |
264 | + propagateRelationTypes: [''], | |
265 | + schedule: { | |
266 | + type: 'string', | |
267 | + }, | |
268 | + condition: {}, | |
269 | + }, | |
270 | + ], | |
271 | + propagate: false, | |
350 | 272 | propagateRelationTypes: [''], |
351 | 273 | }, |
352 | 274 | ], |
353 | 275 | }); |
354 | 276 | }; |
355 | - //Mobile dashboard: | |
277 | + //TODO Mobile dashboard: | |
356 | 278 | const [dashboardForm] = useForm({ |
357 | 279 | labelWidth: 120, |
358 | 280 | schemas: dashboardFormScheme, |
... | ... | @@ -430,42 +352,47 @@ |
430 | 352 | // 添加‘创建条件’ |
431 | 353 | const addCreateRole = (index: number) => { |
432 | 354 | unref(profileData)[index].alarms.push({ |
433 | - id: Date.now() + Math.random(), | |
434 | - alarmVisible: false, | |
435 | - addKeyFilterVisible: false, | |
436 | - detailVisible: false, | |
437 | - detail: '', | |
438 | - filterList: [], | |
355 | + id: Date.now() + Math.random() + '', | |
356 | + alarmType: '', | |
357 | + createRules: {}, | |
358 | + clearRule: [ | |
359 | + { | |
360 | + id: Date.now() + Math.random() + '', | |
361 | + alarmDetails: '', | |
362 | + dashboardId: { | |
363 | + id: '', | |
364 | + entityType: '', | |
365 | + }, | |
366 | + propagate: '', | |
367 | + propagateRelationTypes: [''], | |
368 | + schedule: { | |
369 | + type: 'string', | |
370 | + }, | |
371 | + condition: {}, | |
372 | + }, | |
373 | + ], | |
374 | + propagate: false, | |
375 | + propagateRelationTypes: [''], | |
439 | 376 | }); |
440 | 377 | }; |
441 | 378 | // 删除‘创建条件’ |
442 | 379 | const deleteCondition = (index: number, createIndex: number) => { |
443 | - profileData.value[index].alarms.splice(createIndex, 1); | |
444 | - }; | |
445 | - // 添加‘清除条件’ | |
446 | - const addClearRole = (index: number) => { | |
447 | - unref(profileData)[index].clearAlarms.push({ | |
448 | - id: Date.now() + Math.random(), | |
449 | - alarmVisible: false, | |
450 | - addKeyFilterVisible: false, | |
451 | - detailVisible: false, | |
452 | - detail: '', | |
453 | - filterList: [], | |
454 | - }); | |
455 | - }; | |
456 | - // 删除‘清除条件’ | |
457 | - const deleteClearCondition = (index: number, createIndex: number) => { | |
458 | - profileData.value[index].clearAlarms.splice(createIndex, 1); | |
380 | + unref(profileData)[index].alarms.splice(createIndex, 1); | |
459 | 381 | }; |
460 | 382 | watch(isWhereType, (nV) => { |
461 | 383 | isWhereTypeValue.value = nV; |
384 | + if (isWhereTypeValue.value == nV) { | |
385 | + isWhereTypeValueDisabled.value = true; | |
386 | + } else { | |
387 | + // isWhereTypeValueDisabled.value = false; | |
388 | + } | |
462 | 389 | }); |
463 | 390 | //详情模板 |
464 | 391 | const getAllFieldsFunc = (v) => { |
465 | 392 | detailObj.value = v; |
466 | 393 | detailTemplateData.value = ` |
467 | - 报警详细信息:${v.alarmDetails} | |
468 | - `; | |
394 | + 报警详细信息:${v.alarmDetails} | |
395 | + `; | |
469 | 396 | }; |
470 | 397 | //启用规则 |
471 | 398 | const getAllFieldsEnabFunc = (v) => { |
... | ... | @@ -509,10 +436,12 @@ |
509 | 436 | console.log(e); |
510 | 437 | } |
511 | 438 | }); |
512 | - | |
513 | - enableTemplateData.value = ` | |
514 | - 开始时间:${v.startsOn}结束时间:${v.endsOn}天数:${findDayByValue} | |
515 | - `; | |
439 | + enableTemplateData.value = | |
440 | + v.startsOn == undefined | |
441 | + ? `始终启用` | |
442 | + : ` | |
443 | + 开始时间:${v.startsOn},结束时间:${v.endsOn},天数:${findDayByValue} | |
444 | + `; | |
516 | 445 | }; |
517 | 446 | //规则条件 |
518 | 447 | const getAllFieldsRuleFunc = (v, v1) => { |
... | ... | @@ -537,8 +466,8 @@ |
537 | 466 | } |
538 | 467 | }); |
539 | 468 | ruleTemplateData.value = ` |
540 | - 键名:${v.key1}...操作:${findRuleByValue?.label}...值:${v.value1} | |
541 | - `; | |
469 | + 键名:${v.key1}...操作:${findRuleByValue?.label}...值:${v.value1} | |
470 | + `; | |
542 | 471 | |
543 | 472 | ruleLastObj.value = v1; |
544 | 473 | const predicate = { |
... | ... | @@ -583,8 +512,8 @@ |
583 | 512 | const getAllClearFieldsFunc = (v) => { |
584 | 513 | detailClearObj.value = v; |
585 | 514 | detailClearTemplateData.value = ` |
586 | - 报警详细信息:${v.alarmDetails} | |
587 | - `; | |
515 | + 报警详细信息:${v.alarmDetails} | |
516 | + `; | |
588 | 517 | }; |
589 | 518 | //启用规则 |
590 | 519 | const getAllClearFieldsEnabFunc = (v) => { |
... | ... | @@ -628,9 +557,11 @@ |
628 | 557 | console.log(e); |
629 | 558 | } |
630 | 559 | }); |
631 | - enableClearTemplateData.value = ` | |
632 | - 开始时间:${v.startsOn}结束时间:${v.endsOn}天数:${findDayByValue} | |
633 | - `; | |
560 | + enableClearTemplateData.value = | |
561 | + v.startsOn == undefined | |
562 | + ? `始终启用` | |
563 | + : `开始时间:${v.startsOn},结束时间:${v.endsOn},天数:${findDayByValue} | |
564 | + `; | |
634 | 565 | }; |
635 | 566 | //规则条件 |
636 | 567 | const getAllClearFieldsRuleFunc = (v, v1) => { |
... | ... | @@ -655,8 +586,8 @@ |
655 | 586 | } |
656 | 587 | }); |
657 | 588 | ruleClearTemplateData.value = ` |
658 | - 键名:${v.key1}...操作:${findRuleByValue?.label}...值:${v.value1} | |
659 | - `; | |
589 | + 键名:${v.key1}...操作:${findRuleByValue?.label}...值:${v.value1} | |
590 | + `; | |
660 | 591 | |
661 | 592 | ruleLastObj.value = v1; |
662 | 593 | const predicate = { |
... | ... | @@ -696,6 +627,19 @@ |
696 | 627 | }; |
697 | 628 | Object.assign(addClearitionalObj.value, getValueConditon); |
698 | 629 | }; |
630 | + //用于生成uuid | |
631 | + function generateUUID() { | |
632 | + let d = new Date().getTime(); | |
633 | + if (window.performance && typeof window.performance.now === 'function') { | |
634 | + d += performance.now(); //use high-precision timer if available | |
635 | + } | |
636 | + let uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { | |
637 | + let r = (d + Math.random() * 16) % 16 | 0; | |
638 | + d = Math.floor(d / 16); | |
639 | + return (c == 'x' ? r : (r & 0x3) | 0x8).toString(16); | |
640 | + }); | |
641 | + return uuid; | |
642 | + } | |
699 | 643 | const handleFormStep3toStep4Next = async () => { |
700 | 644 | try { |
701 | 645 | const scheduleClearValue = { |
... | ... | @@ -744,6 +688,9 @@ |
744 | 688 | const valueRegisterFormAndId = { |
745 | 689 | alarmType: Object.values(valueRegisterForm)[0], |
746 | 690 | }; |
691 | + const objectId = { | |
692 | + id: generateUUID(), | |
693 | + }; | |
747 | 694 | const valueRegisterFormHighSetting = await validateRegisterFormHighSetting(); |
748 | 695 | const valueRegisterFormCreateAlarm = await validateRegisterFormCreateAlarm(); |
749 | 696 | console.log(valueRegisterFormCreateAlarm); |
... | ... | @@ -756,7 +703,8 @@ |
756 | 703 | valueRegisterFormAndId, |
757 | 704 | getValueRegisterFormHighSetting, |
758 | 705 | getCreateRulesAllObj, |
759 | - getClearRulesAllObj | |
706 | + getClearRulesAllObj, | |
707 | + objectId | |
760 | 708 | ); |
761 | 709 | alarmss.value.push(emptyObj.value); |
762 | 710 | const getAlarms = { |
... | ... | @@ -827,8 +775,6 @@ |
827 | 775 | handleOpenClearDetailTemplate, |
828 | 776 | handleOpenClearEnableRule, |
829 | 777 | handleOpenClearAlaramRuleConditions, |
830 | - addClearRole, | |
831 | - deleteClearCondition, | |
832 | 778 | detailTemplateData, |
833 | 779 | enableTemplateData, |
834 | 780 | ruleTemplateData, | ... | ... |
... | ... | @@ -5,6 +5,7 @@ import { deviceConfigGetRuleChain } from '/@/api/device/deviceConfigApi'; |
5 | 5 | import { ref } from 'vue'; |
6 | 6 | import { findDictItemByCode } from '/@/api/system/dict'; |
7 | 7 | import { alarmContactGetPage } from '/@/api/device/deviceConfigApi'; |
8 | +import { isWhereTypeValueDisabled } from './DeviceProfileStep3.vue'; | |
8 | 9 | |
9 | 10 | export const step1Schemas: FormSchema[] = [ |
10 | 11 | { |
... | ... | @@ -146,39 +147,85 @@ export const isWhereType = ref(null); |
146 | 147 | |
147 | 148 | export const step3CreateAlarm: FormSchema[] = [ |
148 | 149 | { |
149 | - field: 'WARNING', | |
150 | + field: 'default', | |
150 | 151 | component: 'Select', |
151 | 152 | label: '严重程度', |
152 | 153 | colProps: { |
153 | 154 | span: 16, |
154 | 155 | }, |
155 | - componentProps: { | |
156 | - placeholder: '请选择严重程度', | |
157 | - options: [ | |
158 | - { | |
159 | - value: 'CRITICAL', | |
160 | - label: '危险', | |
161 | - }, | |
162 | - { | |
163 | - value: 'MAJOR', | |
164 | - label: '重要', | |
165 | - }, | |
166 | - { | |
167 | - value: 'MINOR', | |
168 | - label: '次要', | |
156 | + componentProps({ formModel, formActionType }) { | |
157 | + console.log(formModel.default); | |
158 | + return { | |
159 | + filterOptions: (i, v) => { | |
160 | + console.log(i, v); | |
169 | 161 | }, |
170 | - { | |
171 | - value: 'WARNING', | |
172 | - label: '警告', | |
162 | + placeholder: '请选择严重程度', | |
163 | + options: [ | |
164 | + { | |
165 | + value: 'CRITICAL', | |
166 | + label: '危险', | |
167 | + disabled: formModel.default == 'CRITICAL', | |
168 | + }, | |
169 | + { | |
170 | + value: 'MAJOR', | |
171 | + label: '重要', | |
172 | + disabled: formModel.default == 'MAJOR', | |
173 | + }, | |
174 | + { | |
175 | + value: 'MINOR', | |
176 | + label: '次要', | |
177 | + // disabled: formModel.default == 'MINOR', | |
178 | + }, | |
179 | + { | |
180 | + value: 'WARNING', | |
181 | + label: '警告', | |
182 | + // disabled: formModel.default == 'WARNING', | |
183 | + }, | |
184 | + { | |
185 | + value: 'INDETERMINATE', | |
186 | + label: '不确定', | |
187 | + // disabled: formModel.default == 'INDETERMINATE', | |
188 | + }, | |
189 | + ], | |
190 | + onChange: (v) => { | |
191 | + // const newFiletr = [ | |
192 | + // { | |
193 | + // value: 'CRITICAL', | |
194 | + // label: '危险', | |
195 | + // // disabled: formModel.default == 'CRITICAL', | |
196 | + // }, | |
197 | + // { | |
198 | + // value: 'MAJOR', | |
199 | + // label: '重要', | |
200 | + // // disabled: formModel.default == 'MAJOR', | |
201 | + // }, | |
202 | + // { | |
203 | + // value: 'MINOR', | |
204 | + // label: '次要', | |
205 | + // // disabled: formModel.default == 'MINOR', | |
206 | + // }, | |
207 | + // { | |
208 | + // value: 'WARNING', | |
209 | + // label: '警告', | |
210 | + // // disabled: formModel.default == 'WARNING', | |
211 | + // }, | |
212 | + // { | |
213 | + // value: 'INDETERMINATE', | |
214 | + // label: '不确定', | |
215 | + // // disabled: formModel.default == 'INDETERMINATE', | |
216 | + // }, | |
217 | + // ]; | |
218 | + // const { updateSchema } = formActionType; | |
219 | + // const newFileterFunc = newFiletr.filter((f) => f.value != v); | |
220 | + // updateSchema({ | |
221 | + // field: 'default', | |
222 | + // componentProps: { | |
223 | + // options: newFileterFunc, | |
224 | + // }, | |
225 | + // }); | |
226 | + isWhereType.value = v ? v : 'INDETERMINATE'; | |
173 | 227 | }, |
174 | - { | |
175 | - value: 'INDETERMINATE', | |
176 | - label: '不确定', | |
177 | - }, | |
178 | - ], | |
179 | - onChange: (v) => { | |
180 | - isWhereType.value = v ? v : 'INDETERMINATE'; | |
181 | - }, | |
228 | + }; | |
182 | 229 | }, |
183 | 230 | }, |
184 | 231 | ]; | ... | ... |
1 | -interface alarmRuleFilter { | |
2 | - operator: string; | |
3 | - value: string; | |
1 | +interface IConfiguration { | |
2 | + type?: string; | |
4 | 3 | } |
5 | -interface createRule { | |
6 | - id: number; | |
7 | - alarmVisible: boolean; | |
8 | - addKeyFilterVisible: boolean; | |
9 | - detailVisible: boolean; | |
10 | - detail: string; | |
11 | - filterList?: alarmRuleFilter[]; | |
4 | +interface ITansportConfiguration { | |
5 | + type?: string; | |
12 | 6 | } |
13 | -interface clearRule { | |
14 | - detail: string; | |
15 | -} | |
16 | - | |
17 | 7 | interface provisionConfigurationD { |
18 | - provisionDeviceSecret: string; | |
8 | + provisionDeviceSecret?: string; | |
19 | 9 | } |
20 | - | |
21 | -interface IAddAlarms { | |
22 | - id: number; | |
23 | - alarmType: string; | |
24 | - createRules: object; | |
25 | - clearRule: object; | |
26 | - propagate: true; | |
10 | +type ICreateRule = {}; | |
11 | +type IClearRule = { | |
12 | + id: string; | |
13 | + alarmDetails: string; | |
14 | + dashboardId: { | |
15 | + id: string; | |
16 | + entityType: string; | |
17 | + }; | |
18 | + propagate: string; | |
27 | 19 | propagateRelationTypes: string[]; |
28 | -} | |
29 | -interface IAddClearAlarms { | |
30 | - id: number; | |
20 | + schedule: { | |
21 | + type: string; | |
22 | + }; | |
23 | + condition: object; | |
24 | +}; | |
25 | +interface IAlarms { | |
26 | + id: string; | |
31 | 27 | alarmType: string; |
32 | - clearRules: object; | |
33 | - propagate: true; | |
28 | + createRules: ICreateRule; | |
29 | + clearRule?: IClearRule[]; | |
30 | + propagate: boolean; | |
34 | 31 | propagateRelationTypes: string[]; |
35 | 32 | } |
36 | 33 | |
37 | -export interface alarmListItem { | |
38 | - configuration?: object; | |
39 | - transportConfiguration?: object; | |
34 | +export interface IProfileData { | |
35 | + configuration?: IConfiguration; | |
36 | + transportConfiguration?: ITansportConfiguration; | |
40 | 37 | provisionConfiguration?: provisionConfigurationD; |
41 | - // id?: number; | |
42 | - alarms?: IAddAlarms[]; | |
43 | - clearAlarms?: IAddClearAlarms[]; | |
44 | - // alarmType?: string; | |
45 | - // messageMode?: string; | |
46 | - // createRule?: createRule[]; | |
47 | - // clearRule?: clearRule[]; | |
48 | - // propagate?: boolean; | |
49 | - // propagateRelationTypes?: string[]; | |
38 | + alarms?: IAlarms[]; | |
50 | 39 | } | ... | ... |