添加分页

package.json

@@ -8,7 +8,6 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "@amap/amap-jsapi-loader": "^1.0.1",
     "axios": "^1.3.4",
     "core-js": "^3.8.3",
     "echarts": "^5.4.2",
@@ -16,7 +15,6 @@
     "moment": "^2.29.4",
     "update-element-ui-theme": "^1.0.0",
     "vue": "^2.6.14",
-    "vue-awesome-swiper": "^3.1.3",
     "vue-router": "^3.5.1",
     "vuex": "^3.6.2"
   },
@@ -34,6 +32,7 @@
     "less": "^4.1.3",
     "less-loader": "^11.1.0",
     "style-resources-loader": "^1.5.0",
+    "vue-awesome-swiper": "^3.1.3",
     "vue-cli-plugin-style-resources-loader": "^0.1.5",
     "vue-template-compiler": "^2.6.14"
   },

src/utils/request.js

@@ -38,7 +38,7 @@ const service = axios.create({
   // baseURL: '',
   // timeout: 5000
   baseURL: "api", //把原来的项目地址，改成api，解决跨域问题
-  timeout: 3000,
+  timeout: 30000,
 });
 
 service.interceptors.request.use(

src/views/components/carouselChart.vue

@@ -38,14 +38,14 @@
           {{ $moment(item.photoTime).format("YYYY-MM-DD HH:mm:ss") }}
         </p>
       </swiper-slide>
-      <!-- <div
+      <div
         class="swiper-button-next swiper-button-white"
         slot="button-next"
       ></div>
       <div
         class="swiper-button-prev swiper-button-white"
         slot="button-prev"
-      ></div> -->
+      ></div>
     </swiper>
   </div>
 </template>
@@ -70,12 +70,12 @@ export default {
   data() {
     return {
       swiperOptionTop: {
-        zoom: true,
+        //zoom: true,//缩放功能
         loop: true,
         loopedSlides: 5, // looped slides should be the same
-        spaceBetween: 10,
+        //spaceBetween: 10,
-        observer: true, //修改swiper自己或子元素时，自动初始化swiper
+        //observer: true, //修改swiper自己或子元素时，自动初始化swiper
-        observeParents: true, //修改swiper的父元素时，自动初始化swiper
+        //observeParents: true, //修改swiper的父元素时，自动初始化swiper
         // autoplay: {
         //   //自动轮播
         //   delay: 2000,
@@ -92,7 +92,7 @@ export default {
         spaceBetween: 10,
         centeredSlides: true,
         slidesPerView: "auto",
-        touchRatio: 0.2,
+        // touchRatio: 0.2,
         slideToClickedSlide: true,
         navigation: {
           nextEl: ".swiper-button-next",

src/views/realTimeMonitor/index.vue

@@ -129,10 +129,8 @@ export default {
       );
     },
     //获取左侧树结构
-    async getLineTreeList() {
+    getLineTreeList() {
-      await getdyTreeListJoggle({
+      getdyTreeListJoggle()
-        termid: 123455,
-      })
         .then((res) => {
           console.log(res);
           this.lineTreeData = res.data.list;
@@ -151,7 +149,7 @@ export default {
         .catch((err) => {
           console.log(err); //代码错误、请求失败捕获
         });
-      await this.getChannelList(this.channelId); //获取通道id接口
+      this.getChannelList(this.channelId); //获取通道id接口
     },
     //点击获取当前点击的tree数据
     handleNodeClick(data, node) {
@@ -164,8 +162,8 @@ export default {
     },
 
     //获取通道的接口
-    async getChannelList(id) {
+    getChannelList(id) {
-      await getChannelListJoggle({ termid: id })
+      getChannelListJoggle({ termid: id })
         .then((res) => {
           console.log(res);
           this.channelList = res.data.list;

src/views/stritl/chartFiles/mapChart.vue

@@ -1,96 +1,98 @@
 <template>
-    <div id="container"></div>
+  <div id="container"></div>
 </template>
 <script>
-import AMapLoader from '@amap/amap-jsapi-loader';
+//import AMapLoader from '@amap/amap-jsapi-loader';
 
 export default {
-    data() {
+  data() {
-        return {
+    return {
-            //此处不声明 map 对象，可以直接使用 this.map赋值或者采用非响应式的普通对象来存储。
+      //此处不声明 map 对象，可以直接使用 this.map赋值或者采用非响应式的普通对象来存储。
-            //map:null,
+      //map:null,
-            adcode: '310000',
+      adcode: "310000",
-            dep: 2
+      dep: 2,
-        };
+    };
+  },
+  methods: {
+    initMap() {
+      AMapLoader.load({
+        key: "9a18085d520884e61312cba93787a8f2", // 申请好的Web端开发者Key，首次调用 load 时必填
+        version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
+        plugins: ["AMap.MapType"], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
+      })
+        .then((AMap) => {
+          this.map = new AMap.Map("container", {
+            //设置地图容器id
+            center: [121.43333, 31.2],
+            layers: [
+              AMap.createDefaultLayer(), //高德默认标准图层
+            ],
+            zoom: 9.5,
+          });
+          this.map.addControl(new AMap.MapType()); //图层切换，用于几个常用图层切换显示
+          //console.log(AMap.DistrictLayer.Province);
+          var disProvince = new AMap.DistrictLayer.Province({
+            zIndex: 12,
+            adcode: ["310000"],
+            depth: 2,
+            styles: {
+              fill: "rgba(161,207,251,0.5)",
+              "province-stroke": "blue",
+              "city-stroke": "white", // 中国地级市边界
+              "county-stroke": "blue", // 中国区县边界
+            },
+          });
+          disProvince.setMap(this.map);
+          //this.map.addControl(new AMap.DistrictSearch()); //行政区查询服务，提供了根据名称关键字、citycode、adcode 来查询行政区信息的功能
+          this.map.on("click", function (ev) {
+            var px = ev.pixel;
+            var props = disProvince.getDistrictByContainerPos(px); // 拾取所在位置的行政区
+            //console.log(props);
+            //disProvince.setDistricts(props.adcode + ''); // 显示当前点击的省份
+            var NAME_CHN = props.NAME_CHN;
+            disProvince.setStyles({
+              // 国境线
+              //nation-stroke': nationStroke,
+              // 海岸线
+              //'coastline-stroke': '',
+              "province-stroke": "blue",
+              "city-stroke": "white", // 中国地级市边界
+              "county-stroke": "blue", // 中国区县边界
+              fill: function (props) {
+                return props.NAME_CHN == NAME_CHN
+                  ? "rgba(161,207,251,0.8)"
+                  : "rgba(161,207,251,0.5)";
+              },
+            });
+          });
+        })
+        .catch((e) => {
+          console.log(e);
+        });
     },
-    methods: {
+  },
-        initMap() {
+  mounted() {
-            AMapLoader.load({
+    //DOM初始化完成进行地图初始化
-                key: '9a18085d520884e61312cba93787a8f2', // 申请好的Web端开发者Key，首次调用 load 时必填
+    this.initMap();
-                version: '2.0', // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
+  },
-                plugins: ['AMap.MapType'] // 需要使用的的插件列表，如比例尺'AMap.Scale'等
-            })
-                .then((AMap) => {
-                    this.map = new AMap.Map('container', {
-                        //设置地图容器id
-                        center: [121.43333, 31.2],
-                        layers: [
-                            AMap.createDefaultLayer() //高德默认标准图层
-                        ],
-                        zoom: 9.5
-                    });
-                    this.map.addControl(new AMap.MapType()); //图层切换，用于几个常用图层切换显示
-                    //console.log(AMap.DistrictLayer.Province);
-                    var disProvince = new AMap.DistrictLayer.Province({
-                        zIndex: 12,
-                        adcode: ['310000'],
-                        depth: 2,
-                        styles: {
-                            fill: 'rgba(161,207,251,0.5)',
-                            'province-stroke': 'blue',
-                            'city-stroke': 'white', // 中国地级市边界
-                            'county-stroke': 'blue' // 中国区县边界
-                        }
-                    });
-                    disProvince.setMap(this.map);
-                    //this.map.addControl(new AMap.DistrictSearch()); //行政区查询服务，提供了根据名称关键字、citycode、adcode 来查询行政区信息的功能
-                    this.map.on('click', function (ev) {
-                        var px = ev.pixel;
-                        var props = disProvince.getDistrictByContainerPos(px); // 拾取所在位置的行政区
-                        //console.log(props);
-                        //disProvince.setDistricts(props.adcode + ''); // 显示当前点击的省份
-                        var NAME_CHN = props.NAME_CHN;
-                        disProvince.setStyles({
-                            // 国境线
-                            //nation-stroke': nationStroke,
-                            // 海岸线
-                            //'coastline-stroke': '',
-                            'province-stroke': 'blue',
-                            'city-stroke': 'white', // 中国地级市边界
-                            'county-stroke': 'blue', // 中国区县边界
-                            fill: function (props) {
-                                return props.NAME_CHN == NAME_CHN ? 'rgba(161,207,251,0.8)' : 'rgba(161,207,251,0.5)';
-                            }
-                        });
-                    });
-                })
-                .catch((e) => {
-                    console.log(e);
-                });
-        }
-    },
-    mounted() {
-        //DOM初始化完成进行地图初始化
-        this.initMap();
-    }
 };
 </script>
 <style lang="less">
 #container {
-    padding: 0px;
+  padding: 0px;
-    margin: 0px;
+  margin: 0px;
-    width: 100%;
+  width: 100%;
-    height: 100%;
+  height: 100%;
-    .amap-logo {
+  .amap-logo {
-        display: none;
+    display: none;
-        opacity: 0 !important;
+    opacity: 0 !important;
-    }
+  }
-    .amap-copyright {
+  .amap-copyright {
-        opacity: 0;
+    opacity: 0;
-        display: none;
+    display: none;
-    }
+  }
-    .amap-ctrl-overlay-layer {
+  .amap-ctrl-overlay-layer {
-        display: none;
+    display: none;
-    }
+  }
 }
-</style>
+</style>