0

src/views/oneKeyOutfire/outfireDevice/outfireDevice.vue

@@ -0,0 +1,313 @@
+<!--智能灭火设备-->
+<template>
+  <div class="app-container approval_handle">
+    <div class="approval_handle-page" v-if="pageType == 1">
+      <el-form :model="queryParams" ref="queryForm" style="margin-top:20px;" :inline="true">
+        <el-form-item label="关键字" prop="name">
+          <el-input
+            v-model="queryParams.searchValue"
+            placeholder="设备名称\关联实验室"
+            clearable
+            maxLength="30"
+            size="small"
+          />
+        </el-form-item>
+        <el-form-item label="状态" prop="zgType" label-width="80px">
+          <el-select v-model="queryParams.status" placeholder="请选择" clearable size="small">
+            <el-option label="全部" value="" />
+            <el-option label="在线" value="0" />
+            <el-option label="异常" value="1" />
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <p class="inquire-button-one" @click="handleQuery">查询</p>
+          <p class="reset-button-one" @click="resetQuery">重置</p>
+        </el-form-item>
+        <el-form-item style="float: right;">
+          <el-col :span="1.5">
+            <el-button
+              type="primary"
+              plain
+              icon="el-icon-plus"
+              size="mini"
+              @click="handleClick('','','add')"
+              v-hasPermi="['airbottle:flowDetail:add']"
+            >新增</el-button>
+          </el-col>
+        </el-form-item>
+      </el-form>
+      <el-table border v-loading="loading" :data="tableData">
+        <el-table-column label="设备编号" align="left" prop="userName"/>
+        <el-table-column label="设备地址" align="left" prop="userNumber"></el-table-column>
+        <el-table-column label="关联实验室" align="left" prop="userTelephone"></el-table-column>
+        <el-table-column label="状态" align="left" prop="deptName">
+          <template slot-scope="scope">
+            <span>{{scope.row.deptName==1?'已授权':(scope.row.deptName==2?'已失效':'')}}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="left" class-name="small-padding fixed-width" width="180">
+          <template slot-scope="scope">
+            <div class="button-box">
+              <p class="table-min-button"  v-hasPermi="['laboratory:hardware5:edit']" @click="handleClick('',scope.row,'delete')">编辑</p>
+              <p class="table-min-button" v-hasPermi="['laboratory:hardware5:remove']" @click="handleClick('',scope.row,'delete')">删除</p>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        :total="total"
+        layout="total, prev, pager, next, sizes, jumper"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </div>
+    <!--弹框-->
+    <el-dialog title='新增准入实验室' @close="handleClose" :visible.sync="dialogVisible" width="600px">
+      <el-form :model="dialogForm" ref="dialogForm" :inline="true" label-width="140px">
+        <el-form-item label="设备名称:" prop="name" >
+          <el-input
+            style="width: 400px"
+            v-model="dialogForm.name"
+            placeholder="请输入设备名称"
+            clearable
+            size="small"
+          />
+        </el-form-item>
+        <el-form-item label="设备编号:" prop="name" >
+          <el-input
+            style="width: 400px"
+            v-model="dialogForm.name"
+            placeholder="请输入设备编号"
+            clearable
+            size="small"
+          />
+        </el-form-item>
+        <el-form-item label="设备地址:" prop="name" >
+          <el-input
+            style="width: 400px"
+            v-model="dialogForm.name"
+            placeholder="请输入设备地址"
+            clearable
+            size="small"
+          />
+        </el-form-item>
+        <el-form-item label="实验地点" prop="subjectId">
+          <el-select
+            style="width:400px;"
+            v-model="dialogForm.location"
+            filterable
+            remote
+            clearable
+            reserve-keyword
+            @focus="selectFocus"
+            @change="selectChange"
+            placeholder="请选择实验地点"
+            :remote-method="userSelectList"
+            :loading="loading">
+            <el-option
+              v-for="item in laboratoryOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="灭火倒计时:" prop="name" >
+          <el-input
+            style="width: 400px"
+            v-model="dialogForm.name"
+            placeholder="请输入倒计时秒数"
+            clearable
+            size="small"
+          >
+          <template slot="append">秒</template>
+          </el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="cancel">取 消</el-button>
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+      </div>
+    </el-dialog>
+
+  </div>
+</template>
+
+<script>
+import {
+  RFIDtagAdd,
+  listDepartments,
+  labCenterPersonList,
+  labCenterPersonDelete, subjectList, recognizerAnew, recognizerAdd
+} from '@/api/gasManage3_0/gasManage'
+import { getToken } from "@/utils/auth";
+export default {
+  name: "Approval",
+  components: {
+
+  },
+  data() {
+    return {
+      dialogVisible :false,
+      //页面状态
+      pageType:1,
+      loading:false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize:20,
+        searchValue:'',
+      },
+      form:{
+        tagCode:'',
+      },
+      total:0,
+      tableData:[],
+      deptOptions:[],
+      dialogForm:{},
+      laboratoryOptions:[],
+    };
+  },
+  methods: {
+      //监听关联记录弹窗关闭
+      handleClose(){
+
+      },
+      selectFocus(){
+        if(!this.laboratoryOptions[0]){
+          this.userSelectList("");
+        }
+      },
+      //实验室选择
+      selectChange(e){
+        let self = this;
+        for(let i=0;i<self.laboratoryOptions.length;i++){
+          if(self.laboratoryOptions[i].id == e){
+            this.$set(this.dialogForm,"subject",self.laboratoryOptions[i]);
+            this.$set(this.dialogForm,"location",self.laboratoryOptions[i].name);
+          }
+        }
+        this.$set(this.dialogForm,"subjectId",e);
+      },
+      //懒加载实验室
+      userSelectList(e){
+        subjectList({name:e,deptId:this.dialogForm.deptId}).then(response => {
+          this.laboratoryOptions = response.data;
+        });
+      },
+      // 取消按钮
+      cancel() {
+        this.dialogVisible = false;
+        this.reset();
+      },
+      // 表单重置
+      reset() {
+        this.form = {
+
+        };
+        this.resetForm("form");
+      },
+      handleClick(index,row,doType){
+
+        let _this=this;
+        if(doType=='add'){//添加
+          _this.dialogVisible=true;
+        }else if(doType=='delete'){//删除
+          this.$confirm('是否确认删除当前数据项?', "警告", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning"
+          }).then(function() {
+            labCenterPersonDelete(row.id).then( response => {
+              if(response.code==200){
+                _this.getList();
+                _this.msgSuccess("删除成功");
+              }
+            });
+          }).then(() => {
+
+          }).catch(() => {});
+        }
+      },
+
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.queryParams.searchValue = "";
+      this.queryParams.deptIds = "";
+      this.handleQuery();
+    },
+    getList(){
+        let _this=this;
+      labCenterPersonList(_this.queryParams).then( response => {
+          let res=response.rows;
+          _this.tableData=res;
+          _this.total=response.total;
+        });
+
+      },
+      submitForm(){
+        let _this = this;
+        RFIDtagAdd(_this.form).then(res => {
+          this.$message({
+            type: 'success',
+            message: '操作成功!',
+            duration:2000,
+            onClose:function(){
+              _this.backPage();
+              _this.loading = false;
+            }
+          });
+        });
+      },
+
+
+  },
+  mounted() {
+    this.getList();
+  }
+};
+</script>
+
+<style scoped lang="scss">
+  .approval_handle {
+    display: flex!important;
+    flex-direction: column;
+    overflow: hidden;
+    .approval_handle-page{
+      flex:1;
+      display: flex!important;
+      flex-direction: column;
+      box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);
+      padding:20px 20px 20px!important;
+      border-radius:10px;
+      overflow: hidden;
+      .button-box{
+        width:200px;
+        display: flex;
+      }
+    }
+    .entering_t{
+      font-size: 16px;
+      font-family: Microsoft YaHei;
+      font-weight: 400;
+      color: #333333;
+      line-height: 16px;
+      margin: 36px auto 25px;
+      text-align: center;
+    }
+    .entering_img{
+      width: 288px;
+      height: 140px;
+    }
+    .entering_input{
+      width: 288px;
+    }
+
+  }
+</style>