xujun

src/views/evaluation/components/technologyEvalucation.vue

+<template>
+  <div>
+    <table
+      class="tab-content"
+      cellpadding="3"
+      cellspacing="3"
+      style="width: 98%"
+    >
+      <tr>
+        <td class="bg-title">一级指标(固定)</td>
+        <td class="bg-title">二级指标(供参考)</td>
+        <td class="bg-title" colspan="3">评价意见(供参考)</td>
+        <td class="bg-title">专家打分</td>
+      </tr>
+      <tr v-for="(item, index) in tableData" :key="index" style="line-height: 25px">
+        <td :rowspan="item.rowspan" v-if="item.rowspan != 0" class="bg-title">
+          {{ item.oneLevel }}
+        </td>
+        <td>{{ item.towLevel }}</td>
+        <td>{{ item.title1 }}</td>
+        <td>{{ item.title2 }}</td>
+        <td>{{ item.title3 }}</td>
+        <td>
+          <a-form-model-item :prop="'score' + (index + 1)">
+            <a-input-number v-model="item.grade" :min="0" :max="item.score" :step="1" @change="numberChange(index)" style="width: 90%"/>
+          </a-form-model-item>
+        </td>
+      </tr>
+      <tr>
+        <td class="bg-title">评审意见</td>
+        <td colspan="4">
+          <a-form-model-item prop="remark">
+            <a-textarea placeholder="评审意见" v-model="value.remark" @change="AreaChange()" :maxLength="1000" style="width: 90%; height: 120px; margin-top: 6px" />
+          </a-form-model-item>
+        </td>
+        <td style="text-align: center">总分：{{ totalScore }}分</td>
+      </tr>
+      <tr>
+        <td class="bg-title">是否推荐立项支持</td>
+        <td colspan="5">
+            <a-form-model-item prop="supportState">
+              <a-radio-group v-model="value.supportState">
+                <a-radio :value="1">是</a-radio>
+                <a-radio :value="0">否</a-radio>
+              </a-radio-group>
+            </a-form-model-item>
+        </td>
+      </tr>
+    </table>
+  </div>
+</template>
+
+<script>
+const formData = {
+  id: null,
+  projId: null,
+  expertId: null,
+  expertName: null,
+  score1: null,
+  score2: null,
+  score3: null,
+  score4: null,
+  score4: null,
+  score5: null,
+  score6: null,
+  score7: null,
+  score8: null,
+  score9: null,
+  score10: null,
+  score11: null,
+  score12: null,
+  score13: null,
+  score14: null,
+  score15: null,
+  score16: null,
+  score17: null,
+  totalScore: null,
+  supportState: null,
+  remark: null,
+  projName: null,
+  projNo: null,
+};
+
+export default {
+  name: "technologyEvalucation",
+  props: {
+    value: {
+      type: Object,
+      default: () => {
+        return formData;
+      },
+    },
+  },
+  data() {
+    return {
+      tableData: [
+        { rowspan: 1, oneLevel: "1.意义及必要性(5分)", towLevel: "A：项目实施的意义及必要性（5分）", title1: "重要（4-5分）", title2: "较重要（2-3分）", title3: "一般（0-1分）", score: 5, grade: null, },
+        
+        { rowspan: 2, oneLevel: "2.目标及考核指标（10分）", towLevel: "A：目标定位及可考核性（5分）", title1: "明确量化可考（4-5分）", title2: "较明确可考（2-3分）", title3: "一般（0-1分）", score: 5, grade: null, },
+        { rowspan: 0, oneLevel: "2.目标及考核指标（10分）", towLevel: "B：绩效目标设置合理性（5分）", title1: "准确合理（4-5分）", title2: "较准确合理（2-3分）", title3: "一般（0-1分）", score: 5, grade: null, },
+        
+        { rowspan: 3, oneLevel: "3.主要内容（20分）", towLevel: "A：研发内容与目标实现关联度（6分）", title1: "高（5-6分）", title2: "中（2-4分）", title3: "低（0-1分）", score: 6, grade: null, },
+        { rowspan: 0, oneLevel: "3.主要内容（20分）", towLevel: "B：研究成果产业化成熟度（6分）", title1: "好（5-6分）", title2: "较好（2-4分）", title3: "一般（0-1分）", score: 6, grade: null, },
+        { rowspan: 0, oneLevel: "3.主要内容（20分）", towLevel: "C：产业化市场竞争力及预期效益（8分）", title1: "好（7-8分）", title2: "较好（3-6分）", title3: "一般（0-2分）", score: 8, grade: null, },
+
+        { rowspan: 3, oneLevel: "4.项目实施方案（技术路线）（25分）", towLevel: "A：技术路线和实施方案设计（10分）", title1: "合理（7-10分）", title2: "较合理（3-6分）", title3: "一般（0-2分）", score: 10, grade: null, },
+        { rowspan: 0, oneLevel: "4.项目实施方案（技术路线）（25分）", towLevel: "B：技术关键选择及创新性先进性（8分）", title1: "突出（7-8分）", title2: "较突出（3-6分）", title3: "一般（0-2分）", score: 8, grade: null, },
+        { rowspan: 0, oneLevel: "4.项目实施方案（技术路线）（25分）", towLevel: "C：年度计划安排（7分）", title1: "合理（6-7分）", title2: "较合理（3-5分）", title3: "一般（0-2分）", score: 7, grade: null, },
+
+        { rowspan: 3, oneLevel: "5.工作基础及支撑条件（15分）", towLevel: "A：负责人及团队创新能力（7分）", title1: "强（6-7分）", title2: "较强（2-5分）", title3: "一般（0-1分）", score: 7, grade: null, },
+        { rowspan: 0, oneLevel: "5.工作基础及支撑条件（15分）", towLevel: "B：研发平台及科研条件保障（4分）", title1: "好（4分）", title2: "较好（3分）", title3: "一般（1分）", score: 4, grade: null, },
+        { rowspan: 0, oneLevel: "5.工作基础及支撑条件（15分）", towLevel: "C：前期工作基础（4分）", title1: "好（4分）", title2: "较好（3分）", title3: "一般（1分）", score: 4, grade: null, },
+
+        { rowspan: 3, oneLevel: "6.组织运行与管理（15分）", towLevel: "A：经费预算合理性（6分）", title1: "合理（5-6分）", title2: "较合理（2-4分）", title3: "一般（0-1分）", score: 6, grade: null, },
+        { rowspan: 0, oneLevel: "6.组织运行与管理（15分）", towLevel: "B：任务分工和权益分配（4分）", title1: "合理（4分）", title2: "较合理（3分）", title3: "一般（1分）", score: 4, grade: null, },
+        { rowspan: 0, oneLevel: "6.组织运行与管理（15分）", towLevel: "C：项目组织协调及管理措施（5分）", title1: "完善（4-5分）", title2: "较完善（2-3分）", title3: "一般（0-1分）", score: 5, grade: null, },
+
+        { rowspan: 2, oneLevel: "7.风险分析（10分）", towLevel: "A：项目组织实施风险（6分）", title1: "风险小（5-6分）", title2: "有一定风险（3-4分）", title3: "风险较大（0-2分）", score: 6, grade: null, },
+        { rowspan: 0, oneLevel: "7.风险分析（10分）", towLevel: "B：目标实现风险（4分）", title1: "风险小（4分）", title2: "有一定风险（3分）", title3: "风险较大（0分）", score: 4, grade: null, },
+      ],
+      remark: "",
+      totalScore: 0,
+    };
+  },
+  created() {
+    this.tableData[0].grade = this.value.score1
+    this.tableData[1].grade = this.value.score2
+    this.tableData[2].grade = this.value.score3
+    this.tableData[3].grade = this.value.score4
+    this.tableData[4].grade = this.value.score5
+    this.tableData[5].grade = this.value.score6
+    this.tableData[6].grade = this.value.score7
+    this.tableData[7].grade = this.value.score8
+    this.tableData[8].grade = this.value.score9
+    this.tableData[9].grade = this.value.score10
+    this.tableData[10].grade = this.value.score11
+    this.tableData[11].grade = this.value.score12
+    this.tableData[12].grade = this.value.score13
+    this.tableData[13].grade = this.value.score14
+    this.tableData[14].grade = this.value.score15
+    this.tableData[15].grade = this.value.score16
+    this.tableData[16].grade = this.value.score17
+    this.calTotalScore()
+  },
+  methods: {
+    numberChange(index) {
+      switch (index + 1) {
+        case 1:
+          this.value.score1 = this.tableData[index].grade;
+          break;
+        case 2:
+          this.value.score2 = this.tableData[index].grade;
+          break;
+        case 3:
+          this.value.score3 = this.tableData[index].grade;
+          break;
+        case 4:
+          this.value.score4 = this.tableData[index].grade;
+          break;
+        case 5:
+          this.value.score4 = this.tableData[index].grade;
+          break;
+        case 6:
+          this.value.score6 = this.tableData[index].grade;
+          break;
+        case 7:
+          this.value.score7 = this.tableData[index].grade;
+          break;
+        case 8:
+          this.value.score8 = this.tableData[index].grade;
+          break;
+        case 9:
+          this.value.score9 = this.tableData[index].grade;
+          break;
+        case 10:
+          this.value.score10 = this.tableData[index].grade;
+          break;
+        case 11:
+          this.value.score11 = this.tableData[index].grade;
+          break;
+        case 12:
+          this.value.score12 = this.tableData[index].grade;
+          break;
+        case 13:
+          this.value.score13 = this.tableData[index].grade;
+          break;
+        case 14:
+          this.value.score14 = this.tableData[index].grade;
+          break;
+        case 15:
+          this.value.score15 = this.tableData[index].grade;
+          break;
+        case 16:
+          this.value.score16 = this.tableData[index].grade;
+          break;
+        case 17:
+          this.value.score17 = this.tableData[index].grade;
+          break;
+      }
+      this.calTotalScore()
+    },
+    AreaChange() {
+      this.value.remark = this.remark
+    },
+    calTotalScore() {
+      this.totalScore = 0;
+      this.tableData.forEach((e) => {
+        if (e.grade != null) {
+          this.totalScore += e.grade;
+        }
+      });
+    }
+  },
+};
+</script>
+
+<style scoped lang="less">
+table,
+tr,
+td {
+  border: 1px solid #080808;
+  font-size: 10pt;
+  text-align: left;
+  line-height: 25px;
+  height: 25px;
+}
+.bg-title {
+  background-color: #f5f5f5;
+  font-weight: bold;
+  text-align: center;
+}
+.target-value {
+  text-align: center;
+}
+</style>
\ No newline at end of file