You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
464 lines
12 KiB
464 lines
12 KiB
<template> |
|
<basic-container> |
|
<!-- 绩效公示 --> |
|
<avue-crud |
|
:option="option" |
|
:table-loading="loading" |
|
:data="data" |
|
v-model="form" |
|
v-model:page="page" |
|
ref="crud" |
|
@row-update="rowUpdate" |
|
@row-save="rowSave" |
|
@search-change="searchChange" |
|
@search-reset="searchReset" |
|
@selection-change="selectionChange" |
|
@current-change="currentChange" |
|
@size-change="sizeChange" |
|
@refresh-change="refreshChange" |
|
@on-load="onLoad" |
|
@cell-click="cellClick" |
|
> |
|
<!-- <template #menu="scope"> |
|
<el-button type="text" @click="viewRow(scope.row)">详情</el-button> |
|
</template> --> |
|
</avue-crud> |
|
<el-dialog title="公示详情" v-model="showExcel" append-to-body width="85%"> |
|
<div> |
|
月份： |
|
<el-date-picker |
|
v-model="monthValue" |
|
type="month" |
|
placeholder="选择月份" |
|
:disabled-date="pickerOptions" |
|
> |
|
</el-date-picker> |
|
<el-button type="primary" style="margin-left: 10px" @click="queryPerformance">查询</el-button> |
|
</div> |
|
<el-table :data="tableData" style="margin-top: 10px"> |
|
<el-table-column |
|
align="center" |
|
label="KPI得分" |
|
prop="KPI" |
|
width="75" |
|
></el-table-column> |
|
<el-table-column |
|
align="center" |
|
label="量化得分" |
|
prop="lh" |
|
width="80" |
|
></el-table-column> |
|
<el-table-column |
|
align="center" |
|
label="订单准时完成率" |
|
prop="orderTime" |
|
width="130" |
|
></el-table-column> |
|
<el-table-column |
|
align="center" |
|
label="重点零件完成率" |
|
prop="keyPoint" |
|
width="130" |
|
></el-table-column> |
|
<el-table-column |
|
align="center" |
|
label="后工序审理单分数" |
|
prop="after" |
|
width="140" |
|
></el-table-column> |
|
<el-table-column |
|
align="center" |
|
label="出厂不合格率DPP" |
|
prop="unqualified" |
|
width="140" |
|
></el-table-column> |
|
<el-table-column |
|
align="center" |
|
label="成本费用率" |
|
prop="costMoney" |
|
width="95" |
|
></el-table-column> |
|
<el-table-column align="center" label="通报" prop="notice"></el-table-column> |
|
<el-table-column |
|
align="center" |
|
label="请假扣分" |
|
prop="leave" |
|
width="80" |
|
></el-table-column> |
|
<el-table-column |
|
align="center" |
|
label="考勤扣分" |
|
prop="check" |
|
width="80" |
|
></el-table-column> |
|
<el-table-column align="center" label="投稿加分项" prop="add" width="100"></el-table-column> |
|
<el-table-column |
|
align="center" |
|
label="群策群力" |
|
prop="all" |
|
width="80" |
|
></el-table-column> |
|
<el-table-column |
|
align="center" |
|
label="优秀员工加分" |
|
prop="excellence" |
|
width="120" |
|
></el-table-column> |
|
<el-table-column |
|
align="center" |
|
label="成本" |
|
prop="cost" |
|
width="55" |
|
></el-table-column> |
|
<el-table-column |
|
align="center" |
|
label="总分" |
|
prop="total" |
|
width="55" |
|
></el-table-column> |
|
</el-table> |
|
</el-dialog> |
|
</basic-container> |
|
</template> |
|
|
|
<script> |
|
export default { |
|
data() { |
|
return { |
|
showExcel: false, |
|
monthValue: "2025-09", |
|
pickerOptions: (time) => { |
|
const year = new Date().getFullYear() |
|
return time.getFullYear() !== year; // 如果年份不等于当前年份，则禁用该日期 |
|
}, |
|
tableData: [ |
|
{ |
|
KPI: 70, |
|
lh: 26, |
|
orderTime: 0, |
|
keyPoint: "", |
|
after: "", |
|
unqualified: "", |
|
costMoney: "", |
|
notice: 0, |
|
all: 0, |
|
leave: 0, |
|
check: 0, |
|
add: 0, |
|
excellence: 2, |
|
cost: 0, |
|
total: 98, |
|
}, |
|
], |
|
monthArr: [ |
|
{ label: "一月", value: 1 }, |
|
{ label: "一月", value: 1 }, |
|
{ label: "一月", value: 1 }, |
|
{ label: "一月", value: 1 }, |
|
], |
|
loading: false, |
|
data: [], |
|
form: {}, |
|
page: { |
|
pageSize: 10, |
|
currentPage: 1, |
|
total: 0, |
|
}, |
|
option: { |
|
height: "auto", |
|
align: "center", |
|
calcHeight: 32, |
|
rowKey: "id", |
|
rowParentKey: "parentId", |
|
tip: false, |
|
simplePage: true, |
|
searchShow: true, |
|
searchMenuSpan: 6, |
|
searchIcon: true, |
|
searchIndex: 3, |
|
tree: false, |
|
border: true, |
|
index: false, |
|
selection: false, |
|
viewBtn: false, |
|
delBtn: false, |
|
addBtn: false, |
|
editBtn: false, |
|
editBtnText: "修改", |
|
addBtnIcon: " ", |
|
viewBtnIcon: " ", |
|
delBtnIcon: " ", |
|
editBtnIcon: " ", |
|
viewBtnText: "详情", |
|
labelWidth: 120, |
|
searchLabelWidth: 120, |
|
menu: true, |
|
menuWidth: 120, |
|
dialogWidth: 1200, |
|
dialogClickModal: false, |
|
searchEnter: true, |
|
excelBtn: false, |
|
filterBtn: true, |
|
searchShowBtn: false, |
|
columnSort: true, |
|
excelBtn: true, |
|
columnSort: true, |
|
showOverflowTooltip: true, |
|
searchLabelPosition: "left", |
|
searchLabelPosition: "left", |
|
searchGutter: 24, |
|
searchSpan: 6, |
|
menuAlign: "left", |
|
gridBtn: false, |
|
searchMenuPosition: "right", |
|
column: [ |
|
{ |
|
label: "工号", |
|
prop: "userCode", |
|
search: true, |
|
sortable: true, |
|
overHidden: true, |
|
}, |
|
{ |
|
label: "姓名", |
|
prop: "userName", |
|
search: true, |
|
sortable: true, |
|
overHidden: true, |
|
}, |
|
{ |
|
label: "一月", |
|
prop: "january", |
|
search: false, |
|
sortable: true, |
|
overHidden: true, |
|
click: true, |
|
}, |
|
{ |
|
label: "二月", |
|
prop: "february", |
|
search: false, |
|
sortable: true, |
|
overHidden: true, |
|
click: true, |
|
}, |
|
{ |
|
label: "三月", |
|
prop: "march", |
|
search: false, |
|
sortable: true, |
|
overHidden: true, |
|
click: true, |
|
}, |
|
{ |
|
label: "四月", |
|
prop: "april", |
|
search: false, |
|
sortable: true, |
|
overHidden: true, |
|
click: true, |
|
}, |
|
{ |
|
label: "五月", |
|
prop: "may", |
|
search: false, |
|
sortable: true, |
|
overHidden: true, |
|
click: true, |
|
}, |
|
{ |
|
label: "六月", |
|
prop: "june", |
|
search: false, |
|
sortable: true, |
|
overHidden: true, |
|
click: true, |
|
}, |
|
{ |
|
label: "七月", |
|
prop: "july", |
|
search: false, |
|
sortable: true, |
|
overHidden: true, |
|
click: true, |
|
}, |
|
{ |
|
label: "八月", |
|
prop: "august", |
|
search: false, |
|
sortable: true, |
|
overHidden: true, |
|
click: true, |
|
}, |
|
{ |
|
label: "九月", |
|
prop: "september", |
|
search: false, |
|
sortable: true, |
|
overHidden: true, |
|
click: true, |
|
}, |
|
{ |
|
label: "十月", |
|
prop: "october", |
|
search: false, |
|
sortable: true, |
|
overHidden: true, |
|
click: true, |
|
}, |
|
{ |
|
label: "十一月", |
|
prop: "november", |
|
search: false, |
|
sortable: true, |
|
overHidden: true, |
|
click: true, |
|
}, |
|
{ |
|
label: "十二月", |
|
prop: "december", |
|
search: false, |
|
sortable: true, |
|
overHidden: true, |
|
click: true, |
|
}, |
|
], |
|
}, |
|
}; |
|
}, |
|
mounted() { |
|
this.viewOpen(); |
|
}, |
|
methods: { |
|
cellClick(row, column, cell, event) { |
|
const monthProps = [ |
|
"january", "february", "march", "april", "may", "june", |
|
"july", "august", "september", "october", "november", "december" |
|
]; |
|
|
|
if (monthProps.includes(column.property)) { |
|
const monthMap = { |
|
"january": "01", |
|
"february": "02", |
|
"march": "03", |
|
"april": "04", |
|
"may": "05", |
|
"june": "06", |
|
"july": "07", |
|
"august": "08", |
|
"september": "09", |
|
"october": "10", |
|
"november": "11", |
|
"december": "12" |
|
}; |
|
|
|
const currentYear = new Date().getFullYear(); |
|
this.monthValue = `${currentYear}-${monthMap[column.property]}`; |
|
|
|
this.showExcel = true; |
|
} |
|
}, |
|
viewRow(row) { |
|
this.showExcel = true; |
|
}, |
|
queryPerformance() { |
|
const month = this.monthValue.split("-")[1]; |
|
// 模拟数据 |
|
// const baseScore = 70 + parseInt(month) * 2; |
|
// this.tableData = [{ |
|
// KPI: baseScore, |
|
// lh: 20 + parseInt(month), |
|
// orderTime: Math.floor(Math.random() * 10), |
|
// keyPoint: Math.floor(Math.random() * 10), |
|
// after: Math.floor(Math.random() * 10), |
|
// unqualified: (Math.random() * 5).toFixed(2), |
|
// costMoney: (Math.random() * 10).toFixed(2), |
|
// notice: Math.floor(Math.random() * 5), |
|
// all: Math.floor(Math.random() * 5), |
|
// leave: Math.floor(Math.random() * 5), |
|
// check: Math.floor(Math.random() * 5), |
|
// add: Math.floor(Math.random() * 10), |
|
// excellence: Math.floor(Math.random() * 5), |
|
// cost: Math.floor(Math.random() * 5), |
|
// total: baseScore + 20 + parseInt(month), |
|
// }]; |
|
}, |
|
currentChange(currentPage) { |
|
this.page.currentPage = currentPage; |
|
}, |
|
sizeChange(pageSize) { |
|
this.page.pageSize = pageSize; |
|
}, |
|
refreshChange() { |
|
this.onLoad(this.page, this.query); |
|
}, |
|
searchReset() { |
|
this.query = {}; |
|
this.treeDeptId = ""; |
|
this.onLoad(this.page); |
|
}, |
|
searchChange(params, done) { |
|
this.query = params; |
|
this.page.currentPage = 1; |
|
this.onLoad(this.page, params); |
|
done(); |
|
}, |
|
selectionChange(list) { |
|
this.selectionList = list; |
|
}, |
|
selectionClear() { |
|
this.selectionList = []; |
|
this.$refs.crud.toggleSelection(); |
|
}, |
|
onLoad() { |
|
this.data = [ |
|
{ |
|
id: 1, |
|
userCode: "001", |
|
userName: "张三", |
|
january: 98, |
|
february: 97.5, |
|
march: 96, |
|
april: 98, |
|
may: 96, |
|
june: 95.5, |
|
july: 97, |
|
august: 98.5, |
|
september: 95, |
|
}, |
|
{ |
|
id: 2, |
|
userCode: "002", |
|
userName: "李四", |
|
january: 98, |
|
february: 96.5, |
|
march: 97, |
|
april: 96, |
|
may: 98, |
|
june: 97.5, |
|
july: 95, |
|
august: 96.5, |
|
september: 98, |
|
}, |
|
{ |
|
id: 3, |
|
userCode: "003", |
|
userName: "王五", |
|
january: 96, |
|
february: 98.5, |
|
march: 97, |
|
april: 95, |
|
may: 97, |
|
june: 98.5, |
|
july: 96, |
|
august: 96.5, |
|
september: 97, |
|
}, |
|
]; |
|
this.page.total = this.data.length; |
|
}, |
|
}, |
|
}; |
|
</script> |
|
|
|
<style></style>
|
|
|