样式修改基本完成
‘wangjiuyun
parent
8d02e76518
commit
74de4ef76c
|
|
@ -157,6 +157,11 @@ export const taskApi = {
|
|||
method: 'get',
|
||||
params: data,
|
||||
}),
|
||||
getTaskListSelfNormal: (data) => request({
|
||||
url: '/task/listSelf',
|
||||
method: 'get',
|
||||
params: data,
|
||||
}),
|
||||
|
||||
getTaskList: (data) => request({
|
||||
url: '/task/get',
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="project-list flex-row jcsb">
|
||||
<div class="left">
|
||||
<div style="margin-bottom: 20px">人员绩效表</div>
|
||||
<div style="margin-bottom: 20px; font-weight: bold">组织架构</div>
|
||||
<el-tree
|
||||
:data="deptOptions"
|
||||
:expand-on-click-node="false"
|
||||
|
|
@ -10,6 +10,7 @@
|
|||
default-expand-all
|
||||
highlight-current
|
||||
@node-click="handleNodeClick"
|
||||
style="margin-left: 50px"
|
||||
/>
|
||||
</div>
|
||||
<div class="right f1">
|
||||
|
|
@ -91,13 +92,18 @@ export default {
|
|||
prop: "examineStatus",
|
||||
label: "状态",
|
||||
type: "status",
|
||||
callback: (value) => {
|
||||
if (value == 0) var color = "#333";
|
||||
else var color = "#1686d68";
|
||||
callback: (value, row) => {
|
||||
if (row.examineStatusSelf != 0 && row.examineStatus != 0)
|
||||
var color = "#333";
|
||||
else var color = "#FF7D00";
|
||||
|
||||
return `<span style="color: ${color}">${
|
||||
value == 0 ? "待评分" : "已完成"
|
||||
}</span>`;
|
||||
if (row.examineStatusSelf == 0 && row.examineStatus == 0) {
|
||||
return `<span style="color: ${color}">待个人自评/组长评分</span>`;
|
||||
} else if (row.examineStatusSelf == 0) {
|
||||
return `<span style="color: ${color}">待个人自评</span>`;
|
||||
} else {
|
||||
return `<span style="color: ${color}">待组长评分评</span>`;
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
|
|
@ -194,7 +200,7 @@ export default {
|
|||
|
||||
<style lang="scss" scoped>
|
||||
.project-list {
|
||||
padding: 20px;
|
||||
padding: 0 20px;
|
||||
background-color: white;
|
||||
height: 88vh;
|
||||
box-sizing: border-box;
|
||||
|
|
@ -205,7 +211,9 @@ export default {
|
|||
padding-top: 20px;
|
||||
width: 300px;
|
||||
height: 100%;
|
||||
box-shadow: 5px 0 5px rgba(0, 0, 0, 0.5); /* 阴影效果 */
|
||||
// box-shadow: 5px 0 5px rgba(0, 0, 0, 0.5); /* 阴影效果 */
|
||||
border-right: 1px solid #eeeeee;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.right {
|
||||
padding-top: 20px;
|
||||
|
|
@ -305,4 +313,18 @@ export default {
|
|||
width: 90px !important;
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
::v-deep .el-table {
|
||||
border: 1px solid #eee;
|
||||
border-bottom: none;
|
||||
}
|
||||
::v-deep .el-tree-node__content {
|
||||
font-weight: bold;
|
||||
}
|
||||
::v-deep .is-current>.el-tree-node__content:first-child .el-tree-node__label {
|
||||
color: #4096ff !important;
|
||||
}
|
||||
::v-deep .el-tree-node__content {
|
||||
height: 36px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,13 +1,20 @@
|
|||
<template>
|
||||
<div class="conetentBox">
|
||||
<div class="titleBox flex-row aic jcsb">
|
||||
<div class="flex-row aic">
|
||||
<div class="block"></div>
|
||||
评分详情
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-row jcsb aic userBox">
|
||||
<div>
|
||||
<el-form :inline="true" class="demo-form-inline" size="small">
|
||||
<el-form-item label="考核人员" class="form-item">
|
||||
<el-form-item label="人员姓名" class="form-item">
|
||||
<el-select
|
||||
v-model="examineId"
|
||||
placeholder="请选择"
|
||||
@change="userChange"
|
||||
style="width: 300px"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in userList"
|
||||
|
|
@ -18,11 +25,12 @@
|
|||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="考核任务" class="form-item">
|
||||
<el-form-item label="任务名称" class="form-item">
|
||||
<el-select
|
||||
v-model="examineTaskId"
|
||||
placeholder="请选择"
|
||||
@change="getUserList"
|
||||
style="width: 300px"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in taskList"
|
||||
|
|
@ -35,11 +43,25 @@
|
|||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div>考核评分：{{ score }}</div>
|
||||
</div>
|
||||
<div class="flex-row jcsb aic userBox headerBox">
|
||||
<div class="flex-row aic">
|
||||
<i
|
||||
class="el-icon-user-solid"
|
||||
style="color: #4096ff; font-size: 24px; margin-right: 5px"
|
||||
></i
|
||||
>{{ userList.find((ele) => ele.id == examineId).userName }}
|
||||
</div>
|
||||
<div class="totalBox aic" v-if="!isNormal">
|
||||
<div>考核评分：</div>
|
||||
<div class="scoreTotal">{{ score }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-tabs v-model="activeName" type="card">
|
||||
<el-tab-pane label="组长评估" name="first">
|
||||
<div class="tableBox">
|
||||
<div
|
||||
class="tableRow"
|
||||
v-for="(table, index) in tableData1"
|
||||
:key="index"
|
||||
style="margin-bottom: 20px"
|
||||
|
|
@ -52,27 +74,81 @@
|
|||
:label="header.label"
|
||||
:prop="header.prop"
|
||||
:width="header.width"
|
||||
:minWidth="header.minWidth"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column label="评分" prop="score" width="300">
|
||||
<el-table-column
|
||||
label="评分"
|
||||
prop="score"
|
||||
:minWidth="420"
|
||||
class-name="sorceTableCell"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<div style="width: 80%; position: relative">
|
||||
<div style="width: 88%; position: relative">
|
||||
<div>
|
||||
<div
|
||||
class="flex-row jcsb"
|
||||
style="
|
||||
margin-left: 10px;
|
||||
width: 90%;
|
||||
color: #999;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
"
|
||||
>
|
||||
<div>0</div>
|
||||
<div v-show="scope.row.score != 10">10</div>
|
||||
</div>
|
||||
<div
|
||||
class="scoreText aic"
|
||||
v-show="scope.row.score != 0"
|
||||
:style="{
|
||||
left: scope.row.score * 9 - 5 + '%',
|
||||
}"
|
||||
>
|
||||
<img
|
||||
src="@/assets/task/score.png"
|
||||
:style="{
|
||||
height: '28px',
|
||||
width: '34px',
|
||||
zIndex: 0,
|
||||
position: 'absolute',
|
||||
top: '0',
|
||||
}"
|
||||
alt=""
|
||||
/>
|
||||
<div
|
||||
:style="{
|
||||
zIndex: 10,
|
||||
paddingLeft: scope.row.score != 10 ? '13px' : '9px',
|
||||
}"
|
||||
>
|
||||
{{ scope.row.score }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-for="item in scope.row.score == 0
|
||||
? 0
|
||||
: scope.row.score - 1"
|
||||
:key="item"
|
||||
class="stepBox"
|
||||
:style="{
|
||||
left: item * 9 + 1.5 + '%',
|
||||
}"
|
||||
></div>
|
||||
<el-slider
|
||||
v-model="scope.row.score"
|
||||
:min="0"
|
||||
:max="10"
|
||||
disabled
|
||||
:disabled="!isEdit"
|
||||
style="width: 90%"
|
||||
show-stops
|
||||
show-tooltip
|
||||
></el-slider>
|
||||
</div>
|
||||
<div class="statusText" v-show="scope.row.score == 0">
|
||||
未打分
|
||||
</div>
|
||||
|
||||
<div class="flex-row jcsb" style="margin-left: 10px">
|
||||
<div>0</div>
|
||||
<div class="scoreText">{{ scope.row.score }}分</div>
|
||||
<div>10</div>
|
||||
暂未打分
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -88,19 +164,24 @@
|
|||
:autosize="{ minRows: 4 }"
|
||||
placeholder="0/300"
|
||||
v-model="judgeContent"
|
||||
readonly
|
||||
:readonly="!isEdit"
|
||||
maxlength="300"
|
||||
show-word-limit
|
||||
>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
</div></div
|
||||
></el-tab-pane>
|
||||
<el-tab-pane label="个人自评" name="second">
|
||||
<div class="tableBox">
|
||||
<div
|
||||
class="tableRow"
|
||||
v-for="(table, index) in tableData2"
|
||||
:key="index"
|
||||
style="margin-bottom: 20px"
|
||||
>
|
||||
<div class="userBox">表格 {{ table[0].reviewCategory }}</div>
|
||||
<div class="userBox">{{ table[0].reviewCategory }}</div>
|
||||
<el-table :data="table" style="width: 100%">
|
||||
<el-table-column
|
||||
v-for="(header, hIndex) in headers"
|
||||
|
|
@ -108,57 +189,119 @@
|
|||
:label="header.label"
|
||||
:prop="header.prop"
|
||||
:width="header.width"
|
||||
:minWidth="header.minWidth"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column label="评分" prop="score" width="300">
|
||||
<el-table-column
|
||||
label="评分"
|
||||
prop="score"
|
||||
:minWidth="320"
|
||||
class-name="sorceTableCell"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<div style="width: 80%; position: relative">
|
||||
<div style="width: 88%; position: relative">
|
||||
<div>
|
||||
<div
|
||||
class="flex-row jcsb"
|
||||
style="
|
||||
margin-left: 10px;
|
||||
width: 90%;
|
||||
color: #999;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
"
|
||||
>
|
||||
<div>0</div>
|
||||
<div v-show="scope.row.score != 10">10</div>
|
||||
</div>
|
||||
<div
|
||||
class="scoreText aic"
|
||||
v-show="scope.row.score != 0"
|
||||
:style="{
|
||||
left: scope.row.score * 9 - 5 + '%',
|
||||
}"
|
||||
>
|
||||
<img
|
||||
src="@/assets/task/score.png"
|
||||
:style="{
|
||||
height: '28px',
|
||||
width: '34px',
|
||||
zIndex: 0,
|
||||
position: 'absolute',
|
||||
top: '0',
|
||||
}"
|
||||
alt=""
|
||||
/>
|
||||
<div
|
||||
:style="{
|
||||
zIndex: 10,
|
||||
paddingLeft: scope.row.score != 10 ? '13px' : '9px',
|
||||
}"
|
||||
>
|
||||
{{ scope.row.score }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-for="item in scope.row.score == 0
|
||||
? 0
|
||||
: scope.row.score - 1"
|
||||
:key="item"
|
||||
class="stepBox"
|
||||
:style="{
|
||||
left: item * 9 + 1.5 + '%',
|
||||
}"
|
||||
></div>
|
||||
<el-slider
|
||||
v-model="scope.row.score"
|
||||
:min="0"
|
||||
:max="10"
|
||||
disabled
|
||||
@change="updateScore(scope.row)"
|
||||
:disabled="!isEdit"
|
||||
style="width: 90%"
|
||||
show-stops
|
||||
show-tooltip
|
||||
></el-slider>
|
||||
</div>
|
||||
<div class="statusText" v-show="scope.row.score == 0">
|
||||
未打分
|
||||
</div>
|
||||
|
||||
<div class="flex-row jcsb" style="margin-left: 10px">
|
||||
<div>0</div>
|
||||
<div class="scoreText">{{ scope.row.score }}分</div>
|
||||
<div>10</div>
|
||||
暂未打分
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="自评总结" prop="score" width="300">
|
||||
<el-table-column label="自评总结" prop="score">
|
||||
<template slot-scope="scope">
|
||||
<div>
|
||||
<el-button
|
||||
v-if="scope.row.remark"
|
||||
v-if="isEdit"
|
||||
@click="handleEdit(scope.row)"
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-view"
|
||||
:class="{ hasEdit: !scope.row.remark }"
|
||||
>查看</el-button
|
||||
>
|
||||
style="font-weight: 600"
|
||||
>{{ scope.row.remark ? "查看" : "暂未评价" }}
|
||||
<i
|
||||
style="color: #4096ff; font-size: 14px"
|
||||
class="el-icon-edit el-icon--right"
|
||||
></i
|
||||
></el-button>
|
||||
<el-button
|
||||
v-if="!scope.row.remark"
|
||||
v-if="!isEdit"
|
||||
@click="handleEdit(scope.row)"
|
||||
type="text"
|
||||
size="mini"
|
||||
:class="{ hasEdit: !scope.row.remark }"
|
||||
>未填写</el-button
|
||||
style="font-weight: 600"
|
||||
>{{ scope.row.remark ? "查看" : "暂未评价" }}</el-button
|
||||
>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div></div
|
||||
></el-tab-pane>
|
||||
<div></div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<el-dialog title="自评总结" :visible.sync="dialogVisible" width="30%">
|
||||
<div>
|
||||
|
|
@ -190,8 +333,12 @@ export default {
|
|||
dialogVisible: false,
|
||||
remark: "",
|
||||
headers: [
|
||||
{ label: "考核项", prop: "reviewItem", width: 300 },
|
||||
{ label: "评分标准", prop: "remarks" },
|
||||
{ label: "考核项", prop: "reviewItem", minWidth: 200 },
|
||||
{
|
||||
label: "评分标准",
|
||||
prop: "remarks",
|
||||
minWidth: 300,
|
||||
},
|
||||
],
|
||||
// 二维数组，每个子数组代表一个表格的数据
|
||||
tableData1: [],
|
||||
|
|
@ -259,7 +406,7 @@ export default {
|
|||
if (type == 0) this.tableData1 = Object.values(objData);
|
||||
else this.tableData2 = Object.values(objData);
|
||||
this.judgeContent = res.data.examineUser.judgeContent;
|
||||
this.score = res.data.examineUser.score;
|
||||
this.score = res.data.examineUser.score||res.data.examineUser.manageScore;
|
||||
});
|
||||
},
|
||||
},
|
||||
|
|
@ -271,7 +418,7 @@ export default {
|
|||
|
||||
<style scoped>
|
||||
.conetentBox {
|
||||
padding: 30px;
|
||||
padding: 40px 30px 30px;
|
||||
background-color: #fff;
|
||||
height: 90vh; /* 设置整体高度 */
|
||||
overflow: auto;
|
||||
|
|
@ -279,58 +426,128 @@ export default {
|
|||
.el-table {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.userBox {
|
||||
margin: 0 0 20px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
::v-deep .el-slider__runway {
|
||||
height: 20px;
|
||||
border-radius: 20px;
|
||||
height: 14px;
|
||||
border-radius: 10px;
|
||||
margin: 10px !important;
|
||||
/* width: 95%; */
|
||||
}
|
||||
::v-deep .el-slider__bar {
|
||||
height: 20px;
|
||||
border-radius: 20px;
|
||||
background-color: #ff5722;
|
||||
}
|
||||
::v-deep .el-slider__runway.disabled .el-slider__bar {
|
||||
height: 14px;
|
||||
border-radius: 10px;
|
||||
|
||||
background-color: #ff5722;
|
||||
}
|
||||
::v-deep .el-slider__stop {
|
||||
height: 14px;
|
||||
border-radius: 0;
|
||||
z-index: 1000;
|
||||
}
|
||||
::v-deep .el-slider__bar {
|
||||
height: 20px;
|
||||
border-radius: 20px;
|
||||
background-color: #ff5722;
|
||||
height: 14px;
|
||||
border-radius: 10px;
|
||||
background: linear-gradient(to right, #ffb144, #ff7d00);
|
||||
}
|
||||
::v-deep .el-slider__button {
|
||||
display: none;
|
||||
}
|
||||
.scoreText {
|
||||
color: #1686d8;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
font-weight: 500;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
::v-deep .el-table th {
|
||||
text-align: center;
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
::v-deep .el-table .cell {
|
||||
text-align: center;
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.statusText {
|
||||
color: #ff5722;
|
||||
color: #ff7d00;
|
||||
position: absolute;
|
||||
right: -58px;
|
||||
top: 10px;
|
||||
right: -50px;
|
||||
top: 26px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.hasEdit {
|
||||
color: #ff5722;
|
||||
color: #999999;
|
||||
}
|
||||
::v-deep .el-dialog {
|
||||
margin-top: 15% !important;
|
||||
}
|
||||
|
||||
::v-deep .el-tab-pane {
|
||||
height: 600px;
|
||||
.tableBox {
|
||||
height: 75%;
|
||||
overflow: auto;
|
||||
padding: 20px;
|
||||
background-color: #fff;
|
||||
}
|
||||
.tableBox ::v-deep .el-table {
|
||||
border-left: 1px solid #eeeeee;
|
||||
border-right: 1px solid #eeeeee;
|
||||
}
|
||||
.tableRow {
|
||||
padding: 20px;
|
||||
box-shadow: 0 0 20px #0000000f;
|
||||
}
|
||||
.titleBox {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.headerBox {
|
||||
padding: 20px;
|
||||
background-color: #f9f9f9;
|
||||
border-radius: 2px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.block {
|
||||
width: 4px;
|
||||
height: 24px;
|
||||
background-color: #4096ff;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.stepBox {
|
||||
position: absolute;
|
||||
top: 33px;
|
||||
height: 14px;
|
||||
width: 3px;
|
||||
background-color: #fff;
|
||||
z-index: 100;
|
||||
}
|
||||
.totalBox {
|
||||
width: 150px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
}
|
||||
.scoreTotal {
|
||||
font-size: 28px;
|
||||
font-weight: 700;
|
||||
color: #ff7d00;
|
||||
}
|
||||
::v-deep .sorceTableCell .cell {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
::v-deep .el-table__body .el-table__cell {
|
||||
padding: 20px 40px;
|
||||
}
|
||||
::v-deep .el-table__header .el-table__cell {
|
||||
padding: 14px 30px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@
|
|||
<el-table-column
|
||||
label="评分"
|
||||
prop="score"
|
||||
minWidth="320"
|
||||
:minWidth="isNormal ? 320 : 420"
|
||||
class-name="sorceTableCell"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
|
|
@ -186,8 +186,12 @@
|
|||
</div>
|
||||
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="cancelEdit">{{isEdit?'取 消':'关闭'}}</el-button>
|
||||
<el-button type="primary" @click="saveEdit" v-if="isEdit">确 定</el-button>
|
||||
<el-button @click="cancelEdit">{{
|
||||
isEdit ? "取 消" : "关闭"
|
||||
}}</el-button>
|
||||
<el-button type="primary" @click="saveEdit" v-if="isEdit"
|
||||
>确 定</el-button
|
||||
>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
|
@ -207,11 +211,11 @@ export default {
|
|||
remark: "",
|
||||
isEdit: "",
|
||||
headers: [
|
||||
{ label: "考核项", prop: "reviewItem", minWidth: 100 },
|
||||
{ label: "考核项", prop: "reviewItem", minWidth: 200 },
|
||||
{
|
||||
label: "评分标准",
|
||||
prop: "remarks",
|
||||
minWidth: 320,
|
||||
minWidth: 300,
|
||||
},
|
||||
],
|
||||
// 二维数组，每个子数组代表一个表格的数据
|
||||
|
|
@ -272,9 +276,11 @@ export default {
|
|||
this.examineId = res.data.examineUser.id;
|
||||
this.examineTask = res.data.examineTask;
|
||||
this.examineUser = res.data.examineUser;
|
||||
if(res.data.examineUser.examineStatusSelf==1)
|
||||
this.isEdit =false
|
||||
|
||||
if (
|
||||
res.data.examineUser.examineStatusSelf == 1 &&
|
||||
res.data.examineUser.examineStatus == 1
|
||||
)
|
||||
this.isEdit = false;
|
||||
});
|
||||
},
|
||||
handleEdit(row) {
|
||||
|
|
@ -519,6 +525,9 @@ export default {
|
|||
margin-bottom: 20px;
|
||||
}
|
||||
::v-deep .el-table__body .el-table__cell {
|
||||
padding: 20px 0;
|
||||
padding: 20px 40px;
|
||||
}
|
||||
::v-deep .el-table__header .el-table__cell {
|
||||
padding: 14px 30px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -25,7 +25,8 @@
|
|||
</div>
|
||||
<div
|
||||
class="action-buttons aic"
|
||||
@click="viewDetails(item.id, 1)"
|
||||
@click="viewDetails(item, 1)"
|
||||
:class="{ waitBtn: !item.taskEditFlag }"
|
||||
>
|
||||
考核评分
|
||||
<img
|
||||
|
|
@ -62,9 +63,10 @@
|
|||
</div>
|
||||
<div
|
||||
class="action-buttons aic"
|
||||
@click="viewDetails(item.id, 0)"
|
||||
@click="viewDetails(item, 0)"
|
||||
:class="{ waitBtn: !item.taskEditFlag }"
|
||||
>
|
||||
考核评分
|
||||
查看详情
|
||||
<img
|
||||
src="@/assets/task/right.png"
|
||||
alt=""
|
||||
|
|
@ -96,11 +98,18 @@ export default {
|
|||
this.taskList = res.data;
|
||||
});
|
||||
},
|
||||
viewDetails(id, isEdit) {
|
||||
viewDetails(row, isEdit) {
|
||||
if (!row.taskEditFlag) {
|
||||
this.$message({
|
||||
message: "分数正在计算中，请等待计算完成",
|
||||
type: "warning",
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 查看考核详情
|
||||
this.$router.push({
|
||||
path: "/workAppraisal/managerUser",
|
||||
query: { taskId: id, isEdit },
|
||||
query: { taskId: row.id, isEdit },
|
||||
});
|
||||
},
|
||||
},
|
||||
|
|
@ -208,4 +217,7 @@ export default {
|
|||
::v-deep .el-tag--warning {
|
||||
color: #ea741e;
|
||||
}
|
||||
.waitBtn{
|
||||
color: #999;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
placeholder="考核人员"
|
||||
readonly
|
||||
@click.native="openUserSelectDialog"
|
||||
style="width: 300px;"
|
||||
style="width: 300px"
|
||||
><el-button slot="append" icon="el-icon-s-custom"></el-button
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
|
|
@ -22,8 +22,7 @@
|
|||
v-model="searchForm.examineStatus"
|
||||
placeholder="状态"
|
||||
clearable
|
||||
style="width: 300px;"
|
||||
|
||||
style="width: 300px"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in statusList"
|
||||
|
|
@ -233,7 +232,7 @@ export default {
|
|||
|
||||
.demo-form-inline .el-form-item {
|
||||
// margin-right: 50px; /* 将间距设置为 30px */
|
||||
margin-bottom: 0;
|
||||
// margin-bottom: 0;
|
||||
}
|
||||
|
||||
.demo-form-inline .el-form-item:last-child {
|
||||
|
|
@ -257,7 +256,6 @@ export default {
|
|||
white-space: nowrap;
|
||||
}
|
||||
|
||||
|
||||
::v-deep .operation-column {
|
||||
background-color: #ffffff;
|
||||
box-shadow: -2px 0 5px rgba(241, 112, 6, 0.1);
|
||||
|
|
@ -315,4 +313,7 @@ export default {
|
|||
width: 90px !important;
|
||||
height: 36px;
|
||||
}
|
||||
.waitBtn {
|
||||
color: #999;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -25,9 +25,10 @@
|
|||
</div>
|
||||
<div
|
||||
class="action-buttons aic"
|
||||
@click="viewDetails(item.id, 1)"
|
||||
@click="viewDetails(item, 1)"
|
||||
:class="{ waitBtn: !item.taskEditFlag }"
|
||||
>
|
||||
考核评分
|
||||
{{ item.examineStatusSelf == 1 ? "查看详情" : "考核评分" }}
|
||||
<img
|
||||
src="@/assets/task/right.png"
|
||||
alt=""
|
||||
|
|
@ -58,11 +59,12 @@
|
|||
</div>
|
||||
<div class="status-actions aic">
|
||||
<div class="peopleNumber">
|
||||
考核人数：{{ item.peopleNumber }}
|
||||
<!-- 考核人数：{{ item.peopleNumber }} -->
|
||||
</div>
|
||||
<div
|
||||
class="action-buttons aic"
|
||||
@click="viewDetails(item.id, 0)"
|
||||
@click="viewDetails(item, 0)"
|
||||
:class="{ waitBtn: item.taskEditFlag }"
|
||||
>
|
||||
查看详情
|
||||
<img
|
||||
|
|
@ -92,25 +94,33 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
getTaks() {
|
||||
taskApi.getTaskListSelf().then((res) => {
|
||||
taskApi.getTaskListSelfNormal().then((res) => {
|
||||
this.taskList = res.data;
|
||||
});
|
||||
},
|
||||
viewDetails(id, edit) {
|
||||
viewDetails(item, edit) {
|
||||
if (!item.taskEditFlag) {
|
||||
this.$message({
|
||||
message: "分数正在计算中，请等待计算完成",
|
||||
type: "warning",
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 查看考核详情
|
||||
this.$router.push({
|
||||
path: "/workAppraisal/detail",
|
||||
query: {
|
||||
id: id,
|
||||
edit,
|
||||
isNormal: true,
|
||||
examineTaskId: id,
|
||||
examineTaskId: item.id,
|
||||
reviewType: 1,
|
||||
},
|
||||
});
|
||||
},
|
||||
},
|
||||
created() {
|
||||
console.log(123);
|
||||
|
||||
this.getTaks();
|
||||
},
|
||||
};
|
||||
|
|
@ -214,4 +224,7 @@ export default {
|
|||
::v-deep .el-tag--warning {
|
||||
color: #ea741e;
|
||||
}
|
||||
.waitBtn {
|
||||
color: #999;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@
|
|||
<el-input
|
||||
v-model="searchForm.taskName"
|
||||
placeholder="任务名称"
|
||||
style="width: 300px;"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="任务状态" class="form-item">
|
||||
|
|
@ -18,6 +19,8 @@
|
|||
v-model="searchForm.taskStatus"
|
||||
placeholder="状态"
|
||||
clearable
|
||||
style="width: 300px;"
|
||||
|
||||
>
|
||||
<el-option
|
||||
v-for="item in statusList"
|
||||
|
|
@ -31,9 +34,10 @@
|
|||
<el-date-picker
|
||||
v-model="searchForm.year"
|
||||
type="year"
|
||||
style="width: 90%"
|
||||
style="width: 300px"
|
||||
placeholder="选择年份"
|
||||
value-format="yyyy"
|
||||
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
|
|
@ -162,7 +166,7 @@
|
|||
<el-dialog title="配置指标和权重" :visible.sync="dialogVisible2">
|
||||
<div class="modal">
|
||||
<div class="left">
|
||||
<div class="setText">累计权重</div>
|
||||
<div class="setText" style="font-weight: 600">累计权重</div>
|
||||
<el-collapse
|
||||
v-model="letfValue"
|
||||
:accordion="true"
|
||||
|
|
@ -199,7 +203,7 @@
|
|||
class="flex-row jcsb"
|
||||
style="margin-top: 20px; padding-right: 15px"
|
||||
>
|
||||
<div class="setTitle">总计</div>
|
||||
<div class="setTitle" style="font-weight: 600">总计</div>
|
||||
<div class="statusText">
|
||||
{{
|
||||
scoreList.reduce((total, ele) => total + (ele.weight || 0), 0)
|
||||
|
|
@ -209,8 +213,8 @@
|
|||
</div>
|
||||
<div class="right">
|
||||
<div class="flex-row jcsb" style="margin-bottom: 10px">
|
||||
<div style="width: 50%">指标</div>
|
||||
<div class="center" style="width: 50%">权重占比</div>
|
||||
<div style="width: 50%;font-weight: 600">指标</div>
|
||||
<div class="center" style="width: 50%;font-weight: 600">权重占比</div>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
|
|
@ -224,18 +228,70 @@
|
|||
style="margin-bottom: 10px"
|
||||
class="flex-row jcsb aic"
|
||||
>
|
||||
<div style="width: 50%">{{ item.reviewItem }}</div>
|
||||
<div style="width: 50%; font-weight: 600">
|
||||
{{ item.reviewItem }}
|
||||
</div>
|
||||
<div class="center" style="width: 50%">
|
||||
<div
|
||||
class="flex-row jcsb"
|
||||
style="
|
||||
margin-left: 10px;
|
||||
width: 100%;
|
||||
color: #999;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
"
|
||||
>
|
||||
<div>0</div>
|
||||
<div v-show="item.weight != 20">20</div>
|
||||
</div>
|
||||
<div
|
||||
class="scoreText aic"
|
||||
v-show="item.weight != 0"
|
||||
:style="{
|
||||
left: item.weight * 4.5 - 2.5 + '%',
|
||||
}"
|
||||
>
|
||||
<img
|
||||
src="@/assets/task/score.png"
|
||||
:style="{
|
||||
height: '28px',
|
||||
width: '34px',
|
||||
zIndex: 0,
|
||||
position: 'absolute',
|
||||
top: '-2px',
|
||||
}"
|
||||
alt=""
|
||||
/>
|
||||
<div
|
||||
:style="{
|
||||
zIndex: 10,
|
||||
textIndent: item.weight < 10 ? '13px' : '10px',
|
||||
fontSize: '12px',
|
||||
}"
|
||||
>
|
||||
{{ item.weight }}
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="flex-row jcsb scoreBox" style="margin-left: 15px">
|
||||
<div>0%</div>
|
||||
<div class="scoreText">{{ item.weight }}%</div>
|
||||
<div>20%</div>
|
||||
</div> -->
|
||||
<div
|
||||
v-for="item in item.weight == 0 ? 0 : item.weight - 1"
|
||||
:key="item"
|
||||
class="stepBox"
|
||||
:style="{
|
||||
left: item * 5 + 4 + '%',
|
||||
}"
|
||||
></div>
|
||||
<el-slider
|
||||
v-model="item.weight"
|
||||
:max="20"
|
||||
@change="changeTotal"
|
||||
></el-slider>
|
||||
<div class="flex-row jcsb scoreBox" style="margin-left: 15px">
|
||||
<div>0%</div>
|
||||
<div class="scoreText">{{ item.weight }}%</div>
|
||||
<div>20%</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -276,7 +332,7 @@ export default {
|
|||
type: "status",
|
||||
callback: (value) => {
|
||||
if (value == 2) var color = "#999";
|
||||
else var color = "#EA741D";
|
||||
else var color = "#4096FF";
|
||||
|
||||
return `<span style="color: ${color}">${
|
||||
value ? "已过期" : "进行中"
|
||||
|
|
@ -549,7 +605,9 @@ export default {
|
|||
.forEach((ele) => {
|
||||
examineConfigList.push({ id: ele.id, weight: ele.weight });
|
||||
});
|
||||
taskApi.setTaskSet({examineConfigList,taskId:this.id}).then((res) => {
|
||||
taskApi
|
||||
.setTaskSet({ examineConfigList, taskId: this.id })
|
||||
.then((res) => {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "操作成功",
|
||||
|
|
@ -655,7 +713,7 @@ export default {
|
|||
|
||||
.demo-form-inline .el-form-item {
|
||||
// margin-right: 50px; /* 将间距设置为 30px */
|
||||
margin-bottom: 0;
|
||||
// margin-bottom: 0;
|
||||
}
|
||||
|
||||
.demo-form-inline .el-form-item:last-child {
|
||||
|
|
@ -762,16 +820,27 @@ export default {
|
|||
right: -20px;
|
||||
}
|
||||
::v-deep .el-slider__runway {
|
||||
height: 20px;
|
||||
border-radius: 20px;
|
||||
margin: 15px !important;
|
||||
height: 14px;
|
||||
border-radius: 10px;
|
||||
margin: 10px !important;
|
||||
/* width: 95%; */
|
||||
}
|
||||
::v-deep .el-slider__bar {
|
||||
height: 20px;
|
||||
border-radius: 20px;
|
||||
::v-deep .el-slider__runway.disabled .el-slider__bar {
|
||||
height: 14px;
|
||||
border-radius: 10px;
|
||||
|
||||
background-color: #ff5722;
|
||||
}
|
||||
::v-deep .el-slider__stop {
|
||||
height: 14px;
|
||||
border-radius: 0;
|
||||
z-index: 1000;
|
||||
}
|
||||
::v-deep .el-slider__bar {
|
||||
height: 14px;
|
||||
border-radius: 10px;
|
||||
background: linear-gradient(to right, #ffb144, #ff7d00);
|
||||
}
|
||||
::v-deep .el-slider__button {
|
||||
display: none;
|
||||
}
|
||||
|
|
@ -818,4 +887,34 @@ export default {
|
|||
background-color: #4096ff;
|
||||
color: #fff;
|
||||
}
|
||||
.scoreText {
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
font-weight: 500;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 40px;
|
||||
}
|
||||
.block {
|
||||
width: 4px;
|
||||
height: 24px;
|
||||
background-color: #4096ff;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.stepBox {
|
||||
position: absolute;
|
||||
top: 29px;
|
||||
height: 14px;
|
||||
width: 2px;
|
||||
background-color: #fff;
|
||||
z-index: 100;
|
||||
}
|
||||
.totalBox {
|
||||
width: 150px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue