<template>
  <div class="app-container">
    <el-form ref="form" :rules="rules" :model="pd" label-width="110px" style="width: 800px;">
      <el-form-item label="隐患描述" prop="HIDDENDESCR">
        <el-input v-model="pd.HIDDENDESCR" placeholder="这里输入隐患描述..." />
      </el-form-item>
      <!--      <el-form-item label="隐患部位" prop="HIDDENPART">-->
      <!--        <el-input v-if="hiddenPartType =='value'" v-model="pd.HIDDENPART" placeholder="请输入内容" />-->
      <!--        <treeselect v-if="hiddenPartType =='select'" v-model="pd.HIDDENPART" :options="hiddenPartList" :normalizer="normalizer" :disable-branch-nodes="true" placeholder="请选择" />-->
      <!--        <el-button class="ml5" @click="hiddenPartTypeBtn">{{ hiddenPartType === 'select' ? '输入' : '选择' }}</el-button>-->
      <!--      </el-form-item>-->
      <el-form-item label="隐患部位：" prop="HIDDENPART">
        <el-input v-if="hiddenPartType =='value'" v-model="hiddenForm.HIDDENPART" style="width: 90%;" placeholder="请输入内容" />
        <SelectTree
          v-if="hiddenPartType =='select'"
          ref="deptTree_Select1"
          :clearable="false"
          :options="hiddenPartList"
          :props="defaultProps"
          v-model="pd.HIDDENPART"
          style="width: 90%;"
          allow-create
          placeholder="请选择" />
        <el-button class="ml5" @click="hiddenPartTypeBtn">{{ hiddenPartType === 'select' ? '输入' : '选择' }}</el-button>
      </el-form-item>
      <el-form-item label="隐患级别：" prop="HIDDENLEVEL">
        <SelectTree
          ref="deptTree_Select2"
          :clearable="false"
          :options="hiddenlevelList"
          :props="defaultProps"
          v-model="pd.HIDDENLEVEL"
          :canparent="false"
          style="width: 100%;"
          children-name="nodes"
          placeholder="请选择" />
      </el-form-item>
      <!--      <el-form-item label="隐患级别" prop="HIDDENLEVEL">-->
      <!--        <treeselect v-model="pd.HIDDENLEVEL" :options="hiddenlevelList" :normalizer="normalizer" :disable-branch-nodes="true" placeholder="请选择" />-->
      <!--      </el-form-item>-->
      <!--      <el-form-item label="隐患类型" prop="HIDDENTYPE">-->
      <!--        <treeselect v-model="pd.HIDDENTYPE" :options="hiddenTypeList" :normalizer="normalizer" :disable-branch-nodes="true" placeholder="请选择" />-->
      <!--      </el-form-item>-->
      <el-form-item label="隐患类型：" prop="HIDDENTYPE">
        <SelectTree
          ref="deptTree_Select3"
          :clearable="false"
          :options="hiddenTypeList"
          :props="defaultProps"
          v-model="pd.HIDDENTYPE"
          :canparent="false"
          children-name="nodes"
          style="width: 100%;"
          placeholder="请选择" />
      </el-form-item>
      <el-form-item label="是否相关方" prop="ISRELE">
        <el-radio v-model="pd.ISRELEVANT" label="1" value="1" >是</el-radio>
        <el-radio v-model="pd.ISRELEVANT" label="2" value="2" >否</el-radio>
      </el-form-item>
      <el-row>
        <el-form-item label="隐患位置" prop="LONGITUDE" >
          <el-row :gutter="12" type="flex" justify="space-between">
            <el-col :span="10">
              <el-input
                id="LONGITUDE"
                ref="LONGITUDE"
                v-model="pd.LONGITUDE"
                :readonly="true"
                :disabled="true"
                maxlength="255"
                placeholder="这里选择隐患经度..."
                title="隐患位置经度"
                @focus="chooseMap" />
            </el-col>
            <el-col :span="10">
              <el-input
                id="LATITUDE"
                ref="LATITUDE"
                :disabled="true"
                v-model="pd.LATITUDE"
                :readonly="true"
                maxlength="255"
                placeholder="这里选择隐患位置纬度..."
                title="隐患位置经度"
                @focus="chooseMap" />
            </el-col>
            <el-col :span="4" style="text-align: right">
              <el-button type="primary" icon="el-icon-add-location" plain @click="chooseMap">位置定位</el-button>
            </el-col>
          </el-row>
        </el-form-item>
      </el-row>
      <el-form-item label="隐患位置描述" prop="POSITIONDESC">
        <el-input v-model="pd.POSITIONDESC" placeholder="这里输入隐患位置描述..." />
      </el-form-item>

      <el-form-item label="隐患图片" class="is-required">
        <el-upload
          ref="upload"
          :file-list="hImgs"
          :limit="4"
          :on-remove="handleRemovePicture"
          :on-change="handleChangeIMG"
          :class="{hide:hideUpload}"
          :on-preview="handlePictureCardPreview"
          :before-upload="beforeHiddenUpload"
          :auto-upload="false"
          class="avatar-uploader"
          action="#"
          accept=".jpg,.jpeg,.png"
          list-type="picture-card">
          <i class="el-icon-plus" />
        </el-upload>
        <span class="red-tip">* 最多只能上传四张图片</span>
        <el-dialog :visible.sync="dialogVisible">
          <img :src="dialogImageUrl" width="100%" alt="">
        </el-dialog>
      </el-form-item>
      <el-form-item label="隐患视频">
        <el-upload
          ref="videoUpload"
          :on-remove="handleRemoveVideo"
          :on-error="handleUploadVideoError"
          :on-exceed="handleUploadVideoExceed"
          :before-upload="beforeVideoFileUpload"
          :file-list="fileList"
          :limit="1"
          accept=".mp4"
          class="upload-demo"
          action="#"
          multiple>
          <div>
            <el-button size="small" type="primary" style="width:110px">点击上传</el-button>
            <span class="red-tip">* 只能上传mp4文件.最大上传50M</span>
          </div>
        </el-upload>
      </el-form-item>
      <el-form-item label="隐患处置">
        <el-radio-group v-model="pd.RECTIFICATIONTYPE">
          <el-radio v-if="pd.HIDDENLEVEL !='jdyh001' && pd.HIDDENLEVEL !='hiddenLevel2002'" v-model="pd.RECTIFICATIONTYPE" label="1">立即整改</el-radio>
          <el-radio v-model="pd.RECTIFICATIONTYPE" label="2">限期整改</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item v-if="pd.RECTIFICATIONTYPE==1" :prop="pd.RECTIFICATIONTYPE==1?'RECTIFYDESCR':''" label="整改描述">
        <el-input v-model="pd.RECTIFYDESCR" placeholder="这里输入整改描述..." />
      </el-form-item>
      <el-form-item v-if="pd.RECTIFICATIONTYPE==1" label="整改后图片">
        <el-upload
          ref="upload1"
          :file-list="rImgs"
          :limit="4"
          :on-preview="handlePictureCardPreview"
          :before-upload="beforeRectifyUpload"
          :auto-upload="false"
          class="avatar-uploader"
          action="#"
          accept=".jpg,.jpeg,.png"
          list-type="picture-card">
          <i class="el-icon-plus" />
        </el-upload>
        <el-dialog :visible.sync="dialogVisible">
          <img :src="dialogImageUrl" width="100%" alt="">
        </el-dialog>
      </el-form-item>
      <el-row class="form-group input-group-sm">
        <el-col :span="11">
          <el-form-item label="隐患发现部门">
            <SelectTree
              ref="deptTree"
              :key="modelKey"
              :clearable="false"
              :options="treeData"
              :props="defaultProps"
              v-model="myUserInfo.DEPARTMENT_ID"
              placeholder="请选择隐患发现部门"
              @change="updateFindDep(myUserInfo.DEPARTMENT_ID)"
            />
          </el-form-item>
        </el-col>
        <el-col :span="11">
          <el-form-item label="隐患发现人">
            <el-select v-model="myUserInfo.USER_ID" clearable placeholder="请选择隐患发现人" @visible-change="$forceUpdate()">
              <el-option v-for="item in findUserList" :key="item.USER_ID" :label="item.NAME" :value="item.USER_ID" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="隐患发现时间">
            <el-date-picker
              v-model="pd.DISCOVERYTIME"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
              format="yyyy-MM-dd HH:mm:ss"
              style="width: 100%"
              placeholder="选择日期"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row v-if="pd.HIDDENLEVEL !='jdyh001' && pd.HIDDENLEVEL !='hiddenLevel2002'" class="form-group input-group-sm">
        <el-col :span="24">
          <el-form-item label="隐患确认人" prop="CONFIRM_USER">
            <el-select v-model="pd.CONFIRM_USER" clearable placeholder="请选择隐患确认人" style="width: 100%;" @visible-change="$forceUpdate()">
              <el-option v-for="item in confirmUserList" :key="item.USER_ID" :label="item.NAME" :value="item.USER_ID" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item v-if="pd.RECTIFICATIONTYPE==2 &&pd.HIDDENLEVEL !='jdyh001' && pd.HIDDENLEVEL !='hiddenLevel2002'" :prop="pd.RECTIFICATIONTYPE==2?'RECTIFICATIONDEADLINE':''" label="整改期限">
        <el-date-picker v-model="pd.RECTIFICATIONDEADLINE" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%" type="date" placeholder="这里输入整改期限" />
      </el-form-item>
      <el-row v-if="pd.HIDDENLEVEL !='jdyh001' && pd.HIDDENLEVEL !='hiddenLevel2002'" >
        <el-col :span="12">
          <el-form-item v-if="pd.RECTIFICATIONTYPE==2" :prop="pd.RECTIFICATIONTYPE==2?'DEPARTMENT_ID':''" label="整改部门">
            <SelectTree
              ref="rectifyDeptTree"
              :clearable="false"
              :options="treeData"
              :props="defaultProps"
              v-model="pd.DEPARTMENT_ID"
              style="width: 100%;"
              placeholder="请选择整改部门"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item v-if="pd.RECTIFICATIONTYPE==2" :prop="pd.RECTIFICATIONTYPE==2?'RECTIFICATIONOR':''" label="整改人">
            <el-select v-model="pd.RECTIFICATIONOR" style="width: 100%;" clearable placeholder="请选择">
              <el-option v-for="item in rectifyUserList" :key="item.USER_ID" :label="item.NAME" :value="item.USER_ID" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row v-for="(data,index) in repulsecause" :key="index" class="form-group input-group-sm">
        <el-col v-if="pd.STATE == '16'" :span="11">
          <el-form-item label="打回原因：">
            <el-input v-model="data.REPULSE_CAUSE" :disabled="true" placeholder="请输入内容" />
          </el-form-item>
        </el-col>
        <el-col v-if="pd.STATE == '16'" :span="11">
          <el-form-item label="打回时间：">
            <el-input v-model="data.OPERATTIME" :disabled="true" placeholder="请输入内容" />
          </el-form-item>
        </el-col>
      </el-row>
      <!--      <el-form-item v-if="pd.RECTIFICATIONTYPE==2" :prop="pd.RECTIFICATIONTYPE==2?'RECTIFICATIONOR':''" label="整改人">-->
      <!--        <el-select v-model="pd.RECTIFICATIONOR" clearable placeholder="请选择">-->
      <!--          <el-option v-for="item in userList" :key="item.USER_ID" :label="item.NAME" :value="item.USER_ID" />-->
      <!--        </el-select>-->
      <!--      </el-form-item>-->
    </el-form>
    <div class="ui-height" />
    <div class="ui-foot">
      <el-button type="primary" icon="el-icon-arrow-left" plain @click="goBack">返回</el-button>
      <el-button type="primary" @click="confirm">确 定</el-button>
    </div>
    <el-dialog :visible.sync="dialogMap" :title="'确认隐患位置'" width="80%">
      <div>
        <iframe :src="iframeSrc" frameborder="0" allowtransparency="true" width="100%" height="600"/>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { requestFN } from '@/utils/request'
