<template>
  <div>
    <dee-as-com
      ref="applyTable"
      class="list-table"
      :basic-data="{ selectData,selectionRows }"
      :lay-config="{ typeName: 'OutStorageUse', layKey: 'outStorageUseApplyList' }"
      @tableToolHandler="tableToolHandler"
      @selectionChange="selectionChange"
    />
    <dee-dialog
      title="发起领用申请"
      :dialog-visible="dialogVisible"
    >
      <div style="margin-bottom: 20px;font-size: 14px;font-weight: bolder;">确认提交吗?</div>
      <div style="text-align: center;">
        <el-button type="primary" @click="confirm">确 定</el-button>
        <el-button @click="cancle">取 消</el-button>
      </div>
    </dee-dialog>
    <dee-dialog
      title="选择审批领导"
      :dialog-visible="setPersonVisible"
    >
      <dee-form
        ref="form"
        label-width="100"
        :form="form"
        :form-data="formData"
        :rules="rules"
      >
        <el-button type="primary" @click="setPersonConfirm">确 定</el-button>
        <el-button @click="setPersonCancle">取 消</el-button>
      </dee-form>
    </dee-dialog>
  </div>
</template>

<script>
import { post } from '@/utils/http'

export default {
  name: 'UseApply',
  componentName: '领用申请',
  components: { },
  props: {
    selectData: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      dialogVisible: false,
      setPersonVisible: false,
      selectionRows: [],
      form: {},
      formData: [{
        split: 1,
        data: [
          {
            title: '设置审批领导',
            key: 'userIds',
            component: {
              clearable: true,
              name: 'el-select',
              placeholder: '请选择',
              multiple: true,
              options: []
            }
          }]
      }],
      rules: {
        userIds: [
          {
            required: true,
            message: '请填写审批领导',
            trigger: ['blur', 'change']
          }
        ]
      }
    }
  },
  created() {
    const httpParams = {
      'pageFrom': 1,
      'pageSize': 9999,
      'searchItems': {
        'children': [],
        'items': [
          {
            'fieldName': 'source.name',
            'operator': 'IN',
            'value': ['项目部审批人员']
          }
        ],
        'operator': 'AND'
      },
      'openProps': [
        {
          'name': 'source',
          'pageFrom': 1,
          'pageSize': 9999
        },
        {
          'name': 'target',
          'pageFrom': 1,
          'pageSize': 9999
        }
      ],
      'sortItem': [
        {
          'fieldName': 'modifyTime',
          'sortOrder': 'desc'
        }
      ]
    }
    post('/DxGroupMemberLink/search', httpParams).then(res => {
      const arr = []
      const ids = []
      res.items.content.forEach(item => {
        if (ids.indexOf(item.target.id) === -1) {
          ids.push(item.target.id)
          arr.push({
            value: item.target.id,
            label: item.target.name + '/' + item.target.number
          })
        }
      })
      this.formData[0].data.forEach(item => {
        if (item.key === 'userIds') {
          item.component.options = arr
        }
        /**
          item.key === 'userIds' && (item.component.options = arr.map(row => {
            return {
              value: row.value,
              label: row.label
            }
          }
          ))
          */
      })
    }).catch((err) => {
      console.log(err)
    })
  },
  methods: {
    tableToolHandler(e) {
      console.log(e.key.btnValue)
      if (e.key.btnValue === 'UseApply') {
        this.useApply()
      }
    },
    useApply() {
      this.dialogVisible = true
    },
    confirm() {
      let isUrgentUse = 0
      this.selectionRows.forEach(item => {
        if (item.typeName !== 'UrgentUse') {
          isUrgentUse++
        }
      })
      if (isUrgentUse === 0) {
        // 紧急领用选人
        this.dialogVisible = false
        this.setPersonVisible = true
      } else if (isUrgentUse === this.selectionRows.length) {
        post('/OutStorageRequest/outStorageOut/submit?applyIds=' + this.selectionRows.map(item => Number(item.id))).then(res => {
          this.$utils.showMessageSuccess('提交成功')
          this.$refs.applyTable.$refs.asCom.getData()
        }).catch(() => {
          this.$utils.showMessageWarning('出现异常,提交失败')
        }).finally(() => {
          this.dialogVisible = false
        })
      } else {
        this.dialogVisible = false
        this.$utils.showMessageWarning('紧急领用不能和其他领用类型一起提交')
      }
    },
    cancle() {
      this.dialogVisible = false
    },
    setPersonConfirm() {
      const ids = []
      if (this.selectionRows && this.selectionRows.length) {
        this.selectionRows.forEach(item => ids.push(item.id))
      }
      if (this.form.userIds && this.form.userIds.length !== 0) {
        post('/OutStorageRequest/creator/apply?userIds=' + this.form.userIds, ids).then(res => {
          this.$utils.showMessageSuccess('提交成功')
          setTimeout(() => {
            this.$refs.applyTable.$refs.asCom.getData()
          }, 1500)
        }).catch(err => {
          this.$utils.showMessageWarning('出现异常,提交失败')
          console.log(err)
        }).finally(() => {
          this.dialogVisible = false
          this.setPersonVisible = false
          this.$set(this.form, 'userIds', '')
        })
      } else {
        this.$utils.showMessageWarning('请选择审批领导')
      }
    },
    setPersonCancle() {
      this.setPersonVisible = false
      this.$set(this.form, 'userIds', '')
    },
    selectionChange(val) {
      this.selectionRows = val
    }
  }
}
</script>

  <style></style>