设备定位方式界面

vue/src/views/iot/device/device-edit.vue

@@ -43,27 +43,23 @@
                         </el-form-item>
                     </el-col>
                     <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
-                        <!--
-                        <el-form-item label="设备图片" prop="imageUrl">
-                            <el-image style="height:225px;border:1px solid #dee4ed;border-radius:5px;padding:5px;" :src="imageUrl" :preview-src-list="[imageUrl]" fit="cover"></el-image>
-                        </el-form-item>
-                        -->
-                        <el-form-item label="自定义位置" prop="isCustomLocation">
-                            <el-switch v-model="form.isCustomLocation" active-text="" inactive-text="" :active-value="1" :inactive-value="0">
-                            </el-switch>
+                        <el-form-item label="定位方式" prop="isCustomLocation">
+                            <el-select v-model="form.isCustomLocation" placeholder="请选择设备状态" clearable size="small">
+                                <el-option v-for="dict in dict.type.iot_location_way" :key="dict.value" :label="dict.label" :value="Number(dict.value)" />
+                            </el-select>
                         </el-form-item>
                         <el-form-item label="设备经度" prop="longitude">
-                            <el-input v-model="form.longitude" placeholder="请输入设备经度" type="number" :disabled="form.isCustomLocation==0">
+                            <el-input v-model="form.longitude" placeholder="请输入设备经度" type="number" :disabled="form.isCustomLocation!=3">
                                 <el-link slot="append" :underline="false" href="https://api.map.baidu.com/lbsapi/getpoint/index.html" target="_blank">坐标拾取</el-link>
                             </el-input>
                         </el-form-item>
                         <el-form-item label="设备纬度" prop="latitude">
-                            <el-input v-model="form.latitude" placeholder="请输入设备纬度" type="number" :disabled="form.isCustomLocation==0">
+                            <el-input v-model="form.latitude" placeholder="请输入设备纬度" type="number" :disabled="form.isCustomLocation!=3">
                                 <el-link slot="append" :underline="false" href="https://api.map.baidu.com/lbsapi/getpoint/index.html" target="_blank">坐标拾取</el-link>
                             </el-input>
                         </el-form-item>
                         <el-form-item label="所在地址" prop="networkAddress">
-                            <el-input v-model="form.networkAddress" placeholder="请输入设备所在地址" :disabled="form.isCustomLocation==0" />
+                            <el-input v-model="form.networkAddress" placeholder="请输入设备所在地址" :disabled="form.isCustomLocation!=3" />
                         </el-form-item>
                         <el-form-item label="入网地址" prop="networkIp">
                             <el-input v-model="form.networkIp" placeholder="设备入网IP" disabled />
@@ -108,12 +104,10 @@
             <device-timer ref="deviceTimer" :device="form" />
         </el-tab-pane>
 
-        
-         <el-tab-pane name="deviceUser" :disabled="form.deviceId==0">
+        <el-tab-pane name="deviceUser" :disabled="form.deviceId==0">
             <span slot="label">设备用户</span>
             <device-user ref="deviceUser" :device="form" @userEvent="getUserData($event)" />
         </el-tab-pane>
-       
 
         <el-tab-pane name="deviceLog" :disabled="form.deviceId==0">
             <span slot="label">设备日志</span>
