task-5302 人员岗位考核

src/views/business/personAssessment/assessment.vue

@@ -1,286 +1,312 @@
 <template>
-    <div class="main">
-        <el-table
-            ref="statTable"
-            :data="initData"
-            stripe
-            highlight-current-row
-            style="width: 100%"
-            class="stat-table"
-            :max-height="maxHeight"
-            :header-cell-style="{ textAlign: 'center' }"
-            :cell-style="{ textAlign: 'center' }"
-            :span-method="objectSpanMethod"
-        >
-            <!-- :summary-method="getSummaries" -->
-            <!-- <el-table-column type="index" label="序号" width="50" /> -->
-            <el-table-column label="岗位" prop="gangWei" width="200">
-                <!-- <template slot-scope="scope">
+  <div class="main">
+    <el-table
+      ref="statTable"
+      :data="initData"
+      stripe
+      highlight-current-row
+      style="width: 100%"
+      class="stat-table"
+      :max-height="maxHeight"
+      :header-cell-style="{ textAlign: 'center' }"
+      :cell-style="{ textAlign: 'center' }"
+      :span-method="objectSpanMethod"
+    >
+      <!-- :summary-method="getSummaries" -->
+      <!-- <el-table-column type="index" label="序号" width="50" /> -->
+      <el-table-column label="岗位" prop="gangWei" width="200">
+        <!-- <template slot-scope="scope">
                     <span>{{ gangWeiMap[scope.row.gangWei] || scope.row.gangWei }}</span>
                 </template> -->
