<template>
  <!-- 处理挖掘任务1（审核任务） -->
  <div class="handleTask1">
    <el-dialog :title="title" :visible.sync="dialogVisible" width="800px" :before-close="handleClose" :close-on-click-modal="false">
      <el-form :model="form" status-icon :rules="rules" ref="form" label-width="120px" class="demo-ruleForm" :disabled="!form.isLook">
        <el-row>
          <el-col :span="12">
            <el-form-item label="项目名称：" prop="name">
              <el-input v-model="form.name" placeholder="请输入项目名称"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="技术方向：">
              <el-input v-model="form.type" placeholder="请输入技术方向"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="产品阶段：">
              <el-input v-model="form.name" placeholder="请输入产品阶段"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="产品产出：">
              <el-input v-model="form.type" placeholder="请输入产品产出"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="相关竞争对手：">
              <el-input v-model="form.name" placeholder="请输入相关竞争对手"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="技术关键词：">
              <el-input v-model="form.type" placeholder="请输入技术关键词"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="参与人：">
              <el-input v-model="form.name" placeholder="请输入参与人"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="负责人：">
              <el-select v-model="form.value" placeholder="请选择负责人" style="width: 100%;">
                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="是否检索：" >
              <el-switch
                v-model="form.delivery"
                active-color="#13ce66"
                inactive-color="#ff4949">
              </el-switch>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="附件：" prop="file">
              <el-upload class="upload-demo" ref="upload" action="#" :auto-upload="false" :show-file-list="true"
                :on-change="onChange" multiple :on-preview="handlePreview" :on-remove="handleRemove"
                :file-list="fileList">
                <i class="el-icon-upload2" style="font-size: 18px;"></i>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="handleClose" size="small">取 消</el-button>
        <el-dropdown v-if="form.isLook" split-button type="primary" @click="submit" size="small">
          <p>{{ btn.label }}</p>
          <el-dropdown-menu slot="dropdown" class="text-align_center">
            <el-dropdown-item v-for="item in btnObj" :key="item.label" @click.native="onChangeFamily(item)">{{ item.label
            }}</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </span>
    </el-dialog>

  </div>
</template>

<script>
export default {
  components: {},
  props: {},
  data() {
    return {
      dialogVisible: false,
      title: '',
      form: {},
      rules: {
        name: [{ required: true, message: '请输入项目名称', trigger: 'blur' },],
      },
      btnObj: [
        {
          label: '同意创建',
          value: 1
        },
        {
          label: '取消创建',
          value: 4
        },
        {
          label: '缺少材料',
          value: 5
        }
      ],
      btn: {
        label: '同意创建',
        value: 1
      },
      options: [],
      fileList: [],
    };
  },
  watch: {},
  computed: {},
  created() { },
  mounted() { },
  methods: {
    onChange(file, fileList) { },
    handlePreview(file, fileList) { },
    handleRemove(file, fileList) { },
    // 切换按钮
    onChangeFamily(val) {
      this.btn = val
    },
    //打开弹窗
    open(form,val) {
      this.form = JSON.parse(JSON.stringify(form))
      this.form.isLook=val
      // if(this.form.id){
      //     this.title = '编辑任务'
      // }else{
      //     this.title = '创建任务'
      // }
      if (this.form.isLook) {
        this.title = '处理任务'
      } else {
        this.title = '查看任务'
      }
      this.dialogVisible = true
    },
    //关闭弹窗
    handleClose() {
      this.form = {}
      this.dialogVisible = false
    },
    //提交数据
    submit() {
      this.dialogVisible = false
    }
  },

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