<template>
  <div>
    <el-dialog title="请求协同" :visible.sync="visibleCollaboration" :close-on-click-modal="false" :before-close="close"
      class="sendCollaboration" width="600px" append-to-body>
      <div>
        <el-form :model="form" :rules="clientRules" ref="clientForm">

          <el-form-item label="协同人：" prop="headId">
            <el-select v-model="form.handler" placeholder="请选择协同人(只能选一名协同人)" style="width: 100%;" filterable remote
              :remote-method="remoteMethodPerson" v-SelectLazyLoading="lazyLoadingPerson"
              :loading="personnelList.loading">
              <el-option v-for="item in personnelList.data" :key="item.id" :label="item.name + '<' + item.email + '>'"
                :value="item.id" :disabled="item.id ? false : true">
                <span style="float: left">{{ item.name }}</span>
                <span style="float: left">
                  <{{ item.email }}>
                </span>
                <!-- <span style="float: right; color: #8492a6; font-size: 13px" v-if="!item.id">
                  <el-button size="small" @click="create(0)">创建</el-button>
                </span> -->
              </el-option>
            </el-select>
            <p style="position: absolute; right: 10px;top: 28px;width:20px"><i class="el-icon-circle-plus-outline"
                style="font-size:20px" @click="create(0)"></i></p>
          </el-form-item>

          <el-form-item label="抄送人：" prop="people">
            <el-select v-model="form.people" placeholder="请选择抄送人(可选择多名抄送人)" style="width: 100%;" filterable remote
              multiple :remote-method="remoteMethodPerson" v-SelectLazyLoading="lazyLoadingPerson"
              :loading="personnelList.loading">
              <el-option v-for="item in personnelList.data" :key="item.id" :label="item.name + '<' + item.email + '>'"
                :value="item.id">
                <span style="float: left">{{ item.name }}</span>
                <span style="float: left">
                  <{{ item.email }}>
                </span>
                <!-- <span style="float: right; color: #8492a6; font-size: 13px" v-if="!item.id"><el-button size="small"
                    @click="create(1)">创建</el-button></span> -->
              </el-option>
            </el-select>
            <p style="position: absolute; right: 10px;top: 28px;width:20px"><i class="el-icon-circle-plus-outline"
                style="font-size:20px" @click="create(1)"></i></p>
          </el-form-item>

          <el-form-item label="主题：" prop="name">
            <el-input v-model="form.name" type="text" placeholder="输入主题" />
          </el-form-item>

          <el-form-item label="完成日期：" prop="deadLineTime">
            <el-date-picker style="width:100%" v-model="form.deadLineTime" value-format="yyyy-MM-dd HH:mm:ss"
              type="datetime" placeholder="选择日期">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="备注：" prop="description">
            <el-input v-model="form.description" type="textarea" placeholder="输入备注" />
          </el-form-item>
        </el-form>
      </div>
      <div slot="footer" class="dialog-footer" style="display: flex;justify-content: flex-end;">
        <el-button @click="close">取 消</el-button>
        <el-button type="primary" @click="submit">发送</el-button>
      </div>
    </el-dialog>


    <el-dialog title="创建人员" :visible.sync="visiblePerson" :close-on-click-modal="false" width="500px" append-to-body>
      <el-form :model="createdPerson" :rules="createdPersonRules" ref="createdPerson">
        <el-form-item label="姓名 :" prop="name">
          <el-input v-model="createdPerson.name" placeholder="请输入姓名" />
        </el-form-item>
        <el-form-item label="邮箱 :" prop="email">
          <el-input v-model="createdPerson.email" placeholder=" 请输入邮箱" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="closeCreated">取 消</el-button>
        <el-button type="primary" @click="submitCreated">确定</el-button>
      </div>
    </el-dialog>

  </div>
</template>

<script>
import { personnelLoading } from '@/views/patentMining/components/mixins/index2'
export default {
  mixins: [personnelLoading],
  props: {
    // 信息(patentNo,reportId)
    patentNo: {},
    projectId: {},
    reportType: {
      default: 3//默认3fto报告
    },
  },
  components: {
    // checkPatent
  },
  data() {
    //校验协同人是否为空
    const isCollaborator = (rule, value, callback) => {
      if (!this.form.handler) {
        callback(new Error('请选择协同人'))
      } else {
        callback()
      }
    }
    const isEmail = (rule, value, callback) => {
      const mailReg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/;
      if (!this.createdPersonRules.email) {
        return callback(new Error("邮箱不能为空"));
      }
      setTimeout(() => {
        if (mailReg.test(value)) {
          callback();
        } else {
          callback(new Error("请输入正确的邮箱格式"));
        }
      }, 100);
    };
    const isTime = (rule, value, callback) => {
      if (this.isEndTime) {
        this.isEndTimes = Date.parse(new Date)
      }
      let b = Date.parse(value)
      if (value) {
        if (b <= this.isEndTimes) {
          callback(new Error('禁止选择现在及以前时间，请重新选择'))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    return {
      // 控制协同弹窗
      visibleCollaboration: false,
      // 协同表单
      form: {},
      // 协同弹窗的校验
      clientRules: {
        headId: [{ required: true, validator: isCollaborator, trigger: 'change' },],
        name: [{ required: true, message: "请输入主题", trigger: "blur" },],
        deadLineTime: [
          { required: false, validator: isTime, trigger: 'change' }
        ],
      },
      // 人员loading
      loading: false,
      // 创建外来人员的信息
      createdPerson: {},
      // 控制创建人员弹窗
      visiblePerson: false,
      // 创建人员弹窗的校验
      createdPersonRules: {
        name: [{ required: true, message: "请输入姓名", trigger: "blur" },],
        email: [{ required: true, validator: isEmail, trigger: "change" },],
      },
      isEndTime: true,
      isEndTimes: null,
      // 记录从哪里进入创建人员弹窗
      witchOne: null,
      isIf: false
    }
  },
  mounted() {

  },
  methods: {
    // 打开协同弹窗
    open(patentNoList) {
      if (patentNoList) {
        this.form.patentNos=patentNoList
      }
      this.visibleCollaboration = true
    },
    // 协同弹窗的关闭
    close() {
      this.isEndTime = true
      this.$refs.clientForm.resetFields()
      this.form = {}
      this.visibleCollaboration = false
    },
    // 协同弹窗的确定
    submit() {
      this.isEndTime = false
      this.$refs.clientForm.validate((valid) => {
        if (valid) {
          this.form.projectId = this.projectId//项目id
          // 判断是否为外部人员
          if (this.form.handler.includes('@')) {//是邮箱为1
            this.form.handlerType = 1
          } else {//是id为0
            this.form.handlerType = 0
          }
          this.people()
          this.form.type = 4 //4为协同任务类型
          // 协同
          if (this.reportType == 3) {//fto
            this.$api.addFTOAssItTask(this.form).then(res => {
              if (res.code == 200) {
                this.$message.success('发送协同任务成功')
                this.close()
              }
            })
          } else {
            // 侵权分析的协同
            this.$api.addTortTask(this.form).then(res => {
              if (res.code == 200) {
                this.$message.success('发送协同任务成功')
                this.close()
              }
            })
          }


        }
      })
    },
    // 处理协同人数据
    people() {
      if (this.form.people && this.form.people.length > 0) {
        this.form.ccPeople = []
        var ifInner = ''
        this.form.people.forEach(item => {
          if (item.includes('@')) {//是邮箱为1
            ifInner = 1
          } else {//是id为0
            ifInner = 0
          }
          let obj = {
            personId: item,
            ifInner: ifInner
          }
          this.form.ccPeople.push(obj)
        })
      } else {
        this.form.ccPeople = []
      }
    },
    // 创建人员弹窗的关闭
    closeCreated() {
      this.$refs.createdPerson.resetFields()
      this.createdPerson = {}
      this.visiblePerson = false
    },
    // 创建人员弹窗的确定
    submitCreated() {//handler
      this.$refs.createdPerson.validate((valid) => {
        if (valid) {
          let name = this.createdPerson.name + '<' + this.createdPerson.email + '>'
          if (this.witchOne == 1) {
            this.form.people.push(name)
          } else {
            this.form.handler = name
          }
          this.closeCreated()
        }
      })
    },
    create(key) {
      this.witchOne = key
      this.visiblePerson = true
    },
  },
}
</script>

<style lang="scss" scoped></style>