Merge branch 'web-v2' of http://192.168.1.43:3000/git/sass-lab-web into web-v2

src/views/oneKeyOutfire/outfireDevice/outfireDevice.vue

@@ -0,0 +1,315 @@
+<!--智能灭火设备-->
+<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,'edit')">编辑</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=='edit'){//编辑
+          _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>

src/views/oneKeyOutfire/planExecuteRecord/planExecuteRecord.vue

@@ -0,0 +1,162 @@
+<!--预案执行记录-->
+<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>
+      <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="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" prop="userTelephone"></el-table-column>
+        <el-table-column label="操作" align="left" class-name="small-padding fixed-width" width="120">
+          <template slot-scope="scope">
+            <div class="button-box">
+              <p class="table-min-button"  v-hasPermi="['laboratory:hardware5:edit']" @click="handleClick('',scope.row,'detail')">查看</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>
+    <!--详情页面-->
+    <detail-page v-if="pageType==2" :pageData="pageData"></detail-page>
+  </div>
+</template>
+
+<script>
+import {
+  labCenterPersonList,
+} from '@/api/gasManage3_0/gasManage'
+import detailPage from "./planExecuteRecordDetail"
+export default {
+  name: "Approval",
+  components: {
+    detailPage
+  },
+  data() {
+    return {
+      dialogVisible :false,
+      //页面状态
+      pageType:1,
+      loading:false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize:20,
+        searchValue:'',
+      },
+      form:{
+        tagCode:'',
+      },
+      total:0,
+      pageData:{},
+      tableData:[],
+    };
+  },
+  methods: {
+
+      handleClick(index,row,doType){
+
+        let _this=this;
+        if(doType=='detail'){//详情
+          _this.pageType=2;
+        }else if(doType=='back'){//返回
+          _this.pageType=1;
+        }
+      },
+
+    /** 搜索按钮操作 */
+    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;
+        });
+
+      },
+  },
+  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>

src/views/oneKeyOutfire/planExecuteRecord/planExecuteRecordDetail.vue

