Skip to content

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

tui

parent d6057f55
Show whitespace changes
Inline Side-by-side
Showing with 605 additions and 120 deletions
attendance-performance-manager-ui/admin/src/views/perform/attend/appeal/components/BarCharts.vue 0 → 100644
View file @ 3c40b99c
<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);
this.drawLine();
},
},
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,
},
},
color:'#6e98ed',
legend: {
orient: "horizontal",
right: "50px",
top: "0",
itemWidth: 20,
itemHeight: 10,
icon: "roundRect",
textStyle: {
fontSize: "14px",
color: "#000",
},
},
tooltip: {},
xAxis: {
data:
this.title == "申诉次数部门排名TOP20"
? [
"部门1",
"部门2",
"部门3",
"部门4",
"部门5",
"部门6",
"部门7",
"部门8",
"部门9",
"部门10",
"部门11",
"部门12",
"部门13",
"部门14",
"部门15",
"部门16",
"部门17",
"部门18",
"部门19",
"部门20",
]
: this.title == "申诉次数个人排名TOP20"
? [
"个人1",
"个人2",
"个人3",
"个人4",
"个人5",
"个人6",
"个人7",
"个人8",
"个人9",
"个人10",
"个人11",
"个人12",
"个人13",
"个人14",
"个人15",
"个人16",
"个人17",
"个人18",
"个人19",
"个人20",
]
: [
"规则1",
"规则2",
"规则3",
"规则4",
"规则5",
"规则6",
"规则7",
"规则8",
"规则9",
"规则10",
"规则11",
"规则12",
"规则13",
"规则14",
"规则15",
"规则16",
"规则17",
"规则18",
"规则19",
"规则20",
],
},
grid: {
left: "5%",
right: "4%",
bottom: "2%",
containLabel: true,
},
// color:[ "#61a0a8",],
yAxis: {},
series: [
{
name: this.legendName,
type: "bar",
data: [
1200,
1100,
900,
800,
1122,
1234,
1050,
1155,
1120,
1136,
1110,
1110,
1120,
1020,
1212,
1233,
1111,
1000,
1111,
1024,
],
itemStyle: {
// normal: {
// //这里是重点
// color: function(params) {
// //注意，如果颜色太少的话，后面颜色不会自动循环，最好多定义几个颜色
// var colorList = ["#6e98ed"];
// return colorList[params.dataIndex];
// },
// },
lineStyle: {
type: "dotted", //'dotted'虚线 'solid'实线
},
},
},
],
});
},
},
};
</script>
<style lang="less" scoped></style>
attendance-performance-manager-ui/admin/src/views/perform/attend/appeal/list(原绩效申诉).vue 0 → 100644
View file @ 3c40b99c
<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: "PerformAttendAppealList",
components: {
drawerShow
},
mixins: [table],
created() {
},
methods: {
renderTable(tableData) {
return (
<el-table stripe data={tableData} class="total-table">
{this.columnSet.map((item) => this.renderTableColumn(item))}
</el-table>
);
},
renderTableColumn(options) {
return (
<el-table-column
prop={options.prop}
label={options.label}
width={options.width}
formatter={options.formatter}
>
</el-table-column>
);
},
/** 重写新增方法 */
toAdd(row) {
this.$refs.drawerform.add(row);
},
/** 重写编辑方法 */
toEdit(row) {
this.$refs.drawerform.edit(row);
},
/** 重写查看方法 */
toView(row) {
this.$refs.drawerform.view(row);
},
},
data() {
return {
/** 子表列元素 */
columnSet:[
{label: "申诉Id", prop: "appealId", formatter: this.formatter},
{label: "文件名称", prop: "fileName"},
{label: "文件地址", prop: "filePath"},
],
config: {
isshowTabPane:false,
search: [
],
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{label: "姓名", prop: "staffName"},
{label: "窗口工号", prop: "workNum"},
{label: "所属部门", prop: "deptName"},
{label: "违规类型", prop: "ruleName"},
{label: "绩效规则", prop: "ruleName"},
{label: "扣分方式", prop: "subMethod",formatter: this.formatter},
{label: "扣分时间", prop: "attendanceDate" , formatter: this.formatterDate },
{label: "扣分分值", prop: "score", formatter: this.formatter},
{label: "申诉时间", prop: "appealTime", formatter: this.formatterDate},
{label: "处理状态", prop: "processStatus",formatter: this.formatter},
/* {label: "绩效记录申诉附件信息",
width: 120,
prop: "subColumns",
formatter: (row) => {
let widthsize = this.columnSet.reduce((pre, cur) => {
return pre + Number(cur.width);
}, 50);
return (
<el-popover placement="right" width={widthsize} trigger="click">
{this.renderTable(row.performAttendAppealFilesList)}
<el-button type="text" slot="reference">详细</el-button>
</el-popover>
);
},
},*/
{
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/perform/attend/appeal/list.vue
View file @ 3c40b99c
<template>
<div class="page">
<LayoutTable :data="tableData" :config="tableConfig">
<el-tabs v-model="activeName">
<el-tab-pane label="未处理" name="1">
<LayoutTable :data="tableData" notAdd notDel :config="tableConfig">
</LayoutTable>
</el-tab-pane>
<el-tab-pane label="已处理" name="2">
<LayoutTable :data="tableData" notAdd notDel :config="tableConfig">
</LayoutTable>
</el-tab-pane>
<el-tab-pane label="数据分析" name="3">
<div class="content">
<div class="search_box">
<div class="search">
<el-select
v-model="dateValue"
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="data_box">
<div class="top">
<div class="box">
<bar-charts
:title="'申诉次数部门排名TOP20'"
:id="'dept_20'"
:legendName="'申诉次数'"
:styleObj="{ width: '800px', height: '360px' }"
/>
</div>
<div class="box">
<bar-charts
:title="'申诉次数个人排名TOP20'"
:id="'person_20'"
:legendName="'申诉次数'"
:styleObj="{ width: '800px', height: '360px' }"
/>
</div>
</div>
<div class="down">
<bar-charts
:title="'申诉次数规则排名TOP20'"
:id="'rule_20'"
:legendName="'申诉次数'"
:styleObj="{ width: '1800px', height: '320px' }"
/>
</div>
</div>
</div>
</el-tab-pane>
</el-tabs>
<!-- <bar-charts
:title="'部门扣分排名TOP10'"
:id="'koufen_10'"
:legendName="'部门扣分分值'"
:styleObj="{ width: '100%', height: '300px' }"
/> -->
<drawer-show ref="drawerform" @ok="getData" />
</div>
</template>
<script>
/** 表单弹出框模式需引入 */
import drawerShow from "./drawershow";
import table from "@/assets/mixins/table";
export default {
/** 表单弹出框模式需引入 */
import drawerShow from "./drawershow";
import table from "@/assets/mixins/table";
import BarCharts from "./components/BarCharts.vue";
export default {
name: "PerformAttendAppealList",
components: {
drawerShow
},
mixins: [table],
created() {
drawerShow,
BarCharts,
},
mixins: [table],
created() {},
methods: {
renderTable(tableData) {
return (
......@@ -35,8 +98,7 @@
label={options.label}
width={options.width}
formatter={options.formatter}
>
</el-table-column>
></el-table-column>
);
},
/** 重写新增方法 */
......@@ -51,43 +113,52 @@
toView(row) {
this.$refs.drawerform.view(row);
},
},
data() {
return {
/** 子表列元素 */
columnSet:[
{label: "申诉Id", prop: "appealId", formatter: this.formatter},
{label: "文件名称", prop: "fileName"},
{label: "文件地址", prop: "filePath"},
columnSet: [
{ label: "申诉Id", prop: "appealId", formatter: this.formatter },
{ label: "文件名称", prop: "fileName" },
{ label: "文件地址", prop: "filePath" },
],
config: {
isshowTabPane:false,
search: [
],
isshowTabPane: false,
search: [],
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{ type: "selection", width: 60 },
{ type: "index", label: "序号", width: 50 },
{label: "姓名", prop: "staffName"},
{ label: "姓名", prop: "staffName" },
{label: "窗口工号", prop: "workNum"},
{ label: "窗口工号", prop: "workNum" },
{label: "所属部门", prop: "deptName"},
{ label: "所属部门", prop: "deptName" },
{label: "违规类型", prop: "ruleName"},
{label: "绩效规则", prop: "ruleName"},
{ label: "违规类型", prop: "ruleName" },
{ label: "绩效规则", prop: "ruleName" },
{label: "扣分方式", prop: "subMethod",formatter: this.formatter},
{ label: "扣分方式", prop: "subMethod", formatter: this.formatter },
{label: "扣分时间", prop: "attendanceDate" , formatter: this.formatterDate },
{label: "扣分分值", prop: "score", formatter: this.formatter},
{
label: "扣分时间",
prop: "attendanceDate",
formatter: this.formatterDate,
},
{ label: "扣分分值", prop: "score", formatter: this.formatter },
{label: "申诉时间", prop: "appealTime", formatter: this.formatterDate},
{
label: "申诉时间",
prop: "appealTime",
formatter: this.formatterDate,
},
{label: "处理状态", prop: "processStatus",formatter: this.formatter},
{
label: "处理状态",
prop: "processStatus",
formatter: this.formatter,
},
/* {label: "绩效记录申诉附件信息",
width: 120,
......@@ -107,15 +178,109 @@
{
label: "操作",
width: 240,
formatter: row => {
formatter: (row) => {
return (
<table-buttons noAdd row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} />
<table-buttons
noAdd
row={row}
onEdit={this.toEdit}
onView={this.toView}
onDel={this.toDel}
/>
);
},
},
],
},
activeName: "1",
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月",
},
],
dateValue: "1",
};
},
};
</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: 730px;
overflow: hidden;
.search_box {
width: 100%;
height: auto;
text-align: right;
}
]
.data_box {
width: 100%;
height: 100%;
.top {
width: 100%;
height: 380px;
display: flex;
justify-content: space-between;
.box {
width: 49%;
height: 100%;
}
};
}
};
</script>
}
}
}
</style>
attendance-performance-manager-ui/admin/src/views/perform/attend/data/list.vue 0 → 100644
View file @ 3c40b99c
<template>
<div>qwe</div>
</template>
<script>
export default {
name: "AdminList",
data() {
return {};
},
mounted() {},
methods: {},
};
</script>
<style lang="less" scoped></style>
attendance-performance-manager-ui/admin/src/views/staff/perform/stat/components/BarCharts.vue
View file @ 3c40b99c
......@@ -50,18 +50,19 @@ export default {
fontSize: this.legendName == "旷工率" ? 24 : 18,
},
},
// legend: {
// orient: "horizontal",
// right: "10px",
// top: "0",
// itemWidth: 20,
// itemHeight: 10,
// icon: "roundRect",
// textStyle: {
// fontSize: "14px",
// color: "#000",
// },
// },
color:'#6e98ed',
legend: {
orient: "horizontal",
right: "50px",
top: "0",
itemWidth: 20,
itemHeight: 10,
icon: "roundRect",
textStyle: {
fontSize: "14px",
color: "#000",
},
},
tooltip: {},
xAxis: {
data: ["部门1", "部门2", "部门3", "部门4", "部门5", "部门6"],
......@@ -80,22 +81,7 @@ export default {
type: "bar",
data: [5, 20, 36, 10, 10, 20],
itemStyle: {
normal: {
//这里是重点
color: function(params) {
//注意，如果颜色太少的话，后面颜色不会自动循环，最好多定义几个颜色
var colorList = [
"#c23531",
"#2f4554",
"#61a0a8",
"#d48265",
"#91c7ae",
"#749f83",
"#ca8622",
];
return colorList[params.dataIndex];
},
},
lineStyle: {
type: "dotted", //'dotted'虚线 'solid'实线
},
......
attendance-performance-manager-ui/admin/src/views/staff/perform/stat/components/LineCharts.vue
View file @ 3c40b99c
......@@ -56,7 +56,7 @@ export default {
},
},
tooltip: {},
color:[ "#61a0a8",],
color:'#6e98ed',
xAxis: {
type: "category",
data: ["部门1", "部门2", "部门3", "部门4", "部门5", "部门6"],
......
attendance-performance-manager-ui/admin/src/views/staff/perform/stat/components/PieCharts.vue
View file @ 3c40b99c
......@@ -55,6 +55,7 @@ export default {
color: "#000",
},
},
// color:'#6e98ed',
tooltip: {
trigger: "item",
},
......
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