FE-V2-PC/src/views/comprehensive/laboratoryManagement/subject/deviceList.vue

<!--物联设备配置-->
<template>
  <div class="deviceList scrollbar-box">
    <div class="title-box">
      <p class="left-title">传感器</p>
      <p class="right-button reset-button-one" @click="backPage">返回</p>
    </div>
    <div class="for-max-box">
      <div class="for-big-box" v-for="(item,index) in listCgq" :key="index">
        <p class="for-title-p">{{subjectData.room}}-{{item.type.name}}传感器{{index+1}}</p>
        <div class="for-text-box">
          <p>网关编号：</p>
          <el-tooltip class="item" effect="dark" :content="item.gatewayId" placement="top">
            <p>{{item.gatewayId}}</p>
          </el-tooltip>
        </div>
        <div class="for-button-box">
          <p @click="editData(5,item)"><i class="el-icon-edit-outline"></i>编辑</p>
          <p></p>
          <p @click="delSensor(item)"><i class="el-icon-delete"></i>删除</p>
        </div>
      </div>
      <p class="add-for-p" @click="addData(1)"><i class="el-icon-plus"></i>添加传感器</p>
    </div>
    <div class="title-box" v-if="subjectData.hardwareType==1">
      <p class="left-title">智能门禁</p>
    </div>
    <div class="for-max-box" v-if="subjectData.hardwareType==1">
      <div class="for-big-box" v-for="(item,index) in listHK" :key="index" style="width: 350px">
        <p class="for-title-p">{{item.type.name}}-{{item.name}}</p>
        <div class="for-text-box">
          <p>门禁编号：</p>
          <el-tooltip class="item" effect="dark" :content="item.hardwareNum" placement="top">
            <p>{{item.hardwareNum}}</p>
          </el-tooltip>
        </div>
        <div class="for-text-box">
          <p>门禁授权：</p>
          <el-checkbox-group v-model="item.controlScope==null?[]:item.controlScope.split(',')" style="margin-top: 6px" disabled>
            <el-checkbox label="1" style="margin-right: 8px">关联安全准入</el-checkbox>
            <el-checkbox label="2">关联白名单</el-checkbox>
          </el-checkbox-group>
        </div>
        <div class="for-button-box">
          <p @click="editData('editEntrance',item)"><i class="el-icon-edit-outline"></i>编辑</p>
          <p></p>
          <p @click="delEntrance(item)"><i class="el-icon-delete"></i>删除</p>
        </div>
      </div>
      <p class="add-for-p" @click="addData('addEntrance')" style="width: 350px;height: 158px;" v-if="listHK.length<3"><i class="el-icon-plus"></i>添加智能门禁</p>
    </div>
    <div class="title-box">
      <p class="left-title">一体机</p>
    </div>
    <div class="for-max-box">
      <div class="for-big-box" v-for="(item,index) in listYtj" :key="index">
        <p class="for-title-p">{{subjectData.room}}-{{item.type.name}}{{index+1}}</p>
        <div class="for-text-box">
          <p>一体机编号：</p>
          <el-tooltip class="item" effect="dark" :content="item.hardwareNum" placement="top">
            <p>{{item.hardwareNum}}</p>
          </el-tooltip>
        </div>
        <div class="for-button-box">
          <p @click="editData(6,item)"><i class="el-icon-edit-outline"></i>编辑</p>
          <p></p>
          <p @click="delHardware(item)"><i class="el-icon-delete"></i>删除</p>
        </div>
      </div>
      <p class="add-for-p" @click="addData(2)"><i class="el-icon-plus"></i>添加一体机</p>
    </div>
    <div class="title-box">
      <p class="left-title">控制设备</p>
    </div>
    <div class="for-max-box">
      <div class="for-big-box-two" v-for="(item,index) in listkzsb" :key="index">
        <p class="for-title-p">{{subjectData.room}}-{{item.type.name}}传感器{{index+1}}</p>
        <div class="for-text-box">
          <p>设备编号：</p>
          <el-tooltip class="item" effect="dark" :content="item.relayCode" placement="top">
            <p>{{item.relayCode}}</p>
          </el-tooltip>
        </div>
        <div class="for-text-box">
          <p>设备路由：</p>
          <p>{{item.bit}}</p>
        </div>
        <div class="for-button-box">
          <p @click="editData(7,item)"><i class="el-icon-edit-outline"></i>编辑</p>
          <p></p>
          <p @click="delHardwareTwo(item)"><i class="el-icon-delete"></i>删除</p>
        </div>
      </div>
      <p class="add-for-p-two" @click="addData(3)"><i class="el-icon-plus"></i>添加控制设备</p>
    </div>
    <div class="title-box">
      <p class="left-title">摄像头</p>
    </div>
    <div class="for-max-box">
      <div class="for-big-box" v-for="(item,index) in listSpjk" :key="index">
        <p class="camera" v-if="item.isArrest">抓拍</p>
        <p class="for-title-p" style="background: none;color: #333;margin-top: 12px;">{{subjectData.room}}-{{item.type.name}}{{index+1}}</p>
        <div class="for-text-box">
          <p>摄像头编号：</p>
          <el-tooltip class="item" effect="dark" :content="item.hardwareNum" placement="top">
            <p>{{item.hardwareNum}}</p>
          </el-tooltip>
        </div>
