<template>
  <ai-detail>
    <template #title>
      <ai-title :title="parentTaskCode ? '创建子任务' : '创建任务'" isShowBottomBorder isShowBack @onBackClick="onBack(true)"> </ai-title>
    </template>
    <template #content>
      <ai-card title="任务信息">
        <template slot="content">
          <el-form ref="formData" :rules="rules" :model="formData" label-width="90px">
            <!-- 任务类型 -->
            <el-form-item label="任务类型:" prop="type" style="width: 30%">
              <ai-select v-model="formData.type" placeholder="任务类型" :selectList="$dict.getDict('workTaskType')"></ai-select>
            </el-form-item>

            <!-- 发起人 -->
            <!-- <div class="especial">
              <span class="icon">*</span>
              <span class="people">发起人:</span>
              <ai-wechat-selecter isShowUser :instance="instance" v-model="formData.sponsorUserList" :isMultiple="false" :disable="sponsorUserListDisable">
              </ai-wechat-selecter>
              <span class="hint">(只能选择一人)</span>
            </div> -->

            <!-- 任务标题 -->
            <el-form-item label="任务标题:" prop="taskTitle">
              <el-input v-model="formData.taskTitle" placeholder="请输入任务标题" clearable :maxlength="30" show-word-limit></el-input>
            </el-form-item>

            <!-- 任务说明 -->
            <el-form-item label="任务说明:" prop="taskDescription">
              <el-input v-model="formData.taskDescription" placeholder="请输入任务说明" clearable :maxlength="1000" type="textarea" show-word-limit :rows="3"></el-input>
            </el-form-item>

            <!-- 截止日期 -->
            <el-form-item label="截止日期:" prop="lastTime">
              <el-date-picker v-model="formData.lastTime"  :picker-options="pickerOptions0" type="date" placeholder="请选择"  value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
            </el-form-item>

            <!-- 任务通知 -->
            <el-form-item label="任务通知:" prop="isNofity">
              <el-radio-group v-model="formData.isNofity">
                <el-radio :label="item.label" v-for="(item, i) in isNofityList" :key="i">{{ item.name }}</el-radio>
              </el-radio-group>
            </el-form-item>

            <!-- 任务文件 -->
            <el-form-item label="任务文件:" prop="taskFiles">
              <ai-uploader :instance="instance" @change="handleChange" isShowTip fileType="file"
                           acceptType=".zip,.rar,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.pdf,.txt,.jpg,.png" :limit="9"></ai-uploader>
            </el-form-item>

            <!-- 执行人 -->
            <div class="especial">
              <span class="icon">*</span>
              <span class="people">执行人:</span>
              <ai-wechat-selecter slot="append" isShowUser :instance="instance" v-model="formData.userInfoList" :disable="userInfoListDisable"></ai-wechat-selecter>
            </div>

            <!-- 督办人 -->
            <div class="especial">
              <span class="icon">&nbsp;</span>
              <span class="people">督办人:</span>
              <ai-wechat-selecter slot="append" isShowUser :instance="instance" v-model="formData.checkUserList" :disable="checkUserListDisable"></ai-wechat-selecter>
            </div>

            <div class="especial">
              <span class="icon">&nbsp;</span>
              <span class="people">抄送人:</span>
              <ai-wechat-selecter slot="append" isShowUser :instance="instance" v-model="formData.sendUserList" :disable="sendUserListDisable"></ai-wechat-selecter>
            </div>
          </el-form>
        </template>
      </ai-card>
    </template>
    <template  #footer>
      <el-button class="delete-btn footer-btn" @click="onBack">取消</el-button>
      <el-button class="footer-btn" type="primary" @click="submit('formData')">提交</el-button>
    </template>
  </ai-detail>
</template>

<script>
export default {
  name: 'Add',
  // 组件
  components: {},
  props: {
    instance: Function,
    params: Object,
    dict: Object,
    parentTaskCode: String, //创建子任务 父任务code
  },
  data() {
    return {
      formData: {
        type: '',
        taskTitle: '',
        taskDescription: '',
        lastTime: '',
        isNofity: '0',
        taskFiles: [],
        checkUserList: [], //督办人
        id: '',
        parentTaskCode: '', //上级任务编号
        sponsorUserList: [], // 发起人列表
        userInfoList: [], // 执行人列表
        sendUserList: [], //抄送人列表
      },
      rules: {
        type: [{ required: true, message: '请输入任务标题', trigger: 'change' }],
        taskTitle: [{ required: true, message: '请输入任务标题', trigger: 'change' }],
        taskDescription: [{ required: true, message: '请输入任务说明', trigger: 'change' }],
        lastTime: [{required: true, message: '请选择', trigger: 'change'}],
        isNofity: [{ required: true, message: '请选择任务通知', trigger: 'change' }],
      },
      isAdd: true,
      showDetail: false,
      pickerOptions0: {
        disabledDate(time) {
          return time.getTime() < Date.now() - 8.64e7;
        }
      },
      showEdit1: false
    }
  },
  // 计算
  computed: {
    isNofityList() {
      return [
        { name: '是', label: '1' },
        { name: '否', label: '0' },
      ]
    },
    sponsorUserListDisable() {
      return this.formData.userInfoList.concat(this.formData.checkUserList).concat(this.formData.sendUserList)
    },
    userInfoListDisable() {
      return this.formData.sponsorUserList.concat(this.formData.checkUserList).concat(this.formData.sendUserList)
    },
    checkUserListDisable() {
      return this.formData.userInfoList.concat(this.formData.sponsorUserList).concat(this.formData.sendUserList)
    },
    sendUserListDisable() {
      return this.formData.userInfoList.concat(this.formData.checkUserList).concat(this.formData.sponsorUserList)
    }
  },
  // 监听
  watch: {},
  // 实例创建后
  created() {
    this.dict.load('workTaskType').then(() => {})
  },
  mounted() {
    if(this.params.id) {
      this.getDetail()
    }
  },
  // 方法
  methods: {
    handleChange(e) {
      this.formData.taskFiles = e
    },
    // 提交
    submit() {
      var fileIds = []
      if(this.formData.taskFiles.length) {
        this.formData.taskFiles.map((item) => {
          fileIds.push(item.id)
        })
      }
      this.$refs['formData'].validate((valid) => {
        if (valid) {
          if(!this.formData.userInfoList.length) {
            this.$message.error('请选择执行人')
            return
          }
          this.formData.lastTime =this.formData.lastTime?this.formData.lastTime.substring(0,10) + ' 23:59:59':"";
          this.instance.post(`/app/appworktaskinfo/addOrUpdate`, {
            ...this.formData,
            fileIds: fileIds,
            taskFiles: '',
            id: null,
            parentTaskCode: this.parentTaskCode || ''
          }).then((res) => {
            if (res.code == 0) {
              this.$message.success('提交成功')
              setTimeout(() => {
                this.onBack(true)
              }, 600)
            }
          })
        }
      })
    },
    getDetail() {
      this.instance.post(`/app/appworktaskinfo/queryDetailById?id=${this.params.id}`, null).then((res) => {
        if (res.code == 0) {
          this.showDetail = true
          this.formData = {...res.data}
          this.formData.taskFiles = this.formData.fileList || []

          //选人置空 避免字段不一致
          this.formData.checkUserList = []
          this.formData.sponsorUserList = []
          this.formData.userInfoList = []
          this.formData.sendUserList = []
          this.formData.isNofity = '0'
        }
      });
    },

    // 返回按钮
    onBack(isRefresh) {
      if(this.parentTaskCode) {
        this.$emit('back')
      }else {
        this.$emit('change', {
          type: 'list',
          isRefresh: !!isRefresh,
        })
      }
    },
    downFileAll () {
      if (this.form.files.length > 0) {
        this.instance.post('/app/appofficialdocumentinfo/downLoadAllFileForDetail', null, {
          responseType: 'blob',
          params: {
            id: this.form.id
          }
        }).then((res) => {
          const link = document.createElement('a')
          let blob = new Blob([res], { type: 'application/vnd.ms-excel' })
          link.style.display = 'none'
          link.href = URL.createObjectURL(blob)
          var num = ''
          for (let i = 0; i < 10; i++) {
            num += Math.ceil(Math.random() * 10)
          }
          link.setAttribute('download', '公文文件' + '.zip')
          document.body.appendChild(link)
          link.click()
          document.body.removeChild(link)
        })
      } else {
        this.$message.error('暂无附件提供下载')
      }
    },
  },
}
</script>

<style scoped lang="scss">
  .especial {
    margin-bottom: 12px;
    .icon {
      vertical-align: top;
      display: inline-block;
      padding-top: 5px;
      margin-left: 20px;
      color: #f46;
    }
    .people {
      display: inline-block;
      font-size: 14px;
      color: #666;
      margin-right: 16px;
      vertical-align: top;
    }
    .AiWechatSelecter {
      display: inline-block;
      margin-left: 3px;
    }
    .hint {
      font-size: 14px;
      color: #999;
      margin-left: 16px;
    }
    .mar-r40{
      margin-right: 40px;
    }
    .w80{
      width: 80px;
      text-align: right;
      color: #888;
    }
  }
  .AiWechatSelecter{
    width: calc(100% - 120px);
  }
</style>
