<template>
  <div class="dailyinspectionDetails">
    <div class="dailyinspectionDetail_content">
      <el-dialog title="更换人员" :visible.sync="dialogVisibleChange" width="40%">
        <div>
          <el-form
            :label-width="labelwidthStyle"
            :rules="rulesChange"
            ref="changeData"
            :model="changeData"
          >
            <el-row :gutter="10">
              <el-col :span="18">
                <el-form-item label="人员：">
                  <el-select v-model="changeData.data" placeholder="请选择">
                    <el-option
                      v-for="item in jczList"
                      :key="item.rybh"
                      :label="item.ryxm"
                      :value="item.rybh"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="dialogVisibleChange = false">取 消</el-button>
          <el-button type="primary" @click="changeEnter('changeData')">确 定</el-button>
        </span>
      </el-dialog>
      <el-form>
        <br />
        <el-row>
          <el-col :span="12">
            <span class="span_right">任务编号：</span>
            <el-input style="width: 65%;" v-model="detailList.rwId"></el-input>
          </el-col>
          <el-col :span="12">
            <span class="span_right">任务名称：</span>
            <el-input style="width: 65%;" v-model="detailList.rwName"></el-input>
          </el-col>
        </el-row>
        <br />
        <el-row>
          <el-col :span="12">
            <span class="span_right">检查单位：</span>
            <el-input disabled style="width: 65%;" v-model="detailList.jcdwmc"></el-input>
          </el-col>
          <el-col :span="12">
            <span class="span_right">被检单位类型：</span>
            <el-select
              v-model="valueLx"
              multiple
              collapse-tags
              placeholder="请选择"
              style="width: 65%;"
            >
              <el-option
                v-for="item in bjdwlxname"
                :key="item.jcQylx"
                :label="item.jcQylxmc"
                :value="item.jcQylx"
              ></el-option>
            </el-select>
          </el-col>
        </el-row>
        <br />
        <el-row>
          <el-col :span="12">
            <span class="span_right">检查开始时间：</span>
            <el-input
              style="width: 65%;"
              disabled
              class="inputWidth"
              v-model="detailList.jckssjDate"
            ></el-input>
          </el-col>
          <el-col :span="12">
            <span class="span_right">检查结束时间：</span>
            <el-input
              style="width: 65%;"
              disabled
              class="inputWidth"
              v-model="detailList.jcjssjDate"
            ></el-input>
          </el-col>
        </el-row>
        <br />
        <br />
        <el-row>
          <el-col :span="12">
            <span class="span_right">关联文件：</span>
          </el-col>
          <el-col :span="12">
            <span class="span_right">附件：</span>
          </el-col>
        </el-row>
        <br />
        <el-row>
          <el-col :span="24">
            <h1 class="title_style">检查表单</h1>
            <inspectTableView
              :list="dcbdlist"
              @handleSelectionChange="handleSelectionChange"
              :options="tablePar"
              :columns="columns"
            ></inspectTableView>
          </el-col>
        </el-row>
        <br />
        <div v-show="teamVOss.length>0">
          <el-row>
            <el-col :span="24">
              <h1 class="title_style">检查组</h1>
            </el-col>
          </el-row>
          <!--                    <el-row>-->
          <!--                        <el-col :span="24">-->
          <!--                            <h2 style="font-size: 16px;">&nbsp;&nbsp;&nbsp;检查组一</h2>-->
          <!--                        </el-col>-->
          <!--                    </el-row>-->
          <br />
          <el-row v-for="(item,index) in teamVOss" :key="index">
            <el-col :span="10">
              <el-table
                ref="mutipleTable"
                :data="item.members"
                :border="true"
                highlight-current-row
                :header-cell-style="{'background':'#FAFAFA','color':'#333','font-weight':'600'}"
                style="width: 100%;margin:20px 10px 0 0"
                :default-expand-all="true"
              >
                <el-table-column label="人员属性" align="center">
                  <template slot-scope="scope">
                    <span v-if="scope.row.zylx == 0">组长</span>
                    <span v-if="scope.row.zylx == 1">组员</span>
                    <span v-if="scope.row.zylx == 2">外部人员</span>
                  </template>
                </el-table-column>
                <el-table-column label="人员名称" align="center">
                  <template slot-scope="scope">{{scope.row.zyName}}</template>
                </el-table-column>
                <el-table-column label="所属单位" align="center">
                  <template slot-scope="scope">{{scope.row.zydw}}</template>
                </el-table-column>
                <el-table-column label="操作 " align="center">
                  <template slot-scope="scope">
                    <span style="cursor:pointer;" @click="changeTo(scope.row)">更换</span>
                  </template>
                </el-table-column>
              </el-table>
            </el-col>
            <el-col :span="1">
              <span>&nbsp;</span>
            </el-col>
            <el-col :span="10">
              <el-table
                ref="mutipleTable"
                :data="item.organizes"
                :border="true"
                highlight-current-row
                :header-cell-style="{'background':'#FAFAFA','color':'#333','font-weight':'600'}"
                style="width: 100%;margin:20px 10px 0 0"
                :default-expand-all="true"
              >
                <el-table-column property="name" label="被检单位" align="center">
                  <template slot-scope="scope">{{scope.row.bjdwName}}</template>
                </el-table-column>
              </el-table>
            </el-col>
          </el-row>
          <br />
        </div>
        <br />
        <el-row>
          <el-col :span="12">
            <span class="span_right">下发人：</span>
            <el-input class="inputWidth" v-model="detailList.userName"></el-input>
          </el-col>
          <el-col :span="12">
            <span class="span_right">下发时间：</span>
            <el-input class="inputWidth" v-model="detailList.xfTime"></el-input>
          </el-col>
        </el-row>
        <br />
        <div class="btn_operation">
          <el-button style="text-align: center;" type="primary" @click="stage()">暂存</el-button>
          <el-button type="primary" @click="go_specialInspectionFoodstuff()">取消</el-button>
          <el-button type="primary" @click="mylowerHair()">下发</el-button>
        </div>
        <br />
      </el-form>
    </div>
    <br />
  </div>