<!--        <div class="for-text-box">-->
<!--          <p></p>-->
<!--          <el-tooltip class="item" effect="dark" :content="item.hardwareNum" placement="top">-->
<!--            <p>{{item.hardwareNum}}</p>-->
<!--          </el-tooltip>-->
<!--        </div>-->
        <div class="for-button-box">
          <p @click="editData(8,item)"><i class="el-icon-edit-outline"></i>编辑</p>
          <p></p>
          <p @click="delHardwareThree(item)"><i class="el-icon-delete"></i>删除</p>
        </div>
      </div>
      <p class="add-for-p-two" @click="addData(4)"><i class="el-icon-plus"></i>添加摄像头</p>
    </div>
    <div class="title-box" v-if="subjectData.hardwareType==2">
      <p class="left-title">电子信息牌</p>
    </div>
    <div class="for-max-box" v-if="subjectData.hardwareType==2">
      <div class="for-big-box" v-for="(item,index) in listXxp" :key="index">
        <p class="for-title-p">{{subjectData.room}}-{{item.cardName}}{{index+1}}</p>
        <div class="for-text-box">
          <p>设备编号：</p>
          <el-tooltip class="item" effect="dark" :content="item.cardNum" placement="top">
            <p>{{item.cardNum}}</p>
          </el-tooltip>
        </div>
        <div class="for-button-box">
          <p @click="editData('editSign',item)"><i class="el-icon-edit-outline"></i>编辑</p>
          <p></p>
          <p @click="delSign(item)"><i class="el-icon-delete"></i>删除</p>
        </div>
      </div>
      <p class="add-for-p" @click="addData('addSign')" v-if="listXxp.length<1"><i class="el-icon-plus"></i>添加信息牌</p>
    </div>
    <el-dialog :title="title" :visible.sync="addType" v-if="addType" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="110px">
        <div v-if="upType == 1 || upType == 5">
          <el-form-item label="传感器类型" prop="type">
            <el-select v-model="form.type" placeholder="请选择传感器类型" style="width:320px;">
              <el-option
                v-for="item in sensorAddOptions"
                :key="item.enumName"
                :label="item.name"
                :value="item.enumName">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="网关编号" prop="gatewayId">
            <el-input v-model="form.gatewayId" placeholder="请输入网关编号"
                      maxlength="30" style="width:320px;"/>
          </el-form-item>
          <el-form-item label="路由" prop="routeNum">
            <el-input v-model="form.routeNum" oninput="value=value.replace(/[^0-9.]/g,'')" maxlength="2" placeholder="请输入路由" style="width:320px;"></el-input>
          </el-form-item>
          <el-form-item label="传感器参数" prop="configName">
            <el-input v-model="form.configName"  placeholder="请输入传感器参数"
                      maxlength="30" style="width:320px;"></el-input>
          </el-form-item>
          <el-form-item label="状态参数" prop="configStatus">
            <el-input v-model="form.configStatus"  placeholder="请输入状态参数"
                      maxlength="30" style="width:320px;"></el-input>
          </el-form-item>
        </div>
        <div v-if="upType == 2 || upType == 6">
          <el-form-item label="一体机名称" prop="name">
            <el-input
              style="width:320px;"
              v-model="form.name"
              placeholder="请输入一体机名称"
              maxlength="8"
              size="small"
            />
          </el-form-item>
          <el-form-item label="一体机类型" prop="pcType">
            <el-select v-model="form.pcType" placeholder="请选择一体机类型" style="width:320px;">
              <el-option label="管控一体机" value="0" />
              <el-option label="学习一体机" value="1" />
            </el-select>
          </el-form-item>
          <el-form-item label="一体机编号" prop="hardwareNum">
            <el-input
              style="width:320px;"
              v-model="form.hardwareNum"
              placeholder="请输入一体机编号"
              maxlength="30"
              size="small"
            />
          </el-form-item>
        </div>
        <div v-if="upType == 3 || upType == 7">
          <el-form-item label="设备类型" prop="type">
            <el-select v-model="form.type" placeholder="请选择设备类型" style="width:320px;" :disabled="disabledType">
              <el-option key="1" label="电源开关" value="1"></el-option>
              <el-option key="2" label="智能通风" value="2"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="硬件名称"  prop="name">
            <el-input
              v-model="form.name"
              placeholder="请输入硬件名称"
              clearable
              size="small"
              maxLength="8"
            />
          </el-form-item>
          <el-form-item label="继电器类型" prop="hardwareType">
            <el-radio-group v-model="form.hardwareType">
              <el-radio :label="1">老继电器</el-radio>
              <el-radio :label="2">新继电器</el-radio>
              <el-radio :label="3">泥人继电器</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="绑定继电器" prop="relayCode" v-if="form.hardwareType==1 || form.hardwareType==3">
            <el-select v-model="form.relayCode" placeholder="请选择继电器" clearable @change="loadRelayNum" @clear="loadClear">
              <el-option v-for="relay in relayList"
                         :key="relay.code"
                         :label="relay.code"
                         :value="relay.code">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="继电器编号"  prop="relayCode" v-if="form.hardwareType==2">
            <el-input
              v-model="form.relayCode"
              placeholder="请输入继电器编号"
              clearable
              size="small"
              maxlength="20"
            />
          </el-form-item>
          <el-form-item label="继电器位置" prop="bit" >
            <el-select v-model="form.bit" placeholder="请选择继电器位置" clearable >
              <el-option v-for="lab in relayNumList"
                         :key="lab.name"
                         :label="lab.name"
                         :value="lab.name">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="是否灭火主机" prop="isPcfire">
            <el-radio-group v-model="form.isPcfire">
              <el-radio :label="0">否</el-radio>
              <el-radio :label="1">是</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="配置名称" prop="configName" v-if="form.hardwareType == 2">
            <el-input v-model="form.configName" maxlength="30" placeholder="请输入配置名称" style="width:320px;"></el-input>
          </el-form-item>
          <el-form-item label="配置状态" prop="configStatus" v-if="form.hardwareType == 2">
            <el-input v-model="form.configStatus" maxlength="30" placeholder="请输入配置状态" style="width:320px;"></el-input>
          </el-form-item>
        </div>
        <div v-if="upType == 4 || upType == 8">
          <el-form-item label="硬件名称" prop="name">
            <el-input
              v-model="form.name"
              placeholder="请输入硬件名称"
              clearable
              size="small"
              maxLength="8"
              style="width:320px;"
            />
          </el-form-item>
          <el-form-item label="摄像头编号" prop="hardwareNum">
            <el-input v-model="form.hardwareNum" placeholder="摄像头编号"
                      maxlength="30" style="width:320px;"/>
          </el-form-item>
          <el-form-item label="硬件IP" prop="ipAddress">
            <el-input
              v-model="form.ipAddress"
              placeholder="请输入硬件IP"
              clearable
              size="small"
              maxLength="20"
              style="width:320px;"
            />
          </el-form-item>
          <el-form-item label="类型" >
