feat(components): 百度地图

修复压测界面全屏问题
dgiot · Jun 23, 2022 · a0e11b4 · a0e11b4
1 parent 532b3a4
commit a0e11b4
Show file tree

Hide file tree

Showing 12 changed files with 255 additions and 7 deletions.
diff --git a/CHANGELOG.EN.md b/CHANGELOG.EN.md
@@ -12,6 +12,7 @@
 ### Features
 
 * **components:** 设备管理 ([0a9756c](https://github.com/dgiot/dgiot-dashboard/commit/0a9756cadaa45a0796f345fa064c1f1f239af7ee))
+* **components:** 云压测 ([ed99eee](https://github.com/dgiot/dgiot-dashboard/commit/ed99eee177a5947609cfa35998bdd1f8b3d3a9ab))
 * **projects:** 云压测 ([97a7f62](https://github.com/dgiot/dgiot-dashboard/commit/97a7f62e0b32949dc2bc4d1297a30befa76fe583))
 * **projects:** scripts ([d4566d9](https://github.com/dgiot/dgiot-dashboard/commit/d4566d90c7ca08ef84107f2a7ff3b8b8cf0da6e8))
 

diff --git a/CHANGELOG.ZH.md b/CHANGELOG.ZH.md
@@ -12,6 +12,7 @@
 ### Features
 
 * **components:** 设备管理 ([0a9756c](https://github.com/dgiot/dgiot-dashboard/commit/0a9756cadaa45a0796f345fa064c1f1f239af7ee))
+* **components:** 云压测 ([ed99eee](https://github.com/dgiot/dgiot-dashboard/commit/ed99eee177a5947609cfa35998bdd1f8b3d3a9ab))
 * **projects:** 云压测 ([97a7f62](https://github.com/dgiot/dgiot-dashboard/commit/97a7f62e0b32949dc2bc4d1297a30befa76fe583))
 * **projects:** scripts ([d4566d9](https://github.com/dgiot/dgiot-dashboard/commit/d4566d90c7ca08ef84107f2a7ff3b8b8cf0da6e8))
 

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -12,6 +12,7 @@
 ### Features
 
 * **components:** 设备管理 ([0a9756c](https://github.com/dgiot/dgiot-dashboard/commit/0a9756cadaa45a0796f345fa064c1f1f239af7ee))
+* **components:** 云压测 ([ed99eee](https://github.com/dgiot/dgiot-dashboard/commit/ed99eee177a5947609cfa35998bdd1f8b3d3a9ab))
 * **projects:** 云压测 ([97a7f62](https://github.com/dgiot/dgiot-dashboard/commit/97a7f62e0b32949dc2bc4d1297a30befa76fe583))
 * **projects:** scripts ([d4566d9](https://github.com/dgiot/dgiot-dashboard/commit/d4566d90c7ca08ef84107f2a7ff3b8b8cf0da6e8))
 

diff --git a/src/config/net.config.js b/src/config/net.config.js
@@ -3,7 +3,7 @@ module.exports = {
   proxy,
   baseURL: proxy[0].path,
   contentType: 'application/json',
-  requestTimeout: 1000 * 1 * 30,
+  requestTimeout: 1000 * 60 * 3,
   successCode: [
     200,
     0,

diff --git a/src/dgiot/components/DgiotAmis/render.vue b/src/dgiot/components/DgiotAmis/render.vue
@@ -118,10 +118,11 @@
             config.headers = headers || {}
             config.method = method
             _.merge(config.headers, {
-              author: 'iotn2n',
               platform: 'amis',
               departmentToken: store.getters['user/departmentToken'],
               sessionToken: store.getters['user/token'],
+              author: 'h7ml',
+              email: 'h7ml@qq.com',
             })
             if (method === 'get' && data) {
               config.params = data
@@ -197,6 +198,12 @@
             console.log('replaceArr', replaceArr)
             console.info('请求url', url)
             console.groupEnd()
+            if (url.indexOf('null') == -1 || url.indexOf('undefined') == -1) {
+              throw new Error(`url请求参数不正确${url}`)
+              console.log(url)
+              // topo 以下处理了 请求参数替换不正确时页面报错的情况
+              url = url.replace('/null', '/').replace('/undefined', '/')
+            }
             // return axios(url, config)
             // topo: fix https://gitee.com/dgiiot/dgiot/issues/I4RRY3
             // 处理静态资源部署在在二级下页面下,但是页面
@@ -218,8 +225,8 @@
             //   当前页面路由router
             const { path } = this.$route
             // 解决设计界面弹出提示问题
-            // if (!path.indexOf('design')) {
             console.log(path.indexOf('design'), path)
+            // if (!path.indexOf('design')) {
             this.$message({
               type: type,
               message: msg,

diff --git a/src/i18n/zh.js b/src/i18n/zh.js
@@ -131,6 +131,7 @@ export default {
       lists: '列表',
       info: '信息',
       address: '安装位置',
+      'Longitude and latitude': '经纬度',
       Department: '所属部门',
       'Equipment Overview': '设备概况',
       'device status': '设备状态',

diff --git a/src/views/CloudFunction/lowcode/index.vue b/src/views/CloudFunction/lowcode/index.vue
@@ -514,6 +514,9 @@
         setTreeFlag: 'settings/setTreeFlag',
       }),
       async switchlanguage(v) {
+        if (!v.language) {
+          return false
+        }
         await putView(v.objectId, { language: v.language })
         this.$message({
           type: 'success',

diff --git a/src/views/DeviceCloud/manage/devicelist.vue b/src/views/DeviceCloud/manage/devicelist.vue
@@ -1105,7 +1105,9 @@
             _this.list.forEach((t) => {
               topicsKeys.forEach((j) => {
                 if (t.objectId == j) {
-                  const mergeInfo = _.merge(t, parseString[j])
+                  const mergeInfo = _.merge(t, parseString[j], {
+                    detail: { address: parseString[j].address },
+                  })
                   console.log(`更新设备${t.name}`)
                   args.name = t.name
                   console.log(mergeInfo, parseString[j])

diff --git a/src/views/DeviceCloud/manage/home_index.vue b/src/views/DeviceCloud/manage/home_index.vue
@@ -1236,7 +1236,9 @@
             _this.list.forEach((t) => {
               topicsKeys.forEach((j) => {
                 if (t.objectId == j) {
-                  const mergeInfo = _.merge(t, parseString[j])
+                  const mergeInfo = _.merge(t, parseString[j], {
+                    detail: { address: parseString[j].address },
+                  })
                   console.log(`更新设备${t.name}`)
                   args.name = t.name
                   console.log(mergeInfo, parseString[j])

diff --git a/src/views/DeviceCloud/manage/js/proddetail.js b/src/views/DeviceCloud/manage/js/proddetail.js
@@ -38,14 +38,47 @@ var isallchannel = false
 var isupdatetrue = ''
 import dgiotViews from '@/views/CloudFunction/lowcode'
 import { getProtocol } from '@/api/Protocol'
-
+import {
+  BaiduMap,
+  BmCityList,
+  BmControl,
+  BmGeolocation,
+  BmInfoWindow,
+  BmlMarkerClusterer,
+  BmMapType,
+  BmMarker,
+  BmNavigation,
+  BmOverviewMap,
+  BmPanorama,
+  BmScale,
+  BmLabel,
+  BmView,
+  BmLocalSearch,
+  BmPointCollection,
+} from 'vue-baidu-map'
 export default {
   components: {
     mqttLog,
     dgiotViews,
     'dgiot-wmx': wmxdetail,
     'dgiot-profile': profile,
     'thing-form': thingForm,
+    BmLocalSearch,
+    BmPointCollection,
+    BmInfoWindow,
+    BmScale,
+    BmMapType,
+    BmView,
+    BmOverviewMap,
+    BmPanorama,
+    BmControl,
+    BmLabel,
+    BaiduMap,
+    BmNavigation,
+    BmGeolocation,
+    BmCityList,
+    BmMarker,
+    BmlMarkerClusterer,
   },
   data() {
     const validCode = (rule, value, callback) => {
@@ -631,9 +664,18 @@ export default {
       },
       ProductSecret: '',
       dynamicReg: false,
+      dialog_address: false,
       productId: '',
       productName: '',
       productdetail: {
+        config: {
+          address: '余杭区良渚平高创业城c1座',
+          location: {
+            latitude: '120.161324',
+            longitude: '30.262441',
+            __type: 'GeoPoint',
+          },
+        },
         thing: { properties: [], events: [], services: [], tags: [] },
       },
       topicData: [],
@@ -862,6 +904,61 @@ export default {
     this.subdialogtimer = null
   },
   methods: {
+    async handleAddressClose() {
+      this.dialog_address = !this.dialog_address
+       await putProduct(this.productObj.objectId, {
+         config: this.productdetail.config,
+      })
+      this.$message({
+        type: 'success',
+        message: '安装位置更新成功',
+        showClose: true,
+        duration: 2000,
+      })
+    },
+    inputAddress() {
+      const address = this.productdetail.config.addres
+      console.log(1111111111111111,addres)
+      // https://lbsyun.baidu.com/jsdemo.htm#wAddressParseSingle  根据位置解析
+      var map = new BMapGL.Map('container')
+      map.centerAndZoom(new BMapGL.Point(116.331398, 39.897445), 12)
+      //创建地址解析器实例
+      var myGeo = new BMapGL.Geocoder()
+      // 将地址解析结果显示在地图上，并调整地图视野
+      myGeo.getPoint(
+        address,
+        function (point) {
+          if (point) {
+            map.centerAndZoom(point, 16)
+            map.addOverlay(
+              new BMapGL.Marker(point, { title: address })
+            )
+          } else {
+            alert('您选择的地址没有解析到结果！')
+          }
+        },
+        '北京市'
+      )
+      console.log(address)
+    },
+    mapClick(e) {
+      this.productdetail.config.location = {
+        __type: 'GeoPoint',
+        latitude: e.point.lat,
+        longitude: e.point.lng,
+      }
+      console.log(e,this.productdetail.config)
+      // this.center.lng = e.point.lng
+      // this.center.lat = e.point.lat
+      // this.addresspointer =
+      //   e.point.lng.toFixed(6) + ',' + e.point.lat.toFixed(6)
+      const geocoder = new BMap.Geocoder() // 创建地址解析器的实例
+      //  let Marker = new BMap.Marker()
+      geocoder.getLocation(e.point, (rs) => {
+        console.log(rs)
+        this.productdetail.config.address = rs.address
+      })
+    },
     toggleSwitch(row) {
       row.isshow = !row.isshow
       this.preserve('isshow')
@@ -3156,6 +3253,12 @@ export default {
                 parser: [],
                 profile: [],
                 basedate: { params: [] },
+                address: '余杭区良渚平高创业城c1座',
+                location: {
+                  latitude: '120.161324',
+                  longitude: '30.262441',
+                  __type: 'GeoPoint',
+                },
               },
             })
             this.productName = response.name

diff --git a/src/views/DeviceCloud/manage/proddetail.vue b/src/views/DeviceCloud/manage/proddetail.vue
@@ -1,6 +1,115 @@
 <template>
   <div class="proddetail">
     <dgiot-profile v-show="false" :product-info="productInfo" />
+    <el-dialog
+      append-to-body
+      :before-close="handleAddressClose"
+      class="map_dialog"
+      title="安装位置"
+      :visible.sync="dialog_address"
+      width="70%"
+    >
+      <el-card>
+        <label>
+          安装位置：
+          <el-input
+            v-model="productdetail.config.address"
+            @input="inputAddress"
+          >
+            <i
+              slot="suffix"
+              class="el-icon-s-promotion"
+              style="cursor: pointer"
+            ></i>
+          </el-input>
+        </label>
+        <baidu-map
+          :key="productdetail.config.location.latitude"
+          :ak="$dgiot.secret.baidu.map"
+          :center="{
+            lng: productdetail.config.location.latitude,
+            lat: productdetail.config.location.longitude,
+          }"
+          :map-click="false"
+          :scroll-wheel-zoom="true"
+          style="height: 300px"
+          :style="{ height: '500px', width: '100%' }"
+          :zoom="15"
+          @click="mapClick"
+        >
+          <bm-view class="map" />
+          <bm-city-list :offset="{ width: 330, height: 0 }" />
+          <bm-local-search
+            :auto-viewport="true"
+            :keyword="productdetail.config.address"
+            :location="{
+              lng: productdetail.config.location.latitude,
+              lat: productdetail.config.location.longitude,
+            }"
+          />
+          <bm-control>
+            <bm-panorama
+              anchor="BMAP_ANCHOR_TOP_LEFT"
+              :offset="{ width: 500, height: 0 }"
+            />
+            <bm-overview-map :is-open="true" />
+            <bm-scale :offset="{ width: 260, height: 0 }" />
+            <bm-city-list :offset="{ width: 450, height: 0 }" />
+            <bm-map-type
+              anchor="BMAP_ANCHOR_TOP_LEFT"
+              :map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']"
+              :offset="{ width: 400, height: 0 }"
+            />
+          </bm-control>
+          <bml-marker-clusterer>
+            <bm-marker />
+            <bm-label />
+          </bml-marker-clusterer>
+          <bm-navigation anchor="BMAP_ANCHOR_TOP_RIGHT" />
+          <bm-geolocation
+            anchor="BMAP_ANCHOR_BOTTOM_RIGHT"
+            :auto-location="true"
+            :show-address-bar="true"
+            :show-zoom-info="true"
+          />
+        </baidu-map>
+        <!--        <dgiot-baidu-map-->
+        <!--          ref="map"-->
+        <!--          :bm-label="true"-->
+        <!--          :label="{-->
+        <!--            content: productdetail.config.address,-->
+        <!--            style: {-->
+        <!--              color: 'red',-->
+        <!--              fontSize: '24px',-->
+        <!--            },-->
+        <!--            position: {-->
+        <!--              lng: productdetail.config.location.latitude,-->
+        <!--              lat: productdetail.config.location.longitude,-->
+        <!--            },-->
+        <!--            title: productdetail.config.address,-->
+        <!--          }"-->
+        <!--          :map-center="{-->
+        <!--            lng: productdetail.config.location.latitude,-->
+        <!--            lat: productdetail.config.location.longitude,-->
+        <!--          }"-->
+        <!--          :markers="[-->
+        <!--            {-->
+        <!--              lng: productdetail.config.location.latitude,-->
+        <!--              lat: productdetail.config.location.longitude,-->
+        <!--            },-->
+        <!--          ]"-->
+        <!--          :nav-show="true"-->
+        <!--          :scale-show="true"-->
+        <!--          :scroll-wheel-zoom="true"-->
+        <!--        />-->
+      </el-card>
+      <!--      <span slot="footer" class="dialog-footer">-->
+      <!--        <el-button @click="dialog_device = false">取 消</el-button>-->
+      <!--        <el-button type="primary" @click="dialog_device = false">-->
+      <!--          确 定-->
+      <!--        </el-button>-->
+      <!--      </span>-->
+    </el-dialog>
     <div>
       <el-tabs ref="_tabs" v-model="activeName" @tab-click="handleClick">
         <!--产品信息-->
@@ -197,6 +306,24 @@
                     {{ amisproductInfo.length || 0 }}
                   </el-link>
                 </el-descriptions-item>
+                <el-descriptions-item
+                  :label="$translateTitle('equipment.address')"
+                >
+                  <el-link
+                    type="success"
+                    @click="dialog_address = !dialog_address"
+                  >
+                    {{ productdetail.config.address || '-' }}
+                  </el-link>
+                </el-descriptions-item>
+                <el-descriptions-item
+                  :label="$translateTitle('equipment.Longitude and latitude')"
+                >
+                  <el-link type="success">
+                    {{ productdetail.config.location.latitude }}
+                    {{ productdetail.config.location.longitude }}
+                  </el-link>
+                </el-descriptions-item>
                 <!--                <el-descriptions-item>-->
                 <!--                  <template slot="label">-->
                 <!--                    <el-link-->