297 lines
10 KiB
Vue
297 lines
10 KiB
Vue
<template>
|
||
<div class="usermanage">
|
||
<!-- 组织机构信息 -->
|
||
<div class="right">
|
||
<div class="title">
|
||
<span>
|
||
（ <span class="left10">岗位类型</span>：<dict-tag :options="KHLX" :value="data.fromObj.grade" :tag="false"
|
||
color="red" />
|
||
<span class="left10">考核岗位</span>：<span style="color: red;">{{ data.fromObj.name }}</span>
|
||
<span class="left10">适用范围</span>：<dict-tag :options="GWSYFY" :value="data.fromObj.assignLv" :tag="false"
|
||
color="red" />）
|
||
</span>
|
||
<span>当前已分配 </span>
|
||
<span style="margin-right: 20px;">
|
||
<span class="score" style="color: green;font-size: 25px;font-weight: 900;"> {{ total }} </span>
|
||
分</span>
|
||
<span>未分配分数 </span>
|
||
<span style="margin-right: 50px;"><span class="score" style="color: red;font-size: 25px;font-weight: 900;">
|
||
{{ 100 - total < 0 ? 0 : 100 - total }} </span> 分</span>
|
||
<el-button @click="black">关闭</el-button>
|
||
<el-button type="primary" v-if="data.config.saveBtnShow" @click="submit()">保存</el-button>
|
||
|
||
</div>
|
||
<el-form :disabled="!data.config.saveBtnShow">
|
||
<div class="bottom" style="color: #000;">
|
||
<div>
|
||
<table border="1" cellpadding="15" cellSpacing="0" style="border-color: green;width: 100%;">
|
||
<thead>
|
||
<tr>
|
||
<th style="width: 10%;text-align: center; font-weight: bold;color: #000;">评价项目</th>
|
||
<th style="width: 5%;text-align: center; font-weight: bold;color: #000;" align="center"></th>
|
||
<th style="width: 10%;text-align: center; font-weight: bold;color: #000;" align="center">评价要素</th>
|
||
<th style="width: 20%;text-align: center; font-weight: bold;color: #000;" align="center">评价内容</th>
|
||
<th style="width:20%;text-align: center; font-weight: bold;color: #000;" align="center">评价规则</th>
|
||
<th style="width: 10%;text-align: center; font-weight: bold;color: #000;" align="center">评价分值</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr v-for="item in list" :key="item.id">
|
||
<td v-if="item.parentname" :rowspan="item.rowspan"
|
||
style="vertical-align: middle;font-weight: bold;color: #000;" align="center">{{
|
||
item.parentname }}
|
||
</td>
|
||
<td class="uucheck" align="center">
|
||
<div class="checkbox icheck-success">
|
||
<el-checkbox v-model="item.checked" size="large" />
|
||
</div>
|
||
</td>
|
||
<td :style="{ color: item.checked ? '#333' : '#999' }" align="center">{{ item.name }}</td>
|
||
<td :style="{ color: item.checked ? '#333' : '#999' }">{{ item.appraiseContent }}</td>
|
||
<td :style="{ color: item.checked ? '#333' : '#999' }">
|
||
{{ item.note }}
|
||
<span v-if="item.configflag == 'Y'">(
|
||
<span style="font-weight: bold;">配置</span>
|
||
<span v-if="item.p1name" style="margin-left: 8px;">
|
||
{{ item.p1name }}
|
||
<el-input type="number" :min="0" v-model="item.p1" style="width: 120px;"
|
||
@blur="inputNumber(item, $event.target.value, 'p1')" />
|
||
</span>
|
||
<span v-if="item.p2name" style="margin-left: 8px;">
|
||
{{ item.p2name }}
|
||
<el-input type="number" :min="0" v-model="item.p2" style="width: 120px;"
|
||
@blur="inputNumber(item, $event.target.value, 'p2')" />
|
||
</span>
|
||
<span v-if="item.p3name" style="margin-left: 8px;">
|
||
{{ item.p3name }}
|
||
<el-input type="number" :min="0" v-model="item.p3" style="width: 120px;"
|
||
@blur="inputNumber(item, $event.target.value, 'p3')" />
|
||
</span>
|
||
)</span>
|
||
</td>
|
||
<td v-if="item.scoreflag == 'N' && item.parentname != null" :rowspan="item.rowspan"
|
||
style="text-align: center;vertical-align: middle;">
|
||
10分
|
||
</td>
|
||
<td v-if="item.scoreflag == 'F' && item.parentname != null" :rowspan="item.rowspan"
|
||
style="text-align: center;vertical-align: middle;">
|
||
一票否决
|
||
</td>
|
||
<td v-if="item.scoreflag == 'K' && item.parentname != null" :rowspan="item.rowspan"
|
||
style="text-align: center;vertical-align: middle;">
|
||
</td>
|
||
<td v-if="item.pscoreflag != 'N' && item.pscoreflag != 'F' && item.pscoreflag != 'K'" align="center"
|
||
style="text-align: center;">
|
||
<div class="spinner" :style="{ display: item.checked ? 'block' : 'none' }">
|
||
<div style="display: flex;align-items: center;justify-content: center;">
|
||
<el-button plain @click="down(item)">-</el-button>
|
||
<el-input type="number" :min="0" :max="100" v-model="item.modelScore" style="width: 60px;"
|
||
@blur="inputNumber(item, $event.target.value, 'modelScore')" />
|
||
<el-button plain @click="item.modelScore += 1">+</el-button>
|
||
</div>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</el-form>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<style lang="scss" scoped>
|
||
.usermanage {
|
||
.right {
|
||
height: calc(100%);
|
||
width: calc(100%);
|
||
padding: 0 10px;
|
||
box-sizing: border-box;
|
||
|
||
.bottom {
|
||
max-height: calc(100vh - 200px);
|
||
overflow: auto;
|
||
width: 100%;
|
||
}
|
||
|
||
.title {
|
||
color: black;
|
||
height: 50px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
line-height: 50px;
|
||
|
||
width: 100%;
|
||
text-align: center;
|
||
font-size: 18px;
|
||
|
||
.left10 {
|
||
margin-left: 10px;
|
||
}
|
||
|
||
>span {
|
||
.score {
|
||
margin: 0 10px;
|
||
}
|
||
|
||
>div {
|
||
display: inline-block;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|
||
<script setup>
|
||
import { reactive, ref, watchEffect, getCurrentInstance, computed } from "vue";
|
||
import { ElMessage, ElMessageBox } from "element-plus";
|
||
import { getApi, postApi } from "@/api/tobAcco_api.js";
|
||
const { proxy } = getCurrentInstance();
|
||
const { KHLX, GWSYFY } = proxy.$dict("KHLX", "GWSYFY");
|
||
const emit = defineEmits("changePage");
|
||
const props = defineProps({
|
||
editObj: {
|
||
type: Object,
|
||
default: () => { }
|
||
}
|
||
});
|
||
const data = reactive({
|
||
fromObj: {},
|
||
});
|
||
// 列表数据
|
||
const list = ref([])
|
||
// 计算总分
|
||
const total = computed(() => {
|
||
let count = 0;
|
||
let pidmp = {};
|
||
for (let index in list.value) {
|
||
if (!list.value[index].checked) continue;
|
||
let pid = list.value[index].pid;
|
||
pidmp[pid] = 'Y';
|
||
let tmpscore = list.value[index].modelScore;
|
||
if (tmpscore != null && tmpscore != '') {
|
||
if (parseInt(tmpscore)) {
|
||
count += parseInt(tmpscore);
|
||
}
|
||
} else {
|
||
list.value[index].modelScore = 0;
|
||
}
|
||
}
|
||
for (let index in list.value) {
|
||
if (list.value[index].parentname != null) {
|
||
if (pidmp[list.value[index].pid] != null) {
|
||
list.value[index].color = { color: '#333' }
|
||
} else {
|
||
list.value[index].color = { color: '#ccc' }
|
||
}
|
||
}
|
||
}
|
||
return count;
|
||
});
|
||
// 填写分数
|
||
const inputNumber = (item, value, column) => {
|
||
if (value != null && value != '' && value != NaN) {
|
||
item[column] = parseInt(value.replace(/[^\d]/g, ''));
|
||
if (item[column] == "") {
|
||
item[column] = 0;
|
||
}
|
||
} else {
|
||
item[column] = 0;
|
||
}
|
||
}
|
||
// 减分
|
||
const down = (item) => {
|
||
item.modelScore -= 1;
|
||
if (item.modelScore < 0) {
|
||
item.modelScore = 0;
|
||
}
|
||
}
|
||
// 获取配置项列表详情
|
||
const getTableData = (id) => {
|
||
getApi({}, "/mosty-jcgl/station/modelInfo?id=" + id).then(
|
||
(res) => {
|
||
let tList = res.list;
|
||
if (res && res.list.length > 0) {
|
||
let parentChirdens = {};
|
||
let parentList = [];
|
||
let ulist = [];
|
||
for (let index in tList) {
|
||
let pid = tList[index].pid;
|
||
if (pid == "0") {
|
||
parentList.push(tList[index]);
|
||
} else {
|
||
if (parentChirdens[pid] == null) {
|
||
parentChirdens[pid] = [];
|
||
}
|
||
parentChirdens[pid].push(tList[index]);
|
||
}
|
||
}
|
||
for (let index in parentList) {
|
||
let uItem = parentList[index];
|
||
// 父级
|
||
let pid = uItem.id.replace(res.citycode, '');
|
||
if (parentChirdens[pid] != null) {
|
||
let temparr = parentChirdens[pid];
|
||
for (let ind in temparr) {
|
||
if (ind == 0) {
|
||
temparr[0].parentname = uItem.name;
|
||
temparr[0].rowspan = temparr.length;
|
||
temparr[0].scoreflag = uItem.scoreflag;
|
||
}
|
||
temparr[ind].pscoreflag = uItem.scoreflag;
|
||
}
|
||
ulist = ulist.concat(temparr);
|
||
}
|
||
}
|
||
list.value = ulist;
|
||
}
|
||
}
|
||
);
|
||
}
|
||
// 返回
|
||
const black = () => {
|
||
proxy.$modal.confirm('离开会丢失页面中修改的内容，确认离开吗？')
|
||
.then(() => {
|
||
emit("changePage", "Main");
|
||
})
|
||
.catch(() => {
|
||
// catch error
|
||
})
|
||
|
||
};
|
||
// 保存
|
||
const submit = async () => {
|
||
let params = {
|
||
id: data.config.id,
|
||
itemList: list.value
|
||
}
|
||
ElMessageBox.confirm("确定保存当前修改？", "提示").then(() => {
|
||
postApi(params, `/mosty-jcgl/station/saveInfo`).then(() => {
|
||
ElMessage.success("保存成功");
|
||
}
|
||
);
|
||
});
|
||
};
|
||
//获取详情
|
||
function getMain(id) {
|
||
if (id) {
|
||
getApi({ id: id }, "/mosty-jcgl/station/getStationInfo").then(
|
||
(res) => {
|
||
if (res) {
|
||
data.fromObj = res;
|
||
}
|
||
}
|
||
);
|
||
}
|
||
}
|
||
watchEffect(() => {
|
||
if (props.editObj) {
|
||
data.config = props.editObj;
|
||
}
|
||
getMain(data.config.id);
|
||
getTableData(data.config.id);
|
||
});
|
||
</script>
|