拍照装置--数据查询

src/views/management/monitoringEquipment/photographicDevice/components/baseInfor.vue

@@ -0,0 +1,136 @@
+<template>
+  <el-dialog class="setimgDialog" title="基本信息" :visible.sync="isShow" :close-on-click-modal="false" width="70%">
+    <el-form :inline="true" :model="formdata" class="demo-form-inline">
+      <el-form-item label="开始日期">
+        <el-date-picker
+          v-model="formdata.starttime"
+          type="datetime"
+          placeholder="开始日期"
+          value-format="timestamp"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item label="结束日期">
+        <el-date-picker
+          v-model="formdata.endtime"
+          type="datetime"
+          default-time="23:59:59"
+          placeholder="结束日期"
+          value-format="timestamp"
+          class="ml10"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="onSubmit">查询</el-button>
+        <el-button type="primary">导出</el-button>
+      </el-form-item>
+    </el-form>
+    <el-table
+      ref="multipleTable"
+      :data="listData"
+      stripe
+      tooltip-effect="dark"
+      style="width: 100%"
+      v-loading="loading"
+    >
+      <el-table-column min-width="45" label="序号">
+        <template slot-scope="scope">
+          <span>{{ (page - 1) * pageSize + scope.$index + 1 }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="name" label="采集时间" min-width="120" show-overflow-tooltip></el-table-column>
+      <el-table-column prop="name" label="设备名称" min-width="80" show-overflow-tooltip></el-table-column>
+      <el-table-column prop="name" label="设备编号" min-width="120" show-overflow-tooltip></el-table-column>
+      <el-table-column prop="name" label="装置名称" min-width="80" show-overflow-tooltip></el-table-column>
+      <el-table-column prop="name" label="装置型号" min-width="80" show-overflow-tooltip></el-table-column>
+      <el-table-column prop="name" label="装置版本号" min-width="80" show-overflow-tooltip></el-table-column>
+      <el-table-column prop="name" label="生产厂家" min-width="100" show-overflow-tooltip></el-table-column>
+      <el-table-column prop="name" label="生产日期" min-width="120" show-overflow-tooltip></el-table-column>
+      <el-table-column prop="name" label="出厂编号" min-width="100" show-overflow-tooltip></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>
+  </el-dialog>
+</template>
+<script>
+import {
+  getLineListJoggle
+} from "@/utils/api/index";
+export default {
+  data() {
+    return {
+      isShow: false,
+      formdata: {},
+      listData: [],
+      loading: false,
+      seltermid: "", //装置id
+      selcmdId: "", //cmdId
+      requestId: "",
+      page: 1, // 当前页数
+      pageSize: 20, // 每页数量
+      total: 0, //总条数
+    };
+  },
+  mounted() {},
+  methods: {
+    //查询
+    onSubmit() {
+      if (this.formdata.starttime > this.formdata.endtime) {
+        return this.$message({
+          duration: 1500,
+          showClose: true,
+          message: "开始日期不能大于结束日期",
+          type: "warning",
+        });
+      }
+      this.getlistnr();
+    },
+    //获取数据
+    getlistnr(val) {
+      console.log(val);
+      this.seltermid = val.id;
+      this.selcmdId = val.cmdid;
+      this.loading = true;
+      getLineListJoggle({
+        pageindex: this.page,
+        pagesize: this.pageSize,
+      })
+        .then((res) => {
+          this.listData = res.data.list;
+          this.total = res.data.total;
+          this.loading = false;
+        })
+    },
+    //点击分页
+    handleCurrentChange(val) {
+      this.page = val;
+      this.getlistnr();
+    },
+    //每页条数
+    handleSizeChange(val) {
+      this.pageSize = val;
+      this.getlistnr();
+    },
+    display() {
+      this.isShow = true;
+    },
+    hide() {
+      this.isShow = false;
+    }
+  },
+};
+</script>
+<style lang="less" scoped>
+
+</style>

src/views/management/monitoringEquipment/photographicDevice/index.vue

@@ -249,12 +249,8 @@
                 </span>
                 <el-dropdown-menu slot="dropdown">
                   <el-dropdown-item command="info">基本信息</el-dropdown-item>
-                  <el-dropdown-item command="workStatus"
-                    >工作状态</el-dropdown-item
-                  >
-                  <el-dropdown-item command="runState"
-                    >运行状态</el-dropdown-item
-                  >
+                  <el-dropdown-item command="workStatus" >工作状态</el-dropdown-item>
+                  <el-dropdown-item command="runState" >运行状态</el-dropdown-item>
                   <el-dropdown-item command="GPS">GPS位置</el-dropdown-item>
                 </el-dropdown-menu>
               </el-dropdown>
@@ -404,6 +400,7 @@
     <videoCapture ref="videoCaptureref"></videoCapture>
     <pictureTags ref="picturetagsref"></pictureTags>
     <gps-position ref="gpsdialog_ref"></gps-position>
+    <baseInfor ref="baseInfor_ref"></baseInfor>
   </div>
 </template>
 <script>
@@ -420,6 +417,8 @@ import imageCapture from "./components/imageCapture.vue";
 import videoCapture from "./components/videoCapture.vue";
 import pictureTags from "./components/pictureTags.vue";
 import gpsPosition from "./components/gpsPosition.vue";
+import baseInfor from './components/baseInfor.vue';
+
 export default {
   components: {
     addPhotoDialog,
@@ -427,6 +426,7 @@ export default {
     videoCapture,
     pictureTags,
     gpsPosition,
+    baseInfor
   },
   data() {
     return {
@@ -658,6 +658,13 @@ export default {
     //数据查询
     handleSearchCommand(command, row) {
       console.log(command, row);
+      switch (command) {
+        case 'info':
+          this.$refs.baseInfor_ref.display();
+          break;
+        default:
+          break;
+      }
     },
 
     // //新建弹窗handleAddPhoto