Skip to content

A
attendance-performance-platform
Commit adcd440a authored by 姬鋆屾's avatar 姬鋆屾
Browse files
Options

推添加绩效系统功能

parent 9d25b0a7
Hide whitespace changes
Inline Side-by-side
Showing with 2810 additions and 806 deletions
attendance-performance-manager-ui/admin/package-lock.json
View file @ adcd440a
......@@ -6444,9 +6444,8 @@
},
"node_modules/echarts": {
"version": "4.9.0",
"resolved": "https://registry.nlark.com/echarts/download/echarts-4.9.0.tgz",
"integrity": "sha1-qbm6oD8Doqcx5jQMVb77V6nhNH0=",
"license": "Apache-2.0",
"resolved": "https://registry.npmjs.org/echarts/-/echarts-4.9.0.tgz",
"integrity": "sha512-+ugizgtJ+KmsJyyDPxaw2Br5FqzuBnyOWwcxPKO6y0gc5caYcfnEUIlNStx02necw8jmKmTafmpHhGo4XDtEIA==",
"dependencies": {
"zrender": "4.3.2"
}
......@@ -22406,8 +22405,8 @@
},
"echarts": {
"version": "4.9.0",
"resolved": "https://registry.nlark.com/echarts/download/echarts-4.9.0.tgz",
"integrity": "sha1-qbm6oD8Doqcx5jQMVb77V6nhNH0=",
"resolved": "https://registry.npmjs.org/echarts/-/echarts-4.9.0.tgz",
"integrity": "sha512-+ugizgtJ+KmsJyyDPxaw2Br5FqzuBnyOWwcxPKO6y0gc5caYcfnEUIlNStx02necw8jmKmTafmpHhGo4XDtEIA==",
"requires": {
"zrender": "4.3.2"
}
attendance-performance-manager-ui/admin/src/assets/images/u17641.svg 0 → 100644
View file @ adcd440a
<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="18px" height="18px" xmlns="http://www.w3.org/2000/svg">
<g transform="matrix(1 0 0 1 -72 -264 )">
<path d="M 81 268.5 C 83.52 268.5 85.5 270.48 85.5 273 C 85.5 275.52 83.52 277.5 81 277.5 C 78.48 277.5 76.5 275.52 76.5 273 C 76.5 270.48 78.48 268.5 81 268.5 Z " fill-rule="nonzero" fill="#3377ff" stroke="none" />
<path d="M 81 266.5 C 84.64 266.5 87.5 269.36 87.5 273 C 87.5 276.64 84.64 279.5 81 279.5 C 77.36 279.5 74.5 276.64 74.5 273 C 74.5 269.36 77.36 266.5 81 266.5 Z " stroke-width="5" stroke="#3377ff" fill="none" stroke-opacity="0.247058823529412" />
</g>
</svg>
\ No newline at end of file
attendance-performance-manager-ui/admin/src/assets/less/base.css 0 → 100644
View file @ adcd440a
html {
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
box-sizing: border-box;
}
html * {
outline: 0;
box-sizing: inherit;
-webkit-text-size-adjust: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
html,
body {
height: 100%;
min-height: 100%;
font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, STHeiTi, Arial, sans-serif;
}
body {
overflow-y: scroll;
}
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
th,
td,
hr,
button,
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
margin: 0;
padding: 0;
}
input,
select,
textarea,
button {
font-size: 100%;
-webkit-appearance: none;
border: 0;
outline: 0;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
fieldset,
img {
border: 0;
}
abbr,
acronym {
border: 0;
font-variant: normal;
}
del {
text-decoration: line-through;
}
address,
caption,
cite,
code,
dfn,
em,
th,
var {
font-style: normal;
font-weight: 500;
}
ol,
ul {
list-style: none;
}
caption,
th {
text-align: left;
}
q:before,
q:after {
content: "";
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
.mt20 {
margin-top: 20px;
}
.mt10 {
margin-top: 10px;
}
.ml10 {
margin-left: 10px;
}
.ml20 {
margin-left: 20px;
}
ins,
a {
text-decoration: none;
cursor: pointer;
}
/* ============================================================
flex：定义布局为盒模型
flex-v：盒模型垂直布局
flex-1：子元素占据剩余的空间
flex-align-center：子元素垂直居中
flex-pack-center：子元素水平居中
flex-pack-justify：子元素两端对齐
兼容性：ios 4+、android 2.3+、winphone8+
============================================================ */
.flex {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.flex-v {
-webkit-box-orient: vertical;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.flex-1 {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
}
.flex-align-center {
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.flex-pack-center {
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
.flex-pack-justify {
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.flex_warp {
flex-wrap: wrap;
}
.flex_end {
justify-content: flex-end;
}
.clearfix:after {
content: "";
display: table;
clear: both;
font-size: 0;
}
.fl {
float: left;
}
.fr {
float: right;
}
.hide {
display: none;
}
.disabled {
pointer-events: none;
}
#app,
.pages {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
height: 100%;
overflow: hidden;
}
.ellipsis {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
[v-cloak] {
display: none;
}
[disabled] {
pointer-events: none;
}
.el-dialog .el-checkbox-group .el-checkbox {
margin: 5px 0;
width: 33.33%;
}
.el-dialog .el-checkbox-group .pointBox {
width: 50%;
}
.el-table th {
user-select: all;
}
.el-progress-bar {
padding-right: 70px;
margin-right: -70px;
}
#operatorUserCabinCheckBox .el-checkbox {
white-space: normal !important;
width: 100%;
}
#operatorUserCabinCheckBox .el-checkbox__label {
display: inline;
}
.page-statistics .chart {
margin-bottom: 80px;
border: 1px solid #ededed;
height: 400px;
}
.page-statistics .el-table th.color-gray,
.page-statistics .el-table tr.color-gray {
background-color: #f0f9eb;
}
@media screen and (max-width: 800px) {
.page {
margin: 5px 5px;
}
.el-dialog {
width: 98% !important;
}
.el-dialog .el-checkbox-group .el-checkbox {
margin: 5px 0;
width: 50%;
font-size: 12px;
}
.el-dialog .el-checkbox-group .el-checkbox .el-checkbox__label {
font-size: 12px;
}
}
.mobile-table-card {
margin: 10px auto;
padding: 10px;
box-shadow: 0 0 5px #ccc;
}
.mobile-table-card .mobile-table-cell {
padding: 5px 0;
border-bottom: 1px dotted #eee;
}
.mobile-table-card .mobile-table-cell .cell-title {
font-size: 13px;
color: #666;
}
.mobile-table-card .mobile-table-cell .cell-content {
padding-left: 5px;
text-align: right;
word-break: break-word;
}
attendance-performance-manager-ui/admin/src/assets/less/base.less
View file @ adcd440a
html {
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
box-sizing: border-box;
}
html * {
outline: 0;
outline: 0;
box-sizing: inherit;
-webkit-text-size-adjust: none;
-webkit-tap-highlight-color: rgba(0,0,0,0)
-webkit-text-size-adjust: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
html,body {
height: 100%;
html,
body {
height: 100%;
min-height: 100%;
font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, STHeiTi, Arial, sans-serif;
font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, STHeiTi, Arial,
sans-serif;
}
body {
overflow-y: scroll;
}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
margin: 0;
padding: 0
overflow-y: scroll;
}
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
th,
td,
hr,
button,
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
margin: 0;
padding: 0;
}
input,select,textarea,button {
font-size: 100%;
input,
select,
textarea,
button {
font-size: 100%;
-webkit-appearance: none;
border:0;
border: 0;
outline: 0;
}
table {
border-collapse: collapse;
border-spacing: 0
border-collapse: collapse;
border-spacing: 0;
}
fieldset,img {
border: 0
fieldset,
img {
border: 0;
}
abbr,acronym {
border: 0;
font-variant: normal
abbr,
acronym {
border: 0;
font-variant: normal;
}
del {
text-decoration: line-through
text-decoration: line-through;
}
address,caption,cite,code,dfn,em,th,var {
font-style: normal;
font-weight: 500
address,
caption,
cite,
code,
dfn,
em,
th,
var {
font-style: normal;
font-weight: 500;
}
ol,ul {
list-style: none
ol,
ul {
list-style: none;
}
caption,th {
text-align: left
caption,
th {
text-align: left;
}
// h1,h2,h3,h4,h5,h6 {
......@@ -67,39 +120,42 @@ caption,th {
// font-weight: 500
// }
q:before,q:after {
content: ''
q:before,
q:after {
content: "";
}
sub,sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -.5em
top: -0.5em;
}
sub {
bottom: -.25em
bottom: -0.25em;
}
.mt20{
margin-top: 20px;
.mt20 {
margin-top: 20px;
}
.mt10{
margin-top: 10px;
.mt10 {
margin-top: 10px;
}
.ml10{
.ml10 {
margin-left: 10px;
}
.ml20{
margin-left: 20px;
.ml20 {
margin-left: 20px;
}
ins,a {
text-decoration: none;
cursor: pointer;
ins,
a {
text-decoration: none;
cursor: pointer;
}
/* ============================================================
flex：定义布局为盒模型
......@@ -110,39 +166,78 @@ ins,a {
flex-pack-justify：子元素两端对齐
兼容性：ios 4+、android 2.3+、winphone8+
============================================================ */
.flex{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
.flex-v{-webkit-box-orient:vertical;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}
.flex-1{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;}
.flex-align-center{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;}
.flex-pack-center{-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}
.flex-pack-justify{-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;}
.flex_warp{flex-wrap: wrap;}
.flex_end{
justify-content: flex-end;
}
.clearfix{
&:after{
content: '';
.flex {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.flex-v {
-webkit-box-orient: vertical;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.flex-1 {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
}
.flex-align-center {
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.flex-pack-center {
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
.flex-pack-justify {
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.flex_warp {
flex-wrap: wrap;
}
.flex_end {
justify-content: flex-end;
}
.clearfix {
&:after {
content: "";
display: table;
clear: both;
font-size: 0;
}
}
}
.fl{float: left};
.fr{float: right};
.hide{display: none;}
.disabled{
pointer-events: none;
.fl {
float: left;
}
#app,.pages{
.flex;
.flex-v;
height: 100%;
.fr {
float: right;
}
.hide {
display: none;
}
.disabled {
pointer-events: none;
}
#app,
.pages {
.flex;
.flex-v;
height: 100%;
overflow: hidden;
}
.ellipsis{
.ellipsis {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
......@@ -151,90 +246,89 @@ ins,a {
display: none;
}
[disabled] {
pointer-events: none;
}
.el-dialog{
.el-checkbox-group{
.el-checkbox{
margin: 5px 0;
width: 33.33%;
}
.pointBox{
width: 50%;
}
}
pointer-events: none;
}
.el-dialog {
.el-checkbox-group {
.el-checkbox {
margin: 5px 0;
width: 33.33%;
}
.pointBox {
width: 50%;
}
}
}
.el-table th {
user-select: all;
user-select: all;
}
.el-progress-bar{
padding-right: 70px;
margin-right: -70px;
.el-progress-bar {
padding-right: 70px;
margin-right: -70px;
}
#operatorUserCabinCheckBox .el-checkbox{
#operatorUserCabinCheckBox .el-checkbox {
white-space: normal !important;
width: 100%
width: 100%;
}
#operatorUserCabinCheckBox .el-checkbox__label{
#operatorUserCabinCheckBox .el-checkbox__label {
display: inline;
}
// 统计页面隔日期变色
.page-statistics{
.chart{
.page-statistics {
.chart {
margin-bottom: 80px;
border: 1px solid #ededed;
height: 400px;
}
.el-table th, .el-table tr{
&.color-gray{
.el-table th,
.el-table tr {
&.color-gray {
background-color: #f0f9eb;
}
}
}
@media screen and (max-width: 800px){
.page{
margin: 5px 5px;
}
.el-dialog{
width: 98%!important;
.el-checkbox-group{
.el-checkbox{
margin: 5px 0;
width: 50%;
font-size: 12px;
.el-checkbox__label{
font-size: 12px;
}
}
}
}
@media screen and (max-width: 800px) {
.page {
margin: 5px 5px;
}
.el-dialog {
width: 98% !important;
.el-checkbox-group {
.el-checkbox {
margin: 5px 0;
width: 50%;
font-size: 12px;
.el-checkbox__label {
font-size: 12px;
}
}
}
}
}
// .is-active{
// background-color: red;
// }
.mobile-table-card{
margin: 10px auto;
padding: 10px;
box-shadow: 0 0 5px #ccc;
.mobile-table-cell{
padding: 5px 0;
border-bottom: 1px dotted #eee;
.cell-title{
font-size: 13px;
color: #666;
}
.cell-content{
padding-left: 5px;
text-align: right;
word-break: break-word;
}
}
}
\ No newline at end of file
.mobile-table-card {
margin: 10px auto;
padding: 10px;
box-shadow: 0 0 5px #ccc;
.mobile-table-cell {
padding: 5px 0;
border-bottom: 1px dotted #eee;
.cell-title {
font-size: 13px;
color: #666;
}
.cell-content {
padding-left: 5px;
text-align: right;
word-break: break-word;
}
}
}
attendance-performance-manager-ui/admin/src/assets/mixins/form.js
View file @ adcd440a
......@@ -8,15 +8,13 @@ export default {
methods: {
// 渲染前置处理
beforeRender(data) {
return data
return data;
},
// 渲染后置处理
afterRender(data) {
},
afterRender(data) {},
// 提交表单的前置处理
beforeSubmit(data) {
return data
return data;
},
// 提交表单的后置处理, 会阻断默认的回退行为
afterSubmit(data) {
......@@ -39,16 +37,16 @@ export default {
// 部门格式化处理
this.afterRender(res);
})
.catch(error => {
console.error(error)
.catch((error) => {
console.error(error);
this.$message.error(error.message);
})
.then(data => {
.then((data) => {
clearTimeout(this.loadingTimer);
this.loadingTimer = setTimeout(() => {
this.loading = false;
}, 300);
})
});
},
// 提交表单
submitForm(ref) {
......@@ -56,73 +54,82 @@ export default {
el.validate((valid) => {
if (!valid) return;
this.loading = true;
console.log('提交了')
this.$post(this.urls.saveUrl || this.pageInfo.saveUrl,
this.beforeSubmit(this.form)
console.log("提交了");
this.$post(
this.urls.saveUrl || this.pageInfo.saveUrl,
this.beforeSubmit(this.form)
)
.then(res => {
.then((res) => {
this.$message.success(res.msg);
this.afterSubmit(res);
})
.catch(error => {
.catch((error) => {
this.$message.error(error.message);
})
.then(data => {
.then((data) => {
clearTimeout(this.loadingTimer);
this.loadingTimer = setTimeout(() => {
this.loading = false;
}, 200);
})
});
});
},
// 复制一个数组或对象
util_copy(data) {
return JSON.parse(JSON.stringify(data))
return JSON.parse(JSON.stringify(data));
},
// 工具方法，把数字转化为字符串
util_toString(data, array) {
//原始数据
const dataCopy = Object.assign({}, data);
array.forEach(item => {
array.forEach((item) => {
//如果相等做操作
dataCopy[item] = dataCopy[item] === undefined ? '' : dataCopy[item] + '';
})
dataCopy[item] =
dataCopy[item] === undefined ? "" : dataCopy[item] + "";
});
return dataCopy;
},
// 工具方法，把字符串转化为数组
util_toArrays(data, array) {
const dataCopy = Object.assign({}, data);
array.forEach(item => {
dataCopy[item] = dataCopy[item] === undefined ? [] : dataCopy[item].split(",");
})
array.forEach((item) => {
dataCopy[item] =
dataCopy[item] === undefined ? [] : dataCopy[item].split(",");
});
return dataCopy;
},
// 工具方法，把字符串转化为格式化日期
util_toDateStr(data, array) {
const dataCopy = Object.assign({}, data);
array.forEach(item => {
dataCopy[item] = dataCopy[item] === undefined ? '' : this.util_formatterDate(dataCopy[item]);
})
array.forEach((item) => {
dataCopy[item] =
dataCopy[item] === undefined
? ""
: this.util_formatterDate(dataCopy[item]);
});
return dataCopy;
},
util_formatterDate(time) {
let date = new Date(Number(time));
let Y = date.getFullYear() + '-';
let M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
let D = this.panLeft(date.getDate()) + ' ';
let h = this.panLeft(date.getHours()) + ':';
let m = this.panLeft(date.getMinutes()) + ':';
let Y = date.getFullYear() + "-";
let M =
(date.getMonth() + 1 < 10
? "0" + (date.getMonth() + 1)
: date.getMonth() + 1) + "-";
let D = this.panLeft(date.getDate()) + " ";
let h = this.panLeft(date.getHours()) + ":";
let m = this.panLeft(date.getMinutes()) + ":";
let s = this.panLeft(date.getSeconds());
return Y+M+D+h+m+s;
return Y + M + D + h + m + s;
},
panLeft(num){
return num < 10 ? '0'+num : num;
panLeft(num) {
return num < 10 ? "0" + num : num;
},
// 从dict字段暴力取值，取不到则返回原值
util_formatter(key, val) {
try {
return this.dict[key][val]
return this.dict[key][val];
} catch (error) {
return val;
}
......@@ -135,24 +142,24 @@ export default {
}
});
}, 0);
}
},
},
computed: {
pageInfo() {
let currUrl = this.$route.path;
let urlArray = currUrl.split('/');
let urlArray = currUrl.split("/");
let type = urlArray.pop();
urlArray.push('save');
let saveUrl = urlArray.join('/');
urlArray.push("save");
let saveUrl = urlArray.join("/");
urlArray.pop();
urlArray.push('edit');
let editUrl = urlArray.join('/');
urlArray.push("edit");
let editUrl = urlArray.join("/");
urlArray.pop();
urlArray.push('add');
let addUrl = urlArray.join('/');
urlArray.push("add");
let addUrl = urlArray.join("/");
urlArray.pop();
urlArray.push('view');
let viewUrl = urlArray.join('/');
urlArray.push("view");
let viewUrl = urlArray.join("/");
return {
type,
currUrl,
......@@ -176,9 +183,6 @@ export default {
toString: [], // 需要把number转化为string的表单字段name数组
toArrays: [], // 需要把number转化为arrays的表单字段name数组
toDate: [], // 需要把number转化为date的表单字段name数组
}
}
}
};
},
};
attendance-performance-manager-ui/admin/src/assets/mixins/formdialog.js
View file @ adcd440a
export default {
created() {
// this.getData();
// this.getData();
},
beforeDestroy() {
clearTimeout(this.loadingTimer);
......@@ -8,29 +8,27 @@ export default {
methods: {
// 渲染前置处理
beforeRender(data) {
return data
return data;
},
// 渲染后置处理
afterRender(data) {
},
afterRender(data) {},
// 提交表单的前置处理
beforeSubmit(data) {
return data
return data;
},
// 提交表单的后置处理, 会阻断默认的回退行为
afterSubmit(data) {
this.$router.go(-1);
},
// 开启、关闭
changePath(path) {
this.pageInfo.list = path + "/list";
this.pageInfo.del = path + "/delete";
this.pageInfo.add = path + "/add";
this.pageInfo.edit = path + "/edit";
this.pageInfo.view = path + "/view";
},
// 开启、关闭
changePath(path) {
this.pageInfo.list = path + "/list";
this.pageInfo.del = path + "/delete";
this.pageInfo.add = path + "/add";
this.pageInfo.edit = path + "/edit";
this.pageInfo.view = path + "/view";
},
// 默认拉取数据
getData() {
......@@ -48,87 +46,100 @@ export default {
this.dict = Object.assign({}, this.dict, res.dict);
this.afterRender(res);
})
.catch(error => {
this.$message.error(error.message)
throw error
.catch((error) => {
this.$message.error(error.message);
throw error;
})
.then(data => {
.then((data) => {
clearTimeout(this.loadingTimer);
this.loadingTimer = setTimeout(() => {
this.loading = false;
}, 300);
})
});
},
// 提交表单
submitForm(ref) {
console.log(123);
return;
const el = this.$refs.form;
el.validate((valid) => {
if (!valid) return;
this.loading = true;
this.$post(this.urls.saveUrl || this.pageInfo.saveUrl, this.beforeSubmit(this.form))
.then(res => {
this.$post(
this.urls.saveUrl || this.pageInfo.saveUrl,
this.beforeSubmit(this.form)
)
.then((res) => {
this.$message.success(res.msg);
this.afterSubmit(res);
})
.catch(error => {
.catch((error) => {
this.$message.error(error.message);
})
.then(data => {
.then((data) => {
clearTimeout(this.loadingTimer);
this.loadingTimer = setTimeout(() => {
this.loading = false;
}, 200);
})
});
});
},
// 复制一个数组或对象
util_copy(data) {
return JSON.parse(JSON.stringify(data))
return JSON.parse(JSON.stringify(data));
},
// 工具方法，把数字转化为字符串
util_toString(data, array) {
//原始数据
const dataCopy = Object.assign({}, data);
array.forEach(item => {
array.forEach((item) => {
//如果相等做操作
dataCopy[item] = dataCopy[item] === undefined ? '' : dataCopy[item] + '';
})
dataCopy[item] =
dataCopy[item] === undefined ? "" : dataCopy[item] + "";
});
return dataCopy;
},
// 工具方法，把字符串转化为数组
util_toArrays(data, array) {
const dataCopy = Object.assign({}, data);
array.forEach(item => {
dataCopy[item] = dataCopy[item] === undefined ? [] : dataCopy[item].split(",");
})
array.forEach((item) => {
dataCopy[item] =
dataCopy[item] === undefined ? [] : dataCopy[item].split(",");
});
return dataCopy;
},
// 工具方法，把字符串转化为格式化日期
util_toDateStr(data, array) {
const dataCopy = Object.assign({}, data);
array.forEach(item => {
dataCopy[item] = dataCopy[item] === undefined ? '' : this.util_formatterDate(dataCopy[item]);
})
array.forEach((item) => {
dataCopy[item] =
dataCopy[item] === undefined
? ""
: this.util_formatterDate(dataCopy[item]);
});
return dataCopy;
},
util_formatterDate(time) {
let date = new Date(Number(time));
let Y = date.getFullYear() + '-';
let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
let D = this.panLeft(date.getDate()) + ' ';
let h = this.panLeft(date.getHours()) + ':';
let m = this.panLeft(date.getMinutes()) + ':';
let Y = date.getFullYear() + "-";
let M =
(date.getMonth() + 1 < 10
? "0" + (date.getMonth() + 1)
: date.getMonth() + 1) + "-";
let D = this.panLeft(date.getDate()) + " ";
let h = this.panLeft(date.getHours()) + ":";
let m = this.panLeft(date.getMinutes()) + ":";
let s = this.panLeft(date.getSeconds());
return Y + M + D + h + m + s;
},
panLeft(num) {
return num < 10 ? '0' + num : num;
return num < 10 ? "0" + num : num;
},
// 从dict字段暴力取值，取不到则返回原值
util_formatter(key, val) {
try {
return this.dict[key][val]
return this.dict[key][val];
} catch (error) {
return val;
}
......@@ -141,24 +152,24 @@ export default {
}
});
}, 0);
}
},
},
computed: {
pageInfo() {
let currUrl = this.$route.path;
let urlArray = currUrl.split('/');
let urlArray = currUrl.split("/");
let type = urlArray.pop();
urlArray.push('save');
let saveUrl = urlArray.join('/');
urlArray.push("save");
let saveUrl = urlArray.join("/");
urlArray.pop();
urlArray.push('edit');
let editUrl = urlArray.join('/');
urlArray.push("edit");
let editUrl = urlArray.join("/");
urlArray.pop();
urlArray.push('add');
let addUrl = urlArray.join('/');
urlArray.push("add");
let addUrl = urlArray.join("/");
urlArray.pop();
urlArray.push('view');
let viewUrl = urlArray.join('/');
urlArray.push("view");
let viewUrl = urlArray.join("/");
return {
type,
currUrl,
......@@ -182,9 +193,6 @@ export default {
toString: [], // 需要把number转化为string的表单字段name数组
toArrays: [], // 需要把number转化为arrays的表单字段name数组
toDate: [], // 需要把number转化为date的表单字段name数组
}
}
}
};
},
};
attendance-performance-manager-ui/admin/src/main.js
View file @ adcd440a
import Vue from 'vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import './assets/less/base.less'
import App from './App.vue'
import router from './router'
import store from './store'
import Prototype from './assets/utils/prototype'
import Filter from './assets/utils/filter.js'
import GlobalComponents from './assets/utils/globalComponents.js'
import Global from './assets/utils/global.js'
import VueClipboard from 'vue-clipboard2'
import VueAMap from 'vue-amap';
import * as echarts from 'echarts'
import Vue from "vue";
import ElementUI from "element-ui";
import "element-ui/lib/theme-chalk/index.css";
import "./assets/less/base.less";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import Prototype from "./assets/utils/prototype";
import Filter from "./assets/utils/filter.js";
import GlobalComponents from "./assets/utils/globalComponents.js";
import Global from "./assets/utils/global.js";
import VueClipboard from "vue-clipboard2";
import VueAMap from "vue-amap";
import * as echarts from "echarts";
// 将自动注册所有组件为全局组件
import dataV from '@jiaminghi/data-view'
import dataV from "@jiaminghi/data-view";
Vue.use(dataV)
Vue.use(dataV);
Vue.prototype.$echarts = echarts;
Vue.config.productionTip = false
Vue.config.productionTip = false;
Vue.use(ElementUI);
Vue.use(Prototype);
Vue.use(Filter);
Vue.use(GlobalComponents); // 全局组件
Vue.use(VueClipboard)
Vue.use(VueAMap)
Vue.use(VueClipboard);
Vue.use(VueAMap);
VueAMap.initAMapApiLoader({
key: 'f45cca59553214543a5a77e50a7e04df',
plugin: ['AMap.Scale', 'AMap.OverView', 'AMap.ToolBar', 'AMap.MapType', 'AMap.PlaceSearch', 'AMap.Geolocation', 'AMap.Geocoder'],
v: '1.4.4',
uiVersion: '1.0',
})
key: "f45cca59553214543a5a77e50a7e04df",
plugin: [
"AMap.Scale",
"AMap.OverView",
"AMap.ToolBar",
"AMap.MapType",
"AMap.PlaceSearch",
"AMap.Geolocation",
"AMap.Geocoder",
],
v: "1.4.4",
uiVersion: "1.0",
});
Vue.prototype.Global = Global;
new Vue({
router,
store,
render: h => h(App)
}).$mount('#app')
render: (h) => h(App),
}).$mount("#app");
attendance-performance-manager-ui/admin/src/views/homeCharts/record/list.vue
View file @ adcd440a
......@@ -7,11 +7,15 @@
</div>
<dv-scroll-ranking-board
:config="config"
style="width:100%;height:93%"
style="width:100%;height:75%"
/>
</div>
<div class="left_mid"></div>
<div class="left_down"></div>
<div class="left_mid">
<div id="leida" style="width: 100%;height: 100%;"></div>
</div>
<div class="left_down">
<div id="rulePie" style="width: 100%;height: 100%;"></div>
</div>
</div>
<div class="mid">
<div class="mid_top">
......@@ -125,7 +129,7 @@
<div class="down_content">
<img class="content_title" src="../../../assets/images/title.png" />
<div style="margin: 20px 0;">
<el-radio-group v-model="radio1">
<el-radio-group v-model="type" border>
<el-radio-button label="1">部门评估</el-radio-button>
<el-radio-button label="2">个人评估</el-radio-button>
</el-radio-group>
......@@ -173,15 +177,19 @@
<div class="right">
<div class="right_top">
<div class="title">
部门绩效总分排名TOP10
个人绩效总分排名TOP10
</div>
<dv-scroll-ranking-board
:config="config"
style="width:100%;height:93%"
:config="personConfig"
style="width:100%;height:75%"
/>
</div>
<div class="right_mid"></div>
<div class="right_down"></div>
<div class="right_mid">
<div id="shensuPie" style="width: 100%;height: 100%;"></div>
</div>
<div class="right_down">
<div id="recordPie" style="width: 100%;height: 100%;"></div>
</div>
</div>
</div>
</template>
......@@ -190,7 +198,7 @@
export default {
data() {
return {
radio1: "",
type: "1",
form: {
date1: "",
type: [],
......@@ -199,41 +207,455 @@ export default {
config: {
data: [
{
name: "周口",
value: 55,
name: "部门1",
value: 95,
},
{
name: "南阳",
value: 120,
name: "部门2",
value: 90,
},
{
name: "西峡",
value: 78,
name: "部门3",
value: 98,
},
{
name: "驻马店",
value: 66,
name: "部门4",
value: 91,
},
{
name: "新乡",
name: "部门5",
value: 80,
},
{
name: "信阳",
value: 45,
name: "部门6",
value: 92,
},
{
name: "部门7",
value: 93,
},
{
name: "部门8",
value: 94,
},
{
name: "漯河",
value: 29,
name: "部门9",
value: 90,
},
{
name: "部门10",
value: 100,
},
],
},
personConfig: {
data: [
{
name: "个人1",
value: 95,
},
{
name: "个人2",
value: 90,
},
{
name: "个人3",
value: 98,
},
{
name: "个人4",
value: 91,
},
{
name: "个人5",
value: 80,
},
{
name: "个人6",
value: 92,
},
{
name: "个人7",
value: 93,
},
{
name: "个人8",
value: 94,
},
{
name: "个人9",
value: 90,
},
{
name: "个人10",
value: 100,
},
],
},
cricleData: [
{ value: 756, name: "考勤绩效" },
{ value: 690, name: "评价绩效" },
{ value: 559, name: "办件绩效" },
{ value: 1278, name: "效能绩效" },
],
};
},
mounted() {},
mounted() {
this.drawLeiDa();
this.drawRulePie();
this.drawCorePie();
this.drawRecordPie();
},
methods: {
drawLeiDa() {
// 基于dom，初始化echarts实例
let myChart = this.$echarts.init(document.getElementById("leida"));
// 绘制图表
myChart.setOption({
title: {
text: "异常分值分布情况",
left: "left",
textStyle: {
fontSize: 18,
},
},
color: ["#56A3F1", "#FF917C"],
tooltip: {},
legend: {
data: ["加分", "扣分"],
right: 0,
},
radar: [
{
center: ["25%", "50%"],
radius: 120,
startAngle: 90,
splitNumber: 4,
shape: "circle",
axisName: {
formatter: "【{value}】",
color: "#428BD4",
},
axisLine: {
lineStyle: {
color: "rgba(211, 253, 250, 0.8)",
},
},
splitLine: {
lineStyle: {
color: "rgba(211, 253, 250, 0.8)",
},
},
},
{
indicator: [
{ text: "考勤绩效", max: 150 },
{ text: "办件绩效", max: 150 },
{ text: "评价绩效", max: 150 },
{ text: "效能绩效", max: 120 },
{ text: "其他绩效", max: 108 },
],
center: ["45%", "60%"],
radius: 80,
axisName: {
color: "#fff",
backgroundColor: "#666",
borderRadius: 10,
padding: [0, 1],
},
},
],
series: [
{
type: "radar",
radarIndex: 1,
data: [
{
value: [120, 118, 130, 100, 99, 70],
name: "加分",
symbol: "rect",
symbolSize: 12,
areaStyle: { color: "#56A3F1" }, //雷达覆盖区域背景颜色
label: {
show: true,
formatter: function(params) {
return params.value;
},
},
},
{
value: [100, 93, 50, 90, 70, 60],
areaStyle: { color: "#FF917C" }, //雷达覆盖区域背景颜色
name: "扣分",
},
],
},
],
});
},
drawRulePie() {
// 基于dom，初始化echarts实例
let myChart = this.$echarts.init(document.getElementById("rulePie"));
myChart.setOption({
title: {
text: "绩效规则分布情况",
textStyle: {
fontSize: 18,
},
},
tooltip: {
trigger: "item",
},
legend: {
bottom: "0%",
right: "5%",
orient: "vertical",
textStyle: {
// 文字的样式
fontSize: 24, // 可控制每个legend项的间距
color: "#828282",
rich: {
// 通过富文本rich给每个项设置样式，下面的oneone、twotwo、threethree可以理解为"每一列"的样式
oneone: {
// 设置文字、数学、英语这一列的样式
width: 50,
color: "#000000",
fontSize: 12,
fontWeight: "bolder",
},
twotwo: {
// 设置10分、20分、30分这一列的样式
width: 35,
color: "#333",
fontSize: 12,
fontWeight: 600,
},
threethree: {
// 设置百分比这一列的样式
width: 20,
color: "#333",
fontSize: 12,
},
},
},
formatter: (name) => {
// formatter格式化函数动态呈现数据
console.log(name);
var total = 0; // 用于计算总数
var target; // 遍历拿到数据
for (var i = 0; i < this.cricleData.length; i++) {
total += this.cricleData[i].value;
if (this.cricleData[i].name == name) {
target = this.cricleData[i].value;
}
}
var v = ((target / total) * 100).toFixed(2);
return `{oneone|${name}} {twotwo|${target}分} {threethree|${v}%}`;
// 富文本第一列样式应用 富文本第二列样式应用 富文本第三列样式应用
},
},
series: [
{
type: "pie",
radius: ["40%", "70%"],
// avoidLabelOverlap: false,
left: "-50%",
top: "10%",
label: {
position: "center",
fontSize: 16,
formatter: () => {
let str = "总" + "\n" + `${756 + 690 + 559 + 1278}`;
return str;
},
},
labelLine: {
show: false,
},
data: this.cricleData,
},
],
});
},
drawCorePie() {
// 基于dom，初始化echarts实例
let myChart = this.$echarts.init(document.getElementById("shensuPie"));
myChart.setOption({
title: {
text: "绩效规则分布情况",
textStyle: {
fontSize: 18,
},
},
tooltip: {
trigger: "item",
},
legend: {
bottom: "0%",
right: "5%",
orient: "vertical",
textStyle: {
// 文字的样式
fontSize: 24, // 可控制每个legend项的间距
color: "#828282",
rich: {
// 通过富文本rich给每个项设置样式，下面的oneone、twotwo、threethree可以理解为"每一列"的样式
oneone: {
width: 50,
color: "#000000",
fontSize: 12,
fontWeight: "bolder",
},
twotwo: {
width: 35,
color: "#333",
fontSize: 12,
fontWeight: 600,
},
threethree: {
// 设置百分比这一列的样式
width: 20,
color: "#333",
fontSize: 12,
},
},
},
formatter: (name) => {
// formatter格式化函数动态呈现数据
var total = 0; // 用于计算总数
var target; // 遍历拿到数据
for (var i = 0; i < this.cricleData.length; i++) {
total += this.cricleData[i].value;
if (this.cricleData[i].name == name) {
target = this.cricleData[i].value;
}
}
var v = ((target / total) * 100).toFixed(2);
return `{oneone|${name}}`;
// 富文本第一列样式应用 富文本第二列样式应用 富文本第三列样式应用
},
},
series: [
{
type: "pie",
// avoidLabelOverlap: false,
left: "-25%",
top: "10%",
label: {
normal: {
show: true,
position: "outside",
rich: {
// 通过富文本rich给每个项设置样式，下面的oneone、twotwo、threethree可以理解为"每一列"的样式
async: {
width: 50,
color: "#000000",
fontSize: 12,
fontWeight: "bolder",
},
hr: {
width: 35,
color: "#333",
fontSize: 12,
fontWeight: 600,
},
per: {
// 设置百分比这一列的样式
width: 20,
color: "#333",
fontSize: 12,
},
},
formatter: "{per|{d}%}",
},
},
labelLine: {
show: true,
},
data: this.cricleData,
},
],
});
},
methods: {},
drawRecordPie() {
let xData = ["未开始", "进行中", "已完结", "全部问卷"];
let yData = [2, 8, 116, 126];
let colorList = ["#97e7ff", "#75f5ff", "#00deff", "#0093ff", "#2a5fcf"];
let visualMapPiecesData = [];
// visualMap: {
// pieces: [
// { value: 123, label: '123（自定义特殊颜色）', color: 'grey' }
// ]
// }
for (var i = 0; i < xData.length; i++) {
visualMapPiecesData.push({
value: yData[i],
label: xData[i],
color: colorList[i],
});
}
// 基于dom，初始化echarts实例
let myChart = this.$echarts.init(document.getElementById("recordPie"));
myChart.setOption({
title: {
text: "绩效规则分布情况",
textStyle: {
fontSize: 18,
},
},
tooltip: {
trigger: "item",
},
polar: {
radius: [0, "90%"],
center: ["50%", "55%"],
},
angleAxis: {
show: false, // 隐藏刻度
max: 180,
startAngle: 90,
},
radiusAxis: {
show: true,
type: "category",
data: xData,
},
visualMap: {
top: 40,
x: "left",
orient: "vertical",
textStyle: {
color: "#000",
},
pieces: visualMapPiecesData,
outOfRange: {
color: "#999",
},
},
series: [
{
type: "bar",
data: yData,
coordinateSystem: "polar",
itemStyle: {
normal: {
// 定制显示（按顺序）
color: function(params) {
return colorList[params.dataIndex];
},
},
},
},
],
});
},
},
};
</script>
......@@ -393,6 +815,21 @@ export default {
height: 100%;
text-align: center;
padding: 40px 30px 10px 30px;
/deep/.el-radio-button {
width: 150px;
text-align: center;
border: 1px solid #eee;
}
/deep/.el-radio-button__inner {
width: 150px;
}
/deep/.el-radio-button__orig-radio:checked + .el-radio-button__inner {
width: 150px;
border: none;
background: #1890ff;
color: #fff;
border: 1px solid #eee;
}
.form {
width: 70%;
margin: 0 auto;
......@@ -411,6 +848,7 @@ export default {
background: #fff;
border-radius: 8px;
padding: 10px;
overflow: hidden;
.title {
font-weight: 600;
margin-bottom: 5px;
......
attendance-performance-manager-ui/admin/src/views/perform/rules/attend/components/AttendIndex.vue 0 → 100644
View file @ adcd440a
<template>
<div class="attend_page">
<div class="left_box">
<h3>分类管理</h3>
<el-button type="primary" style="margin:20px 0" @click="addCate">
+ 新增分类</el-button
>
<div class="left_content">
<div
:class="index == i ? 'category_box check' : 'category_box'"
v-for="(val, i) in dataArr"
:key="i"
@click="handleClick(val, i)"
>
<span>{{ val.name }}</span>
<div>
<i class="el-icon-edit-outline"></i>
<i class="el-icon-delete"></i>
</div>
</div>
</div>
</div>
<div class="right_box">
<h3>规则管理</h3>
<div class="search_box">
<el-button type="primary" style="margin:20px 0" @click="addRules">
+ 新增规则</el-button
>
<div class="search">
<el-input
placeholder="请输入考核内容关键字搜索"
style="width: 300px;margin-right: 10px;"
></el-input>
<el-button type="primary"> 搜索 </el-button>
</div>
</div>
<div class="table_box"></div>
</div>
<drawer-show ref="drawerform" @ok="getData" />
<dialog-show ref="dialogform" @ok="getData" />
</div>
</template>
<script>
import drawerShow from "../drawershow";
import dialogShow from "../dialogshow";
export default {
name: "AdminAttendIndex",
components: {
drawerShow,
dialogShow,
},
data() {
return {
index: -1,
dataArr: [
{
name: "工作纪律",
},
],
};
},
mounted() {},
methods: {
handleClick(val, i) {
this.index = i;
},
addRules() {
this.$refs.drawerform.add();
},
addCate() {
this.$refs.dialogform.add();
},
},
};
</script>
<style lang="less" scoped>
.attend_page {
width: 100%;
height: 100%;
display: flex;
h3 {
border-width: 0px;
display: flex;
font-family: "微软雅黑 Bold", "微软雅黑 Regular", "微软雅黑", sans-serif;
font-weight: 700;
font-style: normal;
}
.left_box {
width: 344px;
height: 735px;
background-color: rgba(242, 247, 249, 0.447058823529412);
border: none;
border-radius: 8px;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
font-family: "微软雅黑", sans-serif;
font-weight: 400;
font-style: normal;
padding: 20px;
.left_content {
width: 100%;
height: 600px;
overflow-y: auto;
.category_box {
display: flex;
justify-content: space-between;
align-items: center;
border-width: 0px;
width: 304px;
height: 48px;
background: inherit;
background: #ffffff;
border: none;
border-radius: 4px;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
font-family: "微软雅黑", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 14px;
color: #000;
text-align: left;
padding: 0 10px;
border: 1px solid #ddd;
&:hover {
background-color: rgba(22, 202, 122, 1);
color: #ffffff;
border: none;
}
i {
font-style: normal;
font-size: 18px;
margin: 0 5px;
cursor: pointer;
}
}
.check {
background-color: rgba(22, 202, 122, 1);
color: #ffffff;
border: none;
}
}
}
.right_box {
flex: 1;
padding: 20px;
.search_box {
width: 100%;
height: 60px;
display: flex;
justify-content: space-between;
align-items: center;
}
.table_box {
width: 100%;
height: 100%;
}
}
}
</style>
attendance-performance-manager-ui/admin/src/views/perform/rules/attend/dialogshow.vue 0 → 100644
View file @ adcd440a
<template>
<!-- 弹出框表单 -->
<el-dialog :title="title" :visible.sync="open" width="90%" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<Field
label="绩效规则id"
prop="ruleId"
v-model="form.ruleId"
placeholder="请输入绩效规则id"
/>
<Field
label="规则简称"
prop="ruleBrief"
v-model="form.ruleBrief"
placeholder="请输入规则简称"
/>
<Field
label="分类名称"
prop="name"
v-model="form.name"
placeholder="请输入分类名称"
/>
<Field
label="规则类型"
prop="type"
v-model="form.type"
type="select"
:enumData="dict.type"
placeholder="请选择规则类型"
/>
<Field
label="备注"
prop="remark"
v-model="form.remark"
type="textarea"
placeholder="请输入备注"
/>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button
type="primary"
v-if="pageInfo.type !== 'view'"
@click="submitForm"
>确 定</el-button
>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</template>
<script>
import form from "@/assets/mixins/formdialog";
import dialogShow from "./dialogshow";
export default {
mixins: [form],
components: {
dialogShow,
},
data() {
return {
// 遮罩层
loading: true,
// 弹出层标题
title: "绩效规则分类信息",
// 是否显示弹出层
open: false,
toString: ["type"],
// 表单校验
rules: {},
};
},
methods: {
/** 编辑 */
edit(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = "perform/rules/category/edit";
this.getData();
this.pageInfo.type = "edit";
this.title = "修改绩效规则分类信息";
},
/** 新增 */
add(row) {
this.reset();
this.urls.currUrl = "perform/rules/category/add";
this.getData();
this.pageInfo.type = "add";
this.title = "新增绩效规则分类信息";
},
/** 查看*/
view(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = "perform/rules/category/view";
this.getData();
this.pageInfo.type = "view";
this.title = "绩效规则分类信息详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.open = true;
},
afterSubmit(data) {
this.open = false;
this.$emit("ok");
},
// 表单重置
reset() {
this.form = {
ruleId: null,
ruleBrief: "",
name: "",
type: 1,
remark: "",
};
this.resetForm("form");
},
resetForm(refName) {
if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
},
},
};
</script>
attendance-performance-manager-ui/admin/src/views/perform/rules/attend/drawershow.vue
View file @ adcd440a
<template>
<!-- 弹出框表单 -->
<el-drawer
:title="title"
:visible.sync="open"
:direction="direction"
size="50%">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<Field :span="20" label="分类" prop="categoryId" v-model="form.categoryId" :enumData="dict.categoryId" type="select" placeholder="请选择分类"/>
<!-- 弹出框表单 -->
<el-drawer
:title="title"
:visible.sync="open"
:direction="direction"
size="50%"
>
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<Field
:span="20"
label="分类"
prop="categoryId"
v-model="form.categoryId"
:enumData="dict.categoryId"
type="select"
placeholder="请选择分类"
/>
<Field :span="20" label="考核内容简称" prop="name" v-model="form.name" placeholder="请输入考核内容简称"/>
<Field :span="20" label="评分标准" prop="content" v-model="form.content" type="textarea" placeholder="请输入评分标准"/>
<Field :span="20" label="增减类型" prop="subAddType" v-model="form.subAddType" type="select" :enumData="dict.subAddType" placeholder="请选择增减类型"/>
<Field :span="20" label="扣分" prop="score" v-model="form.score" placeholder="请输入扣分或增加分值"/>
<Field :span="20" label="关联负责人" prop="assoOwner" v-model="form.assoOwner" type="radio" :enumData="dict.assoOwner" placeholder="请选择是否关联负责人"/>
<Field :span="20" v-if="form.assoOwner==1" label="负责人扣分" prop="ownerScore" v-model="form.ownerScore" placeholder="请输入负责人扣分或增加分值"/>
<Field :span="20" label="备注" prop="remark" v-model="form.remark" type="textarea" placeholder="请输入备注"/>
<Field
:span="20"
label="考核内容简称"
prop="name"
v-model="form.name"
placeholder="请输入考核内容简称"
/>
<Field
:span="20"
label="评分标准"
prop="content"
v-model="form.content"
type="textarea"
placeholder="请输入评分标准"
/>
<Field
:span="20"
label="增减类型"
prop="subAddType"
v-model="form.subAddType"
type="select"
:enumData="dict.subAddType"
placeholder="请选择增减类型"
/>
<Field
:span="20"
label="扣分"
prop="score"
v-model="form.score"
placeholder="请输入扣分或增加分值"
/>
<Field
:span="20"
label="关联负责人"
prop="assoOwner"
v-model="form.assoOwner"
type="radio"
:enumData="dict.assoOwner"
placeholder="请选择是否关联负责人"
/>
<Field
:span="20"
v-if="form.assoOwner == 1"
label="负责人扣分"
prop="ownerScore"
v-model="form.ownerScore"
placeholder="请输入负责人扣分或增加分值"
/>
<Field
:span="20"
label="备注"
prop="remark"
v-model="form.remark"
type="textarea"
placeholder="请输入备注"
/>
</el-row>
</el-row>
<form-buttons v-if="pageInfo.type!='view'" @submit='submitForm' noCancelBtn />
</el-form>
</el-drawer>
<form-buttons
v-if="pageInfo.type != 'view'"
@submit="submitForm"
noCancelBtn
/>
</el-form>
</el-drawer>
</template>
<script>
import form from "@/assets/mixins/formdialog";
export default {
name: "PerformRulesDetail",
mixins: [form],
components: {
},
created() {
},
data() {
return {
// 遮罩层
loading: true,
// 弹出层标题
title: "绩效规则信息",
// 是否显示弹出层
open: false,
direction:"rtl",
toString:[
"subAddType",
"assoOwner",
"type",
"categoryId"
],
toDate:[
],
// 表单校验
rules: {
},
urls: {
currUrl: "/perform/rules/list",
editUrl: "/perform/rules/edit",
saveUrl: "/perform/rules/save",
},
};
},
import form from "@/assets/mixins/formdialog";
export default {
name: "PerformRulesDetail",
mixins: [form],
components: {},
created() {},
data() {
return {
// 遮罩层
loading: true,
// 弹出层标题
title: "规则",
// 是否显示弹出层
open: false,
direction: "rtl",
toString: ["subAddType", "assoOwner", "type", "categoryId"],
toDate: [],
// 表单校验
rules: {},
urls: {
currUrl: "/perform/rules/list",
editUrl: "/perform/rules/edit",
saveUrl: "/perform/rules/save",
},
};
},
methods: {
/** 编辑 */
edit(row) {
this.reset()
this.query = { id: row.id };
this.urls.currUrl ="perform/rules/edit";
this.getData();
this.pageInfo.type="edit"
this.title = "修改绩效规则信息";
},
/** 新增 */
add(row) {
this.reset()
this.urls.currUrl = "perform/rules/add";
this.getData();
this.pageInfo.type="add"
this.title = "新增绩效规则信息";
},
/** 查看*/
view(row) {
this.reset()
this.query = { id: row.id };
this.urls.currUrl ="perform/rules/view";
this.getData();
this.pageInfo.type="view"
this.title = "绩效规则信息详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.form.type=1
this.open = true;
},
methods: {
/** 编辑 */
edit(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = "perform/rules/edit";
this.getData();
this.pageInfo.type = "edit";
this.title = "修改规则";
},
/** 新增 */
add(row) {
this.reset();
this.urls.currUrl = "perform/rules/add";
this.getData();
this.pageInfo.type = "add";
this.title = "新增规则";
},
/** 查看*/
view(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = "perform/rules/view";
this.getData();
this.pageInfo.type = "view";
this.title = "规则信息详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.form.type = 1;
this.open = true;
},
afterSubmit(data) {
this.open = false;
this.$emit("ok");
},
afterSubmit(data) {
this.open = false;
this.$emit("ok");
},
// 表单重置
reset() {
this.form = {
categoryId : null,
categoryName : "",
name : "",
content : "",
subAddType : 1,
score : 0.00,
assoOwner : 0,
ownerScore : 0.00,
remark : "",
type : 1,
};
this.resetForm("form");
},
resetForm(refName) {
if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
},
},
};
// 表单重置
reset() {
this.form = {
categoryId: null,
categoryName: "",
name: "",
content: "",
subAddType: 1,
score: 0.0,
assoOwner: 0,
ownerScore: 0.0,
remark: "",
type: 1,
};
this.resetForm("form");
},
resetForm(refName) {
if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
},
},
};
</script>
attendance-performance-manager-ui/admin/src/views/perform/rules/attend/list(原绩效规则).vue 0 → 100644
View file @ adcd440a
<template>
<div class="page">
<LayoutTable :data="tableData" :config="tableConfig"> </LayoutTable>
<drawer-show ref="drawerform" @ok="getData" />
</div>
</template>
<script>
/** 表单弹出框模式需引入 */
import drawerShow from "./drawershow";
import table from "@/assets/mixins/table";
export default {
name: "PerformRulesList",
components: {
drawerShow,
},
mixins: [table],
created() {
console.log("route", this.$route);
this.changePath("/perform/rules");
this.query = Object.assign({}, this.query, { type: 1 });
},
methods: {
/** 重写新增方法 */
toAdd(row) {
this.$refs.drawerform.add(row);
},
/** 重写编辑方法 */
toEdit(row) {
this.$refs.drawerform.edit(row);
},
/** 重写查看方法 */
toView(row) {
this.$refs.drawerform.view(row);
},
},
data() {
return {
config: {
isshowTabPane: true,
search: [],
columns: [
{ type: "selection", width: 60 },
{ type: "index", label: "序号", width: 50 },
{ label: "分类", prop: "categoryId", formatter: this.formatter },
{ label: "考核名称", prop: "name" },
{ label: "评分标准", prop: "content" },
{ label: "增减类型", prop: "subAddType", formatter: this.formatter },
{ label: "分值", prop: "score" },
{ label: "负责人分值", prop: "ownerScore" },
{
label: "创建用户",
prop: "createUserId",
formatter: this.formatter,
},
{
label: "操作",
width: 240,
formatter: (row) => {
return (
<table-buttons
noAdd
noDel
row={row}
onEdit={this.toEdit}
onView={this.toView}
onDel={this.toDel}
/>
);
},
},
],
},
};
},
};
</script>
attendance-performance-manager-ui/admin/src/views/perform/rules/attend/list.vue
View file @ adcd440a
<template>
<div class="page">
<LayoutTable :data="tableData" :config="tableConfig">
</LayoutTable>
<drawer-show ref="drawerform" @ok="getData" />
</div>
<div class="page">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="考勤绩效指标" name="1">
<attend-index />
</el-tab-pane>
<el-tab-pane label="评价绩效指标" name="2">
<attend-index />
</el-tab-pane>
<el-tab-pane label="办件绩效指标" name="3">
<attend-index />
</el-tab-pane>
<el-tab-pane label="效能绩效指标" name="4">
<attend-index />
</el-tab-pane>
<el-tab-pane label="其他绩效指标" name="5">
<attend-index />
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
/** 表单弹出框模式需引入 */
import drawerShow from "./drawershow";
import table from "@/assets/mixins/table";
export default {
name: "PerformRulesList",
components: {
drawerShow
},
mixins: [table],
created() {
console.log("route",this.$route)
this.changePath("/perform/rules")
this.query = Object.assign({}, this.query, {type:1});
},
methods: {
/** 重写新增方法 */
toAdd(row) {
this.$refs.drawerform.add(row);
},
/** 重写编辑方法 */
toEdit(row) {
this.$refs.drawerform.edit(row);
},
/** 重写查看方法 */
toView(row) {
this.$refs.drawerform.view(row);
},
},
data() {
return {
config: {
isshowTabPane:true,
search: [
],
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{label: "分类", prop: "categoryId", formatter: this.formatter},
{label: "考核名称", prop: "name"},
{label: "评分标准", prop: "content"},
{label: "增减类型", prop: "subAddType",formatter: this.formatter},
{label: "分值", prop: "score"},
{label: "负责人分值", prop: "ownerScore"},
{label: "创建用户", prop: "createUserId", formatter: this.formatter},
{
label: "操作",
width: 240,
formatter: row => {
return (
<table-buttons noAdd noDel row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} />
);
}
}
]
}
};
}
import AttendIndex from "./components/AttendIndex.vue";
export default {
name: "PerformRulesList",
components: { AttendIndex },
created() {},
methods: {
handleClick(tab, event) {
console.log(tab, event);
},
},
data() {
return {
activeName: "1",
};
},
};
</script>
<style lang="less" scoped>
.page {
width: 100%;
height: 100%;
overflow: hidden;
/deep/.el-tabs__item {
width: 180px;
font-size: 18px;
text-align: center;
}
}
</style>
attendance-performance-manager-ui/admin/src/views/perform/rules/attend/view.vue
View file @ adcd440a
<template>
<layout-view>
<el-descriptions :title="title" :column="column" :size="size" :colon="false" border>
<template slot="title">
<i class="el-icon-tickets"></i>
基本详细信息
</template>
<template slot="extra">
<el-button type="primary" @click="$router.go(-1)" size="small">返回</el-button>
</template>
<el-descriptions-item label="分类id" label-class-name="labelClass" content-class-name="contentClass">
{{form.categoryId}}
</el-descriptions-item>
<el-descriptions-item label="分类名称" label-class-name="labelClass" content-class-name="contentClass">
{{form.categoryName}}
</el-descriptions-item>
<el-descriptions-item label="考核内容简称" label-class-name="labelClass" content-class-name="contentClass">
{{form.name}}
</el-descriptions-item>
<el-descriptions-item label="评分标准" label-class-name="labelClass" content-class-name="contentClass">
{{form.content}}
</el-descriptions-item>
<el-descriptions-item label="增减类型" label-class-name="labelClass" content-class-name="contentClass">
{{ util_formatters("subAddType", form.subAddType) }}
</el-descriptions-item>
<el-descriptions-item label="扣分或增加分值" label-class-name="labelClass" content-class-name="contentClass">
{{form.score}}
</el-descriptions-item>
<el-descriptions-item label="是否关联负责人" label-class-name="labelClass" content-class-name="contentClass">
{{ util_formatters("assoOwner", form.assoOwner) }}
</el-descriptions-item>
<el-descriptions-item label="负责人扣分或增加分值" label-class-name="labelClass" content-class-name="contentClass">
{{form.ownerScore}}
</el-descriptions-item>
<el-descriptions-item label="备注" label-class-name="labelClass" content-class-name="contentClass">
{{form.remark}}
</el-descriptions-item>
<el-descriptions-item label="规则类型" label-class-name="labelClass" content-class-name="contentClass">
{{ util_formatters("type", form.type) }}
</el-descriptions-item>
</el-descriptions>
</layout-view>
<layout-view>
<el-descriptions
:title="title"
:column="column"
:size="size"
:colon="false"
border
>
<template slot="title">
<i class="el-icon-tickets"></i>
基本详细信息
</template>
<template slot="extra">
<el-button type="primary" @click="$router.go(-1)" size="small"
>返回</el-button
>
</template>
<el-descriptions-item
label="分类id"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.categoryId }}
</el-descriptions-item>
<el-descriptions-item
label="分类名称"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.categoryName }}
</el-descriptions-item>
<el-descriptions-item
label="考核内容简称"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.name }}
</el-descriptions-item>
<el-descriptions-item
label="评分标准"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.content }}
</el-descriptions-item>
<el-descriptions-item
label="增减类型"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ util_formatters("subAddType", form.subAddType) }}
</el-descriptions-item>
<el-descriptions-item
label="扣分或增加分值"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.score }}
</el-descriptions-item>
<el-descriptions-item
label="是否关联负责人"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ util_formatters("assoOwner", form.assoOwner) }}
</el-descriptions-item>
<el-descriptions-item
label="负责人扣分或增加分值"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.ownerScore }}
</el-descriptions-item>
<el-descriptions-item
label="备注"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.remark }}
</el-descriptions-item>
<el-descriptions-item
label="规则类型"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ util_formatters("type", form.type) }}
</el-descriptions-item>
</el-descriptions>
</layout-view>
</template>
<script>
import view from "@/assets/mixins/view";
export default {
mixins: [view],
components: {
},
methods: {
},
data() {
return {
size:"small",
column:2,
toString:[
"subAddType",
"assoOwner",
"type",
],
toArrays: [
],
toDate: [
]
}
}
}
import view from "@/assets/mixins/view";
export default {
mixins: [view],
components: {},
methods: {},
data() {
return {
size: "small",
column: 2,
toString: ["subAddType", "assoOwner", "type"],
toArrays: [],
toDate: [],
};
},
};
</script>
<style lang="less">
.labelClass{
width: 200px;
}
.el-descriptions__body{
margin-left: 5px;
margin-right: 5px;
color: #606266;
background-color: #FFF;
}
.contentClass{
width: 600px;
}
</style>
\ No newline at end of file
.labelClass {
width: 200px;
}
.el-descriptions__body {
margin-left: 5px;
margin-right: 5px;
color: #606266;
background-color: #fff;
}
.contentClass {
width: 600px;
}
</style>
attendance-performance-manager-ui/admin/src/views/perform/rules/category/dialogshow.vue
View file @ adcd440a
<template>
<!-- 弹出框表单 -->
<el-dialog :title="title" :visible.sync="open" width="90%" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<Field label="绩效规则id" prop="ruleId" v-model="form.ruleId" placeholder="请输入绩效规则id"/>
<Field label="规则简称" prop="ruleBrief" v-model="form.ruleBrief" placeholder="请输入规则简称"/>
<Field label="分类名称" prop="name" v-model="form.name" placeholder="请输入分类名称"/>
<Field label="规则类型" prop="type" v-model="form.type" type="select" :enumData="dict.type" placeholder="请选择规则类型"/>
<Field label="备注" prop="remark" v-model="form.remark" type="textarea" placeholder="请输入备注"/>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" v-if="pageInfo.type !== 'view'" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<!-- 弹出框表单 -->
<el-dialog :title="title" :visible.sync="open" width="90%" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<Field
label="绩效规则id"
prop="ruleId"
v-model="form.ruleId"
placeholder="请输入绩效规则id"
/>
<Field
label="规则简称"
prop="ruleBrief"
v-model="form.ruleBrief"
placeholder="请输入规则简称"
/>
<Field
label="分类名称"
prop="name"
v-model="form.name"
placeholder="请输入分类名称"
/>
<Field
label="规则类型"
prop="type"
v-model="form.type"
type="select"
:enumData="dict.type"
placeholder="请选择规则类型"
/>
<Field
label="备注"
prop="remark"
v-model="form.remark"
type="textarea"
placeholder="请输入备注"
/>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button
type="primary"
v-if="pageInfo.type !== 'view'"
@click="submitForm"
>确 定</el-button
>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</template>
<script>
import form from "@/assets/mixins/formdialog";
import dialogShow from "./dialogshow";
export default {
mixins: [form],
components: {
dialogShow ,
},
data() {
return {
// 遮罩层
loading: true,
// 弹出层标题
title: "绩效规则分类信息",
// 是否显示弹出层
open: false,
toString:[
"type",
],
// 表单校验
rules: {
}
};
},
import form from "@/assets/mixins/formdialog";
import dialogShow from "./dialogshow";
export default {
mixins: [form],
components: {
dialogShow,
},
data() {
return {
// 遮罩层
loading: true,
// 弹出层标题
title: "绩效规则分类信息",
// 是否显示弹出层
open: false,
toString: ["type"],
// 表单校验
rules: {},
};
},
methods: {
/** 编辑 */
edit(row) {
this.reset()
this.query = { id: row.id };
this.urls.currUrl ="perform/rules/category/edit";
this.getData();
this.pageInfo.type="edit"
this.title = "修改绩效规则分类信息";
},
/** 新增 */
add(row) {
this.reset()
this.urls.currUrl = "perform/rules/category/add";
this.getData();
this.pageInfo.type="add"
this.title = "新增绩效规则分类信息";
},
/** 查看*/
view(row) {
this.reset()
this.query = { id: row.id };
this.urls.currUrl ="perform/rules/category/view";
this.getData();
this.pageInfo.type="view"
this.title = "绩效规则分类信息详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.open = true;
},
methods: {
/** 编辑 */
edit(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = "perform/rules/category/edit";
this.getData();
this.pageInfo.type = "edit";
this.title = "修改绩效规则分类信息";
},
/** 新增 */
add(row) {
this.reset();
this.urls.currUrl = "perform/rules/category/add";
this.getData();
this.pageInfo.type = "add";
this.title = "新增绩效规则分类信息";
},
/** 查看*/
view(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = "perform/rules/category/view";
this.getData();
this.pageInfo.type = "view";
this.title = "绩效规则分类信息详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.open = true;
},
afterSubmit(data) {
this.open = false;
this.$emit("ok");
},
afterSubmit(data) {
this.open = false;
this.$emit("ok");
},
// 表单重置
reset() {
this.form = {
ruleId : null,
ruleBrief : "",
name : "",
type : 1,
remark : "",
};
this.resetForm("form");
},
resetForm(refName) {
if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
},
},
};
// 表单重置
reset() {
this.form = {
ruleId: null,
ruleBrief: "",
name: "",
type: 1,
remark: "",
};
this.resetForm("form");
},
resetForm(refName) {
if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
},
},
};
</script>
attendance-performance-manager-ui/admin/src/views/perform/rules/category/list.vue
View file @ adcd440a
<template>
<div class="page">
<LayoutTable :data="tableData" :config="tableConfig">
</LayoutTable>
<div class="page">
<LayoutTable :data="tableData" :config="tableConfig"> </LayoutTable>
<dialog-show ref="dialogform" @ok="getData" />
</div>
<dialog-show ref="dialogform" @ok="getData" />
</div>
</template>
<script>
/** 表单弹出框模式需引入 */
import dialogShow from "./dialogshow";
import table from "@/assets/mixins/table";
export default {
name: "PerformRulesCategoryList",
components: {
dialogShow
},
mixins: [table],
created() {
},
methods: {
/** 重写新增方法 */
toAdd(row) {
this.$refs.dialogform.add(row);
},
/** 重写编辑方法 */
toEdit(row) {
this.$refs.dialogform.edit(row);
},
/** 重写查看方法 */
toView(row) {
this.$refs.dialogform.view(row);
},
},
data() {
return {
config: {
isshowTabPane:true,
search: [
],
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{label: "分类名称", prop: "name"},
/** 表单弹出框模式需引入 */
import dialogShow from "./dialogshow";
import table from "@/assets/mixins/table";
export default {
name: "PerformRulesCategoryList",
components: {
dialogShow,
},
mixins: [table],
created() {},
methods: {
/** 重写新增方法 */
toAdd(row) {
this.$refs.dialogform.add(row);
},
/** 重写编辑方法 */
toEdit(row) {
this.$refs.dialogform.edit(row);
},
/** 重写查看方法 */
toView(row) {
this.$refs.dialogform.view(row);
},
},
data() {
return {
config: {
isshowTabPane: true,
search: [],
columns: [
{ type: "selection", width: 60 },
{ type: "index", label: "序号", width: 50 },
{ label: "分类名称", prop: "name" },
{label: "规则类型", prop: "type",formatter: this.formatter},
{ label: "规则类型", prop: "type", formatter: this.formatter },
{label: "创建用户", prop: "createUserId", formatter: this.formatter},
{
label: "操作",
width: 240,
formatter: row => {
return (
<table-buttons noAdd row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} />
);
}
}
]
}
};
}
{
label: "创建用户",
prop: "createUserId",
formatter: this.formatter,
},
{
label: "操作",
width: 240,
formatter: (row) => {
return (
<table-buttons
noAdd
row={row}
onEdit={this.toEdit}
onView={this.toView}
onDel={this.toDel}
/>
);
},
},
],
},
};
},
};
</script>
attendance-performance-manager-ui/admin/src/views/staff/perform/stat/components/BarCharts.vue 0 → 100644
View file @ adcd440a
<template>
<div>
<div :id="id" :style="styleObj"></div>
</div>
</template>
<script>
export default {
props: {
title: {
type: String,
default: "",
},
id: {
type: String,
default: "",
},
legendName: {
type: String,
default: "",
},
styleObj: {
type: Object,
default: () => {},
},
},
data() {
return {};
},
watch: {
title(val) {
console.log(val);
},
},
mounted() {
this.drawLine();
},
methods: {
drawLine() {
// 基于dom，初始化echarts实例
let myChart = this.$echarts.init(document.getElementById(this.id));
// 绘制图表
myChart.setOption({
title: {
text: this.title,
left: this.legendName == "旷工率" ? "center" : "left",
textStyle: {
fontSize: this.legendName == "旷工率" ? 24 : 18,
},
},
// legend: {
// orient: "horizontal",
// right: "10px",
// top: "0",
// itemWidth: 20,
// itemHeight: 10,
// icon: "roundRect",
// textStyle: {
// fontSize: "14px",
// color: "#000",
// },
// },
tooltip: {},
xAxis: {
data: ["部门1", "部门2", "部门3", "部门4", "部门5", "部门6"],
},
grid: {
left: "5%",
right: "4%",
bottom: "2%",
containLabel: true,
},
yAxis: {},
series: [
{
name: this.legendName,
type: "bar",
data: [5, 20, 36, 10, 10, 20],
itemStyle: {
lineStyle: {
type: "dotted", //'dotted'虚线 'solid'实线
},
},
},
],
});
},
},
};
</script>
<style lang="less" scoped></style>
attendance-performance-manager-ui/admin/src/views/staff/perform/stat/components/LineCharts.vue 0 → 100644
View file @ adcd440a
<template>
<div>
<div :id="id" :style="styleObj"></div>
</div>
</template>
<script>
export default {
props: {
title: {
type: String,
default: "",
},
id: {
type: String,
default: "",
},
legendName: {
type: String,
default: "",
},
styleObj: {
type: Object,
default: () => {},
},
},
data() {
return {};
},
watch: {
title(val) {
console.log(val);
},
},
mounted() {
this.drawLine();
},
methods: {
drawLine() {
// 基于dom，初始化echarts实例
let myChart = this.$echarts.init(document.getElementById(this.id));
// 绘制图表
myChart.setOption({
title: { text: this.title },
legend: {
orient: "horizontal",
left: "center",
top: "0",
itemWidth: 20,
itemHeight: 10,
icon: "roundRect",
textStyle: {
fontSize: "14px",
color: "#000",
},
},
tooltip: {},
xAxis: {
type: "category",
data: ["部门1", "部门2", "部门3", "部门4", "部门5", "部门6"],
},
grid: {
left: "3%",
right: "4%",
bottom: "2%",
containLabel: true,
},
yAxis: {},
series: [
{
name: this.legendName,
type: "line",
data: [10, 20, 30, 90, 100, 100, 120],
smooth: true,
// itemStyle: {
// lineStyle: {
// type: "dotted", //'dotted'虚线 'solid'实线
// },
// },
},
],
});
},
},
};
</script>
<style lang="less" scoped></style>
attendance-performance-manager-ui/admin/src/views/staff/perform/stat/components/PieCharts.vue 0 → 100644
View file @ adcd440a
<template>
<div>
<div :id="id" :style="styleObj"></div>
</div>
</template>
<script>
export default {
props: {
title: {
type: String,
default: "",
},
id: {
type: String,
default: "",
},
legendName: {
type: String,
default: "",
},
styleObj: {
type: Object,
default: () => {},
},
},
data() {
return {};
},
watch: {
title(val) {
console.log(val);
},
},
mounted() {
this.drawLine();
},
methods: {
drawLine() {
// 基于dom，初始化echarts实例
let myChart = this.$echarts.init(document.getElementById(this.id));
// 绘制图表
myChart.setOption({
title: { text: this.title },
legend: {
orient: "vertical",
left: "right",
bottom: "0",
itemWidth: 20,
itemHeight: 10,
icon: "roundRect",
textStyle: {
fontSize: "14px",
color: "#000",
},
},
tooltip: {
trigger: "item",
},
grid: {
left: "3%",
right: "4%",
containLabel: true,
},
series: [
{
name: this.legendName,
type: "pie",
radius: "65%",
data: [
{ value: 1048, name: "部门1" },
{ value: 735, name: "部门2" },
{ value: 580, name: "部门3" },
{ value: 484, name: "部门4" },
{ value: 300, name: "部门5" },
],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: "rgba(0, 0, 0, 0.5)",
},
},
},
],
});
},
},
};
</script>
<style lang="less" scoped></style>
attendance-performance-manager-ui/admin/src/views/staff/perform/stat/list(原绩效目标).vue 0 → 100644
View file @ adcd440a
<template>
<div class="page">
<LayoutTable :data="tableData" :config="tableConfig">
</LayoutTable>
<drawer-show ref="drawerform" @ok="getData" />
</div>
</template>
<script>
/** 表单弹出框模式需引入 */
import drawerShow from "./drawershow";
import table from "@/assets/mixins/table";
export default {
name: "StaffPerformStatList",
components: {
drawerShow
},
mixins: [table],
created() {
},
methods: {
/** 重写新增方法 */
toAdd(row) {
this.$refs.drawerform.add(row);
},
/** 重写编辑方法 */
toEdit(row) {
this.$refs.drawerform.edit(row);
},
/** 重写查看方法 */
toView(row) {
this.$refs.drawerform.view(row);
},
},
data() {
return {
config: {
isshowTabPane:true,
search: [
],
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{label: "部门名称", prop: "deptName"},
{label: "考勤绩效指标增加分数", prop: "attendScoreAdd", formatter: this.formatter},
{label: "考勤绩效指标扣减分数", prop: "attendScoreSub", formatter: this.formatter},
{label: "评价绩效指标增加分数", prop: "assessScoreAdd", formatter: this.formatter},
{label: "评价绩效指标扣减分数", prop: "assessScoreSub", formatter: this.formatter},
{label: "办件绩效指标增加分数", prop: "workScoreAdd", formatter: this.formatter},
{label: "办件绩效指标扣减分数", prop: "workScoreSub", formatter: this.formatter},
{label: "效能绩效指标增加分数", prop: "effectScoreAdd", formatter: this.formatter},
{label: "效能绩效指标扣减分数", prop: "effectScoreSub", formatter: this.formatter},
{label: "其它绩效指标增加分数", prop: "otherScoreAdd", formatter: this.formatter},
{label: "其它绩效指标扣减分数", prop: "otherScoreSub", formatter: this.formatter},
{
label: "操作",
width: 240,
formatter: row => {
return (
<table-buttons noAdd row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} />
);
}
}
]
}
};
}
};
</script>
attendance-performance-manager-ui/admin/src/views/staff/perform/stat/list.vue
View file @ adcd440a
<template>
<div class="page">
<LayoutTable :data="tableData" :config="tableConfig">
</LayoutTable>
<drawer-show ref="drawerform" @ok="getData" />
</div>
<div class="page">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="目标看板" name="1">
<div class="content">
<div class="top">
<el-radio-group v-model="type">
<el-radio-button label="1">按部门</el-radio-button>
<el-radio-button label="2">按个人</el-radio-button>
</el-radio-group>
</div>
<div class="mid">
<div class="mid_top">
<div class="jixiaozongfen">
<bar-charts
:title="'绩效总分排名'"
:id="'jixiaozongfen'"
:legendName="'绩效总分'"
:styleObj="{ width: '100%', height: '300px' }"
/>
</div>
<div class="jixiaopingjunfen">
<line-charts
:title="'绩效平均分排名'"
:id="'jixiaopingjunfen'"
:legendName="'绩效平均分'"
:styleObj="{ width: '100%', height: '300px' }"
/>
</div>
</div>
<div class="mid_down">
<div class="top_10 box">
<bar-charts
:title="'部门加分排名TOP10'"
:id="'top_10'"
:legendName="'部门加分分值'"
:styleObj="{ width: '100%', height: '300px' }"
/>
</div>
<div class="jiafen box">
<pie-charts
:title="'部门加分整体分布'"
:id="'jiafen'"
:legendName="'部门加分'"
:styleObj="{ width: '100%', height: '300px' }"
/>
</div>
<div class="koufen_10 box">
<bar-charts
:title="'部门扣分排名TOP10'"
:id="'koufen_10'"
:legendName="'部门扣分分值'"
:styleObj="{ width: '100%', height: '300px' }"
/>
</div>
<div class="koufen box">
<pie-charts
:title="'部门扣分整体分布'"
:id="'koufen'"
:legendName="'部门扣分'"
:styleObj="{ width: '100%', height: '300px' }"
/>
</div>
</div>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="目标对齐" name="2">
<div class="content">
<div class="top search_top">
<el-radio-group v-model="type">
<el-radio-button label="1">按部门</el-radio-button>
<el-radio-button label="2">按个人</el-radio-button>
</el-radio-group>
<div class="search_box">
<el-select v-model="value" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
<el-select
v-model="value"
placeholder="请选择"
style="margin: 0 10px;"
>
<el-option
v-for="item in optionsMonths"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
<el-button type="primary">搜索</el-button>
</div>
</div>
<div class="bar_content">
<bar-charts
:title="'各部门1月旷工率对齐情况'"
:id="'bar_content'"
:legendName="'旷工率'"
:styleObj="{ width: '1800px', height: '650px' }"
/>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="目标管理" name="3">
<div class="content">
<div class="top">
<el-radio-group v-model="type">
<el-radio-button label="1">按部门</el-radio-button>
<el-radio-button label="2">按个人</el-radio-button>
</el-radio-group>
<el-button type="primary" style="margin: 0 20px;">
+ 创建目标</el-button
>
</div>
<div class="mid_content">
<div class="goal_box">
<div class="goal_title">
<img src="../../../../assets/images/u17641.svg" alt="" />
<span>
旷工率不高于10%
</span>
</div>
<p class="goal_txt">
<span>目标部门：</span><span>全部部门</span>
</p>
<p class="goal_txt"><span>周期：</span><span>全部部门</span></p>
<p class="goal_txt"><span>负责人：</span><span>全部部门</span></p>
<p class="goal_txt">
<span>最近更新：</span><span>全部部门</span>
</p>
<p class="goal_txt">
<span>更新人员：</span><span>全部部门</span>
</p>
<div class="button_box">
<el-button type="primary" style="width: 150px;" plain
>编辑</el-button
>
<el-button type="danger" style="width: 150px;" plain
>删除</el-button
>
</div>
</div>
</div>
</div>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
/** 表单弹出框模式需引入 */
import drawerShow from "./drawershow";
import table from "@/assets/mixins/table";
export default {
name: "StaffPerformStatList",
components: {
drawerShow
},
mixins: [table],
created() {
},
methods: {
/** 重写新增方法 */
toAdd(row) {
this.$refs.drawerform.add(row);
},
/** 重写编辑方法 */
toEdit(row) {
this.$refs.drawerform.edit(row);
},
/** 重写查看方法 */
toView(row) {
this.$refs.drawerform.view(row);
},
import BarCharts from "./components/BarCharts.vue";
import LineCharts from "./components/LineCharts.vue";
import PieCharts from "./components/PieCharts.vue";
export default {
components: {
BarCharts,
PieCharts,
LineCharts,
},
name: "StaffPerformStatList",
created() {},
methods: {
handleClick(tab, event) {
console.log(tab, event);
},
},
data() {
return {
activeName: "1",
type: "1",
options: [
{
value: "1",
label: "旷工率",
},
data() {
return {
config: {
isshowTabPane:true,
search: [
],
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{label: "部门名称", prop: "deptName"},
{label: "考勤绩效指标增加分数", prop: "attendScoreAdd", formatter: this.formatter},
{label: "考勤绩效指标扣减分数", prop: "attendScoreSub", formatter: this.formatter},
{label: "评价绩效指标增加分数", prop: "assessScoreAdd", formatter: this.formatter},
{label: "评价绩效指标扣减分数", prop: "assessScoreSub", formatter: this.formatter},
{label: "办件绩效指标增加分数", prop: "workScoreAdd", formatter: this.formatter},
{label: "办件绩效指标扣减分数", prop: "workScoreSub", formatter: this.formatter},
{label: "效能绩效指标增加分数", prop: "effectScoreAdd", formatter: this.formatter},
{label: "效能绩效指标扣减分数", prop: "effectScoreSub", formatter: this.formatter},
{label: "其它绩效指标增加分数", prop: "otherScoreAdd", formatter: this.formatter},
{label: "其它绩效指标扣减分数", prop: "otherScoreSub", formatter: this.formatter},
{
label: "操作",
width: 240,
formatter: row => {
return (
<table-buttons noAdd row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} />
);
}
}
]
}
};
}
{
value: "2",
label: "缺卡率",
},
{
value: "3",
label: "迟到率",
},
{
value: "4",
label: "早退率",
},
{
value: "5",
label: "请假率",
},
{
value: "6",
label: "离岗率",
},
{
value: "7",
label: "睡觉率",
},
{
value: "8",
label: "玩手机率",
},
{
value: "9",
label: "办件超期率",
},
{
value: "10",
label: "差评率",
},
],
optionsMonths: [
{
value: "1",
label: "1月",
},
{
value: "2",
label: "2月",
},
{
value: "3",
label: "3月",
},
{
value: "4",
label: "4月",
},
{
value: "5",
label: "5月",
},
{
value: "6",
label: "6月",
},
{
value: "7",
label: "7月",
},
{
value: "8",
label: "8月",
},
{
value: "9",
label: "9月",
},
{
value: "10",
label: "10月",
},
{
value: "11",
label: "11月",
},
{
value: "12",
label: "12月",
},
],
value: "",
};
},
};
</script>
<style lang="less" scoped>
.page {
width: 100%;
height: 100%;
overflow: hidden;
/deep/.el-tabs__item {
width: 120px;
font-size: 18px;
text-align: center;
}
.content {
width: 100%;
height: 100%;
.search_top {
width: 100%;
height: 1000%;
display: flex;
justify-content: space-between;
}
/deep/.el-radio-button {
width: 150px;
text-align: center;
border: 1px solid #eee;
}
/deep/.el-radio-button__inner {
width: 150px;
}
/deep/.el-radio-button__orig-radio:checked + .el-radio-button__inner {
width: 150px;
border: none;
background: #1890ff;
color: #fff;
border: 1px solid #eee;
}
.top {
width: 100%;
height: 60px;
}
.mid {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
.mid_top {
width: 100%;
height: 300px;
display: flex;
justify-content: space-between;
.jixiaozongfen,
.jixiaopingjunfen {
width: 48%;
height: 100%;
}
}
.mid_down {
width: 100%;
height: 380px;
display: flex;
justify-content: space-evenly;
padding-top: 50px;
.box {
width: 25%;
height: 100%;
}
}
}
.mid_content,
.bar_content {
width: 100%;
height: 700px;
overflow: hidden;
}
.mid_content {
overflow-y: auto;
display: flex;
flex-wrap: wrap;
.goal_box {
width: 435px;
height: 238px;
background: inherit;
background-color: rgba(255, 255, 255, 1);
border: none;
border-radius: 8px;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.117647058823529);
-moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.117647058823529);
-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.117647058823529);
margin: 0 20px 20px 0;
padding: 20px;
.goal_title {
width: 100%;
display: flex;
align-items: center;
img {
margin-right: 10px;
}
}
.goal_txt {
font-family: "微软雅黑", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 12px;
color: #666666;
width: 100%;
margin: 10px 0;
}
.button_box {
width: 100%;
display: flex;
justify-content: space-evenly;
align-items: center;
}
}
}
}
}
</style>
attendance-performance-manager-ui/admin/yarn.lock
View file @ adcd440a
......@@ -3665,8 +3665,8 @@
"version" "1.1.3"
"echarts@^4.8.0", "echarts@^4.9.0", "echarts@>3.0.0":
"integrity" "sha1-qbm6oD8Doqcx5jQMVb77V6nhNH0="
"resolved" "https://registry.nlark.com/echarts/download/echarts-4.9.0.tgz"
"integrity" "sha512-+ugizgtJ+KmsJyyDPxaw2Br5FqzuBnyOWwcxPKO6y0gc5caYcfnEUIlNStx02necw8jmKmTafmpHhGo4XDtEIA=="
"resolved" "https://registry.npmjs.org/echarts/-/echarts-4.9.0.tgz"
"version" "4.9.0"
dependencies:
"zrender" "4.3.2"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment