From 2515d1588fa069d8da63c0287bb2175625aee72a Mon Sep 17 00:00:00 2001
From: TiaStars <L18864257234@163.com>
Date: Thu, 29 Feb 2024 14:54:39 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A8=A1=E6=8B=9F=E7=99=BB=E5=BD=95=E8=8E=B7?=
 =?UTF-8?q?=E5=8F=96=E4=BA=8B=E4=BB=B6=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env.development       |   5 +-
 .env.production        |   6 +-
 src/api/root/index.js  |  19 +++
 src/components/map.vue | 262 +++++++----------------------------------
 src/utils/request1.js  | 154 ++++++++++++++++++++++++
 vue.config.js          |  16 ++-
 6 files changed, 242 insertions(+), 220 deletions(-)
 create mode 100644 src/api/root/index.js
 create mode 100644 src/utils/request1.js

diff --git a/.env.development b/.env.development
index 96fd6d1..b70628a 100644
--- a/.env.development
+++ b/.env.development
@@ -8,4 +8,7 @@ ENV = 'development'
 # VUE_APP_BASE_API = 'http://39.101.188.84:9037'
 VUE_APP_BASE_API = 'https://t-jn-bjh-admin-server.jsszkd.com'
 
-VUE_APP_BASE_API1 = 'https://t-jn-development-manager-server.jsszkd.com/api/webapp'
+# 看点测试环境
+VUE_APP_BASE_API1 = 'https://t-kd-process-server.jsszkd.com'
+# 看点test环境
+VUE_APP_BASE_API2 = 'https://t-jn-development-manager-server.jsszkd.com/api/webapp'
diff --git a/.env.production b/.env.production
index b69a50f..bb065e2 100644
--- a/.env.production
+++ b/.env.production
@@ -5,4 +5,8 @@ VUE_APP_TITLE = 事件上图
 ENV = 'production'
 VUE_APP_BASE_API = 'https://t-jn-bjh-admin-server.jsszkd.com'
 
-VUE_APP_BASE_API1 = 'https://t-jn-development-manager-server.jsszkd.com/api/webapp'
\ No newline at end of file
+# 测试环境
+VUE_APP_BASE_API1 = 'https://t-kd-process-server.jsszkd.com'
+
+# test环境
+VUE_APP_BASE_API2 = 'https://t-jn-development-manager-server.jsszkd.com/api/webapp'
\ No newline at end of file
diff --git a/src/api/root/index.js b/src/api/root/index.js
new file mode 100644
index 0000000..801f7f8
--- /dev/null
+++ b/src/api/root/index.js
@@ -0,0 +1,19 @@
+import request from "@/utils/request1"
+
+// 模拟登录
+export function robotLogin(data){
+  return request({
+    url: "/api/system/robotLogin",
+    method:'post',
+    data
+  })
+}
+// 获取事件列表
+export function ViewListPage(params,data){
+  return request({
+    url: "/api/eform/engine/viewEngine/queryViewListPage",
+    method:'post',
+    params,
+    data
+  })
+}
\ No newline at end of file
diff --git a/src/components/map.vue b/src/components/map.vue
index c09657e..4bd7d15 100644
--- a/src/components/map.vue
+++ b/src/components/map.vue
@@ -11,12 +11,12 @@
       </template>
       <div>
         <el-descriptions :border="false" :column="1" size="mini">
-          <el-descriptions-item label="事件编号">2023073024252</el-descriptions-item>
-          <el-descriptions-item label="事件标题">下水道结冰堵塞</el-descriptions-item>
-          <el-descriptions-item label="事件类型">城市安全类</el-descriptions-item>
-          <el-descriptions-item label="事件地址">XXXXXXXXXXXXXXXXXXXX</el-descriptions-item>
-          <el-descriptions-item label="发生时间">2023-07-30</el-descriptions-item>
-          <el-descriptions-item label="所属网格">网格2</el-descriptions-item>
+          <el-descriptions-item label="事件编号">{{ markerInfo.rand_number }}</el-descriptions-item>
+          <el-descriptions-item label="事件标题">{{ markerInfo.name }}</el-descriptions-item>
+          <el-descriptions-item label="事件类型">{{ markerInfo.type }}</el-descriptions-item>
+          <el-descriptions-item label="事件地址">{{ markerInfo.address }}</el-descriptions-item>
+          <el-descriptions-item label="发生时间">{{ markerInfo.open_time }}</el-descriptions-item>
+          <el-descriptions-item label="所属网格">XXX</el-descriptions-item>
         </el-descriptions>
       </div>
       <template slot="footer">
@@ -31,16 +31,9 @@
 <script>
 import L from "leaflet"
 import "@/utils/lib/leaflet.ChineseTmsProviders.js";
-import oneGJ02 from "@/utils/lib/jiangningqu/1GJ02(1).json"; // 一中队
-import twoGJ02 from "@/utils/lib/jiangningqu/1GJ02(2).json"; // 二中队
-import threeGJ02 from "@/utils/lib/jiangningqu/1GJ02(3).json"; // 三中队
-import fourGJ02 from "@/utils/lib/jiangningqu/1GJ02(4).json"; // 四中队
-
-import ruanjianyuan from "@/utils/lib/jiangningqu/1GJ02(5).json"; // 软件园
-import konggang from "@/utils/lib/jiangningqu/1GJ02(6).json"; // 空港开发区
-import onLine from "@/utils/lib/jiangningqu/onLine.json";
 // 重点路段 重点区域 网格 图标获取  手机号和人员名称查询  部门查询  部门id查询  imei查询用户信息
 import { listZdld, listZdqy, levelQywg, getFenceList } from "@/api/basicsSet";
+import { robotLogin, ViewListPage } from "@/api/root";
 export default {
   name: 'HelloWorld',
   data(){
@@ -51,9 +44,11 @@ export default {
         mapLayer1:null,
         mapLayer2:null,
         mapLayer3:null,
+        mapLayer1Text:null,
       },
       dialogVisible:false,
       onLoad:false,
+      markerInfo:{},
     }
   },
   props: {
@@ -105,37 +100,43 @@ export default {
       this.mapLayers.mapLayer1 = L.featureGroup().addTo(this.map);
       this.mapLayers.mapLayer2 = L.featureGroup().addTo(this.map);
       this.mapLayers.mapLayer3 = L.featureGroup().addTo(this.map);
+      this.mapLayers.mapLayer1Text = L.featureGroup().addTo(this.map);
       this.map.on("zoom", () => {
         let zoom = this.map.getZoom();
         if (zoom >= 13) {
           this.map.removeLayer(this.mapLayers.mapLayer1)
+          this.map.removeLayer(this.mapLayers.mapLayer1Text)
           this.map.addLayer(this.mapLayers.mapLayer2)
           this.map.addLayer(this.mapLayers.mapLayer3)
         } else {
           this.map.addLayer(this.mapLayers.mapLayer1)
+          this.map.addLayer(this.mapLayers.mapLayer1Text)
           this.map.removeLayer(this.mapLayers.mapLayer2)
           this.map.removeLayer(this.mapLayers.mapLayer3)
         }
+        if(zoom <= 10) {
+          this.map.removeLayer(this.mapLayers.mapLayer1Text)
+        }
       });
       let zoom = this.map.getZoom();
       if (zoom >= 13) {
         this.map.removeLayer(this.mapLayers.mapLayer1)
+        this.map.removeLayer(this.mapLayers.mapLayer1Text)
         this.map.addLayer(this.mapLayers.mapLayer2)
         this.map.addLayer(this.mapLayers.mapLayer3)
       } else {
         this.map.addLayer(this.mapLayers.mapLayer1)
+        this.map.addLayer(this.mapLayers.mapLayer1Text)
         this.map.removeLayer(this.mapLayers.mapLayer2)
         this.map.removeLayer(this.mapLayers.mapLayer3)
       }
-      // 中队
-      // this.zhongdui();
-      // 空港
-      // this.konggangMap();
-      // 软件园
-      // this.ruanjianyuanMap();
+      robotLogin({username:"superAdmin",password:"sa@123456"}).then(res=>{
+        if(res.code == 200) {
+          localStorage.setItem('robotToken',res.result.token)
+        }
+      })
       // 点位信息
       this.eventPoint();
-      // console.log(onLine,"在线情况");
       // 重点区域
       this.zhongdianMap();
       // 围栏1
@@ -145,208 +146,35 @@ export default {
       // 网格
       this.wanggeMap();
     },
-    // 中队
-    zhongdui() {
-      let one = L.geoJSON(oneGJ02, {
-        pane: "mapLayer2",
-        style: function (feature) {
-          return {
-            color: "#1E83EB",
-            weight: 2,
-            fillColor: "#1E83EB",
-            fillOpacity: 0.2,
-          };
-        },
-        onEachFeature: (feature, layer) => {
-          // console.log(feature,'feature');
-          let bounds = layer._bounds;
-          let center = bounds.getCenter();
-          let myIcon = L.divIcon({
-            className: "region-name3",
-            html: feature.properties.NAME,
-            iconSize: [80, 24],
-            iconAnchor: [20, 0],
-          });
-          // 多边形上的标记点;
-          // L.marker({lng:feature.properties.CENTERX,lat:feature.properties.CENTERY}, {
-          L.marker(center, {
-            pane: "mapLayer3",
-            icon: myIcon,
-          }).addTo(this.mapLayers.mapLayer3);
-        },
-      }).addTo(this.mapLayers.mapLayer2);
-      let two = L.geoJSON(twoGJ02, {
-        pane: "mapLayer2",
-        style: function (feature) {
-          return {
-            color: "#1E83EB",
-            weight: 2,
-            fillColor: "#1E83EB",
-            fillOpacity: 0.2,
-          };
-        },
-        onEachFeature: (feature, layer) => {
-          // console.log(feature,'feature');
-          let bounds = layer._bounds;
-          let center = bounds.getCenter();
-          let myIcon = L.divIcon({
-            className: "region-name3",
-            html: feature.properties.NAME,
-            iconSize: [80, 24],
-            iconAnchor: [20, 0],
-          });
-          // 多边形上的标记点;
-          // L.marker({lng:feature.properties.CENTERX,lat:feature.properties.CENTERY}, {
-          L.marker(center, {
-            pane: "mapLayer3",
-            icon: myIcon,
-          }).addTo(this.mapLayers.mapLayer3);
-        },
-      }).addTo(this.mapLayers.mapLayer2);
-      let three = L.geoJSON(threeGJ02, {
-        pane: "mapLayer2",
-        style: function (feature) {
-          return {
-            color: "#1E83EB",
-            weight: 2,
-            fillColor: "#1E83EB",
-            fillOpacity: 0.2,
-          };
-        },
-        onEachFeature: (feature, layer) => {
-          // console.log(feature,'feature');
-          let bounds = layer._bounds;
-          let center = bounds.getCenter();
-          let myIcon = L.divIcon({
-            className: "region-name3",
-            html: feature.properties.NAME,
-            iconSize: [80, 24],
-            iconAnchor: [20, 0],
-          });
-          // 多边形上的标记点;
-          // L.marker({lng:feature.properties.CENTERX,lat:feature.properties.CENTERY}, {
-          L.marker(center, {
-            pane: "mapLayer3",
-            icon: myIcon,
-          }).addTo(this.mapLayers.mapLayer3);
-        },
-      }).addTo(this.mapLayers.mapLayer2);
-      let four = L.geoJSON(fourGJ02, {
-        pane: "mapLayer2",
-        style: function (feature) {
-          return {
-            color: "#1E83EB",
-            weight: 2,
-            fillColor: "#1E83EB",
-            fillOpacity: 0.2,
-          };
-        },
-        onEachFeature: (feature, layer) => {
-          // console.log(feature,'feature');
-          let bounds = layer._bounds;
-          let center = bounds.getCenter();
-          let myIcon = L.divIcon({
-            className: "region-name3",
-            html: feature.properties.NAME,
-            iconSize: [80, 24],
-            iconAnchor: [20, 0],
-          });
-          // 多边形上的标记点;
-          // L.marker({lng:feature.properties.CENTERX,lat:feature.properties.CENTERY}, {
-          L.marker(center, {
-            pane: "mapLayer3",
-            icon: myIcon,
-          }).addTo(this.mapLayers.mapLayer3);
-        },
-      }).addTo(this.mapLayers.mapLayer2);
-      const bounds = four.getBounds();
-      let center = bounds.getCenter();
-      this.map.setView(center, 11); 
-    },
-    // 空港开发区
-    konggangMap() {
-      let kg = L.geoJSON(konggang, {
-        pane: "mapLayer2",
-        style: function (feature) {
-          return {
-            color: "#1E83EB",
-            weight: 2,
-            fillColor: "#1E83EB",
-            fillOpacity: 0.2,
-          };
-        },
-        onEachFeature: (feature, layer) => {
-          let bounds = layer._bounds;
-          let center = bounds.getCenter();
-          // console.log(feature,'feature');
-          let myIcon = L.divIcon({
-            className: "region-name3",
-            html: feature.properties.NAME,
-            iconSize: [150, 24],
-            iconAnchor: [45, 0],
-          });
-          // 多边形上的标记点;
-          // L.marker({lng:feature.properties.CENTERX,lat:feature.properties.CENTERY}, {
-          L.marker(center, {
-            pane: "mapLayer3",
-            icon: myIcon,
-          }).addTo(this.mapLayers.mapLayer3);
-        },
-      }).addTo(this.mapLayers.mapLayer2);
-    },
-    // 软件园
-    ruanjianyuanMap() {
-      let rjy = L.geoJSON(ruanjianyuan, {
-        pane: "mapLayer2",
-        style: function (feature) {
-          return {
-            color: "#1E83EB",
-            weight: 2,
-            fillColor: "#1E83EB",
-            fillOpacity: 0.2,
-          };
-        },
-        onEachFeature: (feature, layer) => {
-          // console.log(feature,'feature');
-          let bounds = layer._bounds;
-          let center = bounds.getCenter();
-          let myIcon = L.divIcon({
-            className: "region-name3",
-            html: feature.properties.NAME,
-            iconSize: [150, 24],
-            iconAnchor: [45, 0],
-          });
-          // 多边形上的标记点;
-          // L.marker({lng:feature.properties.CENTERX,lat:feature.properties.CENTERY}, {
-          L.marker(center, {
-            pane: "mapLayer3",
-            icon: myIcon,
-          }).addTo(this.mapLayers.mapLayer3);
-        },
-      }).addTo(this.mapLayers.mapLayer2);
-    },
     // 渲染事件点位
     eventPoint(){
-      let iconUrl1 = require("@/assets/images/icon1.png");
-      let iconUrl2 = require("@/assets/images/icon2.png");
-      onLine.features.forEach((element,index) => {
-        let marker = L.marker({ lng: element.geometry.coordinates[0], lat: element.geometry.coordinates[1] },
-          {
-            icon: L.icon({
-              iconUrl:element.properties.name == "Icon1" ? iconUrl1 : iconUrl2,
-              iconSize: [60,70],
-              iconAnchor:[30,70]
-            })
-          }
-        ).addTo(this.map)
-        this.markerClick(marker, element);
-      });
+      let iconUrl1 = require("@/assets/images/icon2.png");
+      let data = {'queryValue' : [], "myInstanceClassify" : "all", "parameterValue":[], fks: []}
+      ViewListPage({viewCode:'shi_jian_shou_li_list_page', pageNo: 1, pageSize:500}, data).then(res=>{
+        if(res.code == 200) {
+          res.result.records.forEach((element)=>{
+            let location = element.location?.split(',');
+            if(location) {
+              let marker = L.marker({ lng: location[0], lat: location[1] },
+                {
+                  icon: L.icon({
+                    iconUrl: iconUrl1,
+                    iconSize: [40,45],
+                    iconAnchor:[20,45]
+                  })
+                }
+              ).addTo(this.map)
+              this.markerClick(marker, element);
+            }
+          })
+        }
+      })
     },
     // 点位的点击事件
     markerClick(marker,element) {
       marker.on("click", (e) => {
         this.dialogVisible = true;
-        console.log(element);
+        this.markerInfo = element;
       })
     },
     dispose(){
@@ -385,7 +213,7 @@ export default {
               L.marker(center, {
                 pane: "mapLayer1",
                 icon: myIcon,
-              }).addTo(this.mapLayers.mapLayer1);
+              }).addTo(this.mapLayers.mapLayer1Text);
             },
           }).addTo(this.mapLayers.mapLayer1);
         })
diff --git a/src/utils/request1.js b/src/utils/request1.js
new file mode 100644
index 0000000..fa60e68
--- /dev/null
+++ b/src/utils/request1.js
@@ -0,0 +1,154 @@
+import axios from 'axios'
+import { Notification, MessageBox, Message, Loading } from 'element-ui'
+// import store from '@/store'
+import { getToken,getAccess } from '@/utils/auth'
+import errorCode from '@/utils/errorCode'
+import { tansParams, blobValidate } from "@/utils/ruoyi";
+import cache from '@/plugins/cache'
+import { saveAs } from 'file-saver'
+
+let downloadLoadingInstance;
+// 是否显示重新登录
+export let isRelogin = { show: false };
+
+axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
+// 创建axios实例
+const service = axios.create({
+  // axios中请求配置有baseURL选项，表示请求URL公共部分
+  baseURL: process.env.VUE_APP_BASE_API1,
+  // 超时
+  timeout: 20000
+})
+
+// request拦截器
+service.interceptors.request.use(config => {
+  // 是否需要设置 token
+  const isToken = (config.headers || {}).isToken === false
+  // 是否需要防止数据重复提交
+  const isRepeatSubmit = (config.headers || {}).repeatSubmit === false
+  if (localStorage.getItem('robotToken') && !isToken) {
+    config.headers['X-Access-Token'] = localStorage.getItem('robotToken') // 让每个请求携带自定义token 请根据实际情况自行修改
+  }
+  // get请求映射params参数
+  if (config.method === 'get' && config.params) {
+    let url = config.url + '?' + tansParams(config.params);
+    url = url.slice(0, -1);
+    config.params = {};
+    config.url = url;
+  }
+  if (!isRepeatSubmit && (config.method === 'post' || config.method === 'put')) {
+    const requestObj = {
+      url: config.url,
+      data: typeof config.data === 'object' ? JSON.stringify(config.data) : config.data,
+      time: new Date().getTime()
+    }
+    const requestSize = Object.keys(JSON.stringify(requestObj)).length; // 请求数据大小
+    const limitSize = 5 * 1024 * 1024; // 限制存放数据5M
+    if (requestSize >= limitSize) {
+      console.warn(`[${config.url}]: ` + '请求数据大小超出允许的5M限制，无法进行防重复提交验证。')
+      return config;
+    }
+    const sessionObj = cache.session.getJSON('sessionObj')
+    if (sessionObj === undefined || sessionObj === null || sessionObj === '') {
+      cache.session.setJSON('sessionObj', requestObj)
+    } else {
+      const s_url = sessionObj.url;                  // 请求地址
+      const s_data = sessionObj.data;                // 请求数据
+      const s_time = sessionObj.time;                // 请求时间
+      const interval = 1000;                         // 间隔时间(ms)，小于此时间视为重复提交
+      if (s_data === requestObj.data && requestObj.time - s_time < interval && s_url === requestObj.url) {
+        const message = '数据正在处理，请勿重复提交';
+        console.warn(`[${s_url}]: ` + message)
+        return Promise.reject(new Error(message))
+      } else {
+        cache.session.setJSON('sessionObj', requestObj)
+      }
+    }
+  }
+  return config
+}, error => {
+  console.log(error)
+  Promise.reject(error)
+})
+
+// 响应拦截器
+service.interceptors.response.use(res => {
+  // 未设置状态码则默认成功状态
+  const code = res.data.code - 0 || 200;
+  // 获取错误信息
+  const msg = errorCode[code] || res.data.msg || errorCode['default']
+  // 二进制数据则直接返回
+  if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') {
+    return res.data
+  }
+  if (code === 401) {
+    if (!isRelogin.show) {
+      isRelogin.show = true;
+      MessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => {
+        isRelogin.show = false;
+        // store.dispatch('LogOut').then(() => {
+        //   location.href = '/index';
+        // })
+        // TODO:自己token过期到登录页
+        location.href = process.env.VUE_APP_TEST_LOGIN;
+      }).catch(() => {
+        isRelogin.show = false;
+      });
+    }
+    return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
+  } else if (code === 500) {
+    Message({ message: msg, type: 'error' })
+    return Promise.reject(new Error(msg))
+  } else if (code === 601) {
+    Message({ message: msg, type: 'warning' })
+    return Promise.reject('error')
+  } else if (code !== 200) {
+    Notification.error({ title: msg })
+    return Promise.reject('error')
+  } else {
+    return res.data
+  }
+},
+  error => {
+    console.log('err' + error)
+    let { message } = error;
+    if (message == "Network Error") {
+      message = "后端接口连接异常";
+    } else if (message.includes("timeout")) {
+      message = "系统接口请求超时";
+    } else if (message.includes("Request failed with status code")) {
+      message = "系统接口" + message.substr(message.length - 3) + "异常";
+    }
+    Message({ message: message, type: 'error', duration: 5 * 1000 })
+    return Promise.reject(error)
+  }
+)
+
+// 通用下载方法
+export function download(url, params, filename, config) {
+  downloadLoadingInstance = Loading.service({ text: "正在下载数据，请稍候", spinner: "el-icon-loading", background: "rgba(0, 0, 0, 0.7)", })
+  return service.post(url, params, {
+    transformRequest: [(params) => { return tansParams(params) }],
+    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+    responseType: 'blob',
+    ...config
+  }).then(async (data) => {
+    const isBlob = blobValidate(data);
+    if (isBlob) {
+      const blob = new Blob([data])
+      saveAs(blob, filename)
+    } else {
+      const resText = await data.text();
+      const rspObj = JSON.parse(resText);
+      const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default']
+      Message.error(errMsg);
+    }
+    downloadLoadingInstance.close();
+  }).catch((r) => {
+    console.error(r)
+    Message.error('下载文件出现错误，请联系管理员！')
+    downloadLoadingInstance.close();
+  })
+}
+
+export default service
diff --git a/vue.config.js b/vue.config.js
index b48c788..f8e2ef8 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -36,8 +36,22 @@ module.exports = {
           ['^' + process.env.VUE_APP_BASE_API]: ''
         }
       },
+      [process.env.VUE_APP_BASE_API1]: {
+        target: `http://localhost:8080`,
+        changeOrigin: true,
+        pathRewrite: {
+          ['^' + process.env.VUE_APP_BASE_API1]: ''
+        }
+      },
+      [process.env.VUE_APP_BASE_API2]: {
+        target: `http://localhost:8080`,
+        changeOrigin: true,
+        pathRewrite: {
+          ['^' + process.env.VUE_APP_BASE_API2]: ''
+        }
+      },
     },
-    disableHostCheck: true
+    // disableHostCheck: true
   },
   css: {
     loaderOptions: {