@@ -0,0 +1,333 @@
+<!-预案执行记录详情-->
+<template>
+  <div class="addPage">
+    <div class="addPage_title">
+      <p>详情</p>
+      <P></P>
+      <p class="button-p reset-button-one" @click="backPage">返回</p>
+    </div>
+    <div class="addPage_b">
+      <div class="addPage_b_t">
+        <div class="addPage_b_t_l">
+          <div class="small_title">风险概况</div>
+          <div class="addPage_b_t_l_b">
+            <li><i>事故原因：</i><i>甲烷气体泄露</i></li>
+            <li><i>风险级别：</i><i>中风险</i></li>
+            <li><i>发生时间：</i><i>2021年10月12日 12:02:36 - 12:03:05</i></li>
+            <li><i>持续时间：</i><i>29秒</i></li>
+            <li><i>风险响应人员：</i><i>曹秀康、杨虎城、刘波</i></li>
+            <li><i>实验室内人员：</i><i>姓名、姓名、姓名、姓名、姓名、姓名、姓名、姓名、姓名、姓名、姓名、姓名</i></li>
+          </div>
+        </div>
+        <div class="addPage_b_t_c">
+          <div class="small_title">现场记录<i>(预案发生一个月后将自动清理）</i></div>
+          <div class="addPage_b_t_c_b">
+            <img src="@/assets/images/login-background.jpg">
+          </div>
+        </div>
+        <div class="addPage_b_t_r">
+          <div class="small_title">消息推送记录</div>
+          <div class="addPage_b_t_r_b">
+            <li><i>12:05:06</i><i>语音播报</i><i>甲烷监测实验室</i></li>
+            <li><i>12:05:06</i><i>语音播报</i><i>甲烷监测实验室</i></li>
+            <li><i>12:05:06</i><i>语音播报</i><i>甲烷监测实验室</i></li>
+            <li><i>12:05:06</i><i>语音播报</i><i>甲烷监测实验室</i></li>
+            <li><i>12:05:06</i><i>语音播报</i><i>甲烷监测实验室</i></li>
+            <li><i>12:05:06</i><i>语音播报</i><i>甲烷监测实验室</i></li>
+          </div>
+        </div>
+      </div>
+      <div class="addPage_b_b">
+        <div class="small_title">风险轨迹</div>
+        <div class="addPage_b_b_b">
+          <div class="time-box">
+            <ul  >
+              <li class="active" v-for="(item,index2) in planAxis" :key="index2">
+                <p>发生风险：{{item.riskPlanName}}</p>
+                <p>甲烷传感器浓度：<i>{{item.sensorJsonValue}}</i></p>
+                <p>时间：<i>{{item.createTime}}</i></p>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: "addPage",
+  props:{
+    pageData:{},
+  },
+  data() {
+    return {
+      pageType:1,
+      planAxis:[
+        {
+          riskPlanName:'甲烷泄露（低风险）',
+          sensorJsonValue:'9',
+          createTime:'2021-12-10 14:00:01',
+        },
+        {
+          riskPlanName:'甲烷泄露（低风险）',
+          sensorJsonValue:'9',
+          createTime:'2021-12-10 14:00:01',
+        },
+        {
+          riskPlanName:'甲烷泄露（低风险）',
+          sensorJsonValue:'9',
+          createTime:'2021-12-10 14:00:01',
+        },
+        {
+          riskPlanName:'甲烷泄露（低风险）',
+          sensorJsonValue:'9',
+          createTime:'2021-12-10 14:00:01',
+        },
+        {
+          riskPlanName:'甲烷泄露（低风险）',
+          sensorJsonValue:'9',
+          createTime:'2021-12-10 14:00:01',
+        },
+        {
+          riskPlanName:'甲烷泄露（低风险）',
+          sensorJsonValue:'9',
+          createTime:'2021-12-10 14:00:01',
+        },
+        {
+          riskPlanName:'甲烷泄露（低风险）',
+          sensorJsonValue:'9',
+          createTime:'2021-12-10 14:00:01',
+        },
+        {
+          riskPlanName:'甲烷泄露（低风险）',
+          sensorJsonValue:'9',
+          createTime:'2021-12-10 14:00:01',
+        },
+        {
+          riskPlanName:'甲烷泄露（低风险）',
+          sensorJsonValue:'9',
+          createTime:'2021-12-10 14:00:01',
+        },
+      ]
+
+    };
+  },
+  methods: {
+    //返回
+    backPage(){
+      this.$parent.handleClick('','','back');
+      this.$parent.getList();
+    },
+
+  },
+  mounted() {
+
+
+  }
+
+};
+</script>
+<style>
+::-webkit-scrollbar {/*滚动条整体样式*/
+  width:5px;     /*高宽分别对应横竖滚动条的尺寸*/
+  height:5px;
+}
+::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
+  border-radius:3px;
+  -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+  background: none;
+}
+::-webkit-scrollbar-track {/*滚动条里面轨道*/
+  -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+  border-radius:3px;
+  background: none;
+}
+</style>
+
+<style scoped lang="scss">
+.addPage {
+  flex:1;
+  display: flex!important;
+  flex-direction: column;
+  box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);
+  border-radius:10px;
+  i{font-style: normal;}
+  li{list-style-type:none;}
+  /*顶部*/
+  .addPage_title{
+    display: flex;
+    align-items: center;
+    border-bottom: 1px solid #E0E0E0;
+    padding-top:20px;
+    p:nth-child(1){
+      line-height:60px;
+      color: #0045AF;
+      font-size:16px;
+      font-weight: 400;
+      margin:0 12px 0 20px;
+    }
+    p:nth-child(2){
+      font-size: 14px;
+      font-family: Source Han Sans CN;
+      font-weight: 400;
+      color: #999999;
+      flex: 1;
+    }
+    p:nth-child(3){
+      margin-right:20px;
+    }
+  }
+  .addPage_b{
+    flex: 1;
+    display: flex!important;
+    flex-direction: column;
+    padding: 34px 80px 0;
+    box-sizing: border-box;
+    /*小标题*/
+    .small_title{
+      font-size: 16px;
+      font-family: Source Han Sans CN-Medium, Source Han Sans CN;
+      font-weight: 500;
+      color: #333333;
+      line-height: 24px;
+      margin-bottom: 24px;
+      >i{
+        color: #666;
+      }
+    }
+    .addPage_b_t{
+      display: flex;
+      justify-content: space-between;
+      .addPage_b_t_l{
+        width: 378px;
+        .addPage_b_t_l_b{
+          >li{
+            margin-bottom: 20px;
+            >i{
+              font-size: 14px;
+              font-family: Source Han Sans CN-Regular, Source Han Sans CN;
+              font-weight: 400;
+              color: #333333;
+              line-height: 14px;
+              display: inline-block;
+              vertical-align:top;
+            }
+            >i:nth-of-type(1){
+              color: #333333;
+            }
+            >i:nth-of-type(2){
+              width: 280px;
+              color: #666666;
+              line-height: 16px;
+            }
+          }
+        }
+      }
+      .addPage_b_t_c{
+        width: 380px;
+        .addPage_b_t_c_b{
+          width: 380px;
+          height: 222px;
+          >img{
+            width: 380px;
+            height: 222px;
+          }
+        }
+      }
+      .addPage_b_t_r{
+        .addPage_b_t_r_b{
+          width: 382px;
+          >li{
+            margin-bottom: 20px;
+            >i{
+              font-size: 14px;
+              font-family: Source Han Sans CN-Regular, Source Han Sans CN;
+              font-weight: 400;
+              color: #666666;
+              line-height: 14px;
+
+              display: inline-block;
+            }
+            >i:nth-of-type(1){
+              width: 92px;
+            }
+            >i:nth-of-type(2){
+              width: 104px;
+            }
+            >i:nth-of-type(3){
+              width: 182px;
+            }
+          }
+        }
+      }
+    }
+    .addPage_b_b{
+      margin-top: 84px;
+      .time-box{
+        width: 100%;
+        overflow-y: auto;
+        >ul{
+          position: relative;
+          height:255px;
+          white-space: nowrap;
+          display: inline-flex;
+          >li{
+            width:242px;
+            height: 98px;
+            float: left;
+            position: relative;
+            cursor: pointer;
+            >p{
+              font-size: 14px;
+              font-family: Microsoft YaHei;
+              font-weight: 400;
+              color: #333333;
+              line-height: 14px;
+              margin-bottom: 14px;
+            }
+            >p:nth-of-type(1){
+
+            }
+            >p:nth-of-type(2){
+              color: #666666;
+              >i{
+                color: #FF3131;
+              }
+            }
+            >p:nth-of-type(3){
+              color: #666666;
+              >i{
+                color: #333333;
+              }
+            }
+          }
+          >li:after{
+            content: "";
+            width: 56px;
+            height: 56px;
+            border-radius: 28px;
+            background: #0183FA;
+            position: absolute;
+            left:50%;margin-left:-64px;
+            bottom: 0;
+            bottom:-60px;
+            z-index: 1;
+            border: 20px solid #fff;
+          }
+          >li:nth-child(2n):after{
+            bottom: auto;top:-60px;
+          }
+          >li:nth-child(2n){
+            margin-top:160px;
+          }
+        }
+        >ul:after{content: "";  display: block;background: #d2d2d2;height: 1px;width: 100%;position: absolute;left:0;top:50%;}
+
+
+      }
+    }
+  }
+
+}
+</style>