<template> <div style="height: 60vh; overflow: auto;"> <!-- <div class="card-head">{{ totalTitle }}</div> --> <div class="ant-descriptions ant-descriptions-bordered"> <div class="ant-descriptions-view"> <table> <tbody> <tr class="ant-descriptions-row"> <th class="ant-descriptions-item-label ant-descriptions-item-colon" style="text-align: center" v-for="(col, index) in colunms" :key="index">{{ col.title }}</th> </tr> <tr class="ant-descriptions-row" v-for="item in tableData" :key="item.knowledge2Id"> <td class="ant-descriptions-item-label ant-descriptions-item-colon" style="text-align: center" v-if="item.visiable" :rowspan="item.rowspan"> {{ item.knowledge1Name }} </td> <td class="ant-descriptions-item-content"> <a-tag v-if="!item.disabled">{{ item.knowledge2Name }}</a-tag> <a-tag v-else :color="knowledgeColor">{{ item.knowledge2Name }}</a-tag> </td> <td class="ant-descriptions-item-content" style="text-align: right"> {{ item.knowledgeCount }} <a-checkbox @change="onCBChange($event, item)" :disabled="item.disabled"></a-checkbox> </td> </tr> </tbody> </table> </div> </div> </div> </template> <script> import { getType } from '@/views/utils/auth' export default { name: "knowledgeSelect", props: { value: { type: String, default: () => { return null } } }, data() { return { totalTitle: '', colunms: [ { title: "一级学科" }, { title: "二级学科" }, { title: "项目个数" } ], tableData: [], reportYear: null, knowledgeIds: [], knowledgeColor: 'green', }; }, created () { this.getYear() }, methods: { getYear () { this.$api.batch.getCurrentYearBatch({ type: 1, projType: getType() }).then(({ data = {} }) => { if (data) { this.reportYear = data.year this.totalTitle = this.reportYear + '项目二级学科选择' this.getKnowledgeSelectedList() } }).catch(() => { }) }, getKnowledgeSelectedList () { this.$api.statistical.getKnowledgeSelectedList({ reportYear: this.reportYear, auditType: 1, projType: getType() }).then(({ data = {} }) => { if (data) { this.tableData = data } }).catch(() => { }) }, onCBChange (e, item) { if (e.target.checked) { this.knowledgeIds.push(item.knowledge2Id) } else { let index = this.knowledgeIds.indexOf(item.knowledge2Id) this.knowledgeIds.splice(index, 1) } }, submit () { if (this.knowledgeIds.length <= 0) { this.$message.info('请选择二级学科!') return } this.$api.projectGroupAssign.addProjectGroupKnowledge({ groupId: this.value, knowledgeIds: this.knowledgeIds, reportYear: this.reportYear }).then(({ data = {} }) => { if (data === '数据保存成功!') { this.$message.success(data) this.$emit('close') } else { this.$message.info(data) } }).catch(() => {}) } }, }; </script> <style scoped lang="less"> .card-head { min-height: 30px; margin-bottom: -1px; padding: 0 5px; color: rgba(0, 0, 0, 0.85); font-weight: 500; font-size: 16px; background: transparent; border-bottom: 1px solid #e8e8e8; border-radius: 2px 2px 0 0; zoom: 1; text-align: center; } </style>