@@ -164,7 +158,7 @@ import {
 
 export default {
     name: "DeviceEdit",
-    dicts: ['iot_device_status'],
+    dicts: ['iot_device_status','iot_location_way'],
     components: {
         deviceLog,
         deviceUser,
@@ -199,6 +193,7 @@ export default {
             form: {
                 productId: 0,
                 status: 1,
+                isCustomLocation: 1,
             },
             // 图片地址
             imageUrl: require('@/assets/images/product.jpg'),
@@ -239,11 +234,11 @@ export default {
     },
     methods: {
         /** 数据同步*/
-        dataSynchronization(){
+        dataSynchronization() {
             getDevice(this.form.deviceId).then(response => {
                 this.form = response.data;
                 // 选项卡切换
-                this.activeName='runningStatus';
+                this.activeName = 'runningStatus';
                 // 禁用状态
                 if (this.form.status == 2) {
                     this.deviceStatus = 1;
@@ -315,7 +310,7 @@ export default {
                 updateBy: null,
                 updateTime: null,
                 remark: null,
-                isCustomLocation: 0,
+                isCustomLocation: 1,
             };
             this.deviceStatus = 0;
             this.resetForm("form");

vue/src/views/iot/device/device-statistic.vue

@@ -1,6 +1,6 @@
 <template>
 <div style="padding-left:20px;">
-    <el-row>
+    <el-row >
         <el-col :span="24">
             <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="75px" style="">
                 <el-form-item label="时间范围">
@@ -11,10 +11,10 @@
             </el-form-item>
             </el-form>
         </el-col>
-        <el-col :span="24">
+        <el-col :span="23">
             <div v-for="(item,index) in monitorThings" :key="index" style="margin-bottom:30px;">
-                <el-card shadow="hover" :body-style="{ padding: '10px 0px',overflow:'auto' }" v-loading="loading">
-                    <div ref="statisticMap" style="height:300px;width:1450px;"></div>
+                <el-card shadow="always" :body-style="{ padding: '10px 0px',overflow:'auto' }" v-loading="loading">
+                    <div ref="statisticMap" style="height:300px;width:1080px;" ></div>
                 </el-card>
             </div>
         </el-col>
@@ -70,7 +70,7 @@ export default {
     },
     mounted() {
 
-    },
+},
     methods: {
         /** 获取物模型*/
         getCacheThingsModdel(productId) {
@@ -120,8 +120,13 @@ export default {
         },
         /**监测统计数据 */
         getStatistic() {
+            
             let color = ['#1890FF', '#91CB74', '#FAC858', '#EE6666', '#73C0DE', '#3CA272', '#FC8452', '#9A60B4', '#ea7ccc'];
             for (let i = 0; i < this.monitorThings.length; i++) {
+                // 设置宽度
+                this.$refs.statisticMap[i].style.width=(document.documentElement.clientWidth-510)+"px";
+                console.log(this.$refs.statisticMap[i]);
+
                 this.chart[i] = echarts.init(this.$refs.statisticMap[i]);
                 var option;
                 option = {

vue/src/views/iot/device/index.vue

@@ -50,9 +50,10 @@
                     <el-row :gutter="10">
                         <el-col :span="15">
                             <div style="text-align:left;line-height:40px;font-size:14px;">
-                                <dict-tag :options="dict.type.iot_device_status" :value="item.status" size="small" style="width:60px;display:inline-block;" />
+                                <dict-tag :options="dict.type.iot_device_status" :value="item.status" size="small" style="display:inline-block;margin-right:10px;" />
                                 <el-tag type="success" size="small" v-if="item.isShadow==1">启用影子</el-tag>
                                 <el-tag type="info" size="small" v-else>禁用影子</el-tag>
+                                <dict-tag :options="dict.type.iot_location_way" :value="item.isCustomLocation" size="small" style="display:inline-block;margin-left:10px;" />
                             </div>
                             <el-descriptions :column="1" size="mini">
                                 <el-descriptions-item label="编号">
@@ -196,7 +197,7 @@ import {
 
 export default {
     name: "Device",
-    dicts: ['iot_device_status', 'iot_is_enable'],
+    dicts: ['iot_device_status', 'iot_is_enable','iot_location_way'],
     components: {
         mqttClient
     },
@@ -429,7 +430,7 @@ export default {
             this.getCacheThingsModdel(item.productId);
             // Mqtt发布实时监测
             let model = {};
-            model.name = "";
+            model.name = "实时监测";
             model.value = this.monitorNumber;
             this.mqttPublish(4, item, model);
         },