轮播图居左，添加装置信息

src/assets/css/element.less

@@ -37,3 +37,8 @@
   display: flex;
   justify-content: flex-end;
 }
+//弹窗
+
+.el-dialog__body {
+  padding: 8px 20px;
+}

src/views/components/carouselChart.vue

@@ -135,14 +135,14 @@ export default {
       },
       swiperOptionThumbs: {
         spaceBetween: 10,
-        centeredSlides: true,
+        centeredSlides: false,
         slidesPerView: "auto",
         touchRatio: 0.2,
         lazyLoading: true, //懒加载开启
         slideToClickedSlide: true,
         lazy: {
           loadPrevNext: true,
-          loadPrevNextAmount: 3,
+          loadPrevNextAmount: 5,
           loadOnTransitionStart: true,
           //loadOnTransitionStart: true,
         },

src/views/pictureRotation/index.vue

@@ -315,7 +315,7 @@ export default {
         position: absolute;
         bottom: 28px;
         left: 0px;
-        font-size: 15px;
+        font-size: 14px;
         background-color: #3a87ad !important;
         color: @color-white;
         font-weight: normal;
@@ -328,7 +328,7 @@ export default {
         bottom: 4px;
         color: @color-white;
         left: 0px;
-        font-size: 15px;
+        font-size: 14px;
         background-color: #51b17c !important;
         font-weight: normal;
         margin-top: 2px;

src/views/realTimeMonitor/components/infoDialog.vue

@@ -0,0 +1,74 @@
+<template>
+  <el-dialog
+    class="infoDialog"
+    title="装置信息"
+    :visible.sync="isShow"
+    :close-on-click-modal="false"
+    width="50%"
+  >
+    <div class="infoTable">
+      <el-descriptions class="margin-top" :column="3" border>
+        <el-descriptions-item>
+          <template slot="label"> 图像监测装置 ID </template>
+          XYIGQ10C230300104
+        </el-descriptions-item>
+        <el-descriptions-item>
+          <template slot="label"> 装置名称 </template>
+          XYIGQ10C230300104
+        </el-descriptions-item>
+        <el-descriptions-item>
+          <template slot="label"> 装置型号 </template>
+          xxx
+        </el-descriptions-item>
+        <el-descriptions-item>
+          <template slot="label"> 装置基本信息版本号 </template>
+          xxxxxxxxxxxx
+        </el-descriptions-item>
+        <el-descriptions-item>
+          <template slot="label"> 生产厂家 </template>
+          xxxxxxxxxxxxxxxxxxxxxxxx
+        </el-descriptions-item>
+
+        <el-descriptions-item>
+          <template slot="label"> 生产日期 </template>
+          xxxxxxxxxxxxxxxxxxxxx
+        </el-descriptions-item>
+        <el-descriptions-item>
+          <template slot="label"> 出厂编号 </template>
+          xxxxxxxxxxxxxxxxxx
+        </el-descriptions-item>
+      </el-descriptions>
+    </div>
+    <div slot="footer" class="dialog-footer">
+      <!-- <el-button @click="isShow = false">取 消</el-button> -->
+      <el-button type="primary" @click="isShow = false">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+<script>
+import { getChannelListJoggle } from "@/utils/api/index";
+export default {
+  props: {
+    title: String,
+  },
+  data() {
+    return {
+      loading: true,
+      isShow: false,
+    };
+  },
+  mounted() {},
+  methods: {
+    display() {
+      this.isShow = true;
+    },
+    hide() {
+      this.isShow = false;
+    },
+  },
+};
+</script>
+<style lang="less">
+.infoDialog {
+}
+</style>

src/views/realTimeMonitor/index.vue

@@ -83,7 +83,7 @@
               <el-button type="primary" @click="handleShowGPS"
                 >获取GPS位置</el-button
               >
-              <el-button type="primary" @click="handleShowErr">
+              <el-button type="primary" @click="handleShowInfo">
                 装置信息</el-button
               >
               <el-dropdown
@@ -99,9 +99,9 @@
                   <el-dropdown-item command="close">关闭GPS</el-dropdown-item>
                 </el-dropdown-menu>
               </el-dropdown>
-              <el-button type="primary" @click="handleShowErr"
+              <!-- <el-button type="primary" @click="handleShowErr"
                 >声光报警</el-button
-              >
+              > -->
               <el-button type="primary" @click="handlehistoryPic"
                 >历史图片</el-button
               >
@@ -123,6 +123,7 @@
       <!-- <deviceUpgrade ref="deviceupgrade_ref"></deviceUpgrade> -->
       <!-- 绘制图片 -->
       <pictureTags ref="pictureTags_ref"></pictureTags>
+      <info-dialog ref="infodialog_ref"></info-dialog>
     </div>
   </div>
 </template>
@@ -140,12 +141,14 @@ import carouselChart from "../components/carouselChart.vue";
 import setschedule from "./components/setschedule.vue";
 import deviceUpgrade from "./components/deviceUpgrade.vue";
 import pictureTags from "./components/pictureTags.vue";
+import infoDialog from "./components/infoDialog.vue";
 export default {
   components: {
     carouselChart,
     setschedule,
     deviceUpgrade,
     pictureTags,
+    infoDialog,
   },
   data() {
     return {
@@ -327,6 +330,10 @@ export default {
       this.$refs.setschedule_ref.getSingleAccess(this.channelId);
       this.$refs.setschedule_ref.deviceList();
     },
+    //
+    handleShowInfo() {
+      this.$refs.infodialog_ref.display();
+    },
     handleShowErr() {
       this.$message({
         message: "该功能暂未开发,敬请期待",
@@ -402,8 +409,17 @@ export default {
       })
         .then((res) => {
           console.log(res);
+
+          this.$message({
+            message: "手动拍照请求成功",
+            type: "success",
+          });
         })
         .catch((err) => {
+          this.$message({
+            message: "手动拍照请求成失败",
+            type: "error",
+          });
           console.log(err); //代码错误、请求失败捕获
         });
     },

src/views/realTimeSearch/index.vue

@@ -5,27 +5,52 @@
         <el-form :inline="true" :model="formdata" class="demo-form-inline">
           <el-form-item label="电压名称">
             <el-select v-model="formdata.dyVal" @change="getSearchxl">
-              <el-option v-for="item in dyOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
+              <el-option
+                v-for="item in dyOptions"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              ></el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="线路名称">
             <el-select v-model="formdata.xlVal" @change="getSearchgt">
-              <el-option v-for="item in xlOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
+              <el-option
+                v-for="item in xlOptions"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              ></el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="杆塔名称">
             <el-select v-model="formdata.gtVal" @change="getSearchtd">
-              <el-option v-for="item in gtOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
+              <el-option
+                v-for="item in gtOptions"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              ></el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="通道监拍点">
             <el-select v-model="formdata.tdVal">
-              <el-option v-for="item in tdOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
+              <el-option
+                v-for="item in tdOptions"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              ></el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="日期">
-            <el-date-picker v-model="formdata.timeVal" type="datetimerange" start-placeholder="开始日期" end-placeholder="结束日期" 
-            value-format="timestamp"></el-date-picker>
+            <el-date-picker
+              v-model="formdata.timeVal"
+              type="datetimerange"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              value-format="timestamp"
+            ></el-date-picker>
           </el-form-item>
           <el-form-item>
             <el-button type="primary" @click="onSubmit">查询</el-button>
@@ -78,60 +103,71 @@ import { getSearchInfo, getPictureList } from "@/utils/api/index";
 export default {
   data() {
     return {
-      dyOptions: [],//电压数据
-      xlOptions: [],//线路数据
-      gtOptions: [],//杆塔数据
-      tdOptions: [],//通道数据
+      dyOptions: [], //电压数据
+      xlOptions: [], //线路数据
+      gtOptions: [], //杆塔数据
+      tdOptions: [], //通道数据
       formdata: {
-        dyVal:'',
-        xlVal:'',
-        gtVal: '',
-        tdVal: '',
-        timeVal: '',
+        dyVal: "",
+        xlVal: "",
+        gtVal: "",
+        tdVal: "",
+        timeVal: "",
       },
       picList: [],
       page: 1, // 当前页数
-      pageSize: 10, // 每页数量
+      pageSize: 30, // 每页数量
       total: 0, //总条数
       loading: false,
     };
   },
-  mounted(){
-    this.$set(this.formdata, "timeVal", [new Date(new Date().toLocaleDateString()).getTime(), new Date().getTime()]);
-    this.getSearchdy()
-    this.getPicData()
+  mounted() {
+    this.$set(this.formdata, "timeVal", [
+      new Date(new Date().toLocaleDateString()).getTime(),
+      new Date().getTime(),
+    ]);
+    this.getSearchdy();
+    this.getPicData();
   },
   methods: {
     //获取电压信息
-    getSearchdy(){
-      getSearchInfo({ type:1 }).then((res) => {
-        this.dyOptions = res.data.list;
-        this.formdata.dyVal = res.data.list[0].id
-        this.getSearchxl()
-      }).catch((err) => {});
+    getSearchdy() {
+      getSearchInfo({ type: 1 })
+        .then((res) => {
+          this.dyOptions = res.data.list;
+          this.formdata.dyVal = res.data.list[0].id;
+          this.getSearchxl();
+        })
+        .catch((err) => {});
     },
     //获取线路数据
-    getSearchxl(){
-      getSearchInfo({ type: 2, id: this.formdata.dyVal }).then((res) => {
-        this.xlOptions = res.data.list;
-        this.formdata.xlVal = res.data.list[0].id
-        this.getSearchgt()
-      }).catch((err) => {});
+    getSearchxl() {
+      getSearchInfo({ type: 2, id: this.formdata.dyVal })
+        .then((res) => {
+          this.xlOptions = res.data.list;
+          this.formdata.xlVal = res.data.list[0].id;
+          this.getSearchgt();
+        })
+        .catch((err) => {});
     },
     //获取杆塔数据
-    getSearchgt(){
-      getSearchInfo({ type: 3, id: this.formdata.xlVal }).then((res) => {
-        this.gtOptions = res.data.list;
-        this.formdata.gtVal = res.data.list[0].id
-        this.getSearchtd()
-      }).catch((err) => {});
+    getSearchgt() {
+      getSearchInfo({ type: 3, id: this.formdata.xlVal })
+        .then((res) => {
+          this.gtOptions = res.data.list;
+          this.formdata.gtVal = res.data.list[0].id;
+          this.getSearchtd();
+        })
+        .catch((err) => {});
     },
     //获取通道数据
-    getSearchtd(){
-      getSearchInfo({ type: 4, id: this.formdata.gtVal }).then((res) => {
-        this.tdOptions = res.data.list;
-        this.formdata.tdVal = res.data.list[0].id
-      }).catch((err) => {});
+    getSearchtd() {
+      getSearchInfo({ type: 4, id: this.formdata.gtVal })
+        .then((res) => {
+          this.tdOptions = res.data.list;
+          this.formdata.tdVal = res.data.list[0].id;
+        })
+        .catch((err) => {});
     },
     //获取图片列表
     getPicData() {
@@ -152,18 +188,18 @@ export default {
     },
     //查询
     onSubmit() {
-      this.getPicData()
+      this.getPicData();
     },
     //点击分页
     handleCurrentChange(val) {
       this.page = val;
-      this.getPicData()
+      this.getPicData();
     },
     //每页条数
-    handleSizeChange(val){
+    handleSizeChange(val) {
       this.pageSize = val;
-      this.getPicData()
-    }
+      this.getPicData();
+    },
   },
 };
 </script>

src/views/stritl/index copy.vue

@@ -361,7 +361,7 @@ export default {
       padding: 8px;
       h3 {
         margin-bottom: 8px;
-        font-size: 15px;
+        font-size: 14px;
       }
     }
     .strRightTop,
@@ -375,7 +375,7 @@ export default {
       padding: 8px;
       h3 {
         margin-bottom: 8px;
-        font-size: 15px;
+        font-size: 14px;
       }
     }
     .strRightTop {
@@ -397,7 +397,7 @@ export default {
     .strRightBottom {
       h3 {
         margin-bottom: 8px;
-        font-size: 15px;
+        font-size: 14px;
       }
       .suggest {
         .attention {