<!--            <el-radio-group v-model="form.pcType">-->
<!--              <el-radio :label="0">火焰算法</el-radio>-->
<!--              <el-radio :label="1">穿戴识别</el-radio>-->
<!--              <el-radio :label="2">违规带离抓拍</el-radio>-->
<!--            </el-radio-group>-->
            <el-checkbox-group v-model="form.subType">
              <el-checkbox label="0">火焰算法</el-checkbox>
              <el-checkbox label="1">穿戴识别</el-checkbox>
              <el-checkbox label="2">违规带离抓拍</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
        </div>
        <div v-if="upType == 'addEntrance'||  upType=='editEntrance'">
          <el-form-item label="门禁编号" prop="hardwareNum">
            <el-input
              style="width:320px;"
              v-model="form.hardwareNum"
              placeholder="请输入门禁编号"
              maxlength="20"
              size="small"
            />
          </el-form-item>
          <el-form-item label="门禁名称" prop="name" >
            <el-input
              style="width:320px;"
              v-model="form.name"
              placeholder="请输入门禁名称"
              maxlength="8"
              size="small"
            />
          </el-form-item>
          <el-form-item label="IP" prop="ipAddress" >
            <el-input
              style="width:320px;"
              v-model="form.ipAddress"
              placeholder="请输入IP"
              maxlength="15"
              size="small"
            />
          </el-form-item>
          <el-form-item label="端口" prop="port" >
            <el-input
              style="width:320px;"
              v-model="form.port"
              placeholder="请输入端口"
              maxlength="6"
              size="small"
            />
          </el-form-item>
          <el-form-item label="设备管理证号" prop="harUser" >
            <el-input
              style="width:320px;"
              v-model="form.harUser"
              placeholder="请输入设备管理证号"
              maxlength="30"
              size="small"
            />
          </el-form-item>
          <el-form-item label="设备管理密码" prop="harPsw" >
            <el-input
              style="width:320px;"
              v-model="form.harPsw"
              placeholder="请输入设备管理密码"
              maxlength="30"
              size="small"
            />
          </el-form-item>
          <el-form-item label="门禁权限" style="margin-bottom: 0">
            <el-checkbox-group v-model="form.controlScope">
              <el-checkbox label="1" >关联安全准入</el-checkbox>
              <el-checkbox label="2">关联白名单</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
          <p style="margin:0 20px 0 104px;color: #FD2A2A;">关联之后申请安全准入或者白名单后自动授权门禁，不关联则需要单独授权门禁</p>
        </div>
        <div v-if="upType == 'addSign'||  upType=='editSign'">
          <el-form-item label="设备编号" prop="cardNum">
            <el-input
              style="width:320px;"
              v-model="form.cardNum"
              placeholder="请输入设备编号"
              maxlength="30"
              size="small"
            />
          </el-form-item>
          <el-form-item label="实验室">
            <el-input
              style="width:320px;"
              v-model="subjectData.name"
              placeholder="请选择实验室"
              maxlength="20"
              size="small"
              disabled
            />
          </el-form-item>
<!--          <el-form-item label="实验室" prop="subjectId">-->
<!--            <el-select-->
<!--              style="width:300px;"-->
<!--              v-model="form.subjectName"-->
<!--              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="安装位置" >
            <el-input
              style="width:320px;"
              v-model="form.location"
              placeholder="请输入安装位置"
              maxlength="10"
              size="small"
            />
          </el-form-item>
          <el-form-item label="关联门禁">
            <el-radio-group v-model="form.isStart">
              <el-radio :label="1">是</el-radio>
              <el-radio :label="2">否</el-radio>
            </el-radio-group>
          </el-form-item>
        </div>
      </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 {
  listBySubjectId,
  addSensor,
  putSensor,
  delSensor,
  addHardware,
  putHardware,
  delHardware,
  subjectSignAdd, subjectSignEdit, subjectSignDelete
} from '@/api/laboratory/subject'
import { getSensorList } from "@/api/laboratory/sensor";
import { subjectList } from '@/api/gasManage3_0/gasManage'
import { listRelay } from '@/api/laboratory/relay'
export default {
  name: "deviceList",
  props:{
    subjectData:{},
  },
  data() {
    return {
      loading:false,
      title:"",
      addType:false,
      listCgq:[],  //传感器
      listYtj:[],  //一体机
      listkzsb:[],
      listSpjk:[],   //摄像头
      listHK:[],//智能门禁
      listXxp:[],//电子信息牌
      form:{
      },
      relayList: [],
      relayNumList:[
        {name:1},
        {name:2},
        {name:3},
        {name:4},
        {name:5},
        {name:6},
        {name:7},
        {name:8},
        {name:9},
        {name:10},
        {name:11},
        {name:12}
      ],
      // 表单校验
      rules: {
        name:[
          {required: true, message: '请输入名称', trigger: 'blur'},
          { required: true, message: "请输入名称", validator: this.spaceJudgment, trigger: "blur" }
        ],
        type:[
          {required: true, message: '类型不能为空', trigger: 'blur'}
        ],
        gatewayId:[
          {required: true, message: '网关不能为空', trigger: 'blur'},
          { required: true, message: "网关不能为空", validator: this.spaceJudgment, trigger: "blur" }
        ],
        hardwareNum:[
          { required: true, message: "请输入编号", trigger: "blur" },
          { required: true, message: "请输入编号", validator: this.spaceJudgment, trigger: "blur" }
        ],
        pcType: [
          { required: true, message: "请选择类型", trigger: "blur" },
        ],
        hardwareType: [
          { required: true, message: "请选择设备版本", trigger: "blur" },
        ],
        relayCode: [
          { required: true, message: "请输入设备编号", trigger: "blur" },
          { required: true, message: "请输入设备编号", validator: this.spaceJudgment, trigger: "blur" }
        ],
        bit: [
          { required: true, message: "请输入路由", trigger: "blur" },
          { required: true, message: "请输入路由", validator: this.spaceJudgment, trigger: "blur" }
        ],
        ipAddress: [
          { required: true, message: "请输入IP", trigger: "blur" },
          { required: true, message: "请输入IP", validator: this.spaceJudgment, trigger: "blur" }
        ],
        port: [
          { required: true, message: "请输入端口", trigger: "blur" },
          { required: true, message: "请输入端口", validator: this.spaceJudgment, trigger: "blur" }
        ],

        harUser: [
          { required: true, message: "请输入设备管理证号", trigger: "blur" },
          { required: true, message: "请输入设备管理证号", validator: this.spaceJudgment, trigger: "blur" }
        ],
        harPsw: [
          { required: true, message: "请输入设备管理密码", trigger: "blur" },
          { required: true, message: "请输入设备管理密码", validator: this.spaceJudgment, trigger: "blur" }
        ],
        cardNum:[
          { required: true, message: "请输入设备编号", trigger: "blur" },
          { required: true, message: "请输入设备编号", validator: this.spaceJudgment, trigger: "blur" }
        ],
        subjectId: [
          { required: true, message: "请选择实验室", trigger: "blur" }
        ],

      },
      //提交类型
      upType:"",
      //传感器类型
      sensorAddOptions: [],
    }
  },
  created() {
    this.listBySubjectId();
    this.getSensorList();
    this.getRelayList();
  },
  mounted(){

  },
  methods:{
    selectFocus(){
      if(!this.laboratoryOptions[0]){
        this.userSelectList("");
      }
    },
    //懒加载实验室
    userSelectList(e){
      subjectList({name:e,deptId:this.form.deptId}).then(response => {
        this.laboratoryOptions = response.data;
      });
    },
    //实验室选择
    selectChange(e){
      let self = this;
      for(let i=0;i<self.laboratoryOptions.length;i++){
        if(self.laboratoryOptions[i].id == e){
          this.$set(this.form,"subject",self.laboratoryOptions[i]);
          this.$set(this.form,"subjectName",self.laboratoryOptions[i].name);
        }
      }
      this.$set(this.form,"subjectId",e);

    },
    // 取消按钮
    cancel() {
      this.addType = false;
    },
    // 查询继电器列表
    getRelayList(){
      listRelay({"type": 1}).then(response => {
        this.relayList = response.data;
        if(this.form.relayCode){
          let self = this
          let num = ""
          for(let i=0;i<self.relayList.length;i++){
            if(self.relayList[i].code == this.form.relayCode){
              num = self.relayList[i].routeNum
            }
          }
          let list = [];
          for(let i=0;i<num;i++){
            let obj = {
              name:i+1
            }
            list.push(obj);
          }
          this.relayNumList = list;
        }
      });
    },
    loadRelayNum(e){
      let self = this;
      let num = ""
      for(let i=0;i<self.relayList.length;i++){
        if(self.relayList[i].code == e){
          num = self.relayList[i].routeNum
        }
      }
      let list = [];
      for(let i=0;i<num;i++){
        let obj = {
          name:i+1
        }
        list.push(obj);
      }
      console.log(list)
      if(list.length>0){
        this.relayNumList = list;
      }else{
        this.relayNumList =[
          {name:1},
          {name:2},
          {name:3},
          {name:4},
          {name:5},
          {name:6},
          {name:7},
          {name:8},
          {name:9},
          {name:10},
        ]
      }

    },
    //清空按钮
    loadClear(){
      this.form.bit = '';
    },
    // 提交
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if(this.upType == 1){
            //新增传感器
            this.addSensor();
          }else if(this.upType == 5){
            //编辑传感器
            this.putSensor();
          }else if(this.upType == 2){
            //新增一体机
            this.addHardware();
          }else if(this.upType == 6){
            //编辑一体机
            this.putHardware();
          }else if(this.upType == 3){
            //新增控制设备
            this.addHardwareTwo();
          }else if(this.upType == 7){
            //编辑控制设备
            this.putHardwareTwo();
          }else if(this.upType == 4){
            //新增控制设备
            this.addHardwareThree();
          }else if(this.upType == 8){
            //编辑控制设备
            this.putHardwareThree();
          }else if(this.upType == 'addEntrance'){
            //新增智能门禁
            this.addEntrance();
          }else if(this.upType == 'editEntrance'){
            //编辑智能门禁
            this.editEntrance();
          }else if(this.upType == 'addSign'){
            //新增电子信息牌
            this.addSign();
          }else if(this.upType == 'editSign'){
            //编辑电子信息牌
            this.editSign();
          }
        }
      });
    },
    //删除电子信息牌
    delSign(item){
      this.$confirm('确认要删除该电子信息牌?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        //  确定
        subjectSignDelete(item.id).then((response) => {
          this.msgSuccess(response.msg)
          this.addType = false;
          this.listBySubjectId();
        });
      }).catch(function() {
        //  取消
      });
    },
    //删除智能门禁
    delEntrance(item){
      this.$confirm('确认要删除该智能门禁?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        //  确定
        delHardware(item.id).then((response) => {
          this.msgSuccess(response.msg)
          this.addType = false;
          this.listBySubjectId();
        });
      }).catch(function() {
        //  取消
      });
    },
    //新增摄像头
    addHardwareThree(){
      let obj = {
        type:4,
        name:this.form.name,
        hardwareNum:this.form.hardwareNum,
        ipAddress:this.form.ipAddress,
        subType:this.form.subType.toString(),
        subjectId:this.subjectData.id,
        deptId:this.subjectData.deptId,
        deptName:this.subjectData.deptName,
      }
      addHardware(obj).then(response => {
        this.msgSuccess(response.msg)
        this.addType = false;
        this.listBySubjectId();
      });
    },
    //编辑摄像头
    putHardwareThree(){
      let obj = {
        id:this.form.id,
        name:this.form.name,
        hardwareNum:this.form.hardwareNum,
        ipAddress:this.form.ipAddress,
        subType:this.form.subType.toString(),
        subjectId:this.form.subjectId,
        deptId:this.form.deptId,
        deptName:this.form.deptName,
      }
      putHardware(obj).then(response => {
        this.msgSuccess(response.msg)
        this.addType = false;
        this.listBySubjectId();
      });
    },
    //删除摄像头
    delHardwareThree(item){
      this.$confirm('确认要删除该摄像头?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        //  确定
        delHardware(item.id).then((response) => {
          this.msgSuccess(response.msg)
          this.addType = false;
          this.listBySubjectId();
        });
      }).catch(function() {
        //  取消
      });
    },
    //新增控制设备
    addHardwareTwo(){
      let obj = {
        name:this.form.name,
        type:this.form.type,
        hardwareType:this.form.hardwareType,
        relayCode:this.form.relayCode,
        bit:this.form.bit,
        configName:this.form.configName,
        configStatus:this.form.configStatus,
        subjectId:this.subjectData.id,
        deptId:this.subjectData.deptId,
        deptName:this.subjectData.deptName,
        isPcfire:this.form.isPcfire,
      }
      addHardware(obj).then(response => {
        this.msgSuccess(response.msg)
        this.addType = false;
        this.listBySubjectId();
      });
    },
    //编辑控制设备
    putHardwareTwo(){
      let obj = {
        id:this.form.id,
        hardwareType:this.form.hardwareType,
        relayCode:this.form.relayCode,
        bit:this.form.bit,
        configName:this.form.configName,
        configStatus:this.form.configStatus,
        subjectId:this.form.subjectId,
        deptId:this.form.deptId,
        deptName:this.form.deptName,
        name:this.form.name,
        isPcfire:this.form.isPcfire,
      }
      putHardware(obj).then(response => {
        this.msgSuccess(response.msg)
        this.addType = false;
        this.listBySubjectId();
      });
    },
    //删除控制设备
    delHardwareTwo(item){
      this.$confirm('确认要删除该一体机?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        //  确定
        delHardware(item.id).then((response) => {
          this.msgSuccess(response.msg)
          this.addType = false;
          this.listBySubjectId();
        });
      }).catch(function() {
        //  取消
      });
    },
    //添加一体机
    addHardware(){
      let obj = {
        type:0,
        name:this.form.name,
        pcType:this.form.pcType,
        hardwareNum:this.form.hardwareNum,
        subjectId:this.subjectData.id,
        deptId:this.subjectData.deptId,
        deptName:this.subjectData.deptName,
      }
      addHardware(obj).then(response => {
        this.msgSuccess(response.msg)
        this.addType = false;
        this.listBySubjectId();
      });
    },
    //编辑一体机
    putHardware(){
      let obj = {
        id:this.form.id,
        name:this.form.name,
        pcType:this.form.pcType,
        hardwareNum:this.form.hardwareNum,
      }
      putHardware(obj).then(response => {
        this.msgSuccess(response.msg)
        this.addType = false;
        this.listBySubjectId();
      });
    },
    //删除一体机
    delHardware(item){
      this.$confirm('确认要删除该一体机?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        //  确定
        delHardware(item.id).then((response) => {
          this.msgSuccess(response.msg)
          this.addType = false;
          this.listBySubjectId();
        });
      }).catch(function() {
        //  取消
      });
    },
    //添加传感器
    addSensor(){
      let obj = {
        type:this.form.type,
        gatewayId:this.form.gatewayId,
        routeNum:this.form.routeNum,
        configName:this.form.configName,
        configStatus:this.form.configStatus,
        subjectId:this.subjectData.id
      }
      addSensor(obj).then(response => {
        this.msgSuccess(response.msg)
        this.addType = false;
        this.listBySubjectId();
      });
    },
    //编辑传感器
    putSensor(){
      let obj = {
        type:this.form.type,
        id:this.form.id,
        gatewayId:this.form.gatewayId,
        routeNum:this.form.routeNum,
        configName:this.form.configName,
        configStatus:this.form.configStatus,
      }
      putSensor(obj).then(response => {
        this.msgSuccess(response.msg)
        this.addType = false;
        this.listBySubjectId();
      });
    },
    //删除传感器
    delSensor(item){
      this.$confirm('确认要删除该传感器?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        //  确定
        delSensor(item.id).then((response) => {
          this.msgSuccess(response.msg)
          this.addType = false;
          this.listBySubjectId();
        });
      }).catch(function() {
        //  取消
      });
    },
    //新增智能门禁
    addEntrance(){
      let obj = {
        type:11,
        subjectId:this.subjectData.id,
        hardwareNum:this.form.hardwareNum,
        name:this.form.name,
        ipAddress:this.form.ipAddress,
        port:this.form.port,
        harUser:this.form.harUser,
        harPsw:this.form.harPsw,
        controlScope:this.form.controlScope.join(','),
      }
      addHardware(obj).then(response => {
        if(response.code==200){
          this.msgSuccess(response.msg)
          this.addType = false;
          this.listBySubjectId();
        }else if(response.code==205){
          this.$confirm(response.msg, "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(() => {
            //  确定
            this.$router.push({ path: '/comprehensive/laboratoryManagement/accessAuthorization' });
          }).catch(function() {
            //  取消
          });
        }
      });
    },
    //编辑智能门禁
    editEntrance(){
      let obj = {
        id:this.form.id,
        hardwareNum:this.form.hardwareNum,
        name:this.form.name,
        ipAddress:this.form.ipAddress,
        port:this.form.port,
        harUser:this.form.harUser,
        harPsw:this.form.harPsw,
        controlScope:this.form.controlScope.join(','),
        subjectId:this.subjectData.id
      }
      putHardware(obj).then(response => {
        this.msgSuccess(response.msg)
        this.addType = false;
        this.listBySubjectId();
      });
    },
    //新增电子信息牌
    addSign(){
      let obj = {
        subjectId:this.subjectData.id,
        subjectName:this.subjectData.name,
        cardNum:this.form.cardNum,
        location:this.form.location,
        isStart:this.form.isStart,
        deptId:this.subjectData.deptId,
        deptName:this.subjectData.deptName,
      }
      subjectSignAdd(obj).then(response => {
        if(response.code==200){
          this.msgSuccess(response.msg)
          this.addType = false;
          this.listBySubjectId();
        }
      });
    },
    //编辑电子信息牌
    editSign(){
      let obj = {
        id:this.form.id,
        cardNum:this.form.cardNum,
        location:this.form.location,
        isStart:this.form.isStart,
        subjectId:this.subjectData.id,
        subjectName:this.subjectData.name,
        deptId:this.subjectData.deptId,
        deptName:this.subjectData.deptName,
      }
      subjectSignEdit(obj).then(response => {
        this.msgSuccess(response.msg)
        this.addType = false;
        this.listBySubjectId();
      });
    },
    //添加
    addData(type){
      // this.resetForm("form");
      if(type == 1){
        this.title = '新增传感器';
        this.$set(this,'form',{
          type:"",
          gatewayId:"",
          routeNum:"",
          configName:"",
          configStatus:"",
        });
      }else if(type == 2){
        this.title = '新增一体机';
        this.$set(this,'form',{
          name:"",
          pcType:"",
          hardwareNum:"",
        });
      }else if(type == 3){
        this.title = '新增控制设备';
        this.disabledType = false;
        this.$set(this,'form',{
          name:"",
          type:"",
          hardwareType:1,
          relayCode:"",
          bit:"",
          configName:"",
          configStatus:"",
          isPcfire:0,
        });
      }else if(type == 4){
        this.title = '新增摄像头';
        this.$set(this,'form',{
          hardwareNum:"",
          subType:[],
        });
      }else if(type == 'addEntrance'){
        this.title = '新增智能门禁';
        this.$set(this,'form',{
          hardwareNum:"",
          name:"",
          ipAddress:"",
          port:"",
          harUser:"",
          harPsw:"",
          controlScope:[],
        });
      }else if(type == 'addSign'){
        this.title = '新增电子信息牌';
        this.$set(this,'form',{
          cardNum:"",
          subjectName:"",
          subjectId:"",
          location:"",
          isStart:"",
          deptId:"",
          deptName:"",
        });
      }
      this.addType = true;
      this.upType = type;
    },
    //编辑
    editData(type,row){
      if(type == 5){
        this.title = '编辑传感器';
        this.$set(this,'form',JSON.parse(JSON.stringify(row)));
        this.$set(this.form,'type',JSON.parse(JSON.stringify(row.type.enumName)));
      }else if(type == 6){
        this.title = '编辑一体机';
        this.$set(this,'form',JSON.parse(JSON.stringify(row)));
        this.$set(this.form,'pcType',JSON.parse(JSON.stringify(row.pcType+'')));
      }else if(type == 7){
        this.title = '编辑控制设备';
        this.disabledType = true;
        this.$set(this,'form',JSON.parse(JSON.stringify(row)));
        this.$set(this.form,'type',JSON.parse(JSON.stringify(row.type.code+'')));
      }else if(type == 8){
        this.title = '编辑摄像头';
        this.$set(this,'form',JSON.parse(JSON.stringify(row)));
        if(this.form.subType!='' && this.form.subType!=null ){
          this.form.subType=this.form.subType.split(',')
        }else{
          this.form.subType=[];
        }
      }else if(type == 'editEntrance'){
        this.title = '编辑智能门禁';
        this.$set(this,'form',JSON.parse(JSON.stringify(row)));
        if(row.controlScope){
          this.form.controlScope=row.controlScope.split(',')
        }else{
          this.form.controlScope=[]
        }

      }else if(type=='editSign'){
        this.title = '编辑电子信息牌';
        this.$set(this,'form',JSON.parse(JSON.stringify(row)));
      }
      this.addType = true;
      this.upType = type;
    },

    //获取列表
    listBySubjectId(){
      console.log(this.subjectData)
      let obj = {
        subjectId:this.subjectData.id
      };
      listBySubjectId(obj).then(response => {
        if(response.data.listCgq){
          this.$set(this,'listCgq',response.data.listCgq);
        }
        if(response.data.listYtj){
          this.$set(this,'listYtj',response.data.listYtj);
        }
        if(response.data.listkzsb){
          this.$set(this,'listkzsb',response.data.listkzsb);
        }
        if(response.data.listSpjk){
          //判断是否是抓拍摄像头
          for(let i=0; i< response.data.listSpjk.length;i++){
            response.data.listSpjk[i].isArrest=(response.data.listSpjk[i].subType!=''&& response.data.listSpjk[i].subType!=null);
          }
          this.$set(this,'listSpjk',response.data.listSpjk);

        }
        if(response.data.listHK){
          this.$set(this,'listHK',response.data.listHK);
        }
        if(response.data.listXxp){
          this.$set(this,'listXxp',response.data.listXxp);
        }
      });
    },
    //返回上一页
    backPage(){
      this.$parent.clickPage(1);
    },
    //传感器类型
    getSensorList(){
      getSensorList().then(response => {
        this.sensorAddOptions = response.data;
      });
    },
  }
}
</script>