-            </el-table-column>
-            <el-table-column label="科目" prop="kaoHeLeiMu" width="200" />
-            <!-- <el-table-column label="考核说明" prop="kaoHeLeiXing" width="300" /> -->
-            <el-table-column label="要点" prop="kaoHeNeiRong" />
-            <el-table-column label="考核标准" prop="kaoHeBiaoZhun" />
-            <el-table-column label="评分" prop="kaoHePingFen" width="150">
-                <template slot-scope="scope">
-                    <el-input v-if="!readonly || isEdit" v-model="scope.row.kaoHePingFen" placeholder="请输入评分" @input="handleInput(scope.$index, scope.column.property)" />
-                    <span v-else>{{ scope.row.kaoHePingFen }}</span>
-                </template>
-            </el-table-column>
-            <!-- <el-table-column label="考核情况" prop="shiFouGuoShen" /> -->
-            <el-table-column label="是否合格" prop="shiFouHeGe" width="150">
-                <template slot-scope="scope">
-                    <el-radio-group v-if="!readonly || isEdit" v-model="scope.row.shiFouHeGe" @change="handleRadioChange(scope.$index)">
-                        <el-radio label="是">是</el-radio>
-                        <el-radio label="否">否</el-radio>
-                    </el-radio-group>
-                    <span v-else>{{ scope.row.shiFouHeGe }}</span>
-                </template>
-            </el-table-column>
-        </el-table>
-    </div>
+      </el-table-column>
+      <el-table-column label="科目" prop="kaoHeLeiMu" width="200" />
+      <!-- <el-table-column label="考核说明" prop="kaoHeLeiXing" width="300" /> -->
+      <el-table-column label="要点" prop="kaoHeNeiRong" />
+      <el-table-column label="考核标准" prop="kaoHeBiaoZhun" />
+      <el-table-column label="评分" prop="kaoHePingFen" width="150">
+        <template slot-scope="scope">
+          <el-input
+            v-if="isEdit"
+            v-model="scope.row.kaoHePingFen"
+            placeholder="请输入评分"
+            @input="handleInput(scope.$index, scope.column.property)"
+          />
+          <span v-else>{{ scope.row.kaoHePingFen }}</span>
+        </template>
+      </el-table-column>
+      <!-- <el-table-column label="考核情况" prop="shiFouGuoShen" /> -->
+      <el-table-column label="是否合格" prop="shiFouHeGe" width="150">
+        <template slot-scope="scope">
+          <el-radio-group
+            v-if="isEdit"
+            v-model="scope.row.shiFouHeGe"
+            @change="handleRadioChange(scope.$index)"
+          >
+            <el-radio label="是">是</el-radio>
+            <el-radio label="否">否</el-radio>
+          </el-radio-group>
+          <span v-else>{{ scope.row.shiFouHeGe }}</span>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
 </template>
 
 <script>
 export default {
-    props: {
-        formData: {
-            type: Object,
-            default: () => ({})
-        },
-        params: {
-            type: Object,
-            default: () => ({})
-        },
-        readonly: {
-            type: Boolean,
-            default: false
-        }
+  props: {
+    formData: {
+      type: Object,
+      default: () => ({}),
     },
-    data () {
-        return {
-            maxHeight: '600px',
-            initData: [],
-            gangWeiMap: {} // 用于存储 gangWei ID 到名称的映射
-        }
+    params: {
+      type: Object,
+      default: () => ({}),
     },
-    computed: {
-        isEdit () {
-            return this.params?.nodeId === 'Activity_0lcx1y7'
-        },
-        initDataWatcher () {
-            return this.formData.jyrykhjlzb
-        },
-        objectSpanMethod () {
-            return this.func1
-        },
-        transformedData () {
-            return this.initData.map(row => ({
-                ...row,
-                gangWei: this.gangWeiMap[row.gangWei] || row.gangWei
-            }))
-        }
+    readonly: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      maxHeight: "600px",
+      initData: [],
+      gangWeiMap: {}, // 用于存储 gangWei ID 到名称的映射
+    };
+  },
+  computed: {
+    isEdit() {
+      return (
+        !this.params?.readonly && this.params?.nodeId === "Activity_0lcx1y7"
+      );
+    },
+    initDataWatcher() {
+      return this.formData.jyrykhjlzb;
+    },
+    objectSpanMethod() {
+      return this.func1;
+    },
+    transformedData() {
+      return this.initData.map((row) => ({
+        ...row,
+        gangWei: this.gangWeiMap[row.gangWei] || row.gangWei,
+      }));
     },
-    watch: {
-        initDataWatcher: {
-            handler (val) {
-                // console.log('reaonle', this.readonly, this.params)
-                this.initData = this.$utils.isEmpty(val) ? [] : val
-                const temp = JSON.parse(JSON.stringify(this.initData))
-                temp.sort((a, b) => {
-                    if (typeof a.gangWei === 'string' && typeof b.gangWei === 'string') {
-                        return a.gangWei.localeCompare(b.gangWei) // 如果 id 是字符串，则使用 localeCompare 比较
-                    } else {
-                        return a.gangWei - b.gangWei // 如果 id 是数字，则直接相减比较
-                    }
-                })
-                if (val !== temp) {
-                    this.initData = temp
-                }
-                // this.spanMap = {} // 重置 spanMap
-                this.sortTableDataById()
-                this.fetchGangWeiNames()
-            },
-            deep: true,
-            immediate: true
+  },
+  watch: {
+    initDataWatcher: {
+      handler(val) {
+        // console.log("reaonle", val, this.readonly, this.params);
+        this.initData = this.$utils.isEmpty(val) ? [] : val;
+        const temp = JSON.parse(JSON.stringify(this.initData));
+        temp.sort((a, b) => {
+          if (typeof a.gangWei === "string" && typeof b.gangWei === "string") {
+            return a.gangWei.localeCompare(b.gangWei); // 如果 id 是字符串，则使用 localeCompare 比较
+          } else {
+            return a.gangWei - b.gangWei; // 如果 id 是数字，则直接相减比较
+          }
+        });
+        if (val !== temp) {
+          this.initData = temp;
         }
+        // this.spanMap = {} // 重置 spanMap
+        this.sortTableDataById();
+        this.fetchGangWeiNames();
+      },
+      deep: true,
+      immediate: true,
     },
-    methods: {
-        fetchGangWeiNames () {
-            // 获取所有唯一的 gangWei ID
-            const uniqueIds = [...new Set(this.initData.map(row => row.gangWei).filter(id => id))]
-            const idsString = uniqueIds.join(',')
+  },
+  methods: {
+    fetchGangWeiNames() {
+      // 获取所有唯一的 gangWei ID
+      const uniqueIds = [
+        ...new Set(this.initData.map((row) => row.gangWei).filter((id) => id)),
+      ];
+      const idsString = uniqueIds.join(",");
 
-            // 调用 postChange 方法获取名称
-            this.postChange(idsString).then(names => {
-                // 更新映射表
-                names.split(', ').forEach((name, index) => {
-                    this.$set(this.gangWeiMap, uniqueIds[index], name)
-                })
-            }).catch(error => {
-                console.error('Error fetching gangWei names:', error)
-            })
-        },
-        // 岗位ID转name
-        postChange (ids) {
-            // const sql = `select * from t_dyzzb where find_in_set(id_,'${ids}')`
-            return this.$common.request('query', {
-                key: 'getDyzzbById',
-                params: [ids]
-            }).then(res => {
-                const { data = [] } = res.variables || {} // 接收查询数据库得到的数据
-                const names = data.map(el => el.gang_wei_ming_che).join(', ')
-                // console.log('Fetched names:', names) // 添加日志以便调试
-                return names
-            }).catch(error => {
-                // console.error('Error fetching data:', error)
-                throw error // 重新抛出错误以便调用者处理
-            })
-        },
-        // 更新子表数据
-        emitChange () {
-            const dataZi = this.initData.map(item => ({
-                'shiFouGuoShen': item.shiFouGuoShen,
-                'kaoHeLeiXing': item.kaoHeLeiXing,
-                'kaoHeLeiMu': item.kaoHeLeiMu,
-                'kaoHeNeiRong': item.kaoHeNeiRong,
-                'kaoHePingFen': item.kaoHePingFen,
-                'gangWei': item.gangWei,
-                'kaoHeBiaoZhun': item.kaoHeBiaoZhun,
-                'shiFouHeGe': item.shiFouHeGe
-            }))
-            this.$emit('change-data', 'jyrykhjlzb', dataZi)
-        },
-        // 数据排序
-        sortTableDataById () {
-            this.initData.sort((a, b) => {
-                if (a.gangWei === '所有岗位') {
-                    return 1 // a 应该排在后面
-                }
-                if (b.gangWei === '所有岗位') {
-                    return -1 // b 应该排在后面
-                }
-                if (typeof a.gangWei === 'string' && typeof b.gangWei === 'string') {
-                    return a.gangWei.localeCompare(b.gangWei) // 如果 id 是字符串，则使用 localeCompare 比较
-                } else {
-                    return a.gangWei - b.gangWei // 如果 id 是数字，则直接相减比较
-                }
-            })
-        },
-        // 合并单元格
-        func1 ({ row, column, rowIndex, columnIndex }) {
-            const culIdTotal = () => {
-                let p = rowIndex
-                while (p < this.initData.length && row.gangWei === this.initData[p].gangWei) {
-                    p++
-                }
-                return p - rowIndex
-            }
-
-            const culIdAndNameTotal = () => {
-                let p = rowIndex
-                while (
-                    p < this.initData.length &&
-                    row.gangWei === this.initData[p].gangWei &&
-                    row.kaoHeLeiMu === this.initData[p].kaoHeLeiMu
-                ) {
-                    p++
-                }
-                return p - rowIndex
-            }
-            const culIdAndMount3Total = () => {
-                let p = rowIndex
-                while (
-                    p < this.initData.length &&
-                    row.gangWei === this.initData[p].gangWei &&
-                    row.shiFouHeGe === this.initData[p].shiFouHeGe
-                ) {
-                    p++
-                }
-                return p - rowIndex
-            }
+      // 调用 postChange 方法获取名称
+      this.postChange(idsString)
+        .then((names) => {
+          // 更新映射表
+          names.split(", ").forEach((name, index) => {
+            this.$set(this.gangWeiMap, uniqueIds[index], name);
+          });
+        })
+        .catch((error) => {
+          console.error("Error fetching gangWei names:", error);
+        });
+    },
+    // 岗位ID转name
+    postChange(ids) {
+      // const sql = `select * from t_dyzzb where find_in_set(id_,'${ids}')`
+      return this.$common
+        .request("query", {
+          key: "getDyzzbById",
+          params: [ids],
+        })
+        .then((res) => {
+          const { data = [] } = res.variables || {}; // 接收查询数据库得到的数据
+          const names = data.map((el) => el.gang_wei_ming_che).join(", ");
+          // console.log('Fetched names:', names) // 添加日志以便调试
+          return names;
+        })
+        .catch((error) => {
+          // console.error('Error fetching data:', error)
+          throw error; // 重新抛出错误以便调用者处理
+        });
+    },
+    // 更新子表数据
+    emitChange() {
+      const dataZi = this.initData.map((item) => ({
+        shiFouGuoShen: item.shiFouGuoShen,
+        kaoHeLeiXing: item.kaoHeLeiXing,
+        kaoHeLeiMu: item.kaoHeLeiMu,
+        kaoHeNeiRong: item.kaoHeNeiRong,
+        kaoHePingFen: item.kaoHePingFen,
+        gangWei: item.gangWei,
+        kaoHeBiaoZhun: item.kaoHeBiaoZhun,
+        shiFouHeGe: item.shiFouHeGe,
+      }));
+      this.$emit("change-data", "jyrykhjlzb", dataZi);
+    },
+    // 数据排序
+    sortTableDataById() {
+      this.initData.sort((a, b) => {
+        if (a.gangWei === "所有岗位") {
+          return 1; // a 应该排在后面
+        }
+        if (b.gangWei === "所有岗位") {
+          return -1; // b 应该排在后面
+        }
+        if (typeof a.gangWei === "string" && typeof b.gangWei === "string") {
+          return a.gangWei.localeCompare(b.gangWei); // 如果 id 是字符串，则使用 localeCompare 比较
+        } else {
+          return a.gangWei - b.gangWei; // 如果 id 是数字，则直接相减比较
+        }
+      });
+    },
+    // 合并单元格
+    func1({ row, column, rowIndex, columnIndex }) {
+      const culIdTotal = () => {
+        let p = rowIndex;
+        while (
+          p < this.initData.length &&
+          row.gangWei === this.initData[p].gangWei
+        ) {
+          p++;
+        }
+        return p - rowIndex;
+      };
 
-            switch (columnIndex) {
-                case 0: // 第一列
-                    if (rowIndex > 0 && row.gangWei === this.initData[rowIndex - 1].gangWei) {
-                        return { rowspan: 0, colspan: 0 }
-                    } else {
-                        return { rowspan: culIdTotal(), colspan: 1 }
-                    }
+      const culIdAndNameTotal = () => {
+        let p = rowIndex;
+        while (
+          p < this.initData.length &&
+          row.gangWei === this.initData[p].gangWei &&
+          row.kaoHeLeiMu === this.initData[p].kaoHeLeiMu
+        ) {
+          p++;
+        }
+        return p - rowIndex;
+      };
+      const culIdAndMount3Total = () => {
+        let p = rowIndex;
+        while (
+          p < this.initData.length &&
+          row.gangWei === this.initData[p].gangWei &&
+          row.shiFouHeGe === this.initData[p].shiFouHeGe
+        ) {
+          p++;
+        }
+        return p - rowIndex;
+      };
 
-                case 1: // 第二列
-                    if (
-                        rowIndex > 0 &&
-                        row.gangWei === this.initData[rowIndex - 1].gangWei &&
-                        row.kaoHeLeiMu === this.initData[rowIndex - 1].kaoHeLeiMu
-                    ) {
-                        return { rowspan: 0, colspan: 0 }
-                    } else {
-                        return { rowspan: culIdAndNameTotal(), colspan: 1 }
-                    }
-                case 5:
-                    if (
-                        rowIndex > 0 &&
-                            row.gangWei === this.initData[rowIndex - 1].gangWei &&
-                            row.shiFouHeGe === this.initData[rowIndex - 1].shiFouHeGe
-                    ) {
-                        return { rowspan: 0, colspan: 0 }
-                    } else {
-                        return { rowspan: culIdAndMount3Total(), colspan: 1 }
-                    }
+      switch (columnIndex) {
+        case 0: // 第一列
+          if (
+            rowIndex > 0 &&
+            row.gangWei === this.initData[rowIndex - 1].gangWei
+          ) {
+            return { rowspan: 0, colspan: 0 };
+          } else {
+            return { rowspan: culIdTotal(), colspan: 1 };
+          }
 
-                default:
-                    return { rowspan: 1, colspan: 1 } // 其他列不合并
-            }
-        },
-        // 评分输入框
-        handleInput (index, property) {
-            const row = this.initData[index]
-            const spanInfo = this.getSpanInfo(row, property)
+        case 1: // 第二列
+          if (
+            rowIndex > 0 &&
+            row.gangWei === this.initData[rowIndex - 1].gangWei &&
+            row.kaoHeLeiMu === this.initData[rowIndex - 1].kaoHeLeiMu
+          ) {
+            return { rowspan: 0, colspan: 0 };
+          } else {
+            return { rowspan: culIdAndNameTotal(), colspan: 1 };
+          }
+        case 5:
+          if (
+            rowIndex > 0 &&
+            row.gangWei === this.initData[rowIndex - 1].gangWei &&
+            row.shiFouHeGe === this.initData[rowIndex - 1].shiFouHeGe
+          ) {
+            return { rowspan: 0, colspan: 0 };
+          } else {
+            return { rowspan: culIdAndMount3Total(), colspan: 1 };
+          }
 
-            spanInfo.indices.forEach(i => {
-                this.$set(this.initData[i], property, row[property])
-            })
-            this.emitChange()
-        },
-        // 是否合格单选框
-        handleRadioChange (index) {
-            const row = this.initData[index]
-            const spanInfo = this.getSpanInfo(row, 'shiFouHeGe')
-            // 同步更新所有相关行的 shiFouHeGe 值
-            this.initData.forEach((item, i) => {
-                if (item.gangWei === row.gangWei) {
-                    this.$set(item, 'shiFouHeGe', row.shiFouHeGe)
-                }
-            })
-            // 强制刷新表格以应用新的合并规则
-            this.$nextTick(() => {
-                this.$refs.statTable.doLayout()
-            })
-            this.emitChange()
-        },
-        getSpanInfo (row, property) {
-            const indices = []
-            const start = this.initData.indexOf(row)
+        default:
+          return { rowspan: 1, colspan: 1 }; // 其他列不合并
+      }
+    },
+    // 评分输入框
+    handleInput(index, property) {
+      const row = this.initData[index];
+      const spanInfo = this.getSpanInfo(row, property);
 
-            for (let i = start; i < this.initData.length; i++) {
-                // 确保只在同一 gangWei 内进行合并
-                if (this.initData[i].gangWei === row.gangWei && this.initData[i][property] === row[property]) {
-                    indices.push(i)
-                } else {
-                    break
-                }
-            }
+      spanInfo.indices.forEach((i) => {
+        this.$set(this.initData[i], property, row[property]);
+      });
+      this.emitChange();
+    },
+    // 是否合格单选框
+    handleRadioChange(index) {
+      const row = this.initData[index];
+      const spanInfo = this.getSpanInfo(row, "shiFouHeGe");
+      // 同步更新所有相关行的 shiFouHeGe 值
+      this.initData.forEach((item, i) => {
+        if (item.gangWei === row.gangWei) {
+          this.$set(item, "shiFouHeGe", row.shiFouHeGe);
+        }
+      });
+      // 强制刷新表格以应用新的合并规则
+      this.$nextTick(() => {
+        this.$refs.statTable.doLayout();
+      });
+      this.emitChange();
+    },
+    getSpanInfo(row, property) {
+      const indices = [];
+      const start = this.initData.indexOf(row);
 
-            return { indices, count: indices.length }
+      for (let i = start; i < this.initData.length; i++) {
+        // 确保只在同一 gangWei 内进行合并
+        if (
+          this.initData[i].gangWei === row.gangWei &&
+          this.initData[i][property] === row[property]
+        ) {
+          indices.push(i);
+        } else {
+          break;
         }
-    }
-}
+      }
+
+      return { indices, count: indices.length };
+    },
+  },
+};
 </script>
 
 <style>
 /* 样式 */
 </style>
-