Commit 84b86771fad1577e825779f0ba6f2542ddc2ce9e

Authored by xp.Huang
2 parents f33a4513 ac6ccef6

Merge branch 'f-dev' into 'main'

fix:修改地理位置弹窗 修改数据流转属性验证

See merge request huang/yun-teng-iot-front!258
... ... @@ -2,7 +2,7 @@
2 2 <div class="wrapper">
3 3 <div ref="wrapRef" :style="{ height, width }"> </div>
4 4 <div class="right-wrap">
5   - <BasicTable @register="registerTable" @rowClick="deviceRowClick">
  5 + <BasicTable style="cursor: pointer" @register="registerTable" @rowClick="deviceRowClick">
6 6 <template #deviceState="{ record }">
7 7 <Tag
8 8 :color="
... ... @@ -230,24 +230,28 @@
230 230 const BMap = (window as any).BMap;
231 231 const wrapEl = unref(wrapRef);
232 232 const map = new BMap.Map(wrapEl);
233   - if (record.deviceInfo.address) {
234   - keys = await getDeviceDataKeys(entityId);
235   - const { name, organizationDTO, deviceState, deviceProfile } = record;
236   - const { longitude, latitude, address } = record.deviceInfo;
237   - const point = new BMap.Point(longitude, latitude);
238   - let options = {
239   - width: 330, // 信息窗口宽度
240   - height: 0, // 信息窗口高度
241   - };
242   - map.centerAndZoom(point, 15);
243   - map.enableScrollWheelZoom(true);
244   - // 创建信息窗口对象
245   - const res = await getDeviceActiveTime(entityId);
  233 + // if (record.deviceInfo.address) {
  234 + keys = await getDeviceDataKeys(entityId);
  235 + const { name, organizationDTO, deviceState, deviceProfile } = record;
  236 + const { longitude, latitude, address } = record.deviceInfo;
  237 + //这里如果没有地理位置 最好设置一个默认位置 不然地图会全蓝
  238 + const point = new BMap.Point(
  239 + longitude == '' ? 104.04666605565338 : longitude,
  240 + latitude == '' ? 30.543516387560476 : latitude
  241 + );
  242 + let options = {
  243 + width: 330, // 信息窗口宽度
  244 + height: 0, // 信息窗口高度
  245 + };
  246 + map.centerAndZoom(point, 15);
  247 + map.enableScrollWheelZoom(true);
  248 + // 创建信息窗口对象
  249 + const res = await getDeviceActiveTime(entityId);
246 250
247   - let { value: activeStatus, lastUpdateTs } = res[0];
248   - lastUpdateTs = moment(lastUpdateTs).format('YYYY-MM-DD HH:mm:ss');
249   - let infoWindow = new BMap.InfoWindow(
250   - `
  251 + let { value: activeStatus, lastUpdateTs } = res[0];
  252 + lastUpdateTs = moment(lastUpdateTs).format('YYYY-MM-DD HH:mm:ss');
  253 + let infoWindow = new BMap.InfoWindow(
  254 + `
251 255 <div style="display:flex;justify-content:space-between; margin:20px 0px;">
252 256 <div style="font-size:16px;font-weight:bold">${name}</div>
253 257 ${
... ... @@ -261,43 +265,45 @@
261 265 </div>
262 266 <div>所属组织:${organizationDTO.name}</div>
263 267 <div style="margin-top:6px;">接入协议:${deviceProfile.transportType}</div>
264   - <div style="margin-top:6px;">设备位置:${address}</div>
  268 + <div style="margin-top:6px;">设备位置:${
  269 + address == '' ? '该设备暂无地理位置' : address
  270 + }</div>
265 271 <div style="margin-top:6px;">${activeStatus ? '在' : '离'}线时间:${lastUpdateTs}</div>
266 272 <div style="display:flex;justify-content:end; margin-top:10px">
267 273 <button onclick="openDeviceInfoDrawer()" style="margin-right:10px;color:#fff;background-color:#409eff;padding:4px; border-radius:4px;">设备信息</button>
268 274 <button onclick="openHistoryModal()" style="color:#fff;background-color:#409eff;padding:4px; border-radius:4px;">历史数据</button>
269 275 </div>
270 276 `,
271   - options
272   - );
  277 + options
  278 + );
273 279
274   - map.openInfoWindow(infoWindow, map.getCenter());
275   - let preMarker = null;
  280 + map.openInfoWindow(infoWindow, map.getCenter());
  281 + let preMarker = null;
276 282
277   - const rivet = deviceState === 'INACTIVE' ? djx : deviceState === 'ONLINE' ? zx : lx;
278   - let myIcon = new BMap.Icon(rivet, new BMap.Size(20, 30));
279   - let marker = new BMap.Marker(point, { icon: myIcon });
280   - if (marker) {
281   - map.removeOverlay(preMarker);
282   - }
283   - map.addOverlay(marker);
284   - //标注监听事件
285   - marker.addEventListener('click', function () {
286   - map.openInfoWindow(infoWindow, map.getCenter());
287   - });
288   - //标注监听事件
289   - } else {
290   - const point = new BMap.Point(106.63028229687498, 36.06735821600903);
291   - let options = {
292   - width: 100, // 信息窗口宽度
293   - height: 100, // 信息窗口高度
294   - title: '提示', // 信息窗口标题
295   - };
296   - map.centerAndZoom(point, 5);
297   - map.enableScrollWheelZoom(true);
298   - let infoWindow = new BMap.InfoWindow('该设备暂无地理位置', options); // 创建信息窗口对象
299   - map.openInfoWindow(infoWindow, map.getCenter());
  283 + const rivet = deviceState === 'INACTIVE' ? djx : deviceState === 'ONLINE' ? zx : lx;
  284 + let myIcon = new BMap.Icon(rivet, new BMap.Size(20, 30));
  285 + let marker = new BMap.Marker(point, { icon: myIcon });
  286 + if (marker) {
  287 + map.removeOverlay(preMarker);
300 288 }
  289 + map.addOverlay(marker);
  290 + //标注监听事件
  291 + marker.addEventListener('click', function () {
  292 + map.openInfoWindow(infoWindow, map.getCenter());
  293 + });
  294 + //标注监听事件
  295 + // } else {
  296 + // const point = new BMap.Point(106.63028229687498, 36.06735821600903);
  297 + // let options = {
  298 + // width: 100, // 信息窗口宽度
  299 + // height: 100, // 信息窗口高度
  300 + // title: '提示', // 信息窗口标题
  301 + // };
  302 + // map.centerAndZoom(point, 5);
  303 + // map.enableScrollWheelZoom(true);
  304 + // let infoWindow = new BMap.InfoWindow('该设备暂无地理位置', options); // 创建信息窗口对象
  305 + // map.openInfoWindow(infoWindow, map.getCenter());
  306 + // }
301 307 };
302 308
303 309 // 设备信息
... ...
... ... @@ -86,6 +86,7 @@
86 86 type: '',
87 87 configuration: {},
88 88 name: '',
  89 + additionalInfo: {},
89 90 });
90 91 const editNextType = reactive({
91 92 type: '',
... ... @@ -97,6 +98,7 @@
97 98 editType.type = d.type;
98 99 editType.configuration = d.configuration;
99 100 editType.name = d.name;
  101 + editType.additionalInfo = d.additionalInfo;
100 102 };
101 103
102 104 const [registerDrawer, { setModalProps, closeModal }] = useModalInner(async (data) => {
... ... @@ -247,7 +249,6 @@
247 249 id,
248 250 additionalInfoV
249 251 );
250   -
251 252 if (!unref(isUpdate)) {
252 253 delete allPostForm.id;
253 254 }
... ... @@ -260,6 +261,17 @@
260 261 if (allPostForm.name == undefined) {
261 262 return createMessage.error('请填写名称');
262 263 }
  264 + //验证属性新增了必填
  265 + const isApiHeaders =
  266 + allPostForm?.configuration?.headers ||
  267 + allPostForm?.configuration?.otherProperties ||
  268 + allPostForm?.configuration?.clientProperties;
  269 + if (isApiHeaders && Object.keys(isApiHeaders).includes('')) {
  270 + return createMessage.error('请填写属性');
  271 + }
  272 + if (isApiHeaders && Object.values(isApiHeaders).includes('')) {
  273 + return createMessage.error('请填写属性');
  274 + }
263 275 await postAddConvertApi(allPostForm);
264 276 createMessage.success('数据流转新增成功');
265 277 emit('success');
... ... @@ -267,6 +279,19 @@
267 279 closeModal();
268 280 } else {
269 281 await addOrEditFunc();
  282 + if (!isEdit.value) {
  283 + //验证属性新增了必填
  284 + const isApiHeaders =
  285 + allPostForm?.configuration?.headers ||
  286 + allPostForm?.configuration?.otherProperties ||
  287 + allPostForm?.configuration?.clientProperties;
  288 + if (isApiHeaders && Object.keys(isApiHeaders).includes('')) {
  289 + return createMessage.error('请填写属性');
  290 + }
  291 + if (isApiHeaders && Object.values(isApiHeaders).includes('')) {
  292 + return createMessage.error('请填写属性');
  293 + }
  294 + }
270 295 await postAddConvertApi(isEdit.value ? noEditObj : allPostForm);
271 296 createMessage.success('数据流转编辑成功');
272 297 emit('success');
... ...
... ... @@ -269,7 +269,6 @@ export const modeMqttForm: FormSchema[] = [
269 269 field: 'name',
270 270 label: '名称',
271 271 colProps: { span: 12 },
272   - required: true,
273 272 component: 'Input',
274 273 componentProps: {
275 274 maxLength: 255,
... ... @@ -293,7 +292,6 @@ export const modeMqttForm: FormSchema[] = [
293 292 label: 'Host',
294 293 colProps: { span: 12 },
295 294 component: 'Input',
296   - required: true,
297 295 componentProps: {
298 296 maxLength: 255,
299 297 placeholder: '请输入Host',
... ... @@ -644,7 +642,7 @@ export const modeRabbitMqForm: FormSchema[] = [
644 642 field: 'description',
645 643 label: '说明',
646 644 colProps: { span: 12 },
647   - component: 'Input',
  645 + component: 'InputTextArea',
648 646 componentProps: {
649 647 maxLength: 255,
650 648 placeholder: '请输入说明',
... ...
... ... @@ -142,10 +142,11 @@
142 142 submitFunc: customSubmitFunc,
143 143 });
144 144
145   - const setStepTwoFieldsValueFunc = (v, v1) => {
  145 + const setStepTwoFieldsValueFunc = (v, v1, v2) => {
146 146 setFieldsValue(v);
147 147 setFieldsValue({
148 148 name: v1,
  149 + description: v2,
149 150 });
150 151 setFieldsValue({
151 152 password: v.credentials?.password,
... ... @@ -232,14 +233,17 @@
232 233 fileList1.value = [];
233 234 showImg1.value = false;
234 235 showImg1Pic.value = '';
  236 + caCertFileName.value = '';
235 237 } else if (e == 'F') {
236 238 fileList2.value = [];
237 239 showImg2.value = false;
238 240 showImg2Pic.value = '';
  241 + certFileName.value = '';
239 242 } else {
240 243 fileList3.value = [];
241 244 showImg3.value = false;
242 245 showImg3Pic.value = '';
  246 + privateKeyFileName.value = '';
243 247 }
244 248 } else {
245 249 const isLt5M = file.size / 1024 / 1024 < 5;
... ...
... ... @@ -42,12 +42,13 @@
42 42 await clearValidate(['name']);
43 43 };
44 44
45   - const setStepTwoFieldsValueFunc = async (v, v1) => {
  45 + const setStepTwoFieldsValueFunc = async (v, v1, v2) => {
46 46 clearName.value = v1;
47 47 setFieldsValue(v);
48 48 vType.value = v1;
49 49 setFieldsValue({
50 50 name: v1,
  51 + description: v2,
51 52 });
52 53 };
53 54
... ...
... ... @@ -160,14 +160,17 @@
160 160 fileList1.value = [];
161 161 showImg1.value = false;
162 162 showImg1Pic.value = '';
  163 + caCertFileName.value = '';
163 164 } else if (e == 'F') {
164 165 fileList2.value = [];
165 166 showImg2.value = false;
166 167 showImg2Pic.value = '';
  168 + certFileName.value = '';
167 169 } else {
168 170 fileList3.value = [];
169 171 showImg3.value = false;
170 172 showImg3Pic.value = '';
  173 + privateKeyFileName.value = '';
171 174 }
172 175 } else {
173 176 const isLt5M = file.size / 1024 / 1024 < 5;
... ... @@ -230,10 +233,11 @@
230 233 }
231 234 }
232 235 };
233   - const setStepTwoFieldsValueFunc = (v, v1) => {
  236 + const setStepTwoFieldsValueFunc = (v, v1, v2) => {
234 237 setFieldsValue(v);
235 238 setFieldsValue({
236 239 name: v1,
  240 + description: v2,
237 241 });
238 242 setFieldsValue({
239 243 password: v.credentials?.password,
... ...
... ... @@ -32,10 +32,11 @@
32 32 submitFunc: customSubmitFunc,
33 33 });
34 34
35   - const setStepTwoFieldsValueFunc = (v, v1) => {
  35 + const setStepTwoFieldsValueFunc = (v, v1, v2) => {
36 36 setFieldsValue(v);
37 37 setFieldsValue({
38 38 name: v1,
  39 + description: v2,
39 40 });
40 41 };
41 42 const customClearStepTwoValueFunc = async () => {
... ...
... ... @@ -95,19 +95,32 @@
95 95 try {
96 96 if (v.type == 'org.thingsboard.rule.engine.kafka.TbKafkaNode') {
97 97 isWhereComp.value = v.type;
98   - proxy.$refs.refTransferConfigKafka.setStepTwoFieldsValueFunc(v.configuration, v.name);
  98 + proxy.$refs.refTransferConfigKafka.setStepTwoFieldsValueFunc(
  99 + v.configuration,
  100 + v.name,
  101 + v?.additionalInfo?.description
  102 + );
99 103 } else if (v.type == 'org.thingsboard.rule.engine.mqtt.TbMqttNode') {
100 104 isWhereComp.value = v.type;
101   - proxy.$refs.refTransferConfigMqtt.setStepTwoFieldsValueFunc(v.configuration, v.name);
  105 + proxy.$refs.refTransferConfigMqtt.setStepTwoFieldsValueFunc(
  106 + v.configuration,
  107 + v.name,
  108 + v?.additionalInfo?.description
  109 + );
102 110 } else if (v.type == 'org.thingsboard.rule.engine.rabbitmq.TbRabbitMqNode') {
103 111 isWhereComp.value = v.type;
104 112 proxy.$refs.refTransferConfigRabbitMq.setStepTwoFieldsValueFunc(
105 113 v.configuration,
106   - v.name
  114 + v.name,
  115 + v?.additionalInfo?.description
107 116 );
108 117 } else if (v.type == 'org.thingsboard.rule.engine.rest.TbRestApiCallNode') {
109 118 isWhereComp.value = v.type;
110   - proxy.$refs.refTransferConfigApi.setStepTwoFieldsValueFunc(v.configuration, v.name);
  119 + proxy.$refs.refTransferConfigApi.setStepTwoFieldsValueFunc(
  120 + v.configuration,
  121 + v.name,
  122 + v?.additionalInfo?.description
  123 + );
111 124 }
112 125 } catch (e) {
113 126 return e;
... ...