<template>
  <div>
    <LHeader :text="text"></LHeader>
    <van-form
      @submit="onSubmit"
      :scroll-to-error="true"
      :show-error="false"
      validate-trigger="onSubmit"
    >
    <van-field
      v-if="isShowreturnCause"
      v-model="returnCause"
      readonly
      rows="1"
      autosize=""
      label="退回原因"
      name="returnCause"
      type="textarea"
    />
      <van-field
        v-if="!isShowreturnCause"
        readonly
        clickable
        name="projectName"
        :value="projectName"
        label="所属工程名称"
        placeholder="请选择"
        @click="showProjectName = true"
        :rules="[{ required: true, message: '所属工程名称不能为空' }]"
      />
      <van-popup v-model="showProjectName" position="bottom">
        <van-picker
          show-toolbar
          value-key="projectName"
          :columns="columnsProjectName"
          @confirm="onConProjectName"
          @cancel="showProjectName = false"
        />
      </van-popup>

      <van-field
        readonly
        clickable
        name="factor"
        :value="factor"
        label="风险因素"
        placeholder="请选择"
        @click="showFactor = true"
        :rules="[{ required: true, message: '风险因素不能为空' }]"
      />
      <van-popup v-model="showFactor" position="bottom">
        <van-picker
          show-toolbar
          value-key="factorType"
          :columns="columnsFactor"
          @confirm="onConFactor"
          @cancel="showFactor = false"
        />
      </van-popup>

      <van-field
        readonly
        clickable
        name="source"
        :value="source"
        label="风险源"
        placeholder="请选择"
        @click="showSource = true"
        :rules="[{ required: true, message: '风险源不能为空' }]"
      />
      <van-popup v-model="showSource" position="bottom">
        <van-picker
          show-toolbar
          value-key="sourceName"
          :columns="columnsSource"
          @confirm="onConSource"
          @cancel="showSource = false"
        />
      </van-popup>

      <van-field
        readonly
        clickable
        name="trouble"
        :value="trouble"
        label="事故类型"
        placeholder="请选择"
        @click="showTrouble = true"
        :rules="[{ required: true, message: '事故类型不能为空' }]"
      />
      <van-popup v-model="showTrouble" position="bottom">
        <van-picker
          show-toolbar
          value-key="accidentType"
          :columns="columnsTrouble"
          @confirm="onConTrouble"
          @cancel="showTrouble = false"
        />
      </van-popup>

      <van-field
        readonly
        clickable
        name="setRank"
        :value="setRank"
        label="风险定级"
        placeholder="请选择"
        @click="showSetRank = true"
        :rules="[{ required: true, message: '风险定级不能为空' }]"
      />
      <van-popup v-model="showSetRank" position="bottom">
        <van-picker
          show-toolbar
          :columns="columnsSetRank"
          @confirm="onConSetRank"
          @cancel="showSetRank = false"
        />
      </van-popup>

      <van-field
        v-model="riskRank"
        readonly
        name="riskRank"
        label="风险等级"
        placeholder="请选择"
        :rules="[{ required: true, message: '风险等级不能为空' }]"
      />

      <van-field
        v-model="setRankMode"
        name="setRankMode"
        label="定级方式"
        type="textarea"
        rows="1"
        autosize
        placeholder="请输入"
      />
      <van-field
        name="定级方式"
        label=" "
      >
        <template #input>
          <van-uploader v-model="setRankModeImg" />
        </template>
      </van-field>

      <van-field
        v-model="location"
        name="location"
        label="风险部位"
        type="textarea"
        rows="1"
        autosize
        placeholder="请输入"
        :rules="[{ required: true, message: '风险部位不能为空' }]"
      />

      <van-field
        readonly
        clickable
        name="control"
        :value="control"
        label="管控层级"
        placeholder="请选择"
        @click="showControl = true"
        :rules="[{ required: true, message: '管控层级不能为空' }]"
      />
      <van-popup v-model="showControl" position="bottom">
        <van-picker
          show-toolbar
          :columns="columnsControl"
          @confirm="onConControl"
          @cancel="showControl = false"
        />
      </van-popup>

      <van-field
        readonly
        clickable
        name="mainDutyDept"
        :value="mainDutyDept"
        label="主责部门"
        placeholder="请选择"
        @click="showMainDutyDept = true"
      />
      <van-popup v-model="showMainDutyDept" position="bottom">
        <van-picker
          show-toolbar
          value-key="deptName"
          :columns="columnsMainDutyDept"
          @confirm="onConMainDutyDept"
          @cancel="showMainDutyDept = false"
        />
      </van-popup>

      <van-field
        readonly
        clickable
        name="mainDutyPeopLe"
        :value="mainDutyPeopLe"
        label="主责人员"
        placeholder="请选择"
        @click="showMainDutyPeopLe = true"
      />
      <van-popup v-model="showMainDutyPeopLe" position="bottom">
        <van-picker
          show-toolbar
          value-key="userName"
          :columns="columnsMainDutyPeopLe"
          @confirm="onConMainDutyPeopLe"
          @cancel="showMainDutyPeopLe = false"
        />
      </van-popup>

      <van-field
        v-model="technology"
        name="technology"
        label="技术措施"
        type="textarea"
        rows="1"
        autosize
        placeholder="请输入"
      />
      <van-field
        name="技术措施"
        label=" "
      >
        <template #input>
          <van-uploader v-model="technologyImg" />
        </template>
      </van-field>

      <van-field
        v-model="administration"
        name="administration"
        label="管理措施"
        type="textarea"
        rows="1"
        autosize
        placeholder="请输入"
      />
      <van-field
        name="管理措施"
        label=" "
      >
        <template #input>
          <van-uploader v-model="administrationImg" />
        </template>
      </van-field>

      <van-field
        v-model="urgent"
        name="urgent"
        label="应急措施"
        type="textarea"
        rows="1"
        autosize
        placeholder="请输入"
      />
      <van-field
        name="应急措施"
        label=" "
      >
        <template #input>
          <van-uploader v-model="urgentImg" />
        </template>
      </van-field>

      <div style="margin: 16px 16px 0">
        <van-button round block type="info" native-type="submit"
          >保存</van-button
        >
      </div>
    </van-form>
    <div style="margin:10px 16px 0px;padding-bottom:16px">
      <van-button round block type="warning" @click.native="cancel"
        >取消</van-button
      >
    </div>
  </div>
</template>

<script>
import LHeader from "@/components/header.vue";
import { getFormList, postHdSource, postHdType, postHdPeople, postReAdd, postriskConiCause } from "@/service/risk";
export default {
  components: {
    LHeader
  },
  data() {
    return {
      taskId:"",
      text: "新增风险",
      projectId: "", // 所属工程
      projectName: "", // 所属工程
      showProjectName: false,
      columnsProjectName: [],
      factor: "", //风险因素
      showFactor: false,
      columnsFactor: [],
      source: "", //风险源
      showSource: false,
      columnsSource: [],
      trouble: "", //事故类型
      showTrouble: false,
      columnsTrouble: [],
      setRank: "", //风险定级
      showSetRank: false,
      columnsSetRank: ["一般风险", "较小风险", "较大风险", "重大风险"],
      riskRank: "", // 风险等级
      setRankMode: "", // 定级方式文字
      setRankModeImg: [], // 定级方式图片
      location: "", //风险部位
      control: "", //管控层级
      showControl: false,
      columnsControl: ["项目级", "企业级"],
      mainDutyDept: "", // 主责部门
      mainDutyDeptId: "",
      showMainDutyDept: false,
      columnsMainDutyDept: [],
      mainDutyPeopLe: "", // 主责人员
      mainDutyPeopLeId :"",
      showMainDutyPeopLe: false,
      columnsMainDutyPeopLe: [],
      technology:"", //技术措施文字
      technologyImg:[],//技术措施图片
      administration:"", //管理措施文字
      administrationImg:[],//管理措施图片
      urgent:"", //应急措施文字
      urgentImg:[],//应急措施图片
      returnCause: "", // 退回原因
      isShowreturnCause: false
    };
  },
  created() {
    if (this.$route.params.status) {
      this.isShowreturnCause = true;
      this.text = "风险上报退回"
      this.taskId = this.$route.params.taskId
      this.postReturnEcho()
    }
    this.getList();
  },
  methods: {
    onSubmit(values) {
      console.log("submit", values);
      let formdata = new FormData()
      formdata.append("pId", this.projectId)
      formdata.append("riskFactor", this.factor)
      formdata.append("riskSource", this.source)
      formdata.append("accidentType", this.trouble)
      formdata.append("level", this.setRank)
      formdata.append("riskLevel",  this.riskRank)
      formdata.append("gradingMethod", this.setRankMode)
      formdata.append("riskPosition", this.location)
      formdata.append("controlLevel", this.control)
      formdata.append("responsibilityDept", this.mainDutyDeptId)
      formdata.append("responsibilityMember",  this.mainDutyPeopLeId)
      formdata.append("technicalMeasures", this.technology)
      formdata.append("managementMeasures", this.administration)
      formdata.append("emergencyMeasure", this.urgent)
      this.$toast.loading({
        message: "提交中...",
        forbidClick: true,
        loadingType: "spinner",
        duration: 0
      });
      postReAdd("/riskMain/add", formdata)
        .then(res => {
          this.$toast.clear();
          this.$toast.success({
            message: "提交成功",
            duration: 2000
          });
          history.go(-1);
        })
        .catch(() => {
          this.$toast.clear();
          this.$toast.fail("提交失败,请稍后再试");
        });

    },

    // 请求表单数据
    getList() {
      this.$toast.loading({
        message: "加载中...",
        forbidClick: true,
        loadingType: "spinner",
        duration: 0
      });
      getFormList("/riskMain/add")
        .then(res => {

          
          this.$toast.clear();
          this.columnsProjectName = res.data.projectInformations;
          this.columnsFactor = res.data.riskInventories;
          this.columnsMainDutyDept = res.data.organizationList
        })
        .catch(() => {
          this.$toast.clear();
          this.$toast.fail("加载失败,请稍后再试");
        });
    },

    // 请求已退回详情数据
    postReturnEcho(){
      this.$toast.loading({
        message: "加载中...",
        forbidClick: true,
        loadingType: "spinner",
        duration: 0
      });
      postriskConiCause(`/riskMain/edit/${this.taskId}`)
        .then(res => {
          this.$toast.clear();
          // let msg = res.data.hdReport
          // // 对数据进行赋值
          this.returnCause = res.data.reason;
          // this.projectId = msg.proId;
          // // 对所属工程数组筛选出 相同id 的工程名
          // let name =  this.columnsProjectName.filter(item =>{
          //   return item.id == msg.proId
          // })
          // this.projectName = name[0].projectName
          // this.range = msg.hdRange
          // this.type = msg.hdType
          // this.dangerName = msg.hdProjectName
          // this.dangerNum = msg.hdProjectId
          // this.dangerLevel = msg.hdLev

          // this.findTime = msg.hdDiscoveryTime
          // this.source = msg.dangerId
          // this.source1 = msg.dangerSource
          // this.location = msg.hdPosition
          // this.describe = msg.hdDescribe
          // this.hdPicture1 = msg.hdPicture1
          // this.hdVideo1 = msg.hdVideo1
          // this.expireTime = msg.hdExpirationTime
          // this.recPeople = msg.rectificationUser

        })
        .catch(() => {
          this.$toast.clear();
          this.$toast.fail("加载失败,请稍后再试");
        });
    },





    // 所属工程名称
    onConProjectName(value) {
      this.projectId = value.id;
      this.projectName = value.projectName;
      this.showProjectName = false;
    },
    // 风险因素
    onConFactor(value) {
      this.factor = value.factorType;
      this.showFactor = false;
      this.source = "";
      this.trouble = "";
      // 请求风险源
      postHdSource(`/riskMain/showSourceName/${this.factor}`).then(res =>{
        this.columnsSource = res.data
      })

    },
    // 风险源
    onConSource(value) {
      this.source = value.sourceName;
      this.showSource = false;
      this.trouble = "";
      // 请求事故类型
      postHdType(`/riskMain/showaccidentType/${this.factor}/${this.source}`).then(res =>{
        this.columnsTrouble = res.data
      })

    },
    // 事故类型
    onConTrouble(value) {
      this.trouble = value.accidentType;
      this.showTrouble = false;
    },
    // 风险定级
    onConSetRank(value) {
      this.setRank = value;
      this.riskRank = value;
      if(value == "重大风险" || value == "较大风险"){
        this.control = "企业级"
      }else{
        this.control = "项目级"
      }
      this.showSetRank = false;
    },
    // 管控层级
    onConControl(value) {
      this.control = value;
      this.showControl = false;
    },
    // 主责部门
    onConMainDutyDept(value) {
      this.mainDutyDeptId = value.deptId
      this.mainDutyDept = value.deptName;
      this.showMainDutyDept = false;
      this.mainDutyPeopLe = ""
      // 请求主责人员
      // 请求事故类型
      let formdata = new FormData()
      formdata.append("organizationId",this.mainDutyDeptId)
      postHdPeople(`/riskMain/getUserList`,formdata).then(res =>{
        this.columnsMainDutyPeopLe = res.data
        
      })

    },
    // 主责人员
    onConMainDutyPeopLe(value) {
      this.mainDutyPeopLeId = value.userId
      this.mainDutyPeopLe = value.userName;
      this.showMainDutyPeopLe = false;
    },

    cancel() {
      this.$router.go(-1);
    }
  }
};
</script>
<style scoped>
/* @import url(); 引入css类 */
</style>