</template>

<script>
import inspectTableView from "../../../components/table/el-index.vue";
import {
  getzidianbiao,
  hxbjdw,
  dcbdList,
  savercjcfpjczxxbc,
  lowerHair,
  temporaryStorage,
  getrcjcfpjczxxbc
} from "@/api/missionDispatchManage/dailyinspection/index.js";
import { getDictionaryList } from "@/api/setTask/index.js";

export default {
  name: "specialInspectionFoodstuffEdit",
  components: {
    inspectTableView
  },
  data() {
    return {
      dialogVisibleChange: false,
      labelwidthStyle: "200px",
      changeData: {
        data: ""
      },
      rulesChange: {
        data: [
          { required: true, message: "请选择被检单位类型", trigger: "change" }
        ]
      },
      jczList: [], //检查组信息
      changeItem: {},
      jcfshx: "", //检查方式获取
      bjdwlxname: [],
      teamVOss: [],
      valueLx: [], //检查类型值
      valueZx: [], //检查子项值
      valueNr: [], //检查内容值
      jczxlist: [], //检查内容数据
      bjdwlxzdb: [], //备件单位类型列表
      jczxzdb: [], //检查子项列表
      jcxmzdb: [], //检查项目列表
      bjdwlisthx: [],
      jcrylisthx: [],
      dcbdlist: [], //待查表单数据
      bjdwcolumnshx: [
        {
          prop: "bjdwName",
          label: "被检单位",
          align: "center"
        },
        {
          prop: "title",
          label: "操作",
          align: "center",
          render: (h, params) => {
            return h("a", [
              h(
                "span",
                {
                  on: {
                    click: () => {
                      console.log(1);
                    }
                  }
                },
                "新增被检单位"
              )
            ]);
          }
        }
      ],
      jcrycolumnshx: [
        {
          prop: "",
          label: "人员属性",
          align: "center",
          render: (h, params) => {
            return h("div", [
              h("span", params.row.zylx == 0 ? "组长" : "组员")
            ]);
          }
        },
        {
          prop: "zyName",
          label: "人员名称",
          align: "center"
        },
        {
          prop: "zydw",
          label: "所属单位",
          align: "center"
        },
        {
          prop: "title",
          label: "操作",
          align: "center",
          render: (h, params) => {
            return h("a", [
              h(
                "span",
                {
                  on: {
                    click: () => {
                      console.log(1);
                    }
                  }
                },
                "更换"
              )
            ]);
          }
        }
      ],
      cqjglist: [],
      radio: 0,
      form: {
        name: "",
        region: "", //检查内容值
        date1: "",
        date2: "",
        delivery: false,
        type: [],
        desc: ""
      },
      checkContentList: [],
      checkContentLists: [],
      checkSubitems: [],
      detailList: {}, //详情页数据
      SubitemMsg: {}, //检查子项数据
      handleSelectionChange(val) {
        console.log("val:", val);
      },
      tablePar: {
        stripe: true, // 是否为斑马纹 table
        loading: false, // 是否添加表格loading加载动画
        highlightCurrentRow: true, // 是否支持当前行高亮显示
        mutiSelect: false, // 是否支持列表项选中功能
        showIndex: true //是否显示选择框
      },
      options: {
        stripe: true, // 是否为斑马纹 table
        loading: false, // 是否添加表格loading加载动画
        highlightCurrentRow: true, // 是否支持当前行高亮显示
        mutiSelect: false // 是否支持列表项选中功能
      },
      pageInfo: {
        currentPage: 2,
        pageSize: 10,
        total: 100,
        handleSizeChange: val => {
          console.log(val);
        },
        handleCurrentChange: val => {
          console.log(val);
        }
      },
      columns: [
        {
          prop: "bdName",
          label: "表单名称",
          align: "center"
        },
        {
          prop: "state",
          label: "操作",
          align: "center",
          render: (h, params) => {
            return h("a", [
              h(
                "span",
                {
                  on: {
                    click: () => {
                      this.$router.push({
                        path:`${params.row.bdLu}`,
                        query:{
                          look:"look"
                        }
                      });
                    }
                  }
                },
                "查看"
              )
            ]);
          }
        }
      ]
    };
  },
  methods: {
    //获取检查组信息
    getrcjcfpjczxxbcs() {
      getrcjcfpjczxxbc()
        .then(res => {
          this.jczList = res.data;
        })
        .catch(err => {
          console.log(err);
        });
    },
    changeEnter() {
      let rybh = this.changeData.data;
      let ryxm = "";
      for (let i = 0; i < this.jczList.length; i++) {
        if (rybh == this.jczList[i].rybh) {
          ryxm = this.jczList[i].ryxm;
        }
      }
      this.changeItem.ryId = rybh;
      this.changeItem.zyName = ryxm;
      this.dialogVisibleChange = false;
    },
    //更改
    changeTo(row) {
      this.changeItem = row;
      this.dialogVisibleChange = true;
    },
    //拼出检查组需要保存的数据
    getInfo() {
      let returnData = [];
      let obj = {
        rwId: this.$route.query.rwid,
        members: [],
        organizes: []
      };
      console.log(this.teamVOss);
      // debugger
      this.teamVOss.forEach(items => {
        items.members.forEach(res => {
          obj.members.push({
            isCz: res.isCz == "Y" ? 1 : 0,
            zyId: res.rybh,
            zyName: res.zyName,
            zydw: res.zydw,
            zyks: res.zyks,
            zylx: res.zylx
          });
        });
        items.organizes.forEach(orgitems => {
          obj.organizes.push({
            bjdwId: orgitems.bjdwId,
            bjdwName: orgitems.bjdwName
          });
        });
      });
      returnData.push(obj);
      console.log(returnData);
      return returnData;
    },
    //生成下发时要传的数据
    set_xhsj() {
      console.log();
      let xfObj = {
        bjdwxzfs: this.detailList.bjdwxzfs,
        inspectedUnitsVO: [],
        // "inspectedUnitsVO": this.detailList.inspectedUnitsVO,
        jcdwId: this.detailList.jcdwId,
        jcdwmc: this.detailList.jcdwmc,
        jcfs: this.jcfs,
        jcjssjDate: this.detailList.jcjssjDate,
        jckssjDate: this.detailList.jckssjDate,
        jcxmlx: this.detailList.jcxmlx,
        jczqdfs: this.detailList.jczqdfs,
        jhId: this.detailList.jhId,
        rwId: this.detailList.rwId,
        rwName: this.detailList.rwName,
        rwZt: this.detailList.rwZt,
        rwlx: this.detailList.rwlx,
        rwlxName: this.detailList.rwlxName
      };
      console.log(this.detailList);
      this.detailList.inspectedUnitsType.forEach(items => {
        xfObj.inspectedUnitsVO.push({
          bjdwId: items.jcQylx,
          bjdwName: items.jcQylxmc
        });
      });
      return xfObj;
    },
    //生成暂存需要传的数据
    zancunshuju() {
      let obj = {
        bjdwxzfs: this.detailList.bjdwxzfs ? this.detailList.bjdwxzfs : "0",
        // "checkContentVO":this.valueNr,
        checkContentVO: [],
        jcdwId: this.detailList.jcdwId,
        jcdwmc: this.detailList.jcdwmc,
        jcfs: this.detailList.jcfs,
        jcjssjDate: this.detailList.jcjssjDate,
        jckssjDate: this.detailList.jckssjDate,
        jcxmlx: this.detailList.jcxmlx,
        jczqdfs: this.detailList.jczqdfs,
        jhId: this.detailList.jhId,
        rwId: this.detailList.rwId,
        rwName: this.detailList.rwName,
        rwZt: this.detailList.rwZt,
        rwlx: this.detailList.rwlx,
        rwlxName: this.detailList.rwlxName,
        sfxs: this.detailList.sfxs,
        taskCheckItemsVO: [],
        // "taskCheckItemsVO":this.valueZxAll,
        // "taskCheckItemsVO":this.detailList.taskCheckItemsVO,
        userId: this.detailList.userId,
        userName: this.detailList.userName
      };
      console.log(this.checkContentList);
      this.checkContentList.forEach(item => {
        // debugger
        if (this.valueNr.length != 0) {
          this.valueNr.forEach(msg => {
            // debugger
            if (msg == item.dictCode) {
              obj.checkContentVO.push({
                jcnrId: item.dictCode,
                jcnrName: item.dictName
              });
            }
          });
        }
      });
      // debugger
      this.jczxzdb.forEach(item => {
        if (this.valueZx.length != 0) {
          this.valueZx.forEach(msg => {
            if (msg == item.dictCode) {
              obj.taskCheckItemsVO.push({
                jcxmId: item.dictCode,
                jcxmName: item.dictName
              });
            }
          });
        }
      });

      // if(this.jcxmlxval != 0){
      //     this.jczxzdb.forEach(item=>{
      //
      //         this.valueZxAll.forEach(msg=>{
      //
      //             if(msg == item.dictCode){
      //                 obj.taskCheckItemsVO.push({
      //                     jcxmId:item.dictCode,
      //                     jcxmName:item.dictName
      //                 })
      //             }
      //         })
      //     })
      // }

      return obj;
    },
    //下发
    mylowerHair() {
      this.jczsave();
      let params = this.set_xhsj();
      lowerHair(params)
        .then(res => {
          if (res.infoCode == 200) {
            this.$message({
              showClose: true,
              message: "下发成功",
              type: "success"
            });
            this.$router.push("/inspection/specialInspectionFoodstuff");
          } else {
            this.$message({
              showClose: true,
              message: "下发失败",
              type: "warning"
            });
          }
        })
        .catch(err => {
          this.$message({
            showClose: true,
            message: "下发失败",
            type: "warning"
          });
        });
    },
    //检查组信息保存
    jczsave() {
      let params = this.getInfo();
      savercjcfpjczxxbc(params)
        .then(res => {
          if (res.infoCode == 200) {
            this.$message({
              showClose: true,
              message: "保存成功",
              type: "success"
            });
          } else {
            this.$message({
              showClose: true,
              message: "保存失败",
              type: "warning"
            });
          }
        })
        .catch(err => {
          this.$message({
            showClose: true,
            message: "保存失败",
            type: "warning"
          });
        });
    },
    // //设置jcz_show为false
    // jcz_show_false(){
    //     if(this.getInfo().length == 0){
    //         this.jcz_show = false
    //     }
    // },
    //暂存
    stage() {
      this.jczsave();
      let params = this.zancunshuju();
      temporaryStorage(params)
        .then(res => {
          if (res.infoCode == 200) {
            this.$message({
              showClose: true,
              message: "暂存成功",
              type: "success"
            });
            this.$router.push("/inspection/specialInspectionFoodstuff");
          } else {
            this.$message({
              showClose: true,
              message: "暂存失败",
              type: "warning"
            });
          }
        })
        .catch(err => {
          this.$message({
            showClose: true,
            message: "暂存失败",
            type: "warning"
          });
        });
    },
    //返回
    go_specialInspectionFoodstuff() {
      this.$router.push("/inspection/specialInspectionFoodstuff");
    },
    //下一步暂存
    next_stage() {
      // this.jczsave()
      let params = this.zancunshuju();
      temporaryStorage(params)
        .then(res => {
          if (res.infoCode == 200) {
            this.$message({
              showClose: true,
              message: "已暂存",
              type: "success"
            });
          } else {
            this.$message({
              showClose: true,
              message: "暂存失败",
              type: "warning"
            });
          }
        })
        .catch(err => {
          this.$message({
            showClose: true,
            message: "暂存失败",
            type: "warning"
          });
        });
    },
    //点击下一步传radiolength
    next_avoid() {
      this.next_stage();
      let arr = [];
      if (!this.bjdwlxname) {
        console.log("1");
      } else {
        this.bjdwlxname.forEach(item => {
          arr.push({
            qylx: item.jcQylx,
            qylxmc: item.jcQylxmc
          });
        });
      }
      this.$router.push({
        path: "/inspection/dailyAvoid",
        query: {
          status: this.radio,
          bjdwlx: JSON.stringify(arr),
          bjqyxzfs: this.detailList.bjdwxzfs ? this.detailList.bjdwxzfs : "0",
          rwid: this.$route.query.rwid
        }
      });
    },
    //点击下一步传radio
    next_avoid1() {
      this.next_stage();
      let arr = [];
      if (!this.bjdwlxname) {
        console.log("1");
      } else {
        this.bjdwlxname.forEach(item => {
          arr.push({
            qylx: item.jcQylx,
            qylxmc: item.jcQylxmc
          });
        });
      }

      this.$router.push({
        path: "/inspection/dailyAvoid",
        query: {
          bjdwlx: JSON.stringify(arr),
          bjqyxzfs: this.detailList.bjdwxzfs ? this.detailList.bjdwxzfs : "0",
          status: this.radio,
          rwid: this.$route.query.rwid
        }
      });
    },
    //检查内容回显
    jcnrhxs() {
      this.jcnrhx.forEach(item => {
        this.valueNr.forEach(items => {
          if (items == item.jcxmId) {
            this.valueNr.push(item.jcnrId);
          }
        });
      });
    },
    //检查子项回显
    jczxhxs() {
      this.jczxlist.forEach(item => {
        this.valueZx.forEach(items => {
          if (items == item.jcxmId) {
            this.valueZx.push(item.jcxmId);
          }
        });
      });
    },
    //被检单位类型回显
    bjdwhx() {
      console.log(this.bjdwlxname);
      this.valueLx = [];
      this.bjdwlxname.forEach(item => {
        // debugger
        this.valueLx.push(item.jcQylx);
        // debugger
      });
      console.log(this.valueLx);
    },
    //获取回显检查表单
    get_hxbd() {
      let params = {
        taskId: "CBRC1908304334"
      };
      hxbjdw(params)
        .then(res => {
          console.log(res);
          this.cqjglist = res.data;
        })
        .catch(err => {
          console.log(err);
        });
    },
    //获取详情页信息
    dcbdLists() {
      let params = {
        rwId: this.$route.query.rwid,
        jhId: this.$route.query.jhid
      };
      dcbdList(params)
        .then(res => {
          this.bjdwlxname = res.data.inspectedUnitsType;
          this.detailList = res.data;
          this.jcfshx = res.data.jcfs ? res.data.jcfs : 0;
          this.teamVOss = res.data.teamVOs;
          this.jczxlist = res.data.taskCheckItemsVO;
          this.jcnrhx = res.data.checkContentVO;
          this.dcbdlist = res.data.taskFormVO;
          this.bjdwhx();
          this.jczxhxs();
          this.jcnrhxs();
        })
        .catch(err => {
          console.log(err);
        });
    },
    //获取字典表检查类型信息
    get_checkType() {
      let params = {
        groupId: "50001"
      };
      getzidianbiao(params)
        .then(res => {
          if (res.infoCode == 200) {
            this.bjdwlxzdb = res.data;
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    //检查内容字典表
    get_CheckContent() {
      let params = {
        groupId: "50002"
      };
      getzidianbiao(params)
        .then(res => {
          if (res.infoCode == 200) {
            this.checkContentList = res.data;
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    //获取字典表检查子项信息
    get_checkSubitems() {
      let params = {
        groupId: "50004"
      };
      getzidianbiao(params)
        .then(res => {
          if (res.infoCode == 200) {
            this.jczxzdb = res.data;
          }
        })
        .catch(err => {
          console.log(err);
        });
    }
  },
  mounted() {
    this.dcbdLists();
    this.get_CheckContent(); //检查内容字典表
    this.get_checkSubitems(); //检查子项字典表
    this.get_checkType(); //被检单位类型字典表
    this.get_hxbd();
    //获取检查组信息
    this.getrcjcfpjczxxbcs();
  }
};
</script>

<style scoped>
.btn_operation {
  text-align: center;
}

.inputWidth {
  width: 300px;
}

.dailyinspectionDetails {
  margin-left: 10px;
  overflow-y: auto;
  height: calc(100vh - 218px);
  width: calc(100% - 40px);
  overflow-x: hidden;
  background: #f6f7f9;
  border: 1px solid #efeded;
  padding: 0 10px;
}

.dailyinspectionDetail_content {
  background: rgb(244, 245, 248);
  padding: 10px 10px 0px 30px;
  height: calc(100vh - 60px);
  /*margin: 10px;*/
}

.title_style {
  border-left: 3px solid #409eff;
  padding-left: 4px;
  font-size: 15px;
  margin-bottom: 10px;
}

.span_right {
  text-align: right;
  display: inline-block;
  width: 156px;
}
</style>