import { upload } from '@/utils/upload'
import SelectTree from '@/components/SelectTree'
import dateformat from '@/utils/dateformat.js'
export default {
  components: { SelectTree },
  data() {
    return {
      uploadDisabled: false,
      ccfile: '',
      hideUpload: false, // 显示图片
      config: config,
      dialogImageUrl: '',
      dialogVisible: false,

      pd: {
        HIDDENDESCR: '',
        HIDDENPART: null,
        RECTIFYDESCR: '',
        RECTIFICATIONDEADLINE: '',
        RECTIFICATIONTYPE: '2',
        RECTIFICATIONOR: '',
        HIDDENLEVEL: null,
        HIDDENTYPE: null,
        DEPARTMENT_ID: '',
        RECTIFICATIONDEPT: '',
        SOURCE: '1',
        HAVESCHEME: 0,
        CONFIRM_USER: '',
        DISCOVERYTIME: dateformat(new Date(), 'YYYY-MM-DD HH:mm:ss'),
        ISRELEVANT: '2'
      },
      hImgs: [],
      rImgs: [],
      userList: [],
      treeData: [],
      repulsecause: [],
      defaultProps: {
        value: 'id',
        children: 'nodes',
        label: 'name'
      },
      hiddenlevelList: [],
      normalizer(node) {
        return {
          id: node.id,
          label: node.name,
          children: node.nodes
        }
      },
      msg: 'add',
      rectify_files: [],
      hidden_files: [],
      rules: {
        HIDDENDESCR: [{ required: true, message: '隐患描述不能为空', trigger: 'blur' }],
        // HIDDENPART: [{ required: true, message: '隐患部位不能为空', trigger: 'blur' }],
        HIDDENLEVEL: [{ required: true, message: '隐患级别不能为空', trigger: 'blur' }],
        HIDDENTYPE: [{ required: true, message: '隐患类型不能为空', trigger: 'blur' }],
        // RECTIFICATIONDEADLINE: [{ required: true, message: '整改期限不能为空', trigger: 'blur' }],
        // DEPARTMENT_ID: [{ required: true, message: '整改部门不能为空', trigger: 'blur' }],
        // RECTIFICATIONOR: [{ required: true, message: '整改人不能为空', trigger: 'blur' }],
        RECTIFYDESCR: [{ required: true, message: '整改描述不能为空', trigger: 'blur' }],
        CONFIRM_USER: [{ required: true, message: '确认人不能为空', trigger: 'blur' }],
        ISRELEVANT: [{ required: true, message: '是否相关方不能为空', trigger: 'blur' }]
        // LONGITUDE: [{ required: true, message: '隐患位置不能为空', trigger: 'blur' }]
      },
      hiddenTypeList: [],
      hiddenType2List: [],
      hiddenPartType: 'select',
      hiddenPartList: [],
      fileList: [],
      myUserInfo: {},
      findCreatorList: [],
      findUserList: [],
      rectifyUserList: [],
      confirmUserList: [], // 隐患确认人
      isClearRectificationor: true, // 是否清空整改人
      iframeSrc: '',
      dialogMap: false,
      modelKey: 0
    }
  },
  watch: {
    'pd.DEPARTMENT_ID': {
      handler: function(newVal, oldVal) {
        if (this.isClearRectificationor) {
          this.pd.RECTIFICATIONOR = ''
        }
        this.getReUserList(newVal)
        this.isClearRectificationor = true
      }
    },
    'pd.RECTIFICATIONTYPE': {
      handler: function() {
        if (this.pd.RECTIFICATIONTYPE == 2) {
          this.rules.RECTIFYDESCR = [{ required: false, message: '整改描述不能为空', trigger: 'blur' }]
          this.$refs['form'].validateField('RECTIFYDESCR')
        } else if (this.pd.RECTIFICATIONTYPE == 1) {
          this.$refs['form'].validateField('RECTIFICATIONOR')
          this.rules.RECTIFYDESCR = [{ required: true, message: '整改描述不能为空', trigger: 'blur' }]
        }
      }
    },
    'pd.HIDDENLEVEL': {
      handler: function() {
        // eslint-disable-next-line no-empty
        if (this.pd.HIDDENLEVEL == 'jdyh001' || this.pd.HIDDENLEVEL == 'hiddenLevel2002') {

        }
      }
    }

  },
  created() {
    this.getTreeList()
    this.getEditMyInfo()
    this.getHiddenReginTreeList()
    this.getDict()
    this.updateConfirmDept()
    if (this.$parent.HIDDEN_ID) {
      this.getData(this.$parent.HIDDEN_ID)
    }
  },
  mounted() {
    const that = this
    window.addEventListener('message', function(e) {
      that.pd.LONGITUDE = e.data.LONGITUDE
      that.pd.LATITUDE = e.data.LATITUDE
      that.dialogMap = false
    })
  },
  methods: {
    handleRemove(file, fileList) {
      console.log(file)
      console.log(fileList)
      this.hideUpload = fileList.length >= 4
      this.$confirm('确定要删除吗?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        requestFN(
          '/imgfiles/delete',
          {
            IMGFILES_ID: file.IMGFILES_ID
          }
        ).then(() => {
          this.$message({
            message: '删除成功',
            type: 'success'
          })
        }).catch((e) => {
        })
      }).catch(() => {
      })
    },
    handleChangeIMG(file, fileList) {
      const types = ['image/jpeg', 'image/jpg', 'image/png']
      const isImage = types.includes(file.raw.type)
      if (!isImage) {
        this.$message.error('上传图片只能是 JPG、JPEG、PNG 格式!')
        fileList.pop()
      }
      this.hideUpload = fileList.length >= 4
    },
    getData(hiddenId) {
      this.listLoading = true
      requestFN(
        '/hiddenApi/getHiddenById',
        {
          HIDDEN_ID: hiddenId,
          tm: new Date().getTime()
        }
      ).then((data) => {
        var vm = this
        vm.pd = data.hidden							// 参数map
        if (vm.pd.HIDDENPART === '') {
          this.pd.HIDDENPART = null
        }
        vm.hs = data.hs							// 参数map
        vm.checkList = data.checkList
        this.hImgs = []
        for (let i = 0; i < data.hImgs.length; i++) {
          this.hImgs.push({
            url: config.fileUrl + data.hImgs[i].FILEPATH,
            FOREIGN_KEY: data.hImgs[i].FOREIGN_KEY,
            IMGFILES_ID: data.hImgs[i].IMGFILES_ID,
            TYPE: data.hImgs[i].TYPE
          })
        }
        this.rImgs = []
        this.repulsecause = data.repulsecause
        for (let i = 0; i < data.rImgs.length; i++) {
          this.rImgs.push({
            url: config.fileUrl + data.rImgs[i].FILEPATH,
            FOREIGN_KEY: data.rImgs[i].FOREIGN_KEY,
            IMGFILES_ID: data.rImgs[i].IMGFILES_ID,
            TYPE: data.rImgs[i].TYPE
          })
        }
        this.sImgs = data.sImgs
        this.hiddenFindPeople = data.hiddenFindPeople
        if (data.hiddenVideo.length > 0) {
          this.playerOptions.sources[0].src = config.fileUrl + data.hiddenVideo[0].FILEPATH
        }
        this.hiddenExamineList = data.hiddenExa
        if (data.hiddenExa.length > 0) {
          data.hiddenExa.forEach(item => {
            if (item.TYPE === 0) {
              this.pd.oldUserName = item.editUserName
              this.pd.oldDeptName = item.editDeptName
              this.pd.oldLevelName = item.editLevelName
              this.pd.oldRectificationDeadline = item.spare3
              return
            }
          })
        }
      }).catch((e) => {
        this.listLoading = false
      })
    },
    getEditMyInfo() { // 获取登录人信息
      requestFN(
        '/user/goEditMyInfo',
        {}
      ).then(async(data) => {
        this.myUserInfo.DEPARTMENT_ID = data.pd.DEPARTMENT_ID
        this.modelKey++ // 为了触发级联选择器重新渲染
        if (data.pd.DEPARTMENT_ID) {
          await this.getFindUserListByDepId(data.pd.DEPARTMENT_ID)
        }
        this.myUserInfo.USER_ID = data.pd.USER_ID
        this.$forceUpdate()
      }).catch((e) => {

      })
    },
    // 提交
    confirm() {
      if (this.pd.RECTIFICATIONTYPE == 2 && this.$refs.upload.uploadFiles.length < 1) {
        this.$message({
          message: '请上传隐患图片',
          type: 'error'
        })
        return false
      }
      if (this.pd.CONFIRM_USER == '' && this.pd.HIDDENLEVEL != 'jdyh001' && this.pd.HIDDENLEVEL != 'hiddenLevel2002') {
        this.$message({
          message: '请选择确认人',
          type: 'error'
        })
        return false
      }
      if (this.pd.RECTIFICATIONTYPE == 1) {
        if (this.$refs.upload.uploadFiles.length < 1) {
          this.$message({
            message: '请上传隐患图片',
            type: 'error'
          })
          return false
        }
        if (this.$refs.upload1.uploadFiles.length < 1) {
          this.$message({
            message: '请上传整改后图片',
            type: 'error'
          })
          return false
        }
      }
      this.pd.RECTIFICATIONDEPT = this.pd.DEPARTMENT_ID
      var findCreator = ''
      if (this.findCreatorList) {
        this.findCreatorList.forEach((row, index) => {
          findCreator += this.findCreatorList[index].USER_ID + ','
        })
      }
      this.pd.findCreator = findCreator
      this.pd.hiddenPartType = this.hiddenPartType
      this.pd.hiddenFindCreator = this.myUserInfo.USER_ID
      this.$refs.form.validate(valid => {
        if (this.pd.HIDDEN_ID) {
          if (valid) {
            requestFN(
              '/hidden/edit',
              this.pd,
            ).then((data) => {
              this.pd = Object.assign({}, data.pd)
              this.$refs.upload.submit()
              this.uploadImg()
              this.uploadVideo()
              this.$message({
                message: '操作成功',
                type: 'success'
              })
              this.listLoading = false
              this.goBack()
            }).catch((e) => {
              this.listLoading = false
            })
          } else {
            return false
          }
        } else {
          if (valid) {
            requestFN(
              '/hiddenApi/addHidden',
              this.pd,
            ).then((data) => {
              if (data.result == 'fail') {
                this.$message({
                  message: data.codeMsg,
                  type: 'error'
                })
                return false
              }
              this.pd = Object.assign({}, data.pd)
              this.$refs.upload.submit()
              this.uploadImg()
              if (this.pd.RECTIFICATIONTYPE == 1) {
                this.$refs.upload1.submit()
                this.uploadRectifyImg()
              }
              this.uploadVideo()
              this.$message({
                message: '操作成功',
                type: 'success'
              })
              this.listLoading = false
              this.goBack()
            }).catch((e) => {
              this.listLoading = false
            })
          } else {
            return false
          }
        }
      })
    },
    getUserList() {
      requestFN(
        '/user/listAll',
        {
          DEPARTMENT_ID: this.pd.DEPARTMENT_ID
        }
      ).then((data) => {
        this.userList = data.userList
      })
    },
    getTreeList() {
      requestFN(
        '/department/listTree',
        {}
      ).then((data) => {
        this.treeData = JSON.parse(data.zTreeNodes)
      }).catch((e) => {
      })
    },
    // 上传隐患照片
    uploadImg() {
      var _this = this
      const formData = new FormData()
      for (var i = 0; i < _this.hidden_files.length; i++) {
        if (_this.hidden_files[i]) {
          formData.append('FFILE', _this.hidden_files[i])
        }
      }
      formData.append('FOREIGN_KEY', _this.pd.HIDDEN_ID)
      formData.append('TYPE', 3)
      upload(
        '/imgfiles/add',
        formData
      ).then((data) => {
        if (_this.pd.RECTIFICATIONTYPE == 2) {
          _this.goBack()
        }
      }).catch((e) => {
        _this.listLoading = false
      })
    },
    // 上传整改照片
    uploadRectifyImg() {
      const formData = new FormData()
      for (var i = 0; i < this.rectify_files.length; i++) {
        if (this.rectify_files[i]) {
          formData.append('FFILE', this.rectify_files[i])
        }
      }
      formData.append('FOREIGN_KEY', this.pd.HIDDEN_ID)
      formData.append('TYPE', 4)
      upload(
        '/imgfiles/add',
        formData
      ).then((data) => {
        this.goBack()
      }).catch((e) => {
        this.listLoading = false
      })
    },
    beforeHiddenUpload(file) {
      const types = ['image/jpeg', 'image/jpg', 'image/png']
      const isImage = types.includes(file.type)
      if (!isImage) {
        this.$message.error('上传图片只能是 JPG、JPEG、PNG 格式!')
        return false
      } else {
        this.hidden_files.push(file)
      }
    },

    beforeRectifyUpload(file) {
      const types = ['image/jpeg', 'image/jpg', 'image/png']
      const isImage = types.includes(file.type)
      if (!isImage) {
        this.$message.error('上传图片只能是 JPG、JPEG、PNG 格式!')
        return false
      } else {
        this.rectify_files.push(file)
      }
    },
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url
      this.dialogVisible = true
    },
    goBack() {
      this.$parent.activeName = 'List'
    },
    // 获取数据字典数据
    getDict: function() {
      requestFN(
        '/dictionaries/listSelectTree',
        {
          DICTIONARIES_ID: '5e7cf8620ba54ad89719d0be62133c7a'
        }
      ).then((data) => {
        this.hiddenlevelList = JSON.parse(data.zTreeNodes)
        this.hiddenlevelList.forEach((itemFirst, i) => {
          itemFirst.nodes.forEach((itemSecond, j) => {
            if (itemSecond.DICTIONARIES_ID === 'a9d916b5a17848c1b15e8b821c24bf6e') { // 忽略隐患、较大隐患、重大隐患 第二级
              itemFirst.nodes.splice(j, 1)
            }
          })
        })
      })
      requestFN(
        '/dictionaries/listSelectTree',
        {
          DICTIONARIES_ID: '3babc15144444bdc8d763d0af2bdfff6'
        }
      ).then((data) => {
        this.hiddenTypeList = JSON.parse(data.zTreeNodes)
      })
      requestFN(
        '/dictionaries/listSelectTree',
        {
          DICTIONARIES_ID: '18c0a9aea6e54feab9f4ab3f46e0bc86'
        }
      ).then((data) => {
        this.hiddenType2List = JSON.parse(data.zTreeNodes)
      })
    },
    // 获取隐患部位 下拉树
    getHiddenReginTreeList() {
      this.treeLoading = true
      requestFN(
        '/hiddenRegion/listAll',
        {
        }
      ).then((data) => {
        this.treeLoading = false
        this.hiddenPartList = JSON.parse(data.zTreeNodes)
      }).catch((e) => {
        this.treeLoading = false
      })
    },
    handleRemoveVideo(file, fileList) { // 文件列表移除文件时的钩子
      this.fileList = []
    },
    handleRemovePicture(file, fileList) { // 图片列表移除文件时的钩子
      this.hImgs = []
    },
    // eslint-disable-next-line handle-callback-err
    handleUploadVideoError(err, file, fileList) {
      this.fileList = fileList
      file.status = 'success'
      this.fileList.push(file)
    },
    handleUploadVideoExceed(file, fileList) { // 文件超出个数限制时的钩子
      this.$message.warning('只能上传一个视频！')
    },
    beforeVideoFileUpload(file) {
      const types = ['video/mp4']
      const isImage = types.includes(file.type)
      const isLt500M = file.size / 1024 / 1024 < 50
      if (this.fileList.length > 0) {
        this.$message.error('文件超出个数限制!')
        return false
      }
      if (!isImage) {
        this.$message.error('上传视频只能是 MP4 格式!')
        return false
      } else if (!isLt500M) {
        this.$message.error('上传视频大小不能超过 50MB!')
        return false
      } else {
        this.fileList.push(file)
        this.$forceUpdate()
        return true
      }
    },
    // 上传隐患视频
    uploadVideo() {
      const formData = new FormData()
      for (var i = 0; i < this.fileList.length; i++) {
        if (this.fileList[i]) {
          formData.append('FFILE', this.fileList[i])
        }
      }
      formData.append('FOREIGN_KEY', this.pd.HIDDEN_ID)
      formData.append('TYPE', 102)
      upload(
        '/imgfiles/addVideo',
        formData
      ).then((data) => {
      }).catch((e) => {
        this.listLoading = false
      })
    },
    addFindOther() { // 添加隐患发现人
      var o = { 'DEPARTMENT_ID': '', 'USER_ID': '' }
      this.findCreatorList.push(o)
    },
    remoFindOther(index) { // 删除隐患发现人员
      this.findCreatorList.splice(index, 1)
    },
    // updateFindOtherDep(DEPARTMENT_ID, i) { // 点击发现部门
    //   this.findCreatorList[i].USER_ID = ''
    //   this.getFindUserList(DEPARTMENT_ID, i)
    // },
    updateFindDep(DEPARTMENT_ID) {
      this.myUserInfo.USER_ID = ''
      this.getFindUserListByDepId(DEPARTMENT_ID)
    },
    getFindUserListByDepId(DEPARTMENT_ID) {
      return new Promise((resolve) => {
        this.listLoading = true
        requestFN(
          '/user/listAll',
          {
            DEPARTMENT_ID: DEPARTMENT_ID,
            tm: new Date().getTime()
          }
        ).then((data) => {
          this.findUserList = data.userList
          this.$forceUpdate()
          resolve()
        }).catch((e) => {
          this.listLoading = false
        })
      })
    },
    // getFindUserList(DEPARTMENT_ID, index) { // 获取发现发现部门的人员信息
    //   this.listLoading = true
    //   requestFN(
    //     '/user/listAll',
    //     {
    //       DEPARTMENT_ID: DEPARTMENT_ID,
    //       tm: new Date().getTime()
    //     }
    //   ).then((data) => {
    //     this.$set(this.findUserList, index, data.userList)
    //   }).catch((e) => {
    //     this.listLoading = false
    //   })
    // },
    updateConfirmDept() { // 根据选择的隐患确认部门显示隐患确认人
      this.pd.CONFIRM_USER = ''
      this.listLoading = true
      requestFN(
        '/user/getHiddenConfirm',
        {
          tm: new Date().getTime(),
          IS_HAZARDCONFIRMER: '1'
        }
      ).then((data) => {
        this.confirmUserList = data.userList
      }).catch((e) => {
        this.listLoading = false
      })
    },
    hiddenPartTypeBtn() {
      this.pd.HIDDENPART = ''
      this.hiddenPartType = (this.hiddenPartType == 'select') ? 'value' : 'select'
    },
    // 获取整改人列表
    getReUserList(DEPARTMENT_ID) {
      if (DEPARTMENT_ID) {
        requestFN(
          '/user/listAll',
          { DEPARTMENT_ID: DEPARTMENT_ID }
        ).then((data) => {
          this.rectifyUserList = data.userList
        }).catch((e) => {
        })
      }
    },
    chooseMap() { // 弹出地图
      this.dialogMap = true
      this.iframeSrc = this.config.weburl + 'static/maplocation.html?t=' + Math.random()
    }
  }
}
</script>

<style lang="sass">
  .el-row
    margin-bottom: 16px
    &:last-child
      margin-bottom: 0
      .form-group
        display: flex
        align-items: center
        margin-right: 20px
        .form-label
          padding: 9px 15px
          font-size: 14px
          width: 240px
          font-weight: 400
          line-height: 20px
          text-align: right
          margin-bottom: 0
          .star
            color: red
            padding-right: 4px
        .input-block
          flex: 1
          min-height: 36px
          position: relative

  .disContent
    padding: 0 20px
    display: flex
    align-items: center
    flex-wrap: wrap
    .img-div
      position: relative
      margin: auto 10px 10px 10px
      width: 120px
      height: 120px
      border-radius: 4px
      &>img
        width: 100%
        height: 100%

      .disContent-hide
        position: absolute
        width: 100%
        height: 100%
        border-radius: 4px
        background-color: rgba(48, 48, 48, 0.59)
        display: none
        top: 0
        left: 0

        .Delete
          position: absolute
          bottom: 14px
          right: 10px
          font-size: 16px
          color: white
          cursor: pointer

          .editCss
            .Delete
              font-size: 16px
              right: 90px

        .yuLan
          position: absolute
          bottom: 23px
          right: 50px
          font-size: 16px
          color: white
          cursor: pointer

        .yuLanImg
          position: absolute
          bottom: 0
          right: 0
          width: 100%
          height: 100%
          opacity: 0

    .img-div:hover .disContent-hide
      display: block

    .pitchCss
      border: 1px solid #202e78
      transition: all linear 0.1s
      width: 116px
      height: 116px
</style>
