简柏林 / thingskit-front · Commits

Commit d20550a7869966153d7630bbfcb6117ab0e48e72

Authored by 1400859700@qq.com
2 parents 9ade13f0 ca172cea

Merge branch 'ft-dev' of http://git.yuntengiot.com/huang/yun-teng-iot-front into ft-dev

Inline Side-by-side
Showing 12 changed files with 530 additions and 243 deletions
  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 +};
  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 +}
  1 +export interface UploadApiResult {
  2 + message: string;
  3 + code: number;
  4 + url: string;
  5 +}
  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,10 +29,16 @@
29 :text="t('layout.header.dropdownItemLoginOut')" 29 :text="t('layout.header.dropdownItemLoginOut')"
30 icon="ion:power-outline" 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 </Menu> 37 </Menu>
33 </template> 38 </template>
34 </Dropdown> 39 </Dropdown>
35 <LockAction @register="register" /> 40 <LockAction @register="register" />
  41 + <PersonalChild @register="registerPersonal" />
36 </template> 42 </template>
37 <script lang="ts"> 43 <script lang="ts">
38 // components 44 // components
@@ -54,7 +60,7 @@ @@ -54,7 +60,7 @@
54 60
55 import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent'; 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 export default defineComponent({ 65 export default defineComponent({
60 name: 'UserDropdown', 66 name: 'UserDropdown',
@@ -64,6 +70,7 @@ @@ -64,6 +70,7 @@
64 MenuItem: createAsyncComponent(() => import('./DropMenuItem.vue')), 70 MenuItem: createAsyncComponent(() => import('./DropMenuItem.vue')),
65 MenuDivider: Menu.Divider, 71 MenuDivider: Menu.Divider,
66 LockAction: createAsyncComponent(() => import('../lock/LockModal.vue')), 72 LockAction: createAsyncComponent(() => import('../lock/LockModal.vue')),
  73 + PersonalChild: createAsyncComponent(() => import('../personal/index.vue')),
67 }, 74 },
68 props: { 75 props: {
69 theme: propTypes.oneOf(['dark', 'light']), 76 theme: propTypes.oneOf(['dark', 'light']),
@@ -80,6 +87,7 @@ @@ -80,6 +87,7 @@
80 }); 87 });
81 88
82 const [register, { openModal }] = useModal(); 89 const [register, { openModal }] = useModal();
  90 + const [registerPersonal, { openModal: openModalPersonal }] = useModal();
