<template>
<!-- 月度考核 -->
<div class="monthjxPagekh">
<div class="searchBoxs">
<n-space class="nspace ">
<div class="name">考核年份：</div>
<n-select v-model:value="selectyear" placeholder="请选择考核年份" clearable :options="yearOptions" style="width: 200px">
</n-select>
<div class="name">考核类型：</div>
<n-select v-model:value="searchVal2" style="width: 200px" :options="jueseOptions" clearable> </n-select>
<n-button type="success" @click="getPersonList(1, 12, startTime, endTime)">
<template #icon>
<n-icon>
<Search />
</n-icon>
</template>
搜索
</n-button>
<n-button type="primary" @click="handleClick('add')">
<template #icon>
<n-icon><Add /> </n-icon>
</template>
新增
</n-button>
</n-space>
</div>
<!-- 表格 -->
<div class="tableBox">
<n-data-table
:bordered="false"
:max-height="700"
striped
:columns="columns"
:data="tableData"
:loading="tableLoading"
:remote="true"
:pagination="pagination"
>
</n-data-table>
</div>
<!-- 个人自评点击弹窗 -->
<n-modal
:title="kaopingTitle"
:mask-closable="false"
preset="dialog"
:show-icon="false"
:style="{ width: '1800px' }"
v-model:show="kaopingShow"
>
<div class="kaopingTable">
<!-- <n-divider /> -->
<n-data-table
:bordered="true"
:single-line="false"
:columns="kaopingcolumns"
:data="kaopingtableData"
:loading="tableLoadingKP"
:remote="true"
>
</n-data-table>
<div class="kaopingTableBtn">
<div class="kaopingTableBtnl">总成绩</div>
<div class="kaopingTableBtnr">{{ totalScore }}</div>
</div>
</div>
</n-modal>
</div>
</template>
<script>
import { reactive, toRefs, onBeforeMount, onMounted, ref, h ,computed} from 'vue';
import { Search, Add, Book } from '@vicons/ionicons5';
import { NInputNumber, NInput,NTag } from 'naive-ui';
import bus from '@/utils/util';
export default {
name: 'monthjxPage',
components: {
Search,
Add,
Book,
},
setup() {
const allData = reactive({
totalScore :'',
kaopingTitle: '新增个人自评', //考评弹窗
kaopingtableData: [],
kaopingShow: false,
selectyear:'',
yearOptions:'',
actionColumn: [
{ btnType: 'primary', type: 'edit', default: '编辑' },
{ btnType: 'error', type: 'delete', default: '删除' },
],
kaopingcolumns: [
{
title: '考核项目',
align: 'center',
key: 'codeName',
width: '120',
rowSpan: (row, index) => {
return row.rowSpan0;
},
},
{
title: '一级指标',
align: 'center',
key: 'insOneName',
width: '120',
rowSpan: (row, index) => {
return row.rowSpan1;
},
},
{
title: '二级指标',
align: 'center',
key: 'insTwoName',
width: '120',
rowSpan: (row, index) => {
return row.rowSpan2;
},
},
{
title: '三级指标',
align: 'center',
key: 'insThreeName',
rowSpan: (row, index) => {
return row.rowSpan3;
},
width: '120',
},
{
title: '评价标准',
align: 'center',
key: "attrs",
children:[{
title: "E(不满意)",
align: 'center',
children:[{
title: "1分",
align: 'center',
key: "indexExp",
}]
},{
title: "D(勉强)",
align: 'center',
children:[{
title: "2分",
align: 'center',
key: "scoreBasis",
}]
},{
title: "C(一般)",
align: 'center',
children:[{
title: "3分",
align: 'center',
key: "scoreStandard",
}]
},{
title: "B(良好)",
align: 'center',
children:[{
title: "4分",
align: 'center',
key: "score",
}]
},{
title: "A(优秀)",
align: 'center',
children:[{
title: "5分",
align: 'center',
key: "acuScore",
}]
}]
},
// {
// title: "Attrs",
// key: "attrs",
// children: [
// {
// title: "Attack",
// key: "attack",
// children: [
// {
// title: "Physics Attack",
// key: "physicsAttack"
// },
// {
// title: "Magic Attack",
// key: "magicAttack"
// }
// ]
// },
// { title: '指标名称', align: 'center', key: 'indexName' },
// { title: '指标解释', align: 'center', key: 'indexExp', ellipsis: { tooltip: true } },
// { title: '评价依据', align: 'center', key: 'scoreBasis', ellipsis: { tooltip: true } },
// { title: '评分标准', align: 'center', key: 'scoreStandard', ellipsis: { tooltip: true } },
// { title: '标准分值', align: 'center', key: 'score', width: '60' },
// { title: '实际得分', align: 'center', key: 'acuScore', width: '60' },
{
title: '自我评价',
align: 'center',
key: 'questions',
width: '120',
render(row, index) {
return h(NInput, {
value: row.questions,
onUpdateValue(v) {
row.questions = v
// data.value[index].questions = v;
handleClick('shu')
},
});
},
// render(row) {
// return h(
// NInput,
// {
// type: 'success',
// onClick: () => handleClick('findissues', row),
// },
// { default: () => row.questions }
// );
// },
},
],
columns: [
{
title: '序号',
align: 'center',
width: '80',
render(row, index) {
return (paginationReactive.page - 1) * paginationReactive.pageSize + index + 1;
},
},
{ title: '考核类型', align: 'center', key: 'performType' },
{ title: '考核时间', align: 'center', key: 'evaluateTime'},
{ title: '提交状态', align: 'center', key: 'evaluateTime' },
{ title: '自评分数', align: 'center', key: 'evaluateTime'},
{ title: '提交时间', align: 'center', key: 'evaluateTime' },
{ title: '创建时间', align: 'center', key: 'evaluateTime' },
// {
// title: '抽查子项个数',
// align: 'center',
// key: 'projectSubCount',
// render(row) {
// return h(
// NTag,
// {
// bordered: true,
// type: 'success',
// onClick: () => handleClick('projectSubCount', row),
// },
// { default: () => row.projectSubCount }
// );
// },
// },
{
title: '操作',
key: 'actions',
width: '240',
align: 'center',
render(row) {
const btn = allData.actionColumn.map((item, index) => {
return h(
NButton,
{
text: true,
size: item.size,
style: {
margin: '10px',
},
type: item.btnType,
onClick: () => handleClick(item.type, row),
},
{ default: () => item.default }
);
});
return btn;
},
},
],
tableData: [],
tableLoading: false,
});
//去考评查看弹窗内容
async function getKaopingData() {
allData.tableLoadingKP = true;
allData.kaopingtableData = [{
id: "1638109121511301136",
mainId: "1638109121481940993",
relIndexId: 517,
relIndexIdType: 0,
acuScore: 1.8000,
questions:1,
operUser: null,
codeId: 50,
codeName: "黄孝河、",
projectSubId: null,
projectSubName: null,
insOneId: 100,
insOneName: "项目管理绩效考核",
insTwoId: 142,
insTwoName: "组织管理",
insThreeId: 286,
insThreeName: "人员配置及管理",
indexName: "人员配置及管理指标",
score: 2.0000,
scoreStandard: "未按《项目运营维护手。",
scoreBasis: "项目运营维护手册、",
indexExp: "问卷调查结果训、",
cutScore: null,
rowSpan0: 8,
rowSpan1: 8,
rowSpan2: 1,
rowSpan3: 3,
},
{
id: "1638109121511301137",
mainId: "1638109121481940993",
relIndexId: 520,
relIndexIdType: 0,
acuScore: 0,
operUser: null,
codeId: 50,
codeName: "黄孝河、",
projectSubId: null,
projectSubName: null,
insOneId: 100,
insOneName: "项目管理绩效考核",
insTwoId: 144,
insTwoName: "财务管理",
insThreeId: 288,
insThreeName: "会计核算合规性",
indexName: "会计核算合规性指标",
score: 1.0000,
scoreStandard: "随机。",
scoreBasis: "财务报表、原始凭证等",
indexExp: "对运营",
cutScore: null,
rowSpan0: 8,
rowSpan1: 8,
rowSpan2: 2,
rowSpan3: 1
},
{
id: "1638109121511301138",
mainId: "1638109121481940993",
relIndexId: 522,
relIndexIdType: 0,
acuScore: 0,
questions: 1,
operUser: null,
codeId: 50,
codeName: "黄孝河、机场河水环境综合治理二期项目",
projectSubId: null,
projectSubName: null,
insOneId: 100,
insOneName: "项目管理绩效考核",
insTwoId: 144,
insTwoName: "财务管理",
insThreeId: 290,
insThreeName: "财务账、表的规范性",
indexName: "财务账、表的规范性指标",
score: 1.0000,
scoreStandard: "检查本期各",
scoreBasis: "财务账簿、报表",
indexExp: "财务账",
cutScore: null,
rowSpan0: 8,
rowSpan1: 8,
rowSpan2: 2,
rowSpan3: 1,
},
{ id: "1638109121511301139",
mainId: "1638109121481940993",
relIndexId: 525,
relIndexIdType: 0,
acuScore: 2.0000,
questions: 1,
operUser: null,
codeId: 50,
codeName: "黄孝河、机场河水环境综合治理二期项目",
projectSubId: null,
projectSubName: null,
insOneId: 100,
insOneName: "项目管理绩效考核",
insTwoId: 146,
insTwoName: "制度管理",
insThreeId: 292,
insThreeName: "制度健全性",
indexName: "制度健全性指标",
score: 2.0000,
scoreStandard: "检查项目",
scoreBasis: "相关制度文件，岗位职责贴示上墙",
indexExp: "针对项目运营维护编制项",
cutScore: null,
rowSpan0: 8,
rowSpan1: 8,
rowSpan2: 1,
rowSpan3: 1,
},{
id: "1638109121511301140",
mainId: "1638109121481940993",
relIndexId: 528,
relIndexIdType: 0,
acuScore: 0.5000,
questions: 1,
operUser: null,
codeId: 50,
codeName: "黄孝河、机场河水环境综合治理二期项目",
projectSubId: null,
projectSubName: null,
insOneId: 100,
insOneName: "项目管理绩效考核",
insTwoId: 148,
insTwoName: "档案管理",
insThreeId: 294,
insThreeName: "日常巡查、监测记录资料管理规范性",
indexName: "日常巡查、监测记录资料管理规范性指标",
score: 1.0000,
scoreStandard: "日常巡、",
scoreBasis: "日常巡查、监测记录文件",
indexExp: "项目公司",
cutScore: null,
rowSpan0: 8,
rowSpan1: 8,
rowSpan2: 3,
rowSpan3: 1
},
{
id: "1638109121511301141",
mainId: "1638109121481940993",
relIndexId: 530,
relIndexIdType: 0,
acuScore: 0,
questions: 1,
operUser: null,
codeId: 50,
codeName: "黄孝河、机场河水环境综合治理二期项目",
projectSubId: null,
projectSubName: null,
insOneId: 100,
insOneName: "项目管理绩效考核",
insTwoId: 148,
insTwoName: "档案管理",
insThreeId: 296,
insThreeName: "设施设备维修维护记录资料管理规范性",
indexName: "设施设备维修维护记录资料管理规范性指标",
score: 1.0000,
scoreStandard: "设施设备",
scoreBasis: "设施设备维修维",
indexExp: "项目公司应对项目设施设备维修维护情况及时记录、相关资料规范管理。",
cutScore: null,
rowSpan0: 8,
rowSpan1: 8,
rowSpan2: 3,
rowSpan3: 1,
},{
id: "1638109121511301142",
mainId: "1638109121481940993",
relIndexId: 532,
relIndexIdType: 0,
acuScore: 1.0000,
questions: 0,
operUser: null,
codeId: 50,
codeName: "黄孝河、机场河水环境综合治理二期项目",
projectSubId: null,
projectSubName: null,
insOneId: 100,
insOneName: "项目管理绩效考核",
insTwoId: 148,
insTwoName: "档案管理",
insThreeId: 298,
insThreeName: "资料的保密性",
indexName: "资料的保密性指标",
score: 1.0000,
scoreStandard: "保密管理",
scoreBasis: "保密管理制度、日常监督检查",
indexExp: "项目公司应",
cutScore: null,
rowSpan0: 8,
rowSpan1: 8,
rowSpan2: 3,
rowSpan3: 1
},
{
id: "1638109121511301143",
mainId: "1638109121481940993",
relIndexId: 535,
relIndexIdType: 0,
acuScore: 1.0000,
questions: 0,
operUser: null,
codeId: 50,
codeName: "黄孝河、机场河水环境综合治理二期项目",
projectSubId: null,
projectSubName: null,
insOneId: 100,
insOneName: "项目管理绩效考核",
insTwoId: 150,
insTwoName: "信息公开",
insThreeId: 300,
insThreeName: "信息公开及时准确性",
indexName: "信息公开及时准确性指标",
score: 1.0000,
scoreStandard: "项目公司应及时履分，扣完为止。",
scoreBasis: "PPP 项目信息公示平台",
indexExp: "项目公司应面向公",
cutScore: null,
rowSpan0: 8,
rowSpan1: 8,
rowSpan2: 1,
rowSpan3: 1
}];
allData.tableLoadingKP = false;
return
// let param = {
// mainId: allData.oneLevelId,
// levelOne: Number(allData.kaopingtypeValue.Type),
// };
// let res = await CGKaopingGetData(param);
// if (res && res.code == 200) {
// let datas = res.data || [];
// allData.kaopingtableData = datas;
// allData.tableLoadingKP = false;
// }
}
// allData.totalScore = computed(() => {
// if (!allData.kaopingtableData || allData.kaopingtableData.length === 0) return 0;
// let total = 0;
// allData.kaopingtableData.forEach(item => {
// total += item.questions; // 假设每个item都有一个questions属性
// });
// return total;
// });
const gettotalScore = ()=>{
if (!allData.kaopingtableData || allData.kaopingtableData.length === 0) return 0;
let total = 0;
console.log( allData.kaopingtableData,' allData.kaopingtableData')
allData.kaopingtableData.forEach(item => {
total += Number(item.questions); // 假设每个item都有一个questions属性
});
allData.totalScore =total;
}
// 点击事件
const handleClick = async (type, row) => {
switch (type) {
case 'shu':
console.log('222222')
gettotalScore()
break;
case 'search':
getTableData();
break;
case 'add':
allData.modalTitle = '新增季度考核'
break;
case 'edit':
allData.kaopingShow = true;
// allData.oneLevelId = row.id;
// allData.kaopingTitle = row.performName;
// allData.kaopingtypeValue.Type = allData.radioArr[0].id;
getKaopingData();
break;
case 'delete':
$dialog.info({
title: '提示',
content: `确定删除该数据吗？`,
positiveText: '确定',
negativeText: '取消',
onPositiveClick: () => {
let ids = [row.id];
dataDel(ids);
},
});
break;
}
};
onMounted(() => {
handleClick('edit')
});
onBeforeMount(() => {
bus.off('getCurrentData');
});
return {
...toRefs(allData),
};
},
};
</script>
<style lang="less" scoped>
.monthjxPagekh {
position: relative;
height: 100%;
padding: 10px;
.searchBoxs {
height: 50px;
margin: 10px;
.name {
height: 34px;
line-height: 34px;
}
}
.nspace{
align-items: center;
}
}
.kaopingTableBtn{
width: 100%;
display: flex;
height: 60px;
justify-content: space-between;
border: 1px solid #214959;
border-top: none !important;
.kaopingTableBtnl,.kaopingTableBtnr{
display: flex;
align-items: center;
justify-content: center;
}
.kaopingTableBtnl{
width: calc(100% - 120px);
border-right: 1px solid #214959;
}
.kaopingTableBtnr{
width: 120px;
}
}
/deep/ .n-data-table-th{
vertical-align: middle;
}
</style>
