<template>
  <div class="avoid_">
    <div class="avoid">
      <el-form>
        <el-row>
          <el-col :span="24">
            <h2 class="title_style">被查单位</h2>
          </el-col>
        </el-row>
        <br />
        <el-row>
          <el-col :span="9">
            <span>被检单位名称：</span>
            <el-input style="width: 70%;" v-model="dwmcss"></el-input>
          </el-col>
          <el-col :span="3">
            <el-button type="primary" @click="gbqymclistcx()">查询</el-button>
          </el-col>
          <el-col :span="10">
            <span>规避区域：</span>
            <el-cascader
              :options="dwoptions"
              :props="dwprops"
              style="width: 75%;"
              collapse-tags
              clearable
            ></el-cascader>
          </el-col>
          <el-col :span="2">
            <el-button type="primary">选择</el-button>
          </el-col>
        </el-row>
        <br />
        <el-row>
          
          <el-col :span="12">
            <el-table
              ref="multipleTable"
              :data="qyxx1"
              tooltip-effect="dark"
              style="width: 100%"
              :border="true"
              @selection-change="handleSelectionChange"
            >
              <el-table-column type="selection"></el-table-column>
              <el-table-column prop="qymc" label="被检单位名称"></el-table-column>
            </el-table>
          </el-col>
          <el-col :span="12">
            <el-table
              ref="multipleTable"
              :data="qyxx2"
              tooltip-effect="dark"
              style="width: 100%"
              :border="true"
              @selection-change="handleSelectionChange11"
            >
              <el-table-column type="selection"></el-table-column>
              <el-table-column prop="qymc" label="被检单位名称"></el-table-column>
            </el-table>
          </el-col>
        </el-row>
        <br />
        <br />
        <div v-show="this.$route.query.status != 2">
          <el-row>
            <el-col :span="24">
              <h2 class="title_style">检查人员</h2>
            </el-col>
          </el-row>
          <br />
          <el-row>
            <el-col :span="9">
              <span>人员名称：</span>
              <el-input style="width: 70%;" v-model="rymxs"></el-input>
            </el-col>
            <el-col :span="3">
              <el-button type="primary" @click="gbrymccx()">查询</el-button>
            </el-col>
            <el-col :span="10">
              <span>规避区域：</span>
              <el-input style="width: 75%;"></el-input>
            </el-col>
            <el-col :span="2">
              <el-button type="primary">选择</el-button>
            </el-col>
          </el-row>
          <br />
          <el-row>
            <el-col :span="12">
              <el-table
                ref="multipleTable"
                :data="tableData"
                tooltip-effect="dark"
                style="width: 100%"
                :border="true"
                @selection-change="handleSelectionChange1"
              >
                <el-table-column type="selection"></el-table-column>
                <el-table-column label="姓名">
                  <template slot-scope="scope">{{ scope.row.ryxm }}</template>
                </el-table-column>
                <el-table-column prop="bmmc" label="所属部门"></el-table-column>
              </el-table>
            </el-col>
            <el-col :span="12">
              <el-table
                ref="multipleTable"
                :data="tableData1"
                tooltip-effect="dark"
                style="width: 100%"
                :border="true"
                @selection-change="handleSelectionChange2"
              >
                <el-table-column type="selection"></el-table-column>
                <el-table-column label="姓名">
                  <template slot-scope="scope">{{ scope.row.ryxm }}</template>
                </el-table-column>
                <el-table-column prop="bmmc" label="所属部门"></el-table-column>
              </el-table>
            </el-col>
          </el-row>
        </div>
      </el-form>
    </div>
    <div class="btn_operation">
      <el-button type="primary" @click="go_back()">上一步</el-button>

      <el-button type="primary" @click="go_dailyinspection()">取消</el-button>
      <el-button type="primary" @click="next_checkExtraction()">下一步</el-button>
    </div>
  </div>
</template>