83 91
84 function handleLock() { 92 function handleLock() {
85 openModal(true); 93 openModal(true);
@@ -106,10 +114,21 @@ @@ -106,10 +114,21 @@
106 case 'lock': 114 case 'lock':
107 handleLock(); 115 handleLock();
108 break; 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 return { 129 return {
  130 + registerPersonal,
  131 + openPersonalFunc,
113 prefixCls, 132 prefixCls,
114 t, 133 t,
115 getUserInfo, 134 getUserInfo,
@@ -4,6 +4,7 @@ export default { @@ -4,6 +4,7 @@ export default {
4 // user dropdown 4 // user dropdown
5 dropdownItemDoc: '文档', 5 dropdownItemDoc: '文档',
6 dropdownItemLoginOut: '退出系统', 6 dropdownItemLoginOut: '退出系统',
  7 + dropdownItemPersonal: '个人中心',
7 8
8 // tooltip 9 // tooltip
9 tooltipErrorLog: '错误日志', 10 tooltipErrorLog: '错误日志',
@@ -158,25 +158,11 @@ @@ -158,25 +158,11 @@
158 function handleRedo() { 158 function handleRedo() {
159 current.value = 0; 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 const handleSubmit = async () => { 161 const handleSubmit = async () => {
175 if (!unref(isUpdate)) { 162 if (!unref(isUpdate)) {
176 isGetStepThreeData.value.profileData = getStepThreeData.value; 163 isGetStepThreeData.value.profileData = getStepThreeData.value;
177 alarmProfileData.value.alarmProfile = 164 alarmProfileData.value.alarmProfile =
178 await proxy.$refs.DeviceProfileStep4Ref.getAllFields(); 165 await proxy.$refs.DeviceProfileStep4Ref.getAllFields();
179 - alarmProfileData.value.alarmProfile.id = generateUUID();  
180 Object.assign( 166 Object.assign(
181 postDeviceConfogData.value, 167 postDeviceConfogData.value,
182 getStepOneData.value, 168 getStepOneData.value,
@@ -10,62 +10,48 @@ @@ -10,62 +10,48 @@
10 alt="移除" 10 alt="移除"
11 src="../../../../assets/images/close.png" 11 src="../../../../assets/images/close.png"
12 /> 12 />
13 - <!-- <DeleteOutlined style="font-size: 20px" class="mr-2" /> -->  
14 </div> 13 </div>
15 </template> 14 </template>
16 <div class="alert-type" style="margin-left: -26px; margin-top: -10px"> 15 <div class="alert-type" style="margin-left: -26px; margin-top: -10px">
17 <BasicForm @register="registerForm" 16 <BasicForm @register="registerForm"
18 /></div> 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 <template #checkBox="{ model, field }"> 24 <template #checkBox="{ model, field }">
24 <Checkbox v-model:checked="model[field]">传递报警</Checkbox> 25 <Checkbox v-model:checked="model[field]">传递报警</Checkbox>
25 </template> 26 </template>
26 </BasicForm> 27 </BasicForm>
27 </div> 28 </div>
28 - </CollapseContainer> 29 + </div>
29 <p>创建报警规则</p> 30 <p>创建报警规则</p>
30 <template v-for="(childItem, createIndex) in item.alarms" :key="childItem.id"> 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 <div class="w-3/4"> 33 <div class="w-3/4">
33 <div style="margin-left: -30px; margin-top: 20px" 34 <div style="margin-left: -30px; margin-top: 20px"
34 ><BasicForm @register="registerFormCreateAlarm" /> 35 ><BasicForm @register="registerFormCreateAlarm" />
35 </div> 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 <Button size="small" type="primary" @click="handleOpenAlaramRuleConditions" 40 <Button size="small" type="primary" @click="handleOpenAlaramRuleConditions"
40 >添加</Button 41 >添加</Button
41 > 42 >
42 <p>{{ ruleTemplateData }}</p> 43 <p>{{ ruleTemplateData }}</p>
43 - <!-- <PlusOutlined  
44 - @click="handleOpenAlaramRuleConditions"  
45 - class="cursor-pointer ml-4"  
46 - style="font-size: 20px"  
47 - />{{ ruleTemplateData }} -->  
48 </div> 44 </div>
49 <div style="white-space: wrap" class="mt-4 ml-4" 45 <div style="white-space: wrap" class="mt-4 ml-4"
50 >启用规则： 46 >启用规则：
51 <Button size="small" type="primary" @click="handleOpenEnableRule">添加</Button> 47 <Button size="small" type="primary" @click="handleOpenEnableRule">添加</Button>
52 <p>{{ enableTemplateData }}</p> 48 <p>{{ enableTemplateData }}</p>
53 - <!-- <EditOutlined  
54 - @click="handleOpenEnableRule"  
55 - class="cursor-pointer ml-4"  
56 - style="font-size: 20px"  
57 - /> -->  
58 <div class="mt-4 ml-4" style="margin-left: 0px" 49 <div class="mt-4 ml-4" style="margin-left: 0px"
59 >详情模板： 50 >详情模板：
60 <Button size="small" type="primary" @click="handleOpenDetailTemplate" 51 <Button size="small" type="primary" @click="handleOpenDetailTemplate"
61 >添加</Button 52 >添加</Button
62 > 53 >
63 <p>{{ detailTemplateData }}</p> 54 <p>{{ detailTemplateData }}</p>
64 - <!-- <EditOutlined  
65 - @click="handleOpenDetailTemplate"  
66 - class="cursor-pointer ml-4"  
67 - style="font-size: 20px"  
68 - /> -->  
69 </div> 55 </div>
70 <div style="margin-left: 0px; position: relative"> 56 <div style="margin-left: 0px; position: relative">
71 <BasicForm @register="dashboardForm" /> 57 <BasicForm @register="dashboardForm" />
@@ -74,7 +60,7 @@ @@ -74,7 +60,7 @@
74 </div> 60 </div>
75 <div 61 <div
76 class="remove-type" 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 <img 65 <img
80 style="cursor: pointer" 66 style="cursor: pointer"
@@ -82,13 +68,6 @@ @@ -82,13 +68,6 @@
82 alt="移除" 68 alt="移除"
83 src="../../../../assets/images/close.png" 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 </div> 71 </div>
93 </div> 72 </div>
94 </div> 73 </div>
@@ -98,7 +77,10 @@ @@ -98,7 +77,10 @@
98 > 77 >
99 <div style="height: 20px"></div> 78 <div style="height: 20px"></div>
100 <p>清除报警规则</p> 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 <div class="aic mb-1" style="border: 1px solid #bfbfbf"> 84 <div class="aic mb-1" style="border: 1px solid #bfbfbf">
103 <div class="w-3/4"> 85 <div class="w-3/4">
104 <div style="margin-left: 5px"> 86 <div style="margin-left: 5px">
@@ -108,11 +90,6 @@ @@ -108,11 +90,6 @@
108 >添加</Button 90 >添加</Button
109 > 91 >
110 <p>{{ ruleClearTemplateData }}</p> 92 <p>{{ ruleClearTemplateData }}</p>
111 - <!-- <PlusOutlined  
112 - @click="handleOpenClearAlaramRuleConditions"  
113 - class="cursor-pointer ml-4"  
114 - style="font-size: 20px"  
115 - /> -->  
116 </div> 93 </div>
117 <div style="white-space: wrap" class="mt-4 ml-4" 94 <div style="white-space: wrap" class="mt-4 ml-4"
118 >启用规则： 95 >启用规则：
@@ -120,49 +97,21 @@ @@ -120,49 +97,21 @@
120 >添加</Button 97 >添加</Button
121 > 98 >
122 <p>{{ enableClearTemplateData }}</p> 99 <p>{{ enableClearTemplateData }}</p>
123 - <!-- <EditOutlined  
124 - @click="handleOpenClearEnableRule"  
125 - class="cursor-pointer ml-4"  
126 - style="font-size: 20px"  
127 - /> -->  
128 <div class="mt-4 ml-4" style="margin-left: 0px" 100 <div class="mt-4 ml-4" style="margin-left: 0px"
129 >详情模板： 101 >详情模板：
130 <Button size="small" type="primary" @click="handleOpenClearDetailTemplate" 102 <Button size="small" type="primary" @click="handleOpenClearDetailTemplate"
131 >添加</Button 103 >添加</Button
132 > 104 >
133 <p>{{ detailClearTemplateData }}</p> 105 <p>{{ detailClearTemplateData }}</p>
134 - <!-- <EditOutlined  
135 - @click="handleOpenClearDetailTemplate"  
136 - class="cursor-pointer ml-4"  
137 - style="font-size: 20px"  
138 - /> -->  
139 </div> 106 </div>
140 <div style="margin-left: 0px"> 107 <div style="margin-left: 0px">
141 <BasicForm @register="dashboardForm" /> 108 <BasicForm @register="dashboardForm" />
142 </div> 109 </div>
143 </div> 110 </div>
144 </div> 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 </div> 112 </div>
161 </div> 113 </div>
162 </template> 114 </template>
163 - <!-- <a-button style="border-radius: 10px" class="mt-5" @click="addClearRole(index)"  
164 - ><PlusCircleOutlined />添加清除条件</a-button  
165 - > -->  
166 </CollapseContainer> 115 </CollapseContainer>
167 </template> 116 </template>
168 </div> 117 </div>
@@ -217,7 +166,7 @@ @@ -217,7 +166,7 @@
217 166
218 <script lang="ts"> 167 <script lang="ts">
219 import { defineComponent, ref, unref, getCurrentInstance, watch } from 'vue'; 168 import { defineComponent, ref, unref, getCurrentInstance, watch } from 'vue';
220 - import type { alarmListItem } from '../types/index'; 169 + import type { IProfileData } from '../types/index';
221 import { CollapseContainer } from '/@/components/Container/index'; 170 import { CollapseContainer } from '/@/components/Container/index';
222 import { BasicForm, useForm } from '/@/components/Form'; 171 import { BasicForm, useForm } from '/@/components/Form';
223 import { 172 import {
@@ -227,13 +176,7 @@ @@ -227,13 +176,7 @@
227 dashboardFormScheme, 176 dashboardFormScheme,
228 isWhereType, 177 isWhereType,
229 } from './data'; 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 import { Checkbox } from 'ant-design-vue'; 180 import { Checkbox } from 'ant-design-vue';
238 import { useModal } from '/@/components/Modal'; 181 import { useModal } from '/@/components/Modal';
239 import DetailTemplate from './cpns/detailtemplate/index.vue'; 182 import DetailTemplate from './cpns/detailtemplate/index.vue';
@@ -241,17 +184,14 @@ @@ -241,17 +184,14 @@
241 import AlarmRuleConditions from './cpns/alarmruleconditions/index.vue'; 184 import AlarmRuleConditions from './cpns/alarmruleconditions/index.vue';
242 import { Button } from '/@/components/Button'; 185 import { Button } from '/@/components/Button';
243 186
  187 + export const isWhereTypeValueDisabled = ref(false);
  188 +
244 export default defineComponent({ 189 export default defineComponent({
245 components: { 190 components: {
246 BasicForm, 191 BasicForm,
247 CollapseContainer, 192 CollapseContainer,
248 - DeleteOutlined,  
249 - // MinusCircleOutlined,  
250 PlusCircleOutlined, 193 PlusCircleOutlined,
251 - PlusOutlined,  
252 - EditOutlined,  
253 Checkbox, 194 Checkbox,
254 - // Tooltip,  
255 DetailTemplate, 195 DetailTemplate,
256 EnableRule, 196 EnableRule,
257 AlarmRuleConditions, 197 AlarmRuleConditions,
@@ -283,34 +223,7 @@ @@ -283,34 +223,7 @@
283 const enableClearTemplateData: any = ref(null); 223 const enableClearTemplateData: any = ref(null);
284 const detailClearTemplateData: any = ref(null); 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 const log = (e) => { 227 const log = (e) => {
315 console.log(e); 228 console.log(e);
316 }; 229 };
@@ -324,35 +237,44 @@ @@ -324,35 +237,44 @@
324 }; 237 };
325 238
326 const addAlarmRule = () => { 239 const addAlarmRule = () => {
327 - // console.log(profileData.value.alarms.length)  
328 unref(profileData).push({ 240 unref(profileData).push({
329 - configuration: {},  
330 - transportConfiguration: {}, 241 + configuration: {
  242 + type: '',
  243 + },
  244 + transportConfiguration: {
  245 + type: '',
  246 + },
331 provisionConfiguration: { 247 provisionConfiguration: {
332 provisionDeviceSecret: '', 248 provisionDeviceSecret: '',
333 }, 249 },
334 alarms: [ 250 alarms: [
335 { 251 {
336 - id: Date.now() + Math.random(), 252 + id: Date.now() + Math.random() + '',
337 alarmType: '', 253 alarmType: '',
338 createRules: {}, 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 propagateRelationTypes: [''], 272 propagateRelationTypes: [''],
351 }, 273 },
352 ], 274 ],
353 }); 275 });
354 }; 276 };
355 - //Mobile dashboard: 277 + //TODO Mobile dashboard:
356 const [dashboardForm] = useForm({ 278 const [dashboardForm] = useForm({
357 labelWidth: 120, 279 labelWidth: 120,
358 schemas: dashboardFormScheme, 280 schemas: dashboardFormScheme,
@@ -430,42 +352,47 @@ @@ -430,42 +352,47 @@
430 // 添加‘创建条件’ 352 // 添加‘创建条件’
431 const addCreateRole = (index: number) => { 353 const addCreateRole = (index: number) => {
432 unref(profileData)[index].alarms.push({ 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 const deleteCondition = (index: number, createIndex: number) => { 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 watch(isWhereType, (nV) => { 382 watch(isWhereType, (nV) => {
461 isWhereTypeValue.value = nV; 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 const getAllFieldsFunc = (v) => { 391 const getAllFieldsFunc = (v) => {
465 detailObj.value = v; 392 detailObj.value = v;
466 detailTemplateData.value = ` 393 detailTemplateData.value = `
467 - 报警详细信息:${v.alarmDetails}  
468 - `; 394 + 报警详细信息:${v.alarmDetails}
  395 + `;
469 }; 396 };
470 //启用规则 397 //启用规则
471 const getAllFieldsEnabFunc = (v) => { 398 const getAllFieldsEnabFunc = (v) => {
@@ -509,10 +436,12 @@ @@ -509,10 +436,12 @@
509 console.log(e); 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 const getAllFieldsRuleFunc = (v, v1) => { 447 const getAllFieldsRuleFunc = (v, v1) => {
@@ -537,8 +466,8 @@ @@ -537,8 +466,8 @@
537 } 466 }
538 }); 467 });
539 ruleTemplateData.value = ` 468 ruleTemplateData.value = `
540 - 键名:${v.key1}...操作:${findRuleByValue?.label}...值:${v.value1}  
541 - `; 469 + 键名:${v.key1}...操作:${findRuleByValue?.label}...值:${v.value1}
  470 + `;
542 471
543 ruleLastObj.value = v1; 472 ruleLastObj.value = v1;
544 const predicate = { 473 const predicate = {
@@ -583,8 +512,8 @@ @@ -583,8 +512,8 @@
583 const getAllClearFieldsFunc = (v) => { 512 const getAllClearFieldsFunc = (v) => {
584 detailClearObj.value = v; 513 detailClearObj.value = v;
585 detailClearTemplateData.value = ` 514 detailClearTemplateData.value = `
586 - 报警详细信息:${v.alarmDetails}  
587 - `; 515 + 报警详细信息:${v.alarmDetails}
  516 + `;
588 }; 517 };
589 //启用规则 518 //启用规则
590 const getAllClearFieldsEnabFunc = (v) => { 519 const getAllClearFieldsEnabFunc = (v) => {
@@ -628,9 +557,11 @@ @@ -628,9 +557,11 @@
628 console.log(e); 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 const getAllClearFieldsRuleFunc = (v, v1) => { 567 const getAllClearFieldsRuleFunc = (v, v1) => {
@@ -655,8 +586,8 @@ @@ -655,8 +586,8 @@
655 } 586 }
656 }); 587 });
657 ruleClearTemplateData.value = ` 588 ruleClearTemplateData.value = `
658 - 键名:${v.key1}...操作:${findRuleByValue?.label}...值:${v.value1}  
659 - `; 589 + 键名:${v.key1}...操作:${findRuleByValue?.label}...值:${v.value1}
  590 + `;
660 591
661 ruleLastObj.value = v1; 592 ruleLastObj.value = v1;
662 const predicate = { 593 const predicate = {
@@ -696,6 +627,19 @@ @@ -696,6 +627,19 @@
696 }; 627 };
697 Object.assign(addClearitionalObj.value, getValueConditon); 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 const handleFormStep3toStep4Next = async () => { 643 const handleFormStep3toStep4Next = async () => {
700 try { 644 try {
701 const scheduleClearValue = { 645 const scheduleClearValue = {
@@ -744,6 +688,9 @@ @@ -744,6 +688,9 @@
744 const valueRegisterFormAndId = { 688 const valueRegisterFormAndId = {
745 alarmType: Object.values(valueRegisterForm)[0], 689 alarmType: Object.values(valueRegisterForm)[0],
746 }; 690 };
  691 + const objectId = {
  692 + id: generateUUID(),
  693 + };
747 const valueRegisterFormHighSetting = await validateRegisterFormHighSetting(); 694 const valueRegisterFormHighSetting = await validateRegisterFormHighSetting();
748 const valueRegisterFormCreateAlarm = await validateRegisterFormCreateAlarm(); 695 const valueRegisterFormCreateAlarm = await validateRegisterFormCreateAlarm();
749 console.log(valueRegisterFormCreateAlarm); 696 console.log(valueRegisterFormCreateAlarm);
@@ -756,7 +703,8 @@ @@ -756,7 +703,8 @@
756 valueRegisterFormAndId, 703 valueRegisterFormAndId,
757 getValueRegisterFormHighSetting, 704 getValueRegisterFormHighSetting,
758 getCreateRulesAllObj, 705 getCreateRulesAllObj,
759 - getClearRulesAllObj 706 + getClearRulesAllObj,
  707 + objectId
760 ); 708 );
761 alarmss.value.push(emptyObj.value); 709 alarmss.value.push(emptyObj.value);
762 const getAlarms = { 710 const getAlarms = {
@@ -827,8 +775,6 @@ @@ -827,8 +775,6 @@
827 handleOpenClearDetailTemplate, 775 handleOpenClearDetailTemplate,
828 handleOpenClearEnableRule, 776 handleOpenClearEnableRule,
829 handleOpenClearAlaramRuleConditions, 777 handleOpenClearAlaramRuleConditions,
830 - addClearRole,  
831 - deleteClearCondition,  
832 detailTemplateData, 778 detailTemplateData,
833 enableTemplateData, 779 enableTemplateData,
834 ruleTemplateData, 780 ruleTemplateData,
@@ -28,6 +28,7 @@ export const formSchema: FormSchema[] = [ @@ -28,6 +28,7 @@ export const formSchema: FormSchema[] = [
28 colProps: { span: 12 }, 28 colProps: { span: 12 },
29 required: true, 29 required: true,
30 component: 'Select', 30 component: 'Select',
  31 + defaultValue: 'ANY_TIME',
31 componentProps: { 32 componentProps: {
32 placeholder: '请选择报警日程表', 33 placeholder: '请选择报警日程表',
33 options: [ 34 options: [
@@ -5,6 +5,7 @@ import { deviceConfigGetRuleChain } from '/@/api/device/deviceConfigApi'; @@ -5,6 +5,7 @@ import { deviceConfigGetRuleChain } from '/@/api/device/deviceConfigApi';
5 import { ref } from 'vue'; 5 import { ref } from 'vue';
6 import { findDictItemByCode } from '/@/api/system/dict'; 6 import { findDictItemByCode } from '/@/api/system/dict';
7 import { alarmContactGetPage } from '/@/api/device/deviceConfigApi'; 7 import { alarmContactGetPage } from '/@/api/device/deviceConfigApi';
  8 +import { isWhereTypeValueDisabled } from './DeviceProfileStep3.vue';
8 9
9 export const step1Schemas: FormSchema[] = [ 10 export const step1Schemas: FormSchema[] = [
10 { 11 {
@@ -146,39 +147,85 @@ export const isWhereType = ref(null); @@ -146,39 +147,85 @@ export const isWhereType = ref(null);
146 147
147 export const step3CreateAlarm: FormSchema[] = [ 148 export const step3CreateAlarm: FormSchema[] = [
148 { 149 {
149 - field: 'WARNING', 150 + field: 'default',
150 component: 'Select', 151 component: 'Select',
151 label: '严重程度', 152 label: '严重程度',
152 colProps: { 153 colProps: {
153 span: 16, 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 interface provisionConfigurationD { 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 propagateRelationTypes: string[]; 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 alarmType: string; 27 alarmType: string;
32 - clearRules: object;  
33 - propagate: true; 28 + createRules: ICreateRule;
  29 + clearRule?: IClearRule[];
  30 + propagate: boolean;
34 propagateRelationTypes: string[]; 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 provisionConfiguration?: provisionConfigurationD; 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 }