评优任务页面、考核结果页面修改

GuLiMmo

2023-12-15 4b898d43d04242e74157aedafa5e1c7d75d1abcd

 src/views/evaluate/components/addDialog.vue

@@ -18,65 +18,33 @@
          </el-select>
        </el-form-item>-->
        <el-form-item label="候选部门:" prop="candidateNum">
          <el-select
            v-model="selectGroup"
            value-key="deptId"
            multiple
            style="width: 100%;"
            placeholder="请选择候选部门"
          >
            <el-option
              v-for="dept in depts"
              :key="dept.deptId"
              :label="dept.deptName"
              :value="dept"
            ></el-option>
                    <el-select v-model="selectGroup" value-key="deptId" multiple style="width: 100%;" placeholder="请选择候选部门">
                        <el-option v-for="dept in depts" :key="dept.deptId" :label="dept.deptName"
                            :value="dept"></el-option>
          </el-select>
          <div class="select-list" v-for="content in selectGroup" :key="content.deptId">
            <span>{{content.deptName}}:</span>
            <el-form-item label="候选人数:" prop="deptnumber" class="select-num">
              <el-input
                type="number"
                :min="1"
                :max="10"
                v-model="addForm.deptnumber"
                placeholder="请输入"
              ></el-input>
            </el-form-item>
            <el-form-item label="参选人:" class="select-item">
              <el-select v-model="content.users" value-key="id" multiple>
                <el-option
                  v-for="employee in content.employees"
                  :key="employee.id"
                  :label="employee.name"
                  :value="employee"
                ></el-option>
                    <div class="select-list">
                        <el-form-item v-for="content in selectGroup" :key="content.deptId" :label="content.deptName"
                            class="select-item">
                            <el-input-number min="1" :max="content.employees.length" v-model="content.val"
                                controls-position="right" placeholder="请输入候选人数量" class="select-num"></el-input-number>
                            <el-select v-model="content.users" value-key="id" multiple placeholder="请输入候选人">
                                <el-option v-for="employee in content.employees" :key="employee.id" :label="employee.name"
                                    :value="employee"></el-option>
              </el-select>
            </el-form-item>
          </div>
        </el-form-item>
        <el-form-item label="候选人截止日期:" prop="candidateCutoffTime">
          <el-date-picker
            v-model="addForm.candidateCutoffTime"
            type="datetime"
            placeholder="请选择截止时间"
            format="YYYY-MM-DD HH:mm:ss"
            valueFormat="YYYY-MM-DD HH:mm:ss"
            style="width: 100%;"
          />
                    <el-date-picker v-model="addForm.candidateCutoffTime" type="datetime" placeholder="请选择截止时间"
                        format="YYYY-MM-DD HH:mm:ss" valueFormat="YYYY-MM-DD HH:mm:ss" style="width: 100%;" />
        </el-form-item>
        <el-form-item label="评优数量:" prop="evaluateNum">
          <el-input v-model="addForm.evaluateNum" placeholder="请输入评优数量"></el-input>
                    <el-input-number min="1" :max="maxEvaluateNum" v-model="addForm.evaluateNum" controls-position="right"
                        :placeholder="`请输入评优数量（最多不可大于${maxEvaluateNum}人）`" class="evaluateNum-input"></el-input-number>
        </el-form-item>
        <el-form-item label="评优截止日期:" prop="evaluateCutoffTime">
          <el-date-picker
            v-model="addForm.evaluateCutoffTime"
            type="datetime"
            placeholder="请选择截止时间"
            format="YYYY-MM-DD HH:mm:ss"
            valueFormat="YYYY-MM-DD HH:mm:ss"
            style="width: 100%;"
          />
                    <el-date-picker v-model="addForm.evaluateCutoffTime" type="datetime" placeholder="请选择截止时间"
                        format="YYYY-MM-DD HH:mm:ss" valueFormat="YYYY-MM-DD HH:mm:ss" style="width: 100%;" />
        </el-form-item>
      </el-form>
    </div>
@@ -137,19 +105,32 @@
        isDeleted: '',
      },
      rules: {
        taskName: [{ required: true, message: '请输入任务名称', trigger: 'blur' }],
        taskType: [{ required: true, message: '请输入任务类别', trigger: 'blur' }],
        remark: [{ required: true, message: '请输入认定标准描述', trigger: 'blur' }],
        type: [{ required: true, message: '请选择评优类型', trigger: 'blur' }],
        candidateNum: [{ required: true, message: '请选择候选人截止日期', trigger: 'click' }],
                taskName: [
                    { required: true, message: '请输入任务名称', trigger: 'blur' }
                ],
                taskType: [
                    { required: true, message: '请输入任务类别', trigger: 'blur' }
                ],
                remark: [
                    { required: true, message: '请输入认定标准描述', trigger: 'blur' }
                ],
                type: [
                    { required: true, message: '请选择评优类型', trigger: 'blur' }
                ],
                candidateNum: [
                    { required: true, message: '请选择候选人截止日期', trigger: 'click' }
                ],
        candidateCutoffTime: [
          { required: true, message: '请选择候选人截止日期', trigger: 'click' },
        ],
        evaluateNum: [{ required: true, message: 'Please input Activity name', trigger: 'click' }],
                evaluateNum: [
                    { required: true, message: '请输入评优数量', trigger: 'click' }
                ],
        evaluateCutoffTime: [
          { required: true, message: 'Please input Activity name', trigger: 'click' },
                    { required: true, message: '请选择评优截止时间', trigger: 'click' },
        ],
      },
            maxEvaluateNum: 0,
    };
  },
  watch: {
@@ -169,6 +150,7 @@
    selectGroup: {
      handler(val) {
        this.addForm.candidateNum = [];
                this.maxEvaluateNum = 0;
        val.forEach(item => {
          const users = [];
          item.users.forEach(user => {
@@ -177,10 +159,12 @@
              name: user.name,
            });
          });
                    this.maxEvaluateNum += (item.val * 1);
                    console.log(item.val);
          this.addForm.candidateNum.push({
            deptId: item.deptId,
            deptName: item.deptName,
            val: item.users.length,
                        val: item.val,
            users,
          });
        });
@@ -282,25 +266,34 @@

<style lang="scss" scoped>
.content {
  height: 40%;
    max-height: 400px;
  overflow: auto;
}

.select-list {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 15px;
  span {
    width: 80px;
  }
  .select-num {
    width: 250px;
  }

  .select-item {
    flex: 1;
    .el-select {
      width: 100%;
            margin-top: 15px;
            display: flex;

            .select-num {
                flex: 2;
            }

            .el-select {
                flex: 5;
                margin-left: 10px;
            }
        }
    }

    .evaluateNum-input {
        width: 100%;
        :deep() {
            .el-input__inner {
                text-align: left;
            }
    }
  }
}