<script>
import {
  gbrylb,
  gbrylbcx,
  gbqylb,
  bjdwmchq
} from "@/api/missionDispatchManage/dailyinspection/index.js";
import { inspectionUnit } from "@/api/setTask/index.js";
export default {
  name: "taskGeneration",
  components: {},
  mounted() {
    // this.gbrymcList()//规避人员列表获取
    // this.gbqymclist()//规避企业名称获取
    this.get_gbqylist(); //规避区域列表获取companyTypeList
    console.log(this.$route);
  },
  methods: {
    //返回上一级
    go_back(){
      this.$router.go(-1)
    },
    //规避区域
    get_gbqylist() {
      inspectionUnit(sessionStorage.getItem("orgCode"))
        .then(res => {
          console.log(res);
          this.dwoptions.push(res.data);
        })
        .catch(err => {
          console.log(err);
        });
    },
    //规避单位名称list
    gbqymclistcx() {
      let params = {
        qymc: this.dwmcss,
        qyjgdm: sessionStorage.getItem("orgCode")
      };
      gbqylb(params)
        .then(res => {
          // debugger
          console.log(res.data.length)
          this.qyxx1 = res.data.slice(0,res.data.length / 2)
          this.qyxx2 = res.data.slice(res.data.length / 2,res.data.length)
        // for(var i=0;i<res.data.length/2;i++){
        //     this.qyxx1[i]=res.data[i*2];
        //     this.qyxx2[i]=res.data[i*2+1];
            
        // }

        console.log(this.qyxx1)
        console.log(this.qyxx2)
        })
        .catch(err => {
          console.log(err);
        });
    },
    //规避人员名称名单
    gbrymcList() {
      let params = {};
      gbrylb(params)
        .then(res => {
          this.tableData = res.data;
          
        })
        .catch(err => {
          console.log(err);
        });
    },
    //规避人员模糊查询
    gbrymccx() {
      var formData = new FormData();
      formData.append("rymc", this.rymxs);
      gbrylbcx(formData)
        .then(res => {
          this.tableData = res.data.slice(0,res.data.length / 2)
          this.tableData1 = res.data.slice(res.data.length / 2,res.data.length)
          console.log(this.tableData)
        console.log(this.tableData1)
        })
        .catch(err => {
          console.log(err);
        });
    },
    //选中时触发的事件
    //单位
    handleSelectionChange(val) {
      this.dwlb = val;
      console.log(this.dwlb);
    },
    //单位
    handleSelectionChange11(val) {
      this.dwlb1 = val;
    },
    //人员
    handleSelectionChange1(val) {
      this.rylb = val;
      console.log(this.rylb);
    },
    //人员
    handleSelectionChange2(val) {
      this.rylb1 = val;
      // console.log(this.rylb);
    },

    //跳转到抽取
    next_checkExtraction() {
      console.log(this.$route.query)
      // return false;
      let arr = [];
      let arr1 = [];
       var dwlbAll =this.dwlb.concat(this.dwlb1)
      dwlbAll.forEach(item => {
        arr.push({
          gbCode: item.tyshxydm,
          gbName: item.qymc
        });
      });
       var rylbAll =this.rylb.concat(this.rylb1)
      rylbAll.forEach(item => {
        arr1.push({
          gbCode: item.id,
          gbName: item.ryxm
        });
      });
      this.$router.push({
        path: "/inspection/dailyCheckExtraction",
        query: {
          status: this.$route.query.status,
          gbdwArr: JSON.stringify(arr),
          gbryArr: JSON.stringify(arr1),
          companyTypeList: this.$route.query.bjdwlx,
          bjqyxzfs: this.$route.query.bjqyxzfs,
          rwid: this.$route.query.rwid,
          zdrw:this.$route.query.zdrw,
        }
      });
    },
    go_dailyinspection() {
      this.$router.push("/inspection/dailyinspection");
    }
  },
  data() {
    return {
      dwmultipleSelection: [],
      //携带的规避单位列表
      dwlb: [],
      //携带的规避单位列表
      dwlb1: [],
      //携带的规避人员列表
      rylb: [],
      //单位options
      dwoptions: [],
      //单位props
      dwprops: {
        multiple: true,
        label: "orgName",
        value: "orgCode",
        children: "children"
      },
      //企业名称搜索
      dwmcss: "",
      //企业信息
      qyxx1: [],
      qyxx2: [],

      //人员名称
      rymxs: "",
      rylb1:[],
      tableData1:[],
      tableData: [
        {
          name: "111",
          asd: "861523"
        }
      ], //人员信息
      checked: "",
      procuratorialPersonnelList: [{}],
      form: {
        name: "",
        region: "",
        date1: "",
        date2: "",
        delivery: false,
        type: [],
        resource: "",
        desc: "",
        resource2: "",
        resource3: ""
      }
    };
  }
};
</script>

<style scoped>
.avoid {
  /*border: 1px solid #dadada;*/
  border-radius: 3px;
  margin-top: 10px;
  padding: 18px 18px 28px 18px;
}
.avoid_ {
  background: rgb(244, 245, 248);
  margin: 10px;
  height: 74vh;
  width: calc(100% - 30px);
  overflow: hidden;
  overflow-y: auto;
}
.inspectionUnit_border {
  border: 1px dashed #ccc;
  border-radius: 8px;
  padding: 10px 10px 20px 20px;
}
.table_span {
  padding-left: 10px;
}
.title_style {
  border-left: 3px solid #409eff;
  padding-left: 4px;
  font-size: 15px;
  margin-bottom: 10px;
}
.btn_operation {
  text-align: center;
}
</style>
