Merge branch 'v_1.0.0' of http://gitlab.ldxinyong.com/enterpriseManagement/digitization-ui into v_1.0.0
This commit is contained in:
熊成强
commit
4116c29b9c
@ -15,6 +15,7 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.20.0",
|
||||
"dingtalk-jsapi": "^2.13.7",
|
||||
"echarts": "^4.9.0",
|
||||
"element-ui": "^2.13.2",
|
||||
"less": "^3.8.1",
|
||||
@ -44,6 +45,7 @@
|
||||
"babel-register": "^6.22.0",
|
||||
"chalk": "^2.0.1",
|
||||
"chromedriver": "^2.27.2",
|
||||
"cli": "^1.0.1",
|
||||
"copy-webpack-plugin": "^4.0.1",
|
||||
"cross-spawn": "^5.0.1",
|
||||
"css-loader": "^0.28.0",
|
||||
@ -84,7 +86,7 @@
|
||||
"vue-loader": "^13.3.0",
|
||||
"vue-style-loader": "^3.0.1",
|
||||
"vue-template-compiler": "^2.5.2",
|
||||
"webpack": "^3.6.0",
|
||||
"webpack": "^3.12.0",
|
||||
"webpack-bundle-analyzer": "^2.9.0",
|
||||
"webpack-dev-server": "^2.9.1",
|
||||
"webpack-merge": "^4.1.0"
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 发起考核
|
||||
export function apiInitiateAssessmentInfo (query) {
|
||||
return request({
|
||||
|
||||
10
src/api/login.js
Normal file
10
src/api/login.js
Normal file
@ -0,0 +1,10 @@
|
||||
import requestFuc from '@/utils/request'
|
||||
|
||||
// 钉钉免登录
|
||||
export function apiDingtalkLogin (query) {
|
||||
return requestFuc({
|
||||
url: '/lz_management/dtlg/login',
|
||||
method: 'post',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
@ -17,3 +17,20 @@ export function getStartsData (query) {
|
||||
data: query
|
||||
})
|
||||
}
|
||||
// 获取绩效排名详情
|
||||
export function getChartDetail (query) {
|
||||
return requestFuc({
|
||||
url: '/lz_management/performance/chart/detail',
|
||||
method: 'POST',
|
||||
data: query
|
||||
})
|
||||
}
|
||||
|
||||
// 获取部门信息
|
||||
export function getDepList (query) {
|
||||
return requestFuc({
|
||||
url: '/lz_management/staff/structure/deplist',
|
||||
method: 'GET',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
10
src/api/toDo.js
Normal file
10
src/api/toDo.js
Normal file
@ -0,0 +1,10 @@
|
||||
import requestFuc from '@/utils/request'
|
||||
|
||||
// 获取考核组列表
|
||||
export function apiGetWaitList (query) {
|
||||
return requestFuc({
|
||||
url: '/lz_management/performance/task/list',
|
||||
method: 'POST',
|
||||
data: query
|
||||
})
|
||||
}
|
||||
11
src/router/config_route.js
Normal file
11
src/router/config_route.js
Normal file
@ -0,0 +1,11 @@
|
||||
export default [
|
||||
{
|
||||
path: '/dingTalkLogin',
|
||||
name: 'dingTalkLogin',
|
||||
component: (resolve) => require(['@/views/login/dingTalkLogin.vue'], resolve),
|
||||
meta: {
|
||||
title: '登录',
|
||||
isNav: true
|
||||
}
|
||||
}
|
||||
]
|
||||
@ -1,17 +1,18 @@
|
||||
import Vue from 'vue'
|
||||
import Router from 'vue-router'
|
||||
import configRouter from './config_route.js'
|
||||
import kpiRouter from './kpi_route.js'
|
||||
Vue.use(Router)
|
||||
|
||||
const routes = [
|
||||
const router = [
|
||||
{
|
||||
path: '/',
|
||||
redirect: kpiRouter.length > 0 ? kpiRouter[0].redirect : '/'
|
||||
}
|
||||
].concat(kpiRouter)
|
||||
]
|
||||
|
||||
export default new Router({
|
||||
base: '/digitization/',
|
||||
mode: 'history',
|
||||
routes
|
||||
routes: [...configRouter, ...kpiRouter, ...router]
|
||||
})
|
||||
|
||||
@ -147,6 +147,13 @@ export default [
|
||||
title: '智能测试带弹窗',
|
||||
pop: true
|
||||
}
|
||||
}, {
|
||||
path: 'report-detial',
|
||||
name: 'reportDetial',
|
||||
component: (resolve) => require(['@/views/kpi/report/detail.vue'], resolve),
|
||||
meta: {
|
||||
title: '绩效详情'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@ -1,15 +1,28 @@
|
||||
@borderColor: #ebebeb;
|
||||
@fontBlue: #3ba1ff;
|
||||
@headerHeight:60px;
|
||||
.boderAndRadius{
|
||||
@headerHeight: 60px;
|
||||
|
||||
.boderAndRadius {
|
||||
border: 1px solid @borderColor;
|
||||
border-radius:6px ;
|
||||
border-radius: 6px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.commonFont {
|
||||
font-size: 16px;
|
||||
color: #52575b;
|
||||
}
|
||||
|
||||
.comonPromptFont {
|
||||
font-size: 14px;
|
||||
color: #b1b1b1;
|
||||
}
|
||||
|
||||
.common-main {
|
||||
background-color: white;
|
||||
padding: 40px 20px;
|
||||
}
|
||||
|
||||
.noSelect {
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
@ -18,7 +31,8 @@
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
.center(){
|
||||
|
||||
.center() {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@ -30,4 +44,4 @@
|
||||
// }
|
||||
// ::-webkit-scrollbar {
|
||||
// width: 0 !important;height: 0;
|
||||
// }
|
||||
// }
|
||||
|
||||
@ -25,9 +25,9 @@ const service = axios.create({
|
||||
const options = {
|
||||
fullscreen: true,
|
||||
target: document.querySelector('.appamin'),
|
||||
background: 'rgba(255, 255, 255, 0.1)',
|
||||
background: 'rgba(255, 255, 255, 0.8)',
|
||||
spinner: 'el-icon-loading',
|
||||
text: '请求加载中。。。'}
|
||||
text: '数据加载中'}
|
||||
|
||||
// request拦截器
|
||||
service.interceptors.request.use(config => {
|
||||
|
||||
@ -1,40 +1,121 @@
|
||||
<!-- -->
|
||||
<template>
|
||||
<div>
|
||||
<div>返回</div>
|
||||
<span></span>
|
||||
<div>等级分布详情<div>
|
||||
</div>
|
||||
<div>
|
||||
<el-cascader></el-cascader>
|
||||
<el-table :data="tableData"
|
||||
<div>
|
||||
<div class="title_bar">
|
||||
<div @click="handleBack">返回</div>
|
||||
<span></span>
|
||||
<div>等级分布详情</div>
|
||||
</div>
|
||||
<div class="detail_content">
|
||||
<el-cascader :options="depList" @change="handleChange" style="margin-bottom:20px" ></el-cascader>
|
||||
<el-table :data="tableData"
|
||||
border
|
||||
:header-cell-style="{ background:'#F5F7FA'}">
|
||||
<el-table-column></el-table-column>
|
||||
<el-table-column></el-table-column>
|
||||
<el-table-column></el-table-column>
|
||||
<el-table-column><el-table-column>
|
||||
:header-cell-style="{ background:'#F5F7FA'}"
|
||||
style="margin-top:20px">
|
||||
<el-table-column prop="staffName" label="姓名"></el-table-column>
|
||||
<el-table-column prop="staffNo" label="工号"></el-table-column>
|
||||
<el-table-column prop="departmentName" label="部门"></el-table-column>
|
||||
<el-table-column prop="allScore" label="考评结果"></el-table-column>
|
||||
<el-table-column prop="scoreLevel" label="实际分布"></el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getChartDetail, getDepList} from '@/api/report'
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
|
||||
// 表格数据
|
||||
tableData: [],
|
||||
// 部门数据列表
|
||||
depList: []
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
beforeMount () {},
|
||||
mounted () {},
|
||||
methods: {},
|
||||
watch: {}
|
||||
mounted () {
|
||||
this.handleDepListReq()
|
||||
this.handleDetailReq()
|
||||
},
|
||||
methods: {
|
||||
// 返回上一页
|
||||
handleBack () {
|
||||
this.$router.go(-1)
|
||||
},
|
||||
// 多选框转中处理
|
||||
handleChange (val) {
|
||||
this.handleDetailReq(val[1])
|
||||
},
|
||||
// 请求详情页面信息
|
||||
async handleDetailReq (depId) {
|
||||
let params = {
|
||||
currPage: 1,
|
||||
departmentId: depId,
|
||||
flowProcess: this.$route.query.flowProcess,
|
||||
startId: this.$route.query.startId,
|
||||
pageSize: 20
|
||||
}
|
||||
let result = await getChartDetail(params)
|
||||
this.tableData = result.data.list
|
||||
},
|
||||
// 请求部门信息
|
||||
async handleDepListReq (handleNode) {
|
||||
let params = {
|
||||
type: 0
|
||||
}
|
||||
let result = await getDepList(params)
|
||||
console.log(result)
|
||||
this.depList = this.handleDepResult(result.data)
|
||||
},
|
||||
// 递归生成可用数组
|
||||
handleDepResult (list) {
|
||||
return Array.from(list).map(item => {
|
||||
let resItem = {
|
||||
value: item.departmentId,
|
||||
label: item.departmentName
|
||||
}
|
||||
// 如果有下一级部门则递归调用
|
||||
if (item.list && item.list.length > 0) {
|
||||
let children = this.handleDepResult(item.list)
|
||||
resItem['children'] = children
|
||||
}
|
||||
return resItem
|
||||
})
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang='' scoped>
|
||||
|
||||
.title_bar{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.title_bar>:nth-child(1){
|
||||
font-size: 16px;
|
||||
color: #b4b4b4;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.title_bar>:nth-child(2){
|
||||
height: 15px ;
|
||||
width: 1px;
|
||||
background: #333;
|
||||
}
|
||||
.title_bar>:nth-child(3){
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
margin-left: 10px;
|
||||
}
|
||||
.detail_content{
|
||||
background: white;
|
||||
padding: 40px 20px;
|
||||
border:solid 1px #b4b4b4;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -27,61 +27,65 @@
|
||||
<div>{{statisticals[4].desc}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>{{statisticals[4].num}}</div>
|
||||
<div>{{statisticals[4].desc}}</div>
|
||||
<div>{{statisticals[5].num}}</div>
|
||||
<div>{{statisticals[5].desc}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>{{statisticals[4].num}}</div>
|
||||
<div>{{statisticals[4].desc}}</div>
|
||||
<div>{{statisticals[6].num}}</div>
|
||||
<div>{{statisticals[6].desc}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="num_title">考核人数分析</div>
|
||||
<div class="num_tips">
|
||||
<div class="num_title">考核人数分析</div>
|
||||
<div class="chart_content">
|
||||
<div class="num_chart">
|
||||
<div>考核人数分析</div>
|
||||
<div>参与考核部门人数</div>
|
||||
<div id="num_chart"></div>
|
||||
</div>
|
||||
<div class="num_report">
|
||||
<div id="num_chart"></div>
|
||||
<ul>
|
||||
<div>参与考核部门人数</div>
|
||||
<ul class="num_report_list">
|
||||
<li v-for="(assessItem, index) in assessNum" :key="assessItem.desc">
|
||||
<div class="rep_list">
|
||||
<div :class="handleliColor(index)">{{ index }}
|
||||
</div>
|
||||
<div>{{ assessItem.title }} {{ assessItem.num }}人</div>
|
||||
<div style="display:flex">
|
||||
<div :style="handleliColor(index)">{{index}}</div>
|
||||
<div style="margin-left:10px">{{assessItem.desc}} </div>
|
||||
</div>
|
||||
<div>{{ assessItem.num }}人</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="level_title">结果分析</div>
|
||||
<div class="level_tips">等级分布</div>
|
||||
<div class="reslut_display">
|
||||
</div>
|
||||
<div class="level_title">结果分析</div>
|
||||
<div class="level_content">
|
||||
<div class="level_chart">
|
||||
<div class="level_tips">等级分布</div>
|
||||
<div id="level_chart"></div>
|
||||
<el-table :data="tableData"
|
||||
:header-cell-style="{ background:'#F5F7FA'}"
|
||||
border
|
||||
style="flex:1">
|
||||
<el-table-column prop="desc" label="绩效等级" width="200">
|
||||
</el-table-column>
|
||||
<el-table-column prop="num" label="实际分布" width="200">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
@click.native.prevent="
|
||||
handleDetailClick(scope.$index, tableData)
|
||||
"
|
||||
</div>
|
||||
<el-table :data="tableData"
|
||||
:header-cell-style="{ background:'#F5F7FA'}"
|
||||
border
|
||||
style="flex-grow:2;margin-top:20px">
|
||||
<el-table-column prop="desc" label="绩效等级">
|
||||
</el-table-column>
|
||||
<el-table-column prop="num" label="实际分布">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
@click.native.prevent="handleDetailClick(scope.$index, scope.row)"
|
||||
type="text"
|
||||
size="small"
|
||||
>
|
||||
查看详情
|
||||
查看详情
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -102,6 +106,8 @@ export default {
|
||||
// 当前选择的月份
|
||||
pickerTime: '',
|
||||
//
|
||||
startId: '',
|
||||
//
|
||||
statisticals: [
|
||||
{num: '0', desc: '参与人数'},
|
||||
{num: '0', desc: '目标制定'},
|
||||
@ -249,12 +255,19 @@ export default {
|
||||
return {
|
||||
width: '20px',
|
||||
height: '20px',
|
||||
'text-align': 'center',
|
||||
'line-height': '20px',
|
||||
color: 'white',
|
||||
background: color
|
||||
}
|
||||
},
|
||||
//
|
||||
// 页面跳转
|
||||
handleDetailClick (index, rows) {
|
||||
|
||||
this.$router.push({
|
||||
path: ('report-detial'),
|
||||
query: {startId: this.startId, flowProcess: rows.desc}
|
||||
})
|
||||
console.log(this.$router)
|
||||
},
|
||||
// Y轴坐标计算，取靠近最大值的3的倍数作为上限，然后划分成4个刻度(0为初始刻度)
|
||||
handleChartYMul (val) {
|
||||
@ -274,7 +287,7 @@ export default {
|
||||
},
|
||||
//
|
||||
handleChange (val) {
|
||||
console.log(val)
|
||||
this.startId = val[1]
|
||||
this.handleChartDataReq(val[1])
|
||||
},
|
||||
// 获取报表内容
|
||||
@ -284,7 +297,7 @@ export default {
|
||||
}
|
||||
try {
|
||||
const result = await getChartData(params)
|
||||
result.forEach((val, index) => {
|
||||
result.data.forEach((val, index) => {
|
||||
console.log(val)
|
||||
if (val.type === 0) {
|
||||
// 头部数据
|
||||
@ -300,6 +313,7 @@ export default {
|
||||
this.assessNum = val.statisticals
|
||||
this.option.series[0].data = Array.from(this.assessNum).map(item => (item.num))
|
||||
this.option.xAxis[0].data = Array.from(this.assessNum).map(item => (item.desc))
|
||||
console.log(this.option.xAxis[0].data)
|
||||
this.handleNumChart()
|
||||
}
|
||||
})
|
||||
@ -316,8 +330,7 @@ export default {
|
||||
}
|
||||
try {
|
||||
let res = await getStartsData(params)
|
||||
res = res.data
|
||||
handleNode(res)
|
||||
handleNode(res.data)
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
@ -329,10 +342,8 @@ export default {
|
||||
|
||||
<style lang='' scoped>
|
||||
.report_content {
|
||||
width: fit-content;
|
||||
height: fit-content;
|
||||
background: white;
|
||||
border-style: #fcfcfc solid 3px;
|
||||
border: #fcfcfc solid 1px;
|
||||
margin-top:20px;
|
||||
padding-top:40px;
|
||||
padding-left: 20px;
|
||||
@ -340,17 +351,13 @@ export default {
|
||||
}
|
||||
.header {
|
||||
background: #fcfcfc;
|
||||
width: fit-content;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.header > div {
|
||||
display: inline-block;
|
||||
width: fit-content;
|
||||
height: fit-content;
|
||||
padding-top: 20px;
|
||||
padding-bottom: 20px;
|
||||
padding-left: 30px;
|
||||
padding-right: 30px;
|
||||
flex-grow: 1;
|
||||
text-align: center;
|
||||
padding:20px
|
||||
}
|
||||
.header > div > div:nth-child(1) {
|
||||
color: black;
|
||||
@ -366,28 +373,48 @@ export default {
|
||||
background: #333333;
|
||||
height: 30px;
|
||||
width: 1px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.num_title{
|
||||
margin-top:20px;
|
||||
margin-bottom: 25px;
|
||||
color: #333333;
|
||||
}
|
||||
.num_tips > div:nth-child(1) {
|
||||
display: inline-block;
|
||||
color: #3a3a3a;
|
||||
font-size: 14px;
|
||||
width: fit-content;
|
||||
padding-left: 20px;
|
||||
position: relative;
|
||||
.chart_content{
|
||||
display: flex;
|
||||
}
|
||||
.num_tips > div:nth-child(2) {
|
||||
display: inline-block;
|
||||
.num_tips{
|
||||
display: flex;
|
||||
}
|
||||
.num_chart {
|
||||
flex-grow: 1;
|
||||
}
|
||||
.num_chart>:nth-child(1){
|
||||
color: #3a3a3a;
|
||||
font-size: 14px;
|
||||
width: fit-content;
|
||||
padding-left: 50%;
|
||||
position: relative;
|
||||
padding-left: 20px;
|
||||
}
|
||||
.num_report {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.num_report>:nth-child(1){
|
||||
color: #3a3a3a;
|
||||
font-size: 14px;
|
||||
}
|
||||
.num_report_list{
|
||||
margin-top: 20px;
|
||||
height: 360px;
|
||||
overflow:auto
|
||||
}
|
||||
.rep_list{
|
||||
width: 200px;
|
||||
display: flex;
|
||||
margin-bottom: 10px;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.rep_list>:nth-child(2){
|
||||
text-align: start;
|
||||
}
|
||||
.level_title{
|
||||
margin-top:20px;
|
||||
@ -404,20 +431,19 @@ export default {
|
||||
.num_report{
|
||||
display: flex
|
||||
}
|
||||
.rep_list{
|
||||
display: flex;
|
||||
}
|
||||
#num_chart {
|
||||
display: inline-block;
|
||||
width: 600px;
|
||||
widows: 500px;
|
||||
height: 360px;
|
||||
}
|
||||
.reslut_display {
|
||||
.level_content{
|
||||
display: flex;
|
||||
}
|
||||
.level_chart {
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
}
|
||||
#level_chart {
|
||||
width: 600px;
|
||||
width: 500px;
|
||||
height: 360px;
|
||||
flex: 1;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<!-- -->
|
||||
<template>
|
||||
<div class="set-mian commonFont">
|
||||
<div class="set-mian commonFont common-main">
|
||||
<el-menu
|
||||
:default-active="activeIndex"
|
||||
mode="horizontal"
|
||||
@ -47,8 +47,7 @@ export default {
|
||||
|
||||
<style lang='less' scoped>
|
||||
.set-mian {
|
||||
background-color: white;
|
||||
min-height: 600px;
|
||||
padding: 25px;
|
||||
padding-top: 0px;
|
||||
min-height: 600px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="initiate-assessment commonFont">
|
||||
<div class="initiate-assessment commonFont common-main">
|
||||
<el-form
|
||||
:model="formData"
|
||||
:rules="formRules"
|
||||
@ -138,7 +138,7 @@
|
||||
</el-table>
|
||||
<div
|
||||
v-else
|
||||
class="popup-empty"
|
||||
class="popup-empty comonPromptFont"
|
||||
>
|
||||
<img
|
||||
src=""
|
||||
@ -290,7 +290,7 @@ export default {
|
||||
apiInitiateAssessmentInfo(para).then(res => {
|
||||
this.dialogSendVisible = false
|
||||
console.log('发起考核成功', res)
|
||||
this.$router.push({name: 'assessment-stepList', query: {id: res.data.id, name: 'assessment-homeList'}})
|
||||
this.$router.push({ name: 'assessment-stepList', query: { id: res.data.id, name: 'assessment-homeList' } })
|
||||
this.$message({
|
||||
message: res.msg,
|
||||
type: 'success'
|
||||
@ -338,36 +338,34 @@ export default {
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.initiate-assessment {
|
||||
padding: 25px;
|
||||
background-color: white;
|
||||
min-height: 600px;
|
||||
.title {
|
||||
margin-bottom: 25px;
|
||||
min-height: 600px;
|
||||
.title {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
.choose-group {
|
||||
margin-top: 200px;
|
||||
}
|
||||
.line-space {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.popup {
|
||||
&-search {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.choose-group {
|
||||
margin-top: 150px;
|
||||
&-empty {
|
||||
padding-top: 100px;
|
||||
height: 500px;
|
||||
width: 410px;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
display: block;
|
||||
align-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.line-space {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.popup {
|
||||
&-search {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
&-empty {
|
||||
padding-top: 100px;
|
||||
height: 500px;
|
||||
width: 410px;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
display: block;
|
||||
align-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
&-footer-left {
|
||||
color: @fontBlue;
|
||||
}
|
||||
&-footer-left {
|
||||
color: @fontBlue;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,18 +1,96 @@
|
||||
<!-- -->
|
||||
<template>
|
||||
<div class="todo">
|
||||
<small-nav />
|
||||
<div class="todo-content boderAndRadius">
|
||||
待办事项
|
||||
<div class="todo commonFont">
|
||||
<small-nav />
|
||||
<div class="todo-content boderAndRadius">
|
||||
<div class="todo-content-left">
|
||||
<el-menu
|
||||
@select="handleMenuSeledt"
|
||||
:default-active="activeIndex"
|
||||
style=" width: 200px; height: 100%;"
|
||||
>
|
||||
<el-menu-item index="0">待处理{{waitCount>0?'（' +waitCount + '）':''}}</el-menu-item>
|
||||
<el-menu-item index="1">已处理</el-menu-item>
|
||||
</el-menu>
|
||||
</div>
|
||||
<div class="todo-content-right">
|
||||
<div v-if="selectedTableList.length > 0">
|
||||
<el-table
|
||||
:data="selectedTableList"
|
||||
@row-click="handleRowClick"
|
||||
:show-header="false"
|
||||
style="border-top: 1px solid #ebebeb;"
|
||||
max-height="500"
|
||||
>
|
||||
<el-table-column width="100">
|
||||
<template slot-scope="scope">
|
||||
<img
|
||||
:src="scope.row.avatar"
|
||||
class="todo-content-right-avatar"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="title"></el-table-column>
|
||||
<el-table-column
|
||||
width="200"
|
||||
align="right"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.time}}<i class="el-icon-arrow-right"></i>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
:hide-on-single-page="true"
|
||||
:current-page.sync="pageSelectedInfo.currPage"
|
||||
:page-size="pageSelectedInfo.pageSize"
|
||||
:total="pageSelectedInfo.totalCount"
|
||||
:page-count="pageSelectedInfo.totalPage"
|
||||
@current-change="handleCurrentChange"
|
||||
layout="total, prev, pager, next, jumper"
|
||||
></el-pagination>
|
||||
</div>
|
||||
<div
|
||||
v-else
|
||||
class="todo-content-right-empty comonPromptFont"
|
||||
>
|
||||
<img src="ssss" />
|
||||
<div>暂无代办</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SmallNav from '@/components/kpi-layout/SmallNav'
|
||||
import { apiGetWaitList } from '@/api/toDo'
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
activeIndex: '0',
|
||||
waitCount: 0,
|
||||
// 选中项
|
||||
selectedTableList: [],
|
||||
pageSelectedInfo: {
|
||||
currPage: 1,
|
||||
pageSize: 20,
|
||||
status: 0,
|
||||
totalCount: 1,
|
||||
totalPage: 1
|
||||
},
|
||||
// 待处理
|
||||
waitTableList: [],
|
||||
// 已处理
|
||||
pageWaitInfo: {},
|
||||
processedTableList: [],
|
||||
pageProcessedInfo: {
|
||||
currPage: 1,
|
||||
pageSize: 20,
|
||||
status: 1,
|
||||
totalCount: 1,
|
||||
totalPage: 1
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
@ -20,9 +98,59 @@ export default {
|
||||
SmallNav
|
||||
},
|
||||
computed: {},
|
||||
beforeMount () {},
|
||||
mounted () {},
|
||||
beforeMount () { },
|
||||
mounted () {
|
||||
this.handleGetList()
|
||||
},
|
||||
methods: {
|
||||
handleGetList () {
|
||||
apiGetWaitList(this.pageSelectedInfo).then(res => {
|
||||
this.pageSelectedInfo.currPage = res.data.currPage
|
||||
this.pageSelectedInfo.totalCount = res.data.totalCount
|
||||
this.pageSelectedInfo.totalPage = res.data.totalPage
|
||||
if (this.activeIndex === '0') {
|
||||
// 待处理事项
|
||||
this.waitCount = res.data.totalCount
|
||||
}
|
||||
this.selectedTableList = res.data.list
|
||||
console.log('待处理', res)
|
||||
})
|
||||
},
|
||||
handleMenuSeledt (val) {
|
||||
console.log('index ======', this.activeIndex)
|
||||
console.log(val)
|
||||
if (this.activeIndex !== val) {
|
||||
console.log('menu 切换')
|
||||
// 待处理 已处理 数据切换
|
||||
if (val === '0') {
|
||||
console.log('menu 0')
|
||||
this.processedTableList = this.selectedTableList
|
||||
this.pageProcessedInfo = this.pageSelectedInfo
|
||||
this.selectedTableList = this.waitTableList
|
||||
this.pageSelectedInfo = this.pageWaitInfo
|
||||
} else {
|
||||
console.log('menu 1')
|
||||
this.waitTableList = this.selectedTableList
|
||||
this.pageWaitInfo = this.pageSelectedInfo
|
||||
this.selectedTableList = this.processedTableList
|
||||
this.pageSelectedInfo = this.pageProcessedInfo
|
||||
}
|
||||
// 如果是第一页 刷新
|
||||
console.log(this.pageSelectedInfo)
|
||||
if (this.pageSelectedInfo.currPage === 1) {
|
||||
this.handleGetList()
|
||||
}
|
||||
}
|
||||
this.activeIndex = val
|
||||
},
|
||||
handleCurrentChange (val) {
|
||||
// 页面变更
|
||||
this.pageSelectedInfo.currPage = val
|
||||
this.handleGetList()
|
||||
},
|
||||
handleRowClick (row) {
|
||||
this.$router.push({ name: 'assessment-stepList', query: { id: row.recordId } })
|
||||
}
|
||||
},
|
||||
watch: {}
|
||||
|
||||
@ -31,11 +159,48 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang='less' scoped>
|
||||
.todo{
|
||||
&-content{
|
||||
.todo {
|
||||
&-content {
|
||||
width: 1252px;
|
||||
min-height: 537px;
|
||||
min-height: 278px;
|
||||
padding: 28px;
|
||||
display: flex;
|
||||
&-left {
|
||||
width: 200px;
|
||||
float: left;
|
||||
.el-menu-item.is-active {
|
||||
background-color: #ecf4ff !important;
|
||||
border-left: 3px solid #409eff;
|
||||
color: #999;
|
||||
span {
|
||||
color: #999 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
&-right {
|
||||
// border-left: 2px solid @borderColor;
|
||||
// padding-left: 20px;
|
||||
padding: 20px;
|
||||
flex: 1;
|
||||
&-avatar {
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
border-radius: 17px;
|
||||
}
|
||||
.el-pagination {
|
||||
text-align: right;
|
||||
margin-top: 20px;
|
||||
}
|
||||
&-empty {
|
||||
padding-top: 20px;
|
||||
img {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
56
src/views/login/dingTalkLogin.vue
Normal file
56
src/views/login/dingTalkLogin.vue
Normal file
@ -0,0 +1,56 @@
|
||||
<template>
|
||||
<div>
|
||||
<h2 class="brand-info__text">{{dataForm.verify}}</h2>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as dd from 'dingtalk-jsapi'
|
||||
import { apiDingtalkLogin } from '@/api/login'
|
||||
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
dataForm: {
|
||||
verify: '身份验证中...'
|
||||
},
|
||||
dingCode: '' // 获取钉钉授权码
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.handleGetDingtalkCode()
|
||||
},
|
||||
mounted () {},
|
||||
methods: {
|
||||
// 获取钉钉鉴权码
|
||||
handleGetDingtalkCode () {
|
||||
dd.runtime.permission.requestAuthCode({
|
||||
corpId: 'ding267474e759bbca1c35c2f4657eb6378f',
|
||||
onSuccess (res) {
|
||||
console.log('result===', res)
|
||||
this.dingCode = res
|
||||
this.handleDingtalkLogin(res)
|
||||
},
|
||||
onFail (err) {
|
||||
console.log('err===', err)
|
||||
this.dingCode = err
|
||||
}
|
||||
})
|
||||
},
|
||||
// 钉钉免登录
|
||||
handleDingtalkLogin (res) {
|
||||
apiDingtalkLogin(res).then(res => {
|
||||
if (res && res.code === 0) {
|
||||
this.$cookie.set('token', res.token)
|
||||
this.dataForm.verify = '登录成功，跳转中...'
|
||||
window.open(window.location.protocol + '//' + window.location.host + '/kpi/workbench/home&code=' + this.dingCode.code, '_blank')
|
||||
} else {
|
||||
this.dataForm.verify = '身份验证失败' + res.msg
|
||||
this.$message.error(this.dataForm.verify)
|
||||
this.$router.replace({ name: 'dingTalkLogin' })
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Loading…
x
Reference in New Issue
Block a user