xiaoshi_system/src/views/patentMining/components/dialog/createTask.vue

<template>
  <!-- 创建挖掘任务弹窗 -->
  <div class="createTask">
    <el-dialog :title="title" :visible.sync="dialogVisible" width="500px" :before-close="handleClose"
      :append-to-body="true" :close-on-click-modal="false">
      <el-form :model="form" status-icon :rules="rules" ref="form" label-width="120px" class="demo-ruleForm">
        <el-form-item label="任务名称：" prop="name">
          <el-input v-model="form.name" placeholder="请输入任务名称" :disabled="form.id ? true : false"></el-input>
        </el-form-item>
        <el-form-item v-if="form.type != 1" label="任务流程：" prop="processId">
          <el-select v-model="form.processId" placeholder="请选择流程" style="width: 100%;" :disabled="form.id ? true : false">
            <el-option v-for="item in pathOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="处理人：" prop="handler">
          <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" :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="截止时间：" prop="deadLineTime">
          <el-date-picker style="width: 100%" v-model="form.deadLineTime" type="datetime"
            value-format="yyyy-MM-dd HH:mm:ss" placeholder="请选择截止日期时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="备注：">
          <el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="form.description"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="handleClose">取 消</el-button>
        <el-button type="primary" @click="submit">确 定</el-button>
      </span>
    </el-dialog>

  </div>
</template>

<script>
import { personnelLoading, optionsData } from '../mixins/index2'
export default {
  mixins: [personnelLoading, optionsData],
  components: {},
  props: ['projectId', 'processId'],
  data() {
    return {
      dialogVisible: false,
      title: '',
      form: {},
      rules: {},
      personOptions: [],//处理人
      rules: {
        name: [{ required: true, message: '请输入任务名称', trigger: 'blur' },],
        processId: [{ required: true, message: '请选择流程', trigger: 'change' },],
        handler: [{ required: true, message: '请选择处理人', trigger: 'change' },],
        deadLineTime: [{ required: true, message: '请选择截止时间', trigger: 'change' },],
      }
    };
  },
  watch: {},
  computed: {},
  created() { },
  mounted() { },
  methods: {
    //打开弹窗
    async open(data) {
      if (data.type == 6 || data.type == 5 || data.type == 1 || data.type == 7) {
        if (data.type == 6) {
          this.title = '编辑文件分配任务'
        } else if (data.type == 5) {
          this.title = '编辑任务审核任务'
        } else if (data.type == 7) {
          this.title = '编辑文件审核任务'
        } else {
          this.title = '编辑项目开卷审核任务'
        }
        this.form = JSON.parse(JSON.stringify(data))
        // 负责人
        if (this.form.handler) {
          this.personnelList.queryParams.id = this.form.handler
          await this.getPermissionPersonnel(1)
          this.personnelList.queryParams.id = null
        }
      } else {//创建分配任务
        this.title = '创建文件分配任务'
        this.form.projectId = this.projectId//项目id
        this.form.processId = this.processId
        this.form.type = 6//分配任务
        this.form.handlerType = 0//0内部人员1外部人员
      }
      this.getPermissionPersonnel()
      this.dialogVisible = true
    },
    //关闭弹窗
    handleClose() {
      this.$refs.form.resetFields()
      this.form = {}
      this.clear()
      this.dialogVisible = false
    },
    clear() {
      this.personnelList.data = []
      this.personnelList.queryParams.current = 1
      this.personnelList.queryParams.total = 0
      this.personnelList.queryParams.name = null
    },
    //提交数据
    submit() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          if (!this.form.id) {//新增分配任务
            this.$api.addTask(this.form).then(res => {
              if (res.code == 200) {
                this.$message.success('创建文件分配任务成功')
                this.$emit('isCreate', '新增成功')
                this.handleClose()
              }
            })
          } else {
            this.$api.updateTask(this.form).then(res => {
              if (res.code == 200) {
                this.$message.success('编辑任务成功')
                this.$emit('isCreate', '编辑成功')
                this.handleClose()
              }
            })
          }

        } else {
          this.$message.error('信息未输入完整')
        }
      });
    }
  },

};
</script>
<style lang="scss" scoped></style>