生产点位管理，标准点位管理

package.json

@@ -59,6 +59,7 @@
     "vue-cropper": "0.5.5",
     "vue-meta": "2.4.0",
     "vue-router": "3.4.9",
+    "vue-video-player": "^5.0.1",
     "vuedraggable": "2.24.3",
     "vuex": "3.6.0"
   },

src/components/videoPlayer/index.vue

@@ -0,0 +1,168 @@
+<template>
+  <div class="container">
+    <div class="video_main">
+      <video-player
+        class="video-player"
+        id="videoDiv"
+        ref="videoPlayer"
+        :playsinline="true"
+        :options="playerOptions"
+        @play="onPlayerPlay($event)"
+        @pause="onPlayerPause($event)"
+        @ended="onPlayerEnded($event)"
+        @waiting="onPlayerWaiting($event)"
+        @playing="onPlayerPlaying($event)"
+        @loadeddata="onPlayerLoadeddata($event)"
+        @timeupdate="onPlayerTimeupdate($event)"
+        @canplay="onPlayerCanplay($event)"
+        @canplaythrough="onPlayerCanplaythrough($event)"
+        @statechanged="playerStateChanged($event)"
+        @ready="playerReadied"
+      ></video-player>
+    </div>
+  </div>
+</template>
+   
+  <script>
+import { videoPlayer } from "vue-video-player";
+export default {
+  name: "",
+  components: { videoPlayer },
+  props: {},
+  data() {
+    return {
+      playerOptions: {
+        playbackRates: [0.5, 1.0, 1.5, 2.0],
+        autoplay: false,
+        muted: false,
+        loop: false,
+        preload: "auto",
+        language: "zh-CN",
+        aspectRatio: "16:9",
+        fluid: true,
+        sources: [
+          {
+            type: "video/mp4",
+            src: "",
+          },
+        ],
+        poster: "", // 封面地址
+        width: document.documentElement.clientWidth,
+        notSupportedMessage: "加载中......", //允许覆盖Video.js无法播放媒体源时显示的默认信息。
+        controlBar: {
+          timeDivider: true, // 当前时间和持续时间的分隔符
+          durationDisplay: true, // 显示持续时间
+          remainingTimeDisplay: true, // 是否显示剩余时间功能
+          fullscreenToggle: false, // 是否显示全屏按钮
+        },
+      },
+    };
+  },
+  computed: {},
+  watch: {
+    src: {
+      handler(newval) {
+        this.playerOptions.sources[0].src = newval;
+        this.srcvideo = newval;
+      },
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    // 播放的回调
+    onPlayerPlay(e) {
+      this.isplay = true;
+    },
+    // 暂停的回调
+    onPlayerPause(e) {
+      this.isplay = false;
+    },
+    // 结束的回调
+    onPlayerEnded(e) {
+      this.isplay = false;
+    },
+    // 等待的回调
+    onPlayerWaiting(e) {},
+    // 播放中回调
+    onPlayerPlaying(e) {
+      this.isplay = true;
+    },
+    // 视频加载完成的回调
+    onPlayerLoadeddata(e) {
+      // e.duration() 可获取视频的总时长
+    },
+    // 视频播放时，时间的回调
+    onPlayerTimeupdate(e) {
+      // this.currentVolume = (e.volume() * 100).toFixed(2) * 1;
+    },
+    //媒体的readyState为HAVE_FUTURE_DATA或更高
+    onPlayerCanplay(player) {
+      // console.log('player Canplay!', player)
+    },
+    //媒体的readyState为HAVE_ENOUGH_DATA或更高。这意味着可以在不缓冲的情况下播放整个媒体文件。
+    onPlayerCanplaythrough(player) {
+      // console.log('player Canplaythrough!', player)
+    },
+    // 视频播放时状态回调
+    playerStateChanged(e) {
+      // e.timeupdate 存在时视频正在播放中，e.timeupdate 值为当前播放时间
+      // e.pause 存在时视频为暂停状态
+      // e.play 存在时视频为播放状态
+    },
+    // 视频加载完成回调，此时可以赋值 myPlayer
+    playerReadied(e) {
+      // this.myPlayer = e;
+    },
+  },
+};
+</script>
+   
+  <style scoped lang="scss">
+// .video_main {
+//   width: 100vw;
+// }
+::v-deep.video-js .vjs-big-play-button {
+  width: 88px !important;
+  height: 88px !important;
+  border-radius: 50% !important;
+  border: 0;
+  line-height: 88px;
+  font-size: 56px;
+  margin-left: -50px;
+  margin-top: -60px;
+  object-fit: cover;
+}
+::v-deep.video-js .vjs-control-bar {
+  height: 58px;
+  line-height: 58px;
+  background: rgba(0, 0, 0, 0.24) !important;
+  // background: #ac8282;
+}
+::v-deep.vjs-button > .vjs-icon-placeholder:before {
+  font-size: 40px;
+}
+::v-deep.video-js .vjs-control {
+  font-size: 22px;
+  line-height: 58px;
+}
+::v-deep.vjs-playback-rate .vjs-playback-rate-value {
+  line-height: 58px;
+}
+::v-deep.vjs-button > .vjs-icon-placeholder:before {
+  line-height: 60px;
+}
+::v-deep.vjs-remaining-time-display {
+  font-size: 24px;
+}
+::v-deep.video-js .vjs-big-play-button {
+  background-color: rgba(0, 0, 0, 0.5);
+}
+::v-deep.video-js .vjs-slider {
+  background-color: rgba(255, 255, 255, 0.5);
+}
+// 视频封面
+::v-deep.video-js .vjs-poster {
+  background-size: cover !important;
+}
+</style>

src/main.js

@@ -38,6 +38,12 @@ import VueMeta from 'vue-meta'
 // 字典数据组件
 import DictData from '@/components/DictData'
 
+// VideoPlayer
+import VideoPlayer from 'vue-video-player'
+import 'video.js/dist/video-js.css'
+import 'vue-video-player/src/custom-theme.css'
+
+
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts
 Vue.prototype.getConfigKey = getConfigKey
@@ -58,6 +64,8 @@ Vue.component('FileUpload', FileUpload)
 Vue.component('ImageUpload', ImageUpload)
 Vue.component('ImagePreview', ImagePreview)
 
+Vue.use(VideoPlayer)
+
 Vue.use(directive)
 Vue.use(plugins)
 Vue.use(VueMeta)

src/views/equipment/entry.vue

@@ -0,0 +1,193 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="20">
+      <el-col :span="5">
+        <div class="grid-content">
+          <div class="operate-left">
+            <i class="el-icon-plus" @click="add"></i>
+            <i class="el-icon-delete"></i>
+            <i class="el-icon-download"></i>
+            <i class="el-icon-upload2"></i>
+          </div>
+          <el-input placeholder="搜索设备名称" v-model="queryParams"></el-input>
+          <el-tree
+            :data="treeData"
+            :props="defaultProps"
+            @node-click="handleNodeClick"
+            default-expand-all
+          >
+            <span slot-scope="{ node, data }" class="slot-node">
+              <template>
+                <i
+                  class="el-icon-box"
+                  v-if="data.type == 1 || data.type == 2 || data.type == 3"
+                ></i>
+                <i
+                  class="el-icon-s-operation"
+                  v-if="data.type == 4"
+                  :class="{
+                    'el-icon-folder': !node.expanded,
+                    'el-icon-folder-opened': node.expanded,
+                    'el-icon-s-operation': data.type === 4,
+                  }"
+                ></i>
+                <span>{{ node.label }}</span>
+              </template>
+            </span>
+          </el-tree>
+        </div>
+      </el-col>
+      <el-col :span="19">
+        <div class="grid-content-right" v-if="show">
+          <div class="titleName">{{ titleName }}</div>
+          <el-form ref="form" :model="form" label-width="80px">
+            <el-form-item label="设备名称">
+              <el-input v-model="form.name"></el-input>
+            </el-form-item>
+            <el-form-item label="设备类型">
+              <el-select v-model="form.region" placeholder="请选择活动区域">
+                <el-option label="区域一" value="shanghai"></el-option>
+                <el-option label="区域二" value="beijing"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="设备编号">
+                <el-input v-model="form.name"></el-input>
+                <span class="serial-number">设备编号用于生产复核，需与SCADA系统中的设备编号一致</span>
+            </el-form-item>
+            <el-form-item label="显示排序">
+                <el-input-number v-model="form.num" controls-position="right" :min="1"></el-input-number>
+            </el-form-item>
+            <el-form-item label="实物ID">
+                <el-input v-model="form.name"></el-input>
+            </el-form-item>
+            <el-form-item label="   监控索引号">
+                <el-input v-model="form.name"></el-input>
+            </el-form-item>
+            <el-form-item label="设备型号">
+                <el-input v-model="form.name"></el-input>
+            </el-form-item>
+            <el-form-item label="设备厂家">
+                <el-input v-model="form.name"></el-input>
+            </el-form-item>
+
+            <el-form-item label="x坐标">
+                <el-input-number v-model="form.numX" controls-position="right" :min="-20" :max="20"></el-input-number>
+                <span class="number-title">(建议最小值-20，最大值20)</span>
+            </el-form-item>
+
+            <el-form-item label="y坐标">
+                <el-input-number v-model="form.num" controls-position="right" :min="66"></el-input-number>
+                <span  class="number-title">(建议66)</span>
+            </el-form-item>
+
+            <el-form-item label="z坐标">
+                <el-input-number v-model="form.num" controls-position="right" :min="-6" :max="20"></el-input-number>
+                <span  class="number-title">(建议最小值-6，最大值20)</span>
+            </el-form-item>
+
+            <el-form-item>
+              <el-button type="primary" @click="onSubmit">保存</el-button>
+            </el-form-item>
+          </el-form>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script >
+
+export default {
+  name: "entry",
+  data() {
+    return {
+      queryParams: "",
+      treeData: [
+        {
+          label: "一级 1",
+          type: 1,
+          children: [
+            {
+              label: "二级 1-1",
+              children: [
+                {
+                  label: "三级 1-1-1",
+                  children: [
+                    {
+                      label: "四级 1-1-1-1",
+                      type: 4,
+                    },
+                    {
+                      label: "四级 1-1-1-2",
+                      type: 4,
+                    },
+                  ],
+                },
+              ],
+            },
+          ],
+        },
+      ],
+      defaultProps: {
+        children: "children",
+        label: "label",
+      },
+      titleName: "",
+      form:{},
+      show:false
+    };
+  },
+  methods: {
+    handleNodeClick(data) {
+      console.log(data);
+      this.titleName = data.label;
+      if(data.type==4||data.type==3){
+        this.show=true
+      }else{
+        this.show=false
+      }
+    },
+    add(){
+        this.show=true
+    }
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.operate-left {
+  height: 30px;
+  display: flex;
+  justify-content: flex-end;
+  i {
+    font-size: 20px;
+    margin-left: 5px;
+    cursor: pointer;
+  }
+}
+::v-deep .el-tree-node:focus > .el-tree-node__content {
+  color: #4a9de7 !important;
+  // color: #fff !important;
+}
+/*节点失焦时的背景颜色*/
+//   .el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content{
+//     background-color: #4a9de7 !important;
+//     color: #fff !important;
+//   }
+.grid-content-right {
+  padding: 0 20%;
+}
+.titleName {
+  font-size: 26px;
+  padding: 10px;
+}
+.number-title{
+    margin-left: 10px;
+}
+.serial-number{
+    color: #999;
+    font-size: 12px;
+    margin-bottom: 30px;
+    margin-top: 20px;
+}
+</style>

src/views/equipment/equipment.vue

@@ -0,0 +1,521 @@
+<template>
+  <div class="app-container">
+    <el-form :inline="true" :model="queryParams" class="demo-form-inline">
+      <el-form-item label="设备类型">
+        <el-select v-model="queryParams.region" placeholder="活动区域">
+          <el-option label="区域一" value="shanghai"></el-option>
+          <el-option label="区域二" value="beijing"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="设备名称">
+        <el-input v-model="queryParams.user" placeholder="审批人"></el-input>
+      </el-form-item>
+      <el-form-item label="设备编码">
+        <el-input v-model="queryParams.user" placeholder="审批人"></el-input>
+      </el-form-item>
+      <el-form-item label="生产厂家">
+        <el-input v-model="queryParams.user" placeholder="审批人"></el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-button
+          type="primary"
+          icon="el-icon-search"
+          size="mini"
+          @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
+          >重置</el-button
+        >
+      </el-form-item>
+    </el-form>
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          >新增</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          >修改</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          >删除</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          plain
+          icon="el-icon-upload2"
+          size="mini"
+          @click="handleExport"
+          >导入</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          >导出</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button type="primary" plain icon="el-icon-upload" size="mini"
+          >模型同步</el-button
+        >
+      </el-col>
+    </el-row>
+    <el-table :data="tableData" style="width: 100%">
+      <el-table-column
+        type="selection"
+        width="55"
+        align="center"
+        fixed="left"
+      />
+      <el-table-column prop="date" label="设备名称" align="center" fixed="left">
+      </el-table-column>
+      <el-table-column prop="name" label="设备编码" align="center" fixed="left">
+      </el-table-column>
+      <el-table-column
+        prop="address"
+        label="视频NVR编码"
+        align="center"
+        fixed="left"
+      >
+      </el-table-column>
+      <el-table-column
+        prop="address"
+        label="生产厂家"
+        align="center"
+        fixed="left"
+      >
+      </el-table-column>
+      <el-table-column
+        prop="address"
+        label="主系统编号"
+        align="center"
+        fixed="left"
+      >
+      </el-table-column>
+      <el-table-column prop="address" label="变电站名称" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="变电站编码" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="区域名称" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="设备类型" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="使用单位" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="设备来源" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="生产日期" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="出厂编号" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="是否转轮" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="使用类型" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="安装位置" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="相对空间位置x" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="相对空间位置y" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="相对空间位置z" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="所属机器人" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="ip地址" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="端口" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="用户" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="密码" align="center">
+      </el-table-column>
+      <el-table-column label="操作" align="center" fixed="right" width="200px">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            >修改</el-button
+          >
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            >删除</el-button
+          >
+          <el-button size="mini" type="text" icon="el-icon-s-promotion"
+            >通道</el-button
+          >
+          <el-button size="mini" type="text" icon="el-icon-upload"
+            >上传图片</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+    />
+
+    <el-dialog
+      :title="title"
+      :visible.sync="dialogVisible"
+      width="70%"
+      :before-close="handleClose"
+    >
+      <el-row :gutter="10">
+        <el-form
+          :model="dialogForm"
+          class="demo-form-inline"
+          label-position="right"
+          label-width="110px"
+        >
+          <el-col span="6">
+            <el-form-item label="区域名称">
+              <el-select
+                v-model="dialogForm.region"
+                placeholder="请选择区域"
+                style="display: block; width: 100%"
+              >
+                <el-option label="区域一" value="shanghai"></el-option>
+                <el-option label="区域二" value="beijing"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="设备类型">
+              <el-select
+                v-model="dialogForm.region"
+                placeholder="请选择类型"
+                style="display: block; width: 100%"
+              >
+                <el-option label="区域一" value="shanghai"></el-option>
+                <el-option label="区域二" value="beijing"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="设备名称">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入设备名称"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="设备编码">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入设备编码"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="设备型号">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入设备型号"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="生产厂家">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入生产"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="主系统" class="mainSystem">
+              <el-select
+                v-model="dialogForm.region"
+                placeholder="请选择主系统"
+                style="display: block; width: 100%"
+              >
+                <el-option label="区域一" value="shanghai"></el-option>
+                <el-option label="区域二" value="beijing"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col span="6">
+            <el-form-item label="使用单位">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入使用单位"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="设备来源">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入设备来源"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="生产日期">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入生产日期"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="出厂编号">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入出厂编号"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="是否转轮">
+              <el-select
+                v-model="dialogForm.region"
+                placeholder="请选择"
+                style="display: block; width: 100%"
+              >
+                <el-option label="区域一" value="shanghai"></el-option>
+                <el-option label="区域二" value="beijing"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="使用类型">
+              <el-select
+                v-model="dialogForm.region"
+                placeholder="请选择使用类型"
+                style="display: block; width: 100%"
+              >
+                <el-option label="区域一" value="shanghai"></el-option>
+                <el-option label="区域二" value="beijing"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="视频类型">
+              <el-select
+                v-model="dialogForm.region"
+                placeholder="请选择视频类型"
+                style="display: block; width: 100%"
+              >
+                <el-option label="区域一" value="shanghai"></el-option>
+                <el-option label="区域二" value="beijing"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="安装位置">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入安装位置"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="所属机器人">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入所属机器人"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="相对空间位置x">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入相对空间位置x"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="相对空间位置y">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入相对空间位置y"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="相对空间位置z">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入相对空间位置 z"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="ip地址">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入ip地址"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="端口">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入端口"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="用户">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入用户"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="密码">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入密码"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col span="6">
+            <el-form-item label="视频NVR编码">
+              <el-input
+                v-model="dialogForm.region"
+                placeholder="请输入视频NVR编码"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+        </el-form>
+      </el-row>
+
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="dialogVisible = false"
+          >确 定</el-button
+        >
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script >
+export default {
+  name: "equipment",
+  data() {
+    return {
+      queryParams: {},
+      tableData: [
+        {
+          date: "2016-05-02",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1518 弄",
+        },
+        {
+          date: "2016-05-04",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1517 弄",
+        },
+        {
+          date: "2016-05-01",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1519 弄",
+        },
+        {
+          date: "2016-05-03",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1516 弄",
+        },
+      ],
+      total: 20,
+      dialogVisible: false,
+      title: "新增",
+      dialogForm: {},
+    };
+  },
+  methods: {
+    handleClose() {
+      this.dialogVisible = false;
+    },
+    handleAdd(){
+      this.dialogVisible = true;
+    }
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.operate-left {
+  height: 30px;
+  display: flex;
+  justify-content: flex-end;
+  i {
+    font-size: 20px;
+    margin-left: 5px;
+    cursor: pointer;
+  }
+}
+::v-deep .el-tree-node:focus > .el-tree-node__content {
+  color: #4a9de7 !important;
+  // color: #fff !important;
+}
+/*节点失焦时的背景颜色*/
+//   .el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content{
+//     background-color: #4a9de7 !important;
+//     color: #fff !important;
+//   }
+.grid-content-right {
+  padding: 0 20%;
+}
+.titleName {
+  font-size: 26px;
+  padding: 10px;
+}
+.number-title {
+  margin-left: 10px;
+}
+.serial-number {
+  color: #999;
+  font-size: 12px;
+  margin-bottom: 30px;
+  margin-top: 20px;
+}
+.mainSystem {
+  ::v-deep.el-form-item__label {
+    color: rgb(255, 200, 0);
+  }
+}
+</style>

src/views/equipment/equipment_type.vue

@@ -0,0 +1,191 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="20">
+      <el-col :span="5">
+        <div class="operate-left">
+          <i class="el-icon-plus" @click="add"></i>
+          <i class="el-icon-delete"></i>
+        </div>
+        <el-input
+          placeholder="输入关键字进行过滤"
+          v-model="queryParams"
+        ></el-input>
+        <el-tree
+          :data="treeData"
+          :props="defaultProps"
+          @node-click="handleNodeClick"
+          default-expand-all
+        >
+          <span slot-scope="{ node, data }" class="slot-node">
+            <template>
+              <i
+                class="el-icon-box"
+                v-if="data.type == 1 || data.type == 2 || data.type == 3"
+              ></i>
+              <i
+                class="el-icon-s-operation"
+                v-if="data.type == 4"
+                :class="{
+                  'el-icon-folder': !node.expanded,
+                  'el-icon-folder-opened': node.expanded,
+                  'el-icon-s-operation': data.type === 4,
+                }"
+              ></i>
+              <span>{{ node.label }}</span>
+            </template>
+          </span>
+        </el-tree>
+      </el-col>
+      <el-col :span="19">
+        <div class="right">
+          <el-button
+            type="primary"
+            @click="add"
+            v-if="!show && (type == 0 || type == 1)"
+            >添加设备</el-button
+          >
+          <i
+            class="el-icon-close closeBtn"
+            v-if="show && type == 0"
+            @click="close"
+          ></i>
+          <div v-if="show">
+            <div class="right-title">{{ rightTitle }}</div>
+
+            <el-form :model="formData">
+              <el-form-item label="设备类型名称">
+                <el-input v-model="formData.name"></el-input>
+              </el-form-item>
+              <el-form-item label="设备类别编号">
+                <el-input v-model="formData.name"></el-input>
+              </el-form-item>
+              <el-form-item label="所属专业">
+                <el-input v-model="formData.name"></el-input>
+              </el-form-item>
+
+              <el-form-item label="相数" v-if="type !== 0&&type !== 1">
+                <el-radio-group v-model="formData.resource">
+                  <el-radio label="无相数"></el-radio>
+                  <el-radio label="单相"></el-radio>
+                  <el-radio label="三相"></el-radio>
+                </el-radio-group>
+              </el-form-item>
+
+              <el-form-item label="相别" v-if="type !== 0&&type !== 1">
+                <el-radio-group v-model="formData.resource">
+                  <el-radio label="无相数"></el-radio>
+                  <el-radio label="A"></el-radio>
+                  <el-radio label="B"></el-radio>
+                  <el-radio label="C"></el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item>
+                <el-button type="primary">保存</el-button>
+              </el-form-item>
+            </el-form>
+          </div>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "equipment_type",
+  data() {
+    return {
+      treeData: [
+        {
+          label: "一级 1",
+          type: 1,
+          children: [
+            {
+              label: "二级 1-1",
+              type: 2,
+              children: [
+                {
+                  label: "三级 1-1-1",
+                  type: 3,
+                  children: [
+                    {
+                      label: "四级 1-1-1-1",
+                      type: 4,
+                    },
+                    {
+                      label: "四级 1-1-1-2",
+                      type: 4,
+                    },
+                  ],
+                },
+              ],
+            },
+          ],
+        },
+      ],
+      defaultProps: {
+        children: "children",
+        label: "label",
+      },
+      rightTitle: "添加设备",
+      queryParams: "",
+      formData: {},
+      show: false,
+      type: 0,
+    };
+  },
+  methods: {
+    handleNodeClick(data) {
+      console.log(data.type);
+      this.type = data.type;
+
+      if (data.type == 0) {
+        this.rightTitle = "添加设备";
+        this.show = true;
+      } else if (data.type !== 0 && data.type !== 1) {
+        this.show = true;
+        this.rightTitle = "编辑设备";
+      } else if (data.type == 1) {
+        this.show = false;
+      }
+    },
+    add() {
+      this.show = true;
+      this.type = 0;
+      this.rightTitle = "添加设备";
+    },
+    close() {
+      this.show = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.operate-left {
+  height: 30px;
+  display: flex;
+  justify-content: flex-end;
+  i {
+    font-size: 20px;
+    margin-left: 10px;
+    cursor: pointer;
+  }
+}
+::v-deep .el-tree-node:focus > .el-tree-node__content {
+  color: #4a9de7 !important;
+  // color: #fff !important;
+}
+.right {
+  padding: 0 50px;
+  width: 50%;
+  .right-title {
+    font-size: 20px;
+    margin: 20px 0;
+  }
+  .closeBtn {
+    font-size: 30px;
+    cursor: pointer;
+  }
+}
+</style>

src/views/point/point_mang.vue

@@ -0,0 +1,267 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="20">
+      <el-col :span="4">
+        <div class="qurey">
+          <el-input
+            placeholder="请输入内容"
+            v-model="input3"
+            class="input-with-select"
+          >
+            <el-button
+              slot="append"
+              icon="el-icon-search"
+              type="primary"
+            ></el-button>
+          </el-input>
+        </div>
+        <el-tree
+          :data="treeData"
+          :props="defaultProps"
+          @node-click="handleNodeClick"
+        ></el-tree>
+      </el-col>
+      <el-col :span="20">
+        <div>
+          <el-button type="primary">添加</el-button>
+          <span>（27/200）最多支持200个巡检点位以及内容</span>
+        </div>
+        <el-table :data="tableData" max-height="700">
+          <el-table-column
+            prop="date"
+            label="序号"
+            width="55"
+            type="index"
+            align="center"
+          ></el-table-column>
+          <el-table-column
+            prop="date"
+            label="设备分类"
+            :render-header="addRedStar"
+            align="center"
+          >
+            <template slot-scope="scope">
+              <el-select placeholder="请选择">
+                <el-option label="item.label" value="item.value"> </el-option>
+              </el-select>
+            </template>
+          </el-table-column>
+
+          <el-table-column
+            prop="date"
+            label="巡检标准"
+            :render-header="addRedStar"
+            align="center"
+          >
+            <template slot-scope="scope">
+              <el-input type="textarea"></el-input>
+            </template>
+          </el-table-column>
+          <el-table-column prop="date" label="数据格式" align="center">
+            <template slot-scope="scope">
+              <el-select
+                v-model="value"
+                multiple
+                filterable
+                allow-create
+                default-first-option
+                placeholder="请选择文章标签"
+              >
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
+                </el-option>
+              </el-select>
+            </template>
+          </el-table-column>
+          <el-table-column prop="date" label="智能识别类型" align="center">
+            <template slot-scope="scope">
+              <span class="intelligenceType" @click="intelligenceTypeBtn"
+                >123123</span
+              >
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center">
+            <template slot-scope="scope">
+              <el-button size="mini" type="primary"> 复制 </el-button>
+              <el-button size="mini" type="danger">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="saveBtn">
+            <el-button type="primary">保存</el-button>
+        </div>
+      </el-col>
+    </el-row>
+    <el-dialog
+      title="设置智能识别类型"
+      :visible.sync="dialogVisible"
+      width="50%"
+      :before-close="handleClose"
+    >
+      <el-table :data="intelligenceTypeData">
+        <el-table-column
+          type="selection"
+          width="55"
+          align="center"
+        ></el-table-column>
+        <el-table-column
+          type="index"
+          width="55"
+          align="center"
+          label="序号"
+        ></el-table-column>
+        <el-table-column
+          prop="name"
+          align="center"
+          label="算法名称"
+        ></el-table-column>
+        <el-table-column
+          prop="name"
+          align="center"
+          label="阀值上限"
+          :render-header="addRedStar"
+        >
+          <template slot-scope="scope">
+            <el-input></el-input>
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="name"
+          align="center"
+          label="阀值下限"
+          :render-header="addRedStar"
+        >
+          <template slot-scope="scope">
+            <el-input></el-input>
+          </template>
+        </el-table-column>
+      </el-table>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="dialogVisible = false"
+          >确 定</el-button
+        >
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      treeData: [
+        {
+          label: "一级 1",
+          type: 1,
+          children: [
+            {
+              label: "二级 1-1",
+              children: [
+                {
+                  label: "三级 1-1-1",
+                  children: [
+                    {
+                      label: "四级 1-1-1-1",
+                      type: 4,
+                    },
+                    {
+                      label: "四级 1-1-1-2",
+                      type: 4,
+                    },
+                  ],
+                },
+              ],
+            },
+          ],
+        },
+      ],
+      defaultProps: {
+        children: "children",
+        label: "label",
+      },
+      tableData: [{}],
+      options: [
+        {
+          value: "HTML",
+          label: "HTML",
+        },
+        {
+          value: "CSS",
+          label: "CSS",
+        },
+        {
+          value: "JavaScript",
+          label: "JavaScript",
+        },
+      ],
+      value: [],
+      dialogVisible: false,
+      intelligenceTypeData: [
+        {
+          date: "2016-05-02",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1518 弄",
+        },
+        {
+          date: "2016-05-04",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1517 弄",
+        },
+        {
+          date: "2016-05-01",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1519 弄",
+        },
+        {
+          date: "2016-05-03",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1516 弄",
+        },
+      ],
+    };
+  },
+  methods: {
+    // 给表头加必填符号*
+    addRedStar(h, { column }) {
+      return [
+        h("span", { style: "color: red" }, "*"),
+        h("span", " " + column.label),
+      ];
+    },
+    intelligenceTypeBtn() {
+      this.dialogVisible = true;
+    },
+    // 给表头加必填符号*
+    addRedStar(h, { column }) {
+      return [
+        h("span", { style: "color: red" }, "*"),
+        h("span", " " + column.label),
+      ];
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.qurey {
+  display: flex;
+  margin-bottom: 10px;
+  ::v-deep.el-button {
+    background-color: #46a6ff !important;
+    color: #fff !important ;
+  }
+}
+.intelligenceType {
+  color: rgb(17, 189, 217);
+  cursor: pointer;
+}
+.saveBtn{
+    text-align: center;
+    margin-top: 10px;
+}
+</style>

src/views/point/site_management.vue

@@ -0,0 +1,916 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="20">
+      <el-col :span="4">
+        <div class="qurey">
+          <el-input
+            placeholder="请输入内容"
+            v-model="input3"
+            class="input-with-select"
+          >
+            <el-button
+              slot="append"
+              icon="el-icon-search"
+              type="primary"
+            ></el-button>
+          </el-input>
+        </div>
+        <el-tree
+          :data="treeData"
+          :props="defaultProps"
+          @node-click="handleNodeClick"
+        ></el-tree>
+      </el-col>
+      <el-col :span="14">
+        <el-alert
+          title="提示"
+          type="info"
+          description="一个监控对象（区域、主设备），最多支持绑定16个不同摄像头；一个监控对象（区域、主设备），最多添加200个监控点位；一个监控点位绑定监控点不超过9个预置位（无论是否同一监控点）；"
+          show-icon
+        >
+        </el-alert>
+        <div class="tableOperate">
+          <div class="btnBox">
+            <el-button type="primary" @click="add">添加</el-button>
+            <el-button type="danger">删除</el-button>
+            <el-button @click="upDataBtn">机器人点位上传</el-button>
+          </div>
+          <div class="tableSearch">
+            <el-input
+              placeholder="请输入内容"
+              v-model="input3"
+              class="input-with-select"
+            >
+              <el-button
+                slot="append"
+                icon="el-icon-search"
+                type="primary"
+              ></el-button>
+            </el-input>
+          </div>
+        </div>
+        <el-table
+          :data="tableData"
+          @row-click="changeCurrentRow"
+          highlight-current-row
+        >
+          <el-table-column type="selection" width="55" fixed="left">
+          </el-table-column>
+          <el-table-column
+            label="监控点位"
+            width="200"
+            fixed="left"
+            align="center"
+            :render-header="addRedStar"
+          >
+            <template slot-scope="scope">
+              <el-input placeholder="请输入点位名称"></el-input>
+            </template>
+          </el-table-column>
+          <el-table-column label="监控内容" width="150" align="center">
+          </el-table-column>
+          <el-table-column label="用途"> </el-table-column>
+          <el-table-column
+            label="监控编号"
+            width="200"
+            align="center"
+            :render-header="addRedStar"
+          >
+            <template slot-scope="scope">
+              <el-input placeholder="请输入监控点位编号"></el-input>
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="巡检类型"
+            width="150"
+            align="center"
+            :render-header="addRedStar"
+          >
+            <template slot-scope="scope">
+              <el-select placeholder="前选择巡检类型">
+                <el-option label="区域一" value="shanghai"></el-option>
+                <el-option label="区域二" value="beijing"></el-option>
+              </el-select>
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="重要等级"
+            width="150"
+            align="center"
+            :render-header="addRedStar"
+          >
+            <el-select placeholder="前选择重要等级">
+              <el-option label="区域一" value="shanghai"></el-option>
+              <el-option label="区域二" value="beijing"></el-option>
+            </el-select>
+          </el-table-column>
+          <el-table-column label="三维坐标" width="270" align="center">
+            <template slot-scope="scope">
+              <div class="tableXYZ">
+                <el-input placeholder="x(-20,20)"></el-input>
+                <el-input placeholder="y(66)"></el-input>
+                <el-input placeholder="z(-6,20)"></el-input>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column label="上报识别类型" width="220" align="center">
+          </el-table-column>
+          <el-table-column label="智能识别类型" width="220" align="center">
+          </el-table-column>
+          <el-table-column label="判别基准图片" width="220" align="center">
+          </el-table-column>
+          <el-table-column
+            label="操作"
+            fixed="right"
+            align="center"
+            width="100"
+          >
+            <template slot-scope="scope">
+              <el-button
+                size="mini"
+                type="text"
+                @click="monitorPointEdit(scope.row)"
+                >修改</el-button
+              >
+              <el-button
+                size="mini"
+                type="text"
+                @click="handleDelete(scope.row)"
+                >删除</el-button
+              >
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-col>
+      <el-col :span="6">
+        <div class="cameraImgDiv">
+          <img src="@/assets/images/camera.png" class="cameraImg" />
+          <div>请选中左点位查看监控点或监测设备</div>
+        </div>
+        <el-tabs v-model="activeName" @tab-click="tabsClick" stretch="true">
+          <el-tab-pane label="视频设备预置点" name="first">
+            <div class="tabsBtn">
+              <el-button @click="bindingMonitorBtn(0)"
+                >绑定可见光监测点</el-button
+              >
+              <el-button @click="bindingMonitorBtn(1)"
+                >绑定热成像监控点</el-button
+              >
+            </div>
+          </el-tab-pane>
+          <el-tab-pane label="监测设备" name="second">
+            <div class="tabsBtn">
+              <el-button @click="InspectionBtn">绑定监测设备</el-button>
+
+              <el-table>
+                <el-table-column label="设备名称"> </el-table-column>
+                <el-table-column label="设备设备编码"> </el-table-column>
+                <el-table-column label="操作">
+                  <template slot-scope="scope">
+                    <el-button size="mini" type="text">移除</el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </div>
+          </el-tab-pane>
+        </el-tabs>
+      </el-col>
+    </el-row>
+
+    <!-- 添加监控点位 -->
+    <el-dialog
+      :title="monitorPointTitle"
+      :visible.sync="monitorPointDialogVisible"
+      width="60%"
+      :before-close="monitorPointHandleClose"
+    >
+      <el-form
+        v-model="monitorPointForm"
+        label-position="right"
+        label-width="120px"
+      >
+        <el-form-item label="监控点位名称">
+          <el-input v-model="monitorPointForm.name"></el-input>
+        </el-form-item>
+        <el-form-item label="监控点位编号">
+          <el-input v-model="monitorPointForm.name"></el-input>
+        </el-form-item>
+        <el-form-item label="监控点位内容">
+          <el-input
+            v-model="monitorPointForm.name"
+            type="textarea"
+            maxlength="200"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="巡检类型">
+          <el-select
+            v-model="monitorPointForm.value"
+            multiple
+            filterable
+            allow-create
+            default-first-option
+            placeholder="请选择文章标签"
+            style="width: 100%"
+          >
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="重要等级">
+          <el-select v-model="monitorPointForm.name" placeholder="请选择">
+            <el-option label="重要等级" value="重要等级"> </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="用途">
+          <el-input v-model="monitorPointForm.name"></el-input>
+        </el-form-item>
+
+        <el-form-item label="x坐标">
+          <el-input-number
+            v-model="monitorPointForm.name"
+            :min="-20"
+            :max="20"
+            label=""
+            :step="0.1"
+          ></el-input-number>
+          <span>（建议最小值-20，最大值20）</span>
+        </el-form-item>
+        <el-form-item label="y坐标">
+          <el-input-number
+            v-model="monitorPointForm.name"
+            :min="66"
+            :max="80"
+            label=""
+            :step="0.1"
+          ></el-input-number>
+          <span>（建议66）</span>
+        </el-form-item>
+        <el-form-item label="z坐标">
+          <el-input-number
+            v-model="monitorPointForm.name"
+            :min="-6"
+            :max="20"
+            label=""
+            :step="0.1"
+          ></el-input-number>
+          <span>（建议最小值-6，最大值20）</span>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="monitorPointHandleClose">取 消</el-button>
+        <el-button type="primary" @click="monitorPointHandleClose"
+          >确 定</el-button
+        >
+      </span>
+    </el-dialog>
+
+    <!-- 绑定可见光监测点 -->
+    <el-dialog
+      :title="bindingMonitorPointTitle"
+      :visible.sync="bindingMonitorPointDialogVisible"
+      width="70%"
+      :before-close="bindingMonitorPointClose"
+    >
+      <el-row :gutter="20">
+        <el-col :span="5">
+          <div class="bindingMonitorPointTree">
+            <el-tree :data="treeData" :props="defaultProps"></el-tree>
+          </div>
+        </el-col>
+        <el-col :span="13">
+          <div class="bindingMonitorPointDiv">
+            <videoPlayer />
+          </div>
+        </el-col>
+        <el-col :span="6">
+          <div style="background: #eee; padding: 5px">云台</div>
+          <div class="PTZ-content">
+            <img src="@/assets/images/PTZImg.png" alt="" class="PTZImg" />
+            <div class="r-ti2-pos">
+              <div></div>
+              <div></div>
+              <div></div>
+              <div></div>
+              <div></div>
+              <div></div>
+              <div></div>
+              <div></div>
+            </div>
+          </div>
+          <div class="r-ti3">
+            <div class="r-ti3-d1">
+              <img src="@/assets/images/searchImg.png" alt="" />
+              <div class="r-ti3-d2">
+                <div></div>
+                <div></div>
+              </div>
+            </div>
+            <div class="r-ti3-d1">
+              <img src="@/assets/images/r2Img.png" alt="" />
+              <div class="r-ti3-d2">
+                <div></div>
+                <div></div>
+              </div>
+            </div>
+            <div class="r-ti3-d1">
+              <img src="@/assets/images/r3Img.png" alt="" />
+              <div class="r-ti3-d2">
+                <div></div>
+                <div></div>
+              </div>
+            </div>
+          </div>
+          <div class="r-ti4">
+            <div style="display: flex">
+              <el-select v-model="value" placeholder="请选择">
+                <el-option label="item.label" value="item.value"> </el-option>
+              </el-select>
+              <img src="@/assets/images/playImg.png" alt="" />
+              <img src="@/assets/images/addImg.png" alt="" />
+            </div>
+            <div style="display: flex; margin-top: 20px">
+              <el-input></el-input>
+              <img src="@/assets/images/setImg.png" alt="" />
+            </div>
+          </div>
+        </el-col>
+      </el-row>
+      <el-table
+        :data="bindingMonitorPointTableData"
+        style="width: 100%"
+        @header-click="clickFun"
+      >
+        <el-table-column prop="date" label="动作类型" align="center">
+        </el-table-column>
+        <el-table-column prop="name" label="录像时长(秒)" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="拍照次数" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="拍照间隔（秒）" align="center">
+        </el-table-column>
+        <el-table-column
+          align="center"
+          :render-header="(h, obj) => renderHeader(h, obj, '添加')"
+        >
+          <template slot-scope="scope">
+            <span>移除</span>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-dialog>
+
+    <!-- 绑定巡检设备 -->
+    <el-dialog
+      title="选择巡检设备"
+      :visible.sync="InspectionDialogVisible"
+      width="70%"
+      :before-close="InspectionHandleClose"
+    >
+      <el-form :inline="true" :model="queryParams" class="demo-form-inline">
+        <el-form-item label="设备类型">
+          <el-select v-model="queryParams.region" placeholder="活动区域">
+            <el-option label="区域一" value="shanghai"></el-option>
+            <el-option label="区域二" value="beijing"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="设备名称">
+          <el-input v-model="queryParams.user" placeholder="审批人"></el-input>
+        </el-form-item>
+        <el-form-item label="设备编码">
+          <el-input v-model="queryParams.user" placeholder="审批人"></el-input>
+        </el-form-item>
+        <el-form-item label="生产厂家">
+          <el-input v-model="queryParams.user" placeholder="审批人"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" size="mini"
+            >搜索</el-button
+          >
+          <el-button icon="el-icon-refresh" size="mini">重置</el-button>
+        </el-form-item>
+      </el-form>
+      <el-table
+        :data="InspectionTableData"
+        style="width: 100%"
+        @row-click="InspectionChangeCurrentRow"
+        highlight-current-row
+      >
+        <el-table-column
+          prop="date"
+          label="设备名称"
+          align="center"
+          fixed="left"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="name"
+          label="设备编码"
+          align="center"
+          fixed="left"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          label="视频NVR编码"
+          align="center"
+          fixed="left"
+          width="150px"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          label="生产厂家"
+          align="center"
+          fixed="left"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          label="主系统编号"
+          align="center"
+          fixed="left"
+          width="150px"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          label="变电站名称"
+          align="center"
+          width="150px"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          label="变电站编码"
+          align="center"
+          width="150px"
+        >
+        </el-table-column>
+        <el-table-column prop="address" label="区域名称" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="设备类型" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="设备型号" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="使用单位" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="设备来源" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="生产日期" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="出厂编号" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="使用类型" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="视频类型" align="center">
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          label="所属机器人"
+          align="center"
+          width="150px"
+        >
+        </el-table-column>
+        <el-table-column prop="address" label="ip地址" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="端口" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="用户" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="密码" align="center">
+        </el-table-column>
+      </el-table>
+
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="dialogVisible = false"
+          >确 定</el-button
+        >
+      </span>
+    </el-dialog>
+    <!-- 机器人点位上传 -->
+    <el-dialog
+      title="机器人离线点位文件上传"
+      :visible.sync="upload.open"
+      width="30%"
+      :before-close="handleClose"
+    >
+      <div style="width: 100%;text-align: center;">
+        <el-upload
+          ref="uploadRef"
+          :limit="1"
+          accept=".xlsx, .xls, .txt, .xml"
+          :headers="upload.headers"
+          :action="upload.url + '?updateSupport=' + upload.updateSupport"
+          :disabled="upload.isUploading"
+          :on-progress="handleFileUploadProgress"
+          :on-success="handleFileSuccess"
+          :auto-upload="false"
+          drag
+        >
+          <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+          <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+          <template #tip>
+            <div class="el-upload__tip text-center">
+              <span>仅允许导入xls、xlsx、xml、txt格式文件。</span>
+              <!-- <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"
+              @click="importTemplate">下载模板</el-link> -->
+            </div>
+          </template>
+        </el-upload>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="upload.open = false">取 消</el-button>
+        <el-button type="primary" @click="submitFileForm">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script >
+import videoPlayer from "@/components/videoPlayer/index.vue";
+import { getToken } from "@/utils/auth";
+export default {
+  name: "SiteManagement",
+  components: {
+    videoPlayer,
+  },
+  data() {
+    return {
+      treeData: [
+        {
+          label: "一级 1",
+          type: 1,
+          children: [
+            {
+              label: "二级 1-1",
+              children: [
+                {
+                  label: "三级 1-1-1",
+                  children: [
+                    {
+                      label: "四级 1-1-1-1",
+                      type: 4,
+                    },
+                    {
+                      label: "四级 1-1-1-2",
+                      type: 4,
+                    },
+                  ],
+                },
+              ],
+            },
+          ],
+        },
+      ],
+      defaultProps: {
+        children: "children",
+        label: "label",
+      },
+      tableData: [{}, {}],
+      activeName: "first",
+      monitorPointDialogVisible: false,
+      monitorPointForm: {},
+      monitorPointTitle: "添加监控点位",
+      options: [
+        {
+          value: "HTML",
+          label: "HTML",
+        },
+        {
+          value: "CSS",
+          label: "CSS",
+        },
+        {
+          value: "JavaScript",
+          label: "JavaScript",
+        },
+      ],
+      bindingMonitorPointTitle: "绑定可见光监控点",
+      bindingMonitorPointDialogVisible: false,
+      bindingMonitorPointTableData: [
+        {
+          date: "2016-05-02",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1518 弄",
+        },
+        {
+          date: "2016-05-04",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1517 弄",
+        },
+        {
+          date: "2016-05-01",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1519 弄",
+        },
+        {
+          date: "2016-05-03",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1516 弄",
+        },
+      ],
+      InspectionDialogVisible: false,
+      queryParams: {},
+      InspectionTableData: [
+        {
+          date: "2016-05-02",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1518 弄",
+        },
+        {
+          date: "2016-05-04",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1517 弄",
+        },
+        {
+          date: "2016-05-01",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1519 弄",
+        },
+        {
+          date: "2016-05-03",
+          name: "王小虎",
+          address: "上海市普陀区金沙江路 1516 弄",
+        },
+      ],
+      upload: {
+        // 是否显示弹出层（用户导入）
+        open: false,
+        // 弹出层标题（用户导入）
+        title: "",
+        // 是否禁用上传
+        isUploading: false,
+        // 是否更新已经存在的用户数据
+        updateSupport: 0,
+        // 设置上传的请求头部
+        headers: { Authorization: "Bearer " + getToken() },
+        // 上传的地址
+        // url: import.meta.env.VITE_APP_BASE_API + "/zhxx/device/import",
+      },
+    };
+  },
+  mounted() {},
+  methods: {
+    // 给表头加必填符号*
+    addRedStar(h, { column }) {
+      return [
+        h("span", { style: "color: red" }, "*"),
+        h("span", " " + column.label),
+      ];
+    },
+    handleNodeClick() {},
+
+    changeCurrentRow(row) {
+      this.currentRowId = row.id; // 更新当前点击的行ID
+      rowStyle(row);
+    },
+    // 更改选中行背景色
+    rowStyle({ row }) {
+      if (this.name === row.name) {
+        return { "background-color": "#F7EDED", cursor: "pointer" };
+      }
+      return { cursor: "pointer" };
+    },
+    tabsClick() {},
+    add() {
+      this.monitorPointDialogVisible = true;
+      this.monitorPointTitle = "添加监控点位";
+    },
+    monitorPointHandleClose() {
+      this.monitorPointDialogVisible = false;
+    },
+    monitorPointEdit() {
+      this.monitorPointDialogVisible = true;
+      this.monitorPointTitle = "修改监控点位";
+    },
+    // 关闭绑定可见光监测点弹窗
+    bindingMonitorPointClose() {
+      this.bindingMonitorPointDialogVisible = false;
+    },
+    bindingMonitorBtn(type) {
+      if (type == 0) {
+        this.bindingMonitorPointTitle = "绑定可见光监控点";
+      } else {
+        this.bindingMonitorPointTitle = "绑定热成像监控点";
+      }
+
+      this.bindingMonitorPointDialogVisible = true;
+    },
+    clickFun() {},
+    renderHeader(h, { column, $index }, type) {
+      let that = this;
+      return h("div", [
+        // 列名称
+        h("span", column.label),
+        // 按钮
+        h(
+          "el-button",
+          {
+            props: {
+              type: "text",
+              size: "small",
+            },
+            style: "margin-left: 5px;",
+            on: {
+              click: function () {
+                that.clickButton(type);
+              },
+            },
+          },
+          "添加"
+        ),
+      ]);
+    },
+    clickButton(type) {
+      console.log("我点击了" + type + "的列");
+    },
+    InspectionHandleClose() {
+      this.InspectionDialogVisible = false;
+    },
+    InspectionBtn() {
+      this.InspectionDialogVisible = true;
+    },
+    InspectionChangeCurrentRow(row) {
+      this.currentRowId = row.id; // 更新当前点击的行ID
+      rowStyle(row);
+    },
+    /**文件上传中处理 */
+    handleFileUploadProgress(event, file, fileList) {
+      upload.isUploading = true;
+    },
+    /** 文件上传成功处理 */
+    handleFileSuccess(response, file, fileList) {
+      upload.open = false;
+      upload.isUploading = false;
+      proxy.$refs["uploadRef"].handleRemove(file);
+      proxy.$alert(
+        "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
+          response.msg +
+          "</div>",
+        "导入结果",
+        { dangerouslyUseHTMLString: true }
+      );
+      // getList();
+    },
+    /** 提交上传文件 */
+    submitFileForm() {
+      proxy.$refs["uploadRef"].submit();
+    },
+    upDataBtn() {
+      console.log(111);
+      this.upload.open = true;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.qurey {
+  margin-bottom: 10px;
+  ::v-deep.el-button {
+    background-color: #46a6ff !important;
+    color: #fff !important ;
+  }
+}
+.tableOperate {
+  margin-top: 10px;
+  display: flex;
+  justify-content: space-between;
+  .tableSearch {
+    ::v-deep.el-button {
+      background-color: #46a6ff !important;
+      color: #fff !important ;
+    }
+  }
+}
+.tableXYZ {
+  display: flex;
+}
+.cameraImgDiv {
+  text-align: center;
+}
+.cameraImg {
+  width: 30%;
+  margin-bottom: 10px;
+}
+.tabsBtn {
+  text-align: center;
+}
+.bindingMonitorPointTree {
+  width: 100%;
+  height: 40vh;
+  overflow-y: scroll;
+}
+.bindingMonitorPointDiv {
+  width: 100%;
+  height: 40vh;
+  background: red;
+}
+.PTZ-content {
+  width: 170px;
+  margin: 10px auto;
+  position: relative;
+  img {
+    width: 100%;
+  }
+}
+.r-ti2-pos {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  div {
+    position: absolute;
+    z-index: 999;
+    width: 20px;
+    height: 15px;
+    cursor: pointer;
+  }
+  div:first-child {
+    top: 32px;
+    left: 75px;
+  }
+  div:nth-child(2) {
+    top: 50px;
+    left: 102px;
+  }
+  div:nth-child(3) {
+    top: 77px;
+    right: 30px;
+  }
+  div:nth-child(4) {
+    bottom: 56px;
+    left: 102px;
+  }
+  div:nth-child(5) {
+    bottom: 36px;
+    left: 75px;
+  }
+  div:nth-child(6) {
+    bottom: 56px;
+    right: 100px;
+  }
+  div:nth-child(7) {
+    bottom: 80px;
+    left: 30px;
+  }
+  div:nth-child(8) {
+    top: 50px;
+    right: 102px;
+  }
+}
+.r-ti3 {
+  width: 100%;
+  display: flex;
+  padding-top: 10px;
+  -webkit-box-pack: justify;
+  justify-content: space-between;
+}
+.r-ti3-d1 {
+  width: 76px;
+  position: relative;
+  img {
+    width: 100%;
+  }
+  .r-ti3-d2 {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    div:first-child {
+      width: 50%;
+      height: 100%;
+      position: absolute;
+      top: 0;
+      left: 0;
+      cursor: pointer;
+    }
+    div:nth-child(2) {
+      width: 50%;
+      height: 100%;
+      position: absolute;
+      top: 0;
+      right: 0;
+      cursor: pointer;
+    }
+  }
+}
+.r-ti4 {
+  padding-top: 20px;
+  img {
+    width: 24px;
+    height: 24px;
+    position: relative;
+    top: 6px;
+    cursor: pointer;
+  }
+}
+</style>