|
@@ -1,4 +1,4 @@
|
|
-<template>
|
|
|
|
|
|
+<template xmlns="http://www.w3.org/1999/html">
|
|
<div class="app-container">
|
|
<div class="app-container">
|
|
<el-row :gutter="24" >
|
|
<el-row :gutter="24" >
|
|
<el-col :span="6">
|
|
<el-col :span="6">
|
|
@@ -12,45 +12,101 @@
|
|
<el-button style="margin-left: 25px;" type="success" @click="addScoreWin">创建评分</el-button>
|
|
<el-button style="margin-left: 25px;" type="success" @click="addScoreWin">创建评分</el-button>
|
|
</div>
|
|
</div>
|
|
<div style="margin-top: 15px">
|
|
<div style="margin-top: 15px">
|
|
- <el-tree ref="date" :default-expand-all="true" :data="data" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
|
|
|
|
|
|
+ <el-tree ref="dateTree" node-key="id" :default-expand-all="true" highlight-current :data="data" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
|
|
</div>
|
|
</div>
|
|
</el-col>
|
|
</el-col>
|
|
<el-col :span="18" >
|
|
<el-col :span="18" >
|
|
- <el-header >
|
|
|
|
|
|
+ <el-header v-show="showFlag">
|
|
<div style="margin-top: 5px;font-size: 16px;font-weight: 700; display: inline-block">{{title}}</div>
|
|
<div style="margin-top: 5px;font-size: 16px;font-weight: 700; display: inline-block">{{title}}</div>
|
|
<el-form label-width="120px" style="display: inline-block">
|
|
<el-form label-width="120px" style="display: inline-block">
|
|
<el-form-item label="被评分人:" >
|
|
<el-form-item label="被评分人:" >
|
|
- <el-input type="textarea" autosize v-model="editForm.scoreUsers" :readonly="true" style="width: 350px">
|
|
|
|
|
|
+ <el-input v-model="editForm.scoreUsers" :readonly="true" style="width: 350px">
|
|
|
|
+ <el-button @click="openUsers1()" icon="el-icon-search" type="primary" slot="append"> </el-button>
|
|
</el-input>
|
|
</el-input>
|
|
- <el-button @click="openUsers1()" style="margin-left: 5px;" icon="el-icon-search" type="primary"></el-button>
|
|
|
|
|
|
+ <el-button style="margin-left: 15px" type="primary" @click="getPerformanceScoreLists">查询</el-button>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
</el-form>
|
|
</el-form>
|
|
- <div style="display: inline-block;margin-left: 25px">
|
|
|
|
|
|
+ <div style="display: inline-block;margin-left: 15px">
|
|
<el-button type="success" @click="exportOutPerformanceScore">导出绩效评分</el-button>
|
|
<el-button type="success" @click="exportOutPerformanceScore">导出绩效评分</el-button>
|
|
</div>
|
|
</div>
|
|
</el-header>
|
|
</el-header>
|
|
- <el-main>
|
|
|
|
- <el-collapse v-model="activeNames" >
|
|
|
|
- <el-collapse-item name="1">
|
|
|
|
|
|
+ <el-main v-show="showFlag1">
|
|
|
|
+ <el-collapse v-model="activeNames" @change="handleCollapseClick">
|
|
|
|
+ <div v-for="(item,index) in taskDatas" :key="index" >
|
|
|
|
+ <el-collapse-item :name="index" >
|
|
<template slot="title">
|
|
<template slot="title">
|
|
- 张三本周总计38工时,任务数量9,已完成8 <el-button @click="exportOutPerformanceScore">99</el-button>
|
|
|
|
|
|
+ <div>{{index+1}}、
|
|
|
|
+ <span v-if="item.userName.length===2">
|
|
|
|
+ {{item.userName}}
|
|
|
|
+ </span>
|
|
|
|
+ <span v-else>
|
|
|
|
+ {{item.userName}}
|
|
|
|
+ </span>
|
|
|
|
+
|
|
|
|
+ 本周总计
|
|
|
|
+ <span v-if="item.totalWorkTime<10">
|
|
|
|
+ {{item.totalWorkTime}}
|
|
|
|
+ </span>
|
|
|
|
+ <span v-else>
|
|
|
|
+ {{item.totalWorkTime}}
|
|
|
|
+ </span>
|
|
|
|
+
|
|
|
|
+ 工时,任务数量
|
|
|
|
+ <span v-if="item.totalTaskNum<10">
|
|
|
|
+ {{item.totalTaskNum}}
|
|
|
|
+ </span>
|
|
|
|
+ <span v-else>
|
|
|
|
+ {{item.totalTaskNum}}
|
|
|
|
+ </span>
|
|
|
|
+
|
|
|
|
+ ,已完成
|
|
|
|
+ <span v-if="item.completeTaskNum<10">
|
|
|
|
+ {{item.completeTaskNum}}
|
|
|
|
+ </span>
|
|
|
|
+ <span v-else>
|
|
|
|
+ {{item.completeTaskNum}}
|
|
|
|
+ </span>
|
|
|
|
+
|
|
|
|
+ </div>
|
|
|
|
+ <div style="margin-left: 200px; width: 350px">
|
|
|
|
+
|
|
|
|
+ 评分:
|
|
|
|
+ <el-input-number size="mini" v-model="item.workScore" :min="0" :max="10" :step="0.5" :precision="2" style="width: 150px" @change="userWorkScore(item,index)">
|
|
|
|
+ <el-button v-if="false" size="mini" type="primary" slot="append" @click="userWorkScore(item)">评分</el-button>
|
|
|
|
+ </el-input-number>
|
|
|
|
+
|
|
|
|
+ </div>
|
|
</template>
|
|
</template>
|
|
- <div>与现实生活一致:与现实生活的流程、逻辑保持一致,遵循用户习惯的语言和概念;</div>
|
|
|
|
- <div>在界面中一致:所有的元素和结构需保持一致,比如:设计样式、图标和文本、元素的位置等。</div>
|
|
|
|
- </el-collapse-item>
|
|
|
|
- <el-collapse-item title="反馈 Feedback" name="2">
|
|
|
|
- <div>控制反馈:通过界面样式和交互动效让用户可以清晰的感知自己的操作;</div>
|
|
|
|
- <div>页面反馈:操作后,通过页面元素的变化清晰地展现当前状态。</div>
|
|
|
|
- </el-collapse-item>
|
|
|
|
- <el-collapse-item title="效率 Efficiency" name="3">
|
|
|
|
- <div>简化流程:设计简洁直观的操作流程;</div>
|
|
|
|
- <div>清晰明确:语言表达清晰且表意明确,让用户快速理解进而作出决策;</div>
|
|
|
|
- <div>帮助用户识别:界面简单直白,让用户快速识别而非回忆,减少用户记忆负担。</div>
|
|
|
|
- </el-collapse-item>
|
|
|
|
- <el-collapse-item title="可控 Controllability" name="4">
|
|
|
|
- <div>用户决策:根据场景可给予用户操作建议或安全提示,但不能代替用户进行决策;</div>
|
|
|
|
- <div>结果可控:用户可以自由的进行操作,包括撤销、回退和终止当前操作等。</div>
|
|
|
|
|
|
+
|
|
|
|
+ <el-table :data="item.tasks" style="width: 100%" stripe>
|
|
|
|
+ <el-table-column label="序号" width="60" type="index"></el-table-column>
|
|
|
|
+ <el-table-column prop="taskName" label="任务名称" width="250" :show-overflow-tooltip="true"></el-table-column>
|
|
|
|
+ <el-table-column prop="remark" label="任务详情" :show-overflow-tooltip="true">
|
|
|
|
+ <template slot-scope="scope">
|
|
|
|
+ <div v-html="scope.row.description"></div>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="times" label="开始结束时间" width="180">
|
|
|
|
+ <template slot-scope="scope">
|
|
|
|
+ <div>{{scope.row.beginDate}}-{{scope.row.endDate}}</div>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="usedWorkTime" label="已用工时" width="80">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="taskStatus" label="任务状态" width="80">
|
|
|
|
+ <template slot-scope="scope">
|
|
|
|
+ <div v-if="scope.row.taskStatus==='4'" style="color: green">
|
|
|
|
+ 已完成
|
|
|
|
+ </div>
|
|
|
|
+ <div v-else style="color: red">
|
|
|
|
+ 进行中
|
|
|
|
+ </div>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ </el-table>
|
|
</el-collapse-item>
|
|
</el-collapse-item>
|
|
|
|
+ <br>
|
|
|
|
+ </div>
|
|
</el-collapse>
|
|
</el-collapse>
|
|
</el-main>
|
|
</el-main>
|
|
</el-col>
|
|
</el-col>
|
|
@@ -66,7 +122,7 @@
|
|
<el-radio v-model="editForm.scoreType" label="0">周度评分</el-radio>
|
|
<el-radio v-model="editForm.scoreType" label="0">周度评分</el-radio>
|
|
<el-radio v-model="editForm.scoreType" label="1">月度评分</el-radio>
|
|
<el-radio v-model="editForm.scoreType" label="1">月度评分</el-radio>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-form-item label="被评分人:">
|
|
|
|
|
|
+ <el-form-item label="被评分人:" v-if="false">
|
|
<el-input type="textarea" autosize size="mini" v-model="editForm.scoreUsers" :readonly="true" style="width: 250px">
|
|
<el-input type="textarea" autosize size="mini" v-model="editForm.scoreUsers" :readonly="true" style="width: 250px">
|
|
</el-input>
|
|
</el-input>
|
|
<el-button @click="openUsers1()" style="margin-left: 5px;" icon="el-icon-search" type="primary"></el-button>
|
|
<el-button @click="openUsers1()" style="margin-left: 5px;" icon="el-icon-search" type="primary"></el-button>
|
|
@@ -115,7 +171,12 @@
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
-import { addPerformanceScoreSet, getDateDataList, getDateListByYear } from '@/api/performance/performance'
|
|
|
|
|
|
+import {
|
|
|
|
+ addPerformanceScoreSet, editPerformanceScore,
|
|
|
|
+ getDateDataList,
|
|
|
|
+ getDateListByYear,
|
|
|
|
+ getPerformanceScoreList
|
|
|
|
+} from '@/api/performance/performance'
|
|
import { getDeptUserTree } from '@/api/system/user'
|
|
import { getDeptUserTree } from '@/api/system/user'
|
|
|
|
|
|
export default {
|
|
export default {
|
|
@@ -154,10 +215,14 @@ export default {
|
|
dateDatas:[],
|
|
dateDatas:[],
|
|
monthDatas:[],
|
|
monthDatas:[],
|
|
data: [],
|
|
data: [],
|
|
|
|
+ showFlag:false,
|
|
|
|
+ showFlag1:false,
|
|
defaultProps: {
|
|
defaultProps: {
|
|
|
|
+ id:'id',
|
|
children: 'children',
|
|
children: 'children',
|
|
label: 'label'
|
|
label: 'label'
|
|
- }
|
|
|
|
|
|
+ },
|
|
|
|
+ taskDatas:[]
|
|
};
|
|
};
|
|
},
|
|
},
|
|
mounted() {
|
|
mounted() {
|
|
@@ -174,14 +239,35 @@ export default {
|
|
let year=this.yearValue
|
|
let year=this.yearValue
|
|
getDateListByYear(year).then(res =>{
|
|
getDateListByYear(year).then(res =>{
|
|
this.data=res.data
|
|
this.data=res.data
|
|
|
|
+ if(this.data.length>0){
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
+ this.$refs.dateTree.setCurrentKey(this.data[0].children[0].children[0].id)
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ this.handleDefaultNodeClick(this.data)
|
|
});
|
|
});
|
|
},
|
|
},
|
|
|
|
+ handleDefaultNodeClick(data){
|
|
|
|
+ let d=data;
|
|
|
|
+ if(data.length>0){
|
|
|
|
+ d=data[0];
|
|
|
|
+ this.showFlag=true
|
|
|
|
+ this.showFlag1=true
|
|
|
|
+ this.title=d.children[0].children[0].label
|
|
|
|
+ }else{
|
|
|
|
+ this.showFlag=false
|
|
|
|
+ this.showFlag1=false
|
|
|
|
+ this.title=''
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+ },
|
|
handleNodeClick(data, n, component) {
|
|
handleNodeClick(data, n, component) {
|
|
- let node = this.$refs.date.getCurrentNode();
|
|
|
|
|
|
+ let node = this.$refs.dateTree.getCurrentNode();
|
|
if(node.json===null || node.json===''){
|
|
if(node.json===null || node.json===''){
|
|
|
|
|
|
}else{
|
|
}else{
|
|
- this.title=node.label
|
|
|
|
|
|
+ this.title=node.label
|
|
|
|
+ this.showFlag1=false
|
|
}
|
|
}
|
|
|
|
|
|
},
|
|
},
|
|
@@ -263,11 +349,11 @@ export default {
|
|
this.$message.warning("请输入评分名称!")
|
|
this.$message.warning("请输入评分名称!")
|
|
return
|
|
return
|
|
}
|
|
}
|
|
- let scoreUsers=editForm.scoreUsers
|
|
|
|
|
|
+ /* let scoreUsers=editForm.scoreUsers
|
|
if(scoreUsers===null || scoreUsers===''){
|
|
if(scoreUsers===null || scoreUsers===''){
|
|
this.$message.warning("请选择被评分人员!")
|
|
this.$message.warning("请选择被评分人员!")
|
|
return
|
|
return
|
|
- }
|
|
|
|
|
|
+ } */
|
|
let dateId=editForm.dateId
|
|
let dateId=editForm.dateId
|
|
if(dateId===null){
|
|
if(dateId===null){
|
|
this.$message.warning("请选择评分年月!")
|
|
this.$message.warning("请选择评分年月!")
|
|
@@ -287,6 +373,8 @@ export default {
|
|
addPerformanceScoreSet(editForm).then(res=>{
|
|
addPerformanceScoreSet(editForm).then(res=>{
|
|
this.$message.success("操作成功!")
|
|
this.$message.success("操作成功!")
|
|
this.editFormVisible=false;
|
|
this.editFormVisible=false;
|
|
|
|
+ this.editForm.scoreUsers = null
|
|
|
|
+ this.editForm.scoreUserss = null
|
|
this.getData()
|
|
this.getData()
|
|
});
|
|
});
|
|
|
|
|
|
@@ -299,19 +387,76 @@ export default {
|
|
},
|
|
},
|
|
exportOutPerformanceScore(){
|
|
exportOutPerformanceScore(){
|
|
alert('点击导出绩效评分')
|
|
alert('点击导出绩效评分')
|
|
|
|
+ },
|
|
|
|
+ handleCollapseClick(){
|
|
|
|
+ let a= event.target.tagName.toUpperCase();
|
|
|
|
+ if(a==='|' || a==='INPUT' ){
|
|
|
|
+ event.stop()
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ userWorkScore(row,index){
|
|
|
|
+ let node = this.$refs.dateTree.getCurrentNode();
|
|
|
|
+ let dateId=node.id
|
|
|
|
+ let score=row.workScore
|
|
|
|
+ if(score===undefined || score===null){
|
|
|
|
+ this.$message.error('请输入评分!')
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ let id=row.workScoreId
|
|
|
|
+ if(id===undefined){
|
|
|
|
+ id=null;
|
|
|
|
+ }
|
|
|
|
+ let data={
|
|
|
|
+ id:id,
|
|
|
|
+ userId:row.userId,
|
|
|
|
+ userName:row.userName,
|
|
|
|
+ score:score,
|
|
|
|
+ dataId:dateId
|
|
|
|
+ }
|
|
|
|
+ editPerformanceScore(data).then(res=>{
|
|
|
|
+ this.$message.success('操作成功!')
|
|
|
|
+ this.getPerformanceScoreLists()
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ getPerformanceScoreLists(){
|
|
|
|
+ let node = this.$refs.dateTree.getCurrentNode();
|
|
|
|
+ let title=this.title
|
|
|
|
+ if(node===undefined || node===null || title===''){
|
|
|
|
+ this.$message.error("请选择查询评分日期!")
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ if(node.json===undefined || node.json===null || node.json===''){
|
|
|
|
+ this.$message.error("请选择正确的评分节点!")
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ let peoples=this.editForm.scoreUserss
|
|
|
|
+ if(peoples===null || peoples===''){
|
|
|
|
+ this.$message.error("请选择被评分的人!")
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ let json=JSON.parse(node.json)
|
|
|
|
+ let beginDate=json.beginDate
|
|
|
|
+ let endDate=json.endDate
|
|
|
|
+ let dateId=node.id
|
|
|
|
+ let searchParam={
|
|
|
|
+ dataId:dateId,
|
|
|
|
+ beginDate:beginDate,
|
|
|
|
+ endDate:endDate,
|
|
|
|
+ users:peoples
|
|
|
|
+ }
|
|
|
|
+ this.showFlag=true
|
|
|
|
+ this.showFlag1=true
|
|
|
|
+ getPerformanceScoreList(searchParam).then(res=>{
|
|
|
|
+ this.taskDatas=res.data
|
|
|
|
+ });
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
<style scoped lang="scss">
|
|
- /*.el-row {
|
|
|
|
- margin-bottom: 20px;
|
|
|
|
- &:last-child {
|
|
|
|
- margin-bottom: 0;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-.el-col {
|
|
|
|
- border-radius: 2px;
|
|
|
|
-}*/
|
|
|
|
|
|
+
|
|
</style>
|
|
</style>
|