From e05dd17101fb1eff21b67171780ff46f92612a1a Mon Sep 17 00:00:00 2001
From: fanluyan <754122931@qq.com>
Date: Mon, 3 Jul 2023 13:31:30 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A4=87=E4=BB=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../photographicDevice/indexhn1.vue           | 804 ++++++++++++++++++
 1 file changed, 804 insertions(+)
 create mode 100644 src/views/management/monitoringEquipment/photographicDevice/indexhn1.vue

diff --git a/src/views/management/monitoringEquipment/photographicDevice/indexhn1.vue b/src/views/management/monitoringEquipment/photographicDevice/indexhn1.vue
new file mode 100644
index 0000000..05030e4
--- /dev/null
+++ b/src/views/management/monitoringEquipment/photographicDevice/indexhn1.vue
@@ -0,0 +1,804 @@
+<template>
+  <div class="photoGraphicDevice">
+    <div class="photoBox">
+      <div class="photoGraphicBtnGroup">
+        <h4>拍照装置管理</h4>
+        <el-button type="primary" icon="el-icon-plus" @click="handleAddPhoto()"
+          >新增</el-button
+        >
+      </div>
+      <div class="searchBox">
+        <el-form :inline="true" :model="formdata" class="demo-form-inline">
+          <el-form-item label="电压等级" class="dybox">
+            <el-select v-model="formdata.dyId" @change="getSearchxl">
+              <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="线路名称" class="xlbox">
+            <el-select
+              v-model="formdata.lineId"
+              @change="getSearchgt"
+              filterable
+            >
+              <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.towerId" filterable>
+              <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>
+            <el-input
+              v-model="formdata.search"
+              placeholder="请输入线路/杆塔/设备编号"
+            ></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="onSubmit">查询</el-button>
+            <el-button type="primary" @click="onReset">重置</el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="photoGraphicTable">
+        <el-table
+          ref="multipleTable"
+          :data="terminalTableData"
+          stripe
+          tooltip-effect="dark"
+          style="width: 100%"
+          height="calc(100% - 40px)"
+          @selection-change="handleSelectionChange"
+          @row-click="handleRowClick"
+          v-loading="loading"
+        >
+          <!-- <el-table-column
+            prop="cmdid"
+            label="电压等级"
+            show-overflow-tooltip
+            
+          >
+          </el-table-column> -->
+          <el-table-column
+            prop="lineName"
+            label="线路名称"
+            show-overflow-tooltip
+            min-width="120"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="towerName"
+            label="杆塔名称"
+            show-overflow-tooltip
+            min-width="150"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="equipName"
+            label="设备名称"
+            show-overflow-tooltip
+            min-width="150"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="cmdId"
+            label="设备编号"
+            show-overflow-tooltip
+            min-width="150"
+          >
+          </el-table-column>
+          <!-- <el-table-column
+            prop="cmdid"
+            label="SIM卡号"
+            show-overflow-tooltip
+            
+          >
+          </el-table-column>
+          <el-table-column
+            prop="cmdid"
+            label="网络类型"
+            show-overflow-tooltip
+            
+          >
+          </el-table-column>
+          <el-table-column
+            prop="cmdid"
+            label="状态"
+            show-overflow-tooltip
+            
+          >
+          </el-table-column>
+          <el-table-column
+            prop="cmdid"
+            label="装置型号"
+            show-overflow-tooltip
+            
+          >
+          </el-table-column>
+          <el-table-column
+            prop="cmdid"
+            label="装置厂家"
+            show-overflow-tooltip
+            
+          >
+          </el-table-column>
+          <el-table-column
+            prop="cmdid"
+            label="规约版本"
+            show-overflow-tooltip
+            
+          >
+          </el-table-column>
+          <el-table-column
+            prop="cmdid"
+            label="投运日期"
+            show-overflow-tooltip
+            
+            :formatter="dateFormat"
+          >
+          </el-table-column> -->
+          <el-table-column
+            prop="lastHeartbeat"
+            label="最后一次心跳时间"
+            show-overflow-tooltip
+            min-width="150"
+          >
+            <template slot-scope="scope">
+              {{
+                scope.row.lastHeartbeat == null || scope.row.lastHeartbeat == 0
+                  ? ""
+                  : $moment(scope.row.lastHeartbeat * 1000).format(
+                      "yy-MM-DD HH:mm:ss"
+                    )
+              }}</template
+            >
+          </el-table-column>
+          <el-table-column
+            prop="bootTime"
+            label="装置上次启动时间"
+            show-overflow-tooltip
+            min-width="150"
+          >
+            <template slot-scope="scope"
+              >{{
+                scope.row.bootTime == null
+                  ? ""
+                  : $moment(scope.row.bootTime * 1000).format(
+                      "yy-MM-DD HH:mm:ss"
+                    )
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="电量/电压"
+            show-overflow-tooltip
+            min-width="80"
+            ><template slot-scope="scope"
+              >{{ scope.row.batteryCapacity }} /
+              {{
+                scope.row.batteryVoltage.toFixed(1) == 0.0
+                  ? 0
+                  : scope.row.batteryVoltage.toFixed(1)
+              }}V</template
+            >
+          </el-table-column>
+          <el-table-column
+            prop="signalStrength4g"
+            label="4G信号强度"
+            show-overflow-tooltip
+            min-width="90"
+          >
+          </el-table-column>
+          <!-- <el-table-column
+            prop="cmdid"
+            label=" 连续工作时间
+          剩余运行内存
+          剩余存储内存"
+            show-overflow-tooltip
+            
+          >
+          </el-table-column> -->
+
+          <!-- <el-table-column
+            prop="updateTime"
+            label="修改时间"
+            :show-overflow-tooltip="true"
+            :formatter="dateFormat"
+            
+          >
+          </el-table-column> -->
+
+          <!-- <el-table-column
+            prop="createTime"
+            label="创建时间"
+            :show-overflow-tooltip="true"
+            :formatter="dateFormat"
+          >
+          </el-table-column> -->
+          <el-table-column
+            fixed="right"
+            label="操作"
+            width="520"
+            v-if="roleUser != 2"
+          >
+            <template slot-scope="scope">
+              <el-button
+                @click.native.stop="handleRevisePhoto(scope.row)"
+                type="text"
+                >修改</el-button
+              >
+              <el-button
+                type="text"
+                @click.native.stop="handlepicture(scope.row)"
+                >图片标记</el-button
+              >
+              <el-button
+                type="text"
+                @click.native.stop="handleDeviceReset(scope.row)"
+                >装置复位</el-button
+              >
+              <el-button
+                type="text"
+                @click.native.stop="handleImageCapture(scope.row)"
+                >图像参数</el-button
+              >
+              <el-button
+                type="text"
+                @click.native.stop="handleVideoCapture(scope.row)"
+                >视频参数</el-button
+              >
+              <el-button
+                type="text"
+                @click.native.stop="handleShowGPS(scope.row)"
+                >获取GPS位置</el-button
+              >
+              <!-- <el-select
+                class="dropgps"
+                v-model="gpsvalue"
+                placeholder="请选择"
+                popper-class="gpsdropbox"
+                @change="gpsChange(scope.row)"
+              >
+                <el-option
+                  v-for="item in gpsOptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
+                </el-option>
+              </el-select> -->
+              <el-dropdown
+                class="dropgps"
+                trigger="click"
+                @command="
+                  (command) => {
+                    handleCommand(command, scope.row);
+                  }
+                "
+              >
+                <span class="el-dropdown-link">
+                  GPS开关<i class="el-icon-arrow-down el-icon--right"></i>
+                </span>
+                <el-dropdown-menu slot="dropdown" class="gpsdropStyle">
+                  <el-dropdown-item command="open">开启GPS</el-dropdown-item>
+                  <el-dropdown-item command="close">关闭GPS</el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
+              <!-- <el-button
+                type="text"
+                class="deleteText"
+                @click.native.stop="handleDelete(scope.row)"
+                >删除</el-button
+              > -->
+            </template>
+          </el-table-column>
+          <el-table-column fixed="right" label="操作" width="320" v-else>
+            <template slot-scope="scope">
+              <el-button
+                @click.native.stop="handleRevisePhoto(scope.row)"
+                type="text"
+                >修改</el-button
+              >
+              <el-button
+                type="text"
+                @click.native.stop="handlepicture(scope.row)"
+                >图片标记</el-button
+              >
+
+              <el-button
+                type="text"
+                @click.native.stop="handleShowGPS(scope.row)"
+                >获取GPS位置</el-button
+              >
+
+              <el-dropdown
+                class="dropgps"
+                trigger="click"
+                @command="
+                  (command) => {
+                    handleCommand(command, scope.row);
+                  }
+                "
+              >
+                <span class="el-dropdown-link">
+                  GPS开关<i class="el-icon-arrow-down el-icon--right"></i>
+                </span>
+                <el-dropdown-menu slot="dropdown" class="gpsdropStyle">
+                  <el-dropdown-item command="open">开启GPS</el-dropdown-item>
+                  <el-dropdown-item command="close">关闭GPS</el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
+              <!-- <el-button
+                type="text"
+                class="deleteText"
+                @click.native.stop="handleDelete(scope.row)"
+                >删除</el-button
+              > -->
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="pageNation">
+          <el-pagination
+            @current-change="handleCurrentChange"
+            @size-change="handleSizeChange"
+            :current-page="page"
+            :page-size="pageSize"
+            layout="sizes, prev, pager, next, jumper,total"
+            :total="total"
+            background
+          >
+          </el-pagination>
+        </div>
+      </div>
+    </div>
+    <addPhotoDialog
+      :photoDialogTitle="photoDialogTitle"
+      ref="addPhotoDialogref"
+    ></addPhotoDialog>
+    <imageCapturebak ref="imageCaptureref"></imageCapturebak>
+    <videoCapturebak ref="videoCaptureref"></videoCapturebak>
+    <pictureTags ref="picturetagsref"></pictureTags>
+    <gps-position ref="gpsdialog_ref"></gps-position>
+    <parameterSetDialog ref="parameterSetref"></parameterSetDialog>
+    <baseInfor ref="baseInfor_ref"></baseInfor>
+    <workStatus ref="workStatus_ref"></workStatus>
+    <runStatus ref="runStatus_ref"></runStatus>
+    <gpsSite ref="gpsSite_ref"></gpsSite>
+  </div>
+</template>
+<script>
+import {
+  getTerminalJoggle,
+  deleteTerminalJoggle,
+  resetTerminalApi,
+  setTermGPSJoggle,
+  getSearchInfo,
+} from "@/utils/api/index";
+import moment from "moment";
+import addPhotoDialog from "./components/addPhotoDialog.vue";
+import imageCapturebak from "./components/imageCapturebak.vue";
+import videoCapturebak from "./components/videoCapturebak.vue";
+import pictureTags from "./components/pictureTags.vue";
+import gpsPosition from "./components/gpsPosition.vue";
+import parameterSetDialog from "./components/parameterSetDialog.vue";
+import baseInfor from "./components/baseInfor.vue";
+import workStatus from "./components/workStatus.vue";
+import runStatus from "./components/runStatus.vue";
+import gpsSite from "./components/gpsSite.vue";
+
+export default {
+  components: {
+    addPhotoDialog,
+    imageCapturebak,
+    videoCapturebak,
+    pictureTags,
+    gpsPosition,
+    parameterSetDialog,
+    baseInfor,
+    workStatus,
+    runStatus,
+    gpsSite,
+  },
+  data() {
+    return {
+      dyOptions: [{ id: -1, name: "全部" }], //电压数据
+      xlOptions: [{ id: -1, name: "全部" }], //线路数据
+      gtOptions: [{ id: -1, name: "全部" }], //杆塔数据
+      formdata: {
+        dyId: -1,
+        lineId: -1,
+        towerId: -1,
+        search: "",
+      },
+      roleUser: "",
+      terminalTableData: [], //表格数据
+      photoDialog: false, //新增弹窗
+      photoDialogTitle: "", //弹窗标题
+      deleteArr: [], //删除数组
+      multipleSelection: [], //当前选中数组
+      formphotoInfo: {}, //弹窗传值
+      page: 1, // 当前页数
+      pageSize: 20, // 每页数量
+      total: 0, //总条数
+      loading: true,
+
+      gpsOptions: [
+        {
+          value: "1",
+          label: "GPS关闭",
+        },
+        {
+          value: "2",
+          label: "GPS开启",
+        },
+      ],
+      gpsvalue: "1",
+    };
+  },
+  created() {
+    this.getSearchdy();
+    this.terminalList();
+    this.roleUser = localStorage.getItem("role");
+    console.log(this.roleUser);
+  },
+  methods: {
+    //获取电压信息
+    getSearchdy() {
+      getSearchInfo({ type: 1 })
+        .then((res) => {
+          this.dyOptions = [{ id: -1, name: "全部" }];
+          this.dyOptions = this.dyOptions.concat(res.data.list);
+          this.formdata.dyId = this.dyOptions[0].id;
+          this.getSearchxl();
+        })
+        .catch((err) => {});
+    },
+    //获取线路数据
+    getSearchxl() {
+      getSearchInfo({ type: 2, id: this.formdata.dyId })
+        .then((res) => {
+          this.xlOptions = [{ id: -1, name: "全部" }];
+          this.xlOptions = this.xlOptions.concat(res.data.list);
+          this.formdata.lineId = this.xlOptions[0].id;
+          this.getSearchgt();
+        })
+        .catch((err) => {});
+    },
+    //获取杆塔数据
+    getSearchgt() {
+      getSearchInfo({ type: 3, id: this.formdata.lineId })
+        .then((res) => {
+          this.gtOptions = [{ id: -1, name: "全部" }];
+          this.gtOptions = this.gtOptions.concat(res.data.list);
+          this.formdata.towerId = this.gtOptions[0].id;
+        })
+        .catch((err) => {});
+    },
+    //查询
+    onSubmit() {
+      this.terminalList();
+    },
+    //重置
+    onReset() {
+      this.formdata = {};
+      this.getSearchdy();
+      this.page = 1;
+      this.pageSize = 20;
+      this.terminalList();
+    },
+    ////获取拍照装置列表数据
+    terminalList() {
+      this.loading = true;
+      this.$set(this.formdata, "pageindex", this.page);
+      this.$set(this.formdata, "pagesize", this.pageSize);
+      getTerminalJoggle(this.formdata)
+        .then((res) => {
+          console.log(res);
+          this.terminalTableData = res.data.list;
+          this.total = res.data.total;
+          this.loading = false;
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    //点击行选中当前行
+    handleRowClick(row, column, event) {
+      this.$refs.multipleTable.toggleRowSelection(row);
+    },
+    //获取选中的行
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    //时间转化
+    dateFormat(row, column) {
+      var date = row[column.property];
+      if (date == undefined) {
+        return "";
+      }
+      return moment(date).format("YYYY-MM-DD HH:mm:ss");
+    },
+    // 新建弹窗
+    handleAddPhoto() {
+      this.photoDialogTitle = "新增";
+      this.$refs.addPhotoDialogref.display();
+      this.$refs.addPhotoDialogref.getdataform(null);
+    },
+    //handleResive 修改线路数据
+    handleRevisePhoto(data) {
+      this.photoDialogTitle = "修改";
+      this.$refs.addPhotoDialogref.display();
+      this.$refs.addPhotoDialogref.getdataform(data);
+      console.log(data);
+    },
+    //装置复位
+    handleDeviceReset(data) {
+      this.$confirm("此操作将复位装置, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          resetTerminalApi({ cmId: data.cmdId })
+            .then((res) => {
+              if (res.code == 200) {
+                this.$message({
+                  duration: 1500,
+                  showClose: true,
+                  message: "装置已复位",
+                  type: "success",
+                });
+              } else {
+                this.$message({
+                  duration: 1500,
+                  showClose: true,
+                  message: res.msg,
+                  type: "error",
+                });
+              }
+            })
+            .catch((err) => {});
+        })
+        .catch(() => {
+          // this.$message({
+          //   duration: 1500,
+          //   showClose: true,
+          //   type: "info",
+          //   message: "已取消删除",
+          // });
+        });
+    },
+    //获取GPS位置
+    handleShowGPS(data) {
+      // this.$refs.gpsdialog_ref.display();
+      // this.$refs.gpsdialog_ref.getgpsData(data);
+      this.$refs.gpsdialog_ref.display(data);
+      this.$refs.gpsdialog_ref.getgpssql();
+      console.log(data);
+    },
+
+    //切换gps开启关闭
+    changeGPS(val, row) {
+      console.log(val, row);
+      setTermGPSJoggle({ gpsstatus: val, cmdId: row.cmdId })
+        .then((res) => {
+          console.log(res);
+          if (val == 0) {
+            this.$message({
+              duration: 1500,
+              message: "关闭GPS",
+              type: "success",
+              showClose: true,
+            });
+          } else {
+            this.$message({
+              duration: 1500,
+              message: "成功开启GPS",
+              type: "success",
+              showClose: true,
+            });
+          }
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    handleCommand(command, row) {
+      console.log(command, row);
+      switch (command) {
+        case "open": //开启
+          this.changeGPS(1, row);
+          break;
+        case "close": //关闭
+          this.changeGPS(0, row);
+          break;
+      }
+    },
+    //
+    // gpsChange(val) {
+    //   console.log(val);
+    // },
+    //图像采集参数
+    handleImageCapture(data) {
+      this.$refs.imageCaptureref.display();
+      this.$refs.imageCaptureref.getSingleAccess(data);
+      this.$refs.imageCaptureref.getRatio();
+    },
+    //视频采集参数
+    handleVideoCapture(data) {
+      this.$refs.videoCaptureref.display();
+      this.$refs.videoCaptureref.getSingleAccess(data);
+      this.$refs.videoCaptureref.getRatio();
+    },
+
+    //线缆绘制
+    handlepicture(data) {
+      console.log(data);
+      this.$refs.picturetagsref.display(data);
+    },
+    //数据查询
+    handleSearchCommand(command, row) {
+      console.log(command, row);
+      switch (command) {
+        case "info":
+          this.$refs.baseInfor_ref.display();
+          break;
+        case "workStatus":
+          this.$refs.workStatus_ref.display();
+          break;
+        case "runStatus":
+          this.$refs.runStatus_ref.display();
+          break;
+        case "GPS":
+          this.$refs.gpsSite_ref.display();
+          break;
+        default:
+          break;
+      }
+    },
+    //参数配置
+    handleParameterSet(data) {
+      this.$refs.parameterSetref.display(data);
+    },
+
+    // //新建弹窗handleAddPhoto
+    // handleAddPhoto() {
+    //   this.photoDialog = true;
+    //   this.photoDialogTitle = "新增";
+    // },
+    // //修改弹窗handleRevisePhoto
+    // handleRevisePhoto(data) {
+    //   this.photoDialog = true;
+    //   this.photoDialogTitle = "修改";
+    //   this.formphotoInfo = Object.assign({}, data);
+    // },
+
+    //删除数据
+    handleDelete(data) {
+      console.log(data);
+      this.deleteArr.push({
+        termid: data.id,
+      });
+      console.log(this.deleteArr);
+      this.$confirm("确定要删除记录吗,同时删除关联关系?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          // 行设置向后台请求删除数据
+          deleteTerminalJoggle({ list: this.deleteArr }).then((res) => {
+            console.log(res);
+            this.terminalList(); //刷新
+          });
+          this.$message({
+            duration: 1500,
+            type: "success",
+            message: "删除成功!",
+            showClose: true,
+          });
+        })
+        .catch(() => {
+          // this.$message({
+          //   duration: 1500,
+          //   type: "info",
+          //   message: "已取消删除",
+          //   showClose: true,
+          // });
+        });
+    },
+    //点击分页
+    handleCurrentChange(val) {
+      this.page = val;
+      this.terminalList(); //刷新
+    },
+    //每页条数
+    handleSizeChange(val) {
+      this.pageSize = val;
+      this.terminalList();
+    },
+  },
+};
+</script>
+<style lang="less">
+.photoGraphicDevice {
+  width: calc(100% - 24px);
+  height: calc(100% - 24px);
+  padding: 12px 12px;
+  background: @color-white;
+  .photoBox {
+    border: 1px solid #dddddd;
+    height: calc(100% - 24px);
+    padding: 12px;
+    border-radius: 4px;
+    .searchBox {
+      .ml10 {
+        margin-left: 10px;
+      }
+      .el-form {
+        .dybox {
+          .el-form-item__content {
+            width: 120px;
+          }
+        }
+        .xlbox {
+          .el-form-item__content {
+            width: 160px;
+          }
+        }
+      }
+    }
+  }
+  .photoGraphicBtnGroup {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+  .searchBox {
+    margin-top: 8px;
+  }
+  .photoGraphicTable {
+    // margin-top: 16px;
+    //margin-top: 36px;
+    height: calc(100% - 94px);
+  }
+  .dropgps {
+    color: @color-primary;
+    margin-left: 16px;
+    // margin-right: 16px;
+    cursor: pointer;
+    font-size: 12px;
+    width: 80px;
+    .el-input__inner {
+      padding: 0px;
+      border: none;
+      color: @color-primary;
+      font-size: 12px;
+      background-color: transparent;
+    }
+  }
+}
+.gpsdropbox {
+  .el-select-dropdown__item {
+    line-height: 27px;
+    padding: 0 15px;
+    font-size: 12px;
+    height: 27px;
+  }
+}
+</style>