<style scoped lang="scss">
.deviceList{
  flex:1;
  display: flex;
  flex-direction: column;
  padding-bottom:20px;
  border-radius:10px!important;
  margin:5px 20px 20px 10px!important;
  box-shadow: 0 0 8px 1px rgba(0, 0, 0, 0.1) !important;
  *{
    margin:0;
  }
  .title-box{
    display: flex;
    margin:0 20px;
    .left-title{
      flex:1;
      height:80px;
      line-height:80px;
      color:#0045AF;
      font-size:18px;
    }
    .right-button{
      margin:20px 0;
    }
  }
  .for-max-box{
    margin:0 40px;
    font-weight:500;
    .for-big-box{
      border: 1px solid #E0E0E0;
      display: inline-block;
      overflow: hidden;
      width:280px;
      min-height:158px;
      padding-bottom:10px;
      border-radius: 6px;
      margin:0 20px 20px 0;
      position: relative;
      .camera{
        position: absolute;
        right: 0;
        top: 0;
        width: 50px;
        height: 30px;
        background: #0183FA;
        border-radius: 10px 0px 10px 0px;
        font-size: 14px;
        font-weight: 400;
        color: #FFFFFF;
        line-height: 30px;
        text-align: center;
      }
      .for-title-p{
        background: rgba(182,214,254,1);
        color:#0183FA;
        font-size:16px;
        line-height:40px;
        display:block;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
        padding:0 16px;
        margin-bottom:10px;
        font-weight:700;
      }
      .for-text-box{
        display: flex;
        padding:0 23px;
        p{
          font-size:14px;
          line-height:30px;
          flex:1;
        }
        p:nth-child(1){
          color:#333;
          text-align: left;
        }
        p:nth-child(2){
          color:#999;
          text-align: right;
          overflow:hidden;
          text-overflow:ellipsis;
          white-space:nowrap;
        }
      }
      .for-button-box{
        display: flex;
        line-height:26px;
        margin-top:10px;
        p{
          text-align: center;
          font-size:14px;
          color:#666666;
        }
        p:nth-child(1){
          flex:1;
          cursor: pointer;
          i{
            color:#1151b4;
            margin-right:10px;
          }
        }
        p:nth-child(2){
          width:2px;
          height:14px;
          margin:6px 0;
          background: #CCCCCC;
        }
        p:nth-child(3){
          flex:1;
          cursor: pointer;
          i{
            color:#ff6868;
            margin-right:10px;
          }
        }
      }
    }
    .for-big-box-two{
      border: 1px solid #E0E0E0;
      display: inline-block;
      overflow: hidden;
      width:280px;
      min-height:158px;
      padding-bottom:10px;
      border-radius: 6px;
      margin:0 20px 20px 0;
      .for-title-p{
        background: rgba(182,214,254,1);
        color:#0183FA;
        font-size:16px;
        line-height:40px;
        display:block;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
        padding:0 16px;
        margin-bottom:10px;
        font-weight:700;
      }
      .for-text-box{
        display: flex;
        padding:0 23px;
        p{
          font-size:14px;
          line-height:30px;
          flex:1;
        }
        p:nth-child(1){
          text-align: left;
          color:#333;
        }
        p:nth-child(2){
          color:#999;
          text-align: right;
          overflow:hidden;
          text-overflow:ellipsis;
          white-space:nowrap;
        }
      }
      .for-button-box{
        display: flex;
        line-height:26px;
        margin-top:10px;
        p{
          text-align: center;
          font-size:14px;
          color:#666666;
        }
        p:nth-child(1){
          flex:1;
          cursor: pointer;
          i{
            color:#1151b4;
            margin-right:10px;
          }
        }
        p:nth-child(2){
          width:2px;
          height:14px;
          margin:6px 0;
          background: #CCCCCC;
        }
        p:nth-child(3){
          flex:1;
          cursor: pointer;
          i{
            color:#ff6868;
            margin-right:10px;
          }
        }
      }
    }
    .add-for-p{
      font-size:14px;
      border: 1px solid #E0E0E0;
      display: inline-block;
      overflow: hidden;
      width:280px;
      height:130px;
      line-height:130px;
      text-align: center;
      border-radius: 6px;
      color:#999999;
      cursor: pointer;
      margin:0 20px 20px 0;
      i{
        margin-right:10px;
      }
    }
    .add-for-p-two{
      font-size:14px;
      border: 1px solid #E0E0E0;
      display: inline-block;
      overflow: hidden;
      width:280px;
      height:158px;
      line-height:158px;
      text-align: center;
      border-radius: 6px;
      color:#999999;
      cursor: pointer;
      margin:0 20px 20px 0;
      i{
        margin-right:10px;
      }
    }
  }
}
</style>