<!--供应商管理-->
<template>
  <div class="supplier">
    <div class="supplier-title">
      <P>实验室名称-授权失败详情 </P>
      <p class="button-p reset-button-one" @click="backPage">返回</p>
    </div>
    <div class="supplier-page">
      <el-form :model="queryParams" ref="queryForm" style="margin-top:20px;" :inline="true" label-width="120">
        <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.userType" placeholder="请选择" clearable size="small">
            <el-option label="学生" value="22" />
            <el-option label="教师" value="11" />
          </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 label="" prop="title" style="float: right">
          <p class="inquire-button-one"
             style="width: 120px;margin-left: 10px;"
             v-if="!admittance"
             @click="handleClick('','','addStudent')"
          >批量重试</p>
        </el-form-item>
      </el-form>
      <el-table border v-loading="loading" :data="tableData" :row-key="getRowKeys"  highlight-current-row @selection-change="handleSelectionChange" >
        <el-table-column type="selection"  width="55" :reserve-selection="true" align="center"></el-table-column>
        <el-table-column label="所属单位" align="left" prop="deptName"/>
        <el-table-column label="姓名" align="left" prop="nickName"></el-table-column>
        <el-table-column label="验证方式" align="left" prop="verifyMode"></el-table-column>
        <el-table-column label="类别" align="left" prop="userType"></el-table-column>
        <el-table-column label="授权时间" align="left" prop="verifyTime"></el-table-column>
        <el-table-column label="授权人" align="left" prop="verifyUser"></el-table-column>
        <el-table-column label="状态" align="left" prop="verifyUser"></el-table-column>
        <el-table-column label="失效时间" align="left" prop="invalidTime" width="250">
          <template slot-scope="scope">
            <el-date-picker
              :disabled="(scope.row.userType=='学生' && admittance) || (scope.row.userType=='教师' && whiteList)"
              :picker-options="pickerOptions0"
              v-model="scope.row.invalidTime"
              value-format="yyyy-MM-dd"
              type="date"
              placeholder="请选择失效时间">
            </el-date-picker>
          </template>
        </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-if="(scope.row.userType=='学生' && !admittance) || (scope.row.userType=='教师' && !whiteList)"
                 @click="handleClick('',scope.row,'delete')"
              >删除</p>
              <p class="table-min-button"  style="color: #333;cursor: text" @click="handleClick('',scope.row,'again')">手动<i style="color: #0045AF;cursor: pointer;font-style: normal;text-decoration:underline">重试</i></p>
              <p class="table-min-button"  style="color: #333;cursor: text" @click="handleClick('',scope.row,'again')"  v-if="scope.row.userType=='学生' && admittance">安全准入<i style="color: #0045AF;cursor: pointer;font-style: normal;text-decoration:underline">重试</i></p>
              <p class="table-min-button"  style="color: #333;cursor: text" @click="handleClick('',scope.row,'again')" v-if="scope.row.userType=='教师' && whiteList">白名单<i style="color: #0045AF;cursor: pointer;font-style: normal;text-decoration:underline">重试</i></p>
            </div>
          </template>
        </el-table-column>
      </el-table>
      <div style="display: flex;height:32px;margin-top:15px;">
        <div style="flex:5;">
          <pagination :page-sizes="[20, 30, 40, 50]"
                      v-show="total>0"
                      :total="total"
                      style="margin:0;"
                      :page.sync="queryParams.pageNum"
                      :limit.sync="queryParams.pageSize"
                      @pagination="getList"
          />
        </div>
      </div>
      <div style="text-align: center;">
        <el-button class="color_ff back_one" style="width: 300px;" @click="loseTimeSubmitForm()">确定</el-button>
      </div>

    </div>
  </div>
</template>

<script>
import {
  AddImpowerHaikang,
  delUserHaikang,
  editImpowerHaikang,
  getHaikangUserList
} from '@/api/laboratory/subject'

export default {
  name: "Approval",
  components: {

  },
  props:{
    pageData:{},
  },
  data() {
    return {
      loading:false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize:20,
        searchValue:'',
        userType:'',
        hardId:'',
      },
      total:0,
      tableData:[{}],
      dateRange:[],
      labWhiteJoinSubList:[],
      userType:1,//判断是学生 1 教职工2
      //提交
      form:{},
      // 设置只能选择当前日期及之后的日期
      pickerOptions0: {
        disabledDate(time) {
          return time.getTime() < Date.now();//如果没有后面的-8.64e7就是不可以选择今天的
        }
      },
      admittance:false,//智能门禁有没有勾选安全准入
      whiteList:false,//智能门禁有没有勾选白名单
    };


  },
  methods: {
      getRowKeys(row) {
        return row.userId;   //指定row-key的一个标识
      },
      //监听关联记录弹窗关闭
      handleClose(){
        console.log('弹窗关闭');
        this.$refs.multipleTable.clearSelection();
      },
      //取消选中
      toggleSelection(rows) {
        let _this=this;
        if (rows) {
          rows.forEach(row => {
            this.$refs.multipleTable.toggleRowSelection(row,true);
          });

        } else {
          this.$refs.multipleTable.clearSelection();
        }
      },
      //选中实验室
      handleSelectionChange(val){
        let _this=this;
        this.labWhiteJoinSubList=[];
        this.labWhiteJoinSubList=val;

      },

      handleClick(index,row,doType){
        let _this=this;
        if(doType=='delete'){//新增学生授权
          this.$confirm('是否确认删除['+row.nickName+']门禁授权?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function() {
            delUserHaikang(row.id).then( response => {
              _this.msgSuccess("删除成功");
              _this.getList();
            });
          }).then(() => {
            _this.getList();

          }).catch(() => {});
        }else if(doType=='again'){

        }
      },
      /** 弹框搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      /** 弹框重置按钮操作 */
      resetQuery() {
        this.queryParams.searchValue = "";
        this.queryParams.userType = "";
        this.handleQuery();
      },
      //返回
      backPage(){
        this.$parent.handleClick('','','back');
        this.$parent.getList();
      },
      getList(){
        let _this=this;
        getHaikangUserList(_this.queryParams).then( response => {
          let res=response.rows;
         // _this.tableData=res;
          _this.total=response.total;
        });
      },
    //失效时间修改后提交
      loseTimeSubmitForm(){
        let _this=this;
        let arr=[];
        _this.tableData.forEach(function(item2) {
          arr.push({'invalidTime':item2.invalidTime,'userId':item2.userId,'verifyMode':item2.verifyMode,id:item2.id})
        })
        _this.form.detailList=arr;
        setTimeout(function () {
          editImpowerHaikang(_this.form).then(response => {
            if(response.code==200){
              _this.msgSuccess("修改成功");
              _this.getList();
            }
          });
        },100)
      },
      /* 新增授权*/
      submitForm(){
        let _this=this;
        let arr=[];
        if(this.labWhiteJoinSubList.length>0){
          this.labWhiteJoinSubList.forEach(function(item){
            arr.push({'invalidTime':item.invalidTime,'userId':item.userId,'verifyMode':item.verifyMode})
          })
          _this.form.detailList=arr;
          setTimeout(function () {
            AddImpowerHaikang(_this.form).then(response => {
              if(response.code==200){
                setTimeout(function () {
                  _this.msgSuccess("新增成功");
                  _this.dialogVisible=false;
                  _this.getList();
                },1000)
              }
            });
          },100)
        }else{
          this.msgError("请先选择人员!");
        }



      },
  },
  mounted() {
    this.queryParams.hardId=this.pageData.hardId;
    this.form.hardId=this.pageData.hardId;
    this.admittance=this.pageData.controlScope.search("1") != -1
    this.whiteList=this.pageData.controlScope.search("2") != -1
    console.log('安全准入'+this.admittance)
    console.log('白名单'+this.whiteList)
    this.getList()
  }
};
</script>

<style lang="scss">
.supplier{
  flex:1;
  display: flex;
  flex-direction: column;
  /*顶部*/
  .supplier-title{
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #E0E0E0;
    height: 90px;
    p:nth-child(1){
      line-height:60px;
      color: #0045AF;
      font-size:14px;
      margin:0 12px 0 20px;
    }
    p:nth-child(2){
      margin-right:20px;
    }
  }
  .supplier-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;
  }
  /*弹框*/
  .btn_list{
    width: 100%;
    height: 40px;
    background: rgba(1,131,250,0.1);
    border-radius: 6px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 32px;
    >i{
      font-style: normal;
      display: inline-block;
      cursor: pointer;
    }
    >i:nth-of-type(1){
      font-size: 20px;
      color: #0045AF;
      margin: 0 16px 0 14px;
    }
    >i:nth-of-type(2){
      font-size: 16px;
      font-family: Source Han Sans CN;
      font-weight: bold;
      color: #999999;
      line-height: 16px;
    }
    >i:nth-of-type(3){
      font-size: 16px;
      font-family: Source Han Sans CN;
      font-weight: bold;
      color: #0045AF;
      line-height: 16px;
      margin: 0 28px 0 46px;
    }
    >i:nth-of-type(4){
      font-size: 16px;
      font-family: Source Han Sans CN;
      font-weight: bold;
      color: #0045AF;
      line-height: 16px;
    }
    >i:nth-of-type(5){
      font-size: 16px;
      font-family: Source Han Sans CN;
      font-weight: bold;
      color: #FFA312;
      line-height: 16px;
      margin: 0 40px 0 28px;
    }
    .bottom-button-box{
      display: flex;
      width:220px;
      margin: 0;
      p{
        font-size:14px;
        height:30px;
        width:100px;
        line-height:30px;
        text-align: center;
        border-radius:4px;
      }
      p:nth-child(1){
        border:1px solid #E0E0E0;
        margin-right:20px;
      }
      p:nth-child(2){
        border:1px solid #0045AF;
      }
    }
  }
  .configuration{
    height: 70px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    border-top: 1px solid #D8D8D8;
    .el-form-item{
      margin-bottom: 0!important;
    }
  }
}
</style>
