gjerp_ui/src/views/cxtj/new_index.vue

238 lines
7.7 KiB

<template>
<el-container>
<el-container style="padding-top: 10px">
<el-container>
<el-main>
<VxeGrid ref="bFangRef" v-bind="gridOptions" />
</el-main>
</el-container>
</el-container>
</el-container>
</template>
<script>
import XEUtils from 'xe-utils'
import {getData} from "@/api/kban";
export default {
name:'CXTJ',
data(){
return{
gridOptions:{
align:'center',
border: true,
resizable: true,
keepSource:true,
size:'mini',
showOverflow: true,
editConfig:{trigger: 'click', mode: 'cell', showStatus: true},
highlightCurrentRow:true,
columns:[],
data:[],
},
}
},
created(){
const columns0=[
{ type: 'seq', width: 60, title: '序号' },
{ field: 'kua', title: '跨',},
{ field: 'c', title: '完成率',},
{ field: 'n', title: '未完成率',},
]
const columns1=[
{ type: 'seq', width: 60, title: '序号' },
{ field: 'label', title: '跨',},
{ field: 'quantity', title: '数量',},
{ field: 'weight', title: '重量',},
]
const path=this.$route.path
switch (path){
case '/scgl/jh/cxtj_rikwc':
case '/scgl/jh/cxtj_zkwc':
case '/scgl/jh/cxtj_ykwc':
this.gridOptions.columns=columns0
break
case '/scgl/jh/cxtj_rikcl':
case '/scgl/jh/cxtj_zkcl':
case '/scgl/jh/cxtj_ykcl':
this.gridOptions.columns=columns1
}
},
mounted(){
const path=this.$route.path
switch (path){
case '/scgl/jh/cxtj_rikwc':
this.init('riwc')
break
case '/scgl/jh/cxtj_zkwc':
this.init('zhouwc')
break
case '/scgl/jh/cxtj_ykwc':
this.init('yuewc')
break
case '/scgl/jh/cxtj_rikcl':
this.init('ricl')
break
case '/scgl/jh/cxtj_zkcl':
this.init('zhoucl')
break
case '/scgl/jh/cxtj_ykcl':
this.init('yuecl')
break
}
},
methods:{
init(type){
getData().then(res=>{
const _data=JSON.parse(res.data)
let begin=XEUtils.toDateString(XEUtils.now(),'yyyy/MM/dd')
let end=XEUtils.toDateString(XEUtils.getWhatDay(XEUtils.now(), 1),'yyyy/MM/dd')
const endOfMonth=XEUtils.toDateString(XEUtils.getWhatMonth(XEUtils.now(), 0,'last'),'yyyy/MM/dd')
switch (type){
case 'riwc':
console.log(111)
this.gridOptions.data= this.完成率计算(_data,begin,end,endOfMonth).point
break
case 'zhouwc':
begin=XEUtils.toDateString(XEUtils.getWhatWeek (XEUtils.now(), 0,1,0),'yyyy/MM/dd')
end=XEUtils.toDateString(XEUtils.getWhatWeek (XEUtils.now(), 1,1,0),'yyyy/MM/dd')
this.gridOptions.data= this.完成率计算(_data,begin,end,endOfMonth).point
break
case 'yuewc':
begin=XEUtils.toDateString(XEUtils.getWhatMonth(XEUtils.now(), 0,'first'),'yyyy/MM/dd')
end=XEUtils.toDateString(XEUtils.getWhatMonth(XEUtils.now(), 0,'last'),'yyyy/MM/dd')
this.gridOptions.data=this.完成率计算(_data,begin,end,endOfMonth).point
break
case 'ricl':
this.gridOptions.data=this.完成率计算(_data,begin,end,endOfMonth).wc
break
case 'zhoucl':
begin=XEUtils.toDateString(XEUtils.getWhatWeek (XEUtils.now(), 0,1,0),'yyyy/MM/dd')
end=XEUtils.toDateString(XEUtils.getWhatWeek (XEUtils.now(), 1,1,0),'yyyy/MM/dd')
this.gridOptions.data= this.完成率计算(_data,begin,end,endOfMonth).wc
break
case 'yuecl':
begin=XEUtils.toDateString(XEUtils.getWhatMonth(XEUtils.now(), 0,'first'),'yyyy/MM/dd')
end=XEUtils.toDateString(XEUtils.getWhatMonth(XEUtils.now(), 0,'last'),'yyyy/MM/dd')
this.gridOptions.data= this.完成率计算(_data,begin,end,endOfMonth).wc
break
}
})
},
完成率计算(data,date,nextDate,endOfMonth){
const wc=[],point=[]
const 一跨完成数据=data.filter(item=> item.qgfkrq >= date && item.qgfkrq < nextDate && item.zyq1 === '二区'&&['7','8'].includes(item.kw))
const 一跨计划数量=data.filter(item=> item.qgjhrq >= date && item.qgjhrq < endOfMonth && item.zyq1 === '二区'&&['7','8'].includes(item.kw)).length
let 一跨完成率='0'
if (一跨计划数量){
一跨完成率=(一跨完成数据.length/一跨计划数量*100).toFixed(2)
}
point.push({kua:'1跨',c:一跨完成率,n:一跨完成率>100?'0':(100-一跨完成率).toFixed(2)})
wc.push({ label: '1跨', quantity: 一跨完成数据.length, weight: 一跨完成数据.reduce((accumulator, currentValue) => {
return accumulator + (currentValue?.bcshzl||0)/1000;
}, 0) },)
const 二跨完成数据=data.filter(item=> item.qgfkrq >= date && item.qgfkrq < nextDate && item.zyq1 === '三区')
const 二跨计划数量=data.filter(item=> item.qgjhrq >= date && item.qgjhrq < endOfMonth && item.zyq1 === '三区').length
let 二跨完成率='0.00'
if (二跨计划数量){
二跨完成率=(二跨完成数据.length/二跨计划数量*100).toFixed(2)
}
point.push({kua:'2跨',c:二跨完成率,n:二跨完成率>100?'0':(100-二跨完成率).toFixed(2)})
wc.push({ label: '2跨', quantity: 二跨完成数据.length, weight: 二跨完成数据.reduce((accumulator, currentValue) => {
return accumulator + (currentValue.bcshzl||0)/1000;
}, 0) },)
const 三跨完成数据=data.filter(item=> item.qgfkrq >= date && item.qgfkrq < nextDate && item.zyq1 === '二区'&&['6','13','14'].includes(item.kw))
const 三跨计划数量=data.filter(item=> item.qgjhrq >= date && item.qgjhrq < endOfMonth && item.zyq1 === '二区'&&['6','13','14'].includes(item.kw)).length
let 三跨完成率='0.00'
if (三跨计划数量){
三跨完成率=(三跨完成数据.length/三跨计划数量*100).toFixed(2)
}
point.push({kua:'3跨',c:三跨完成率,n:三跨完成率>100?'0':(100-三跨完成率).toFixed(2)})
wc.push({ label: '3跨', quantity: 三跨完成数据.length, weight: 三跨完成数据.reduce((accumulator, currentValue) => {
return accumulator + (currentValue.bcshzl||0)/1000;
}, 0) },)
const 四跨完成数据=data.filter(item=> item.qgfkrq >= date && item.qgfkrq < nextDate && item.zyq1 === '四区')
const 四跨计划数量=data.filter(item=> item.qgjhrq >= date && item.qgjhrq < endOfMonth && item.zyq1 === '四区').length
let 四跨完成率='0.00'
if (四跨计划数量){
四跨完成率=(四跨完成数据.length/四跨计划数量*100).toFixed(2)
}
point.push({kua:'4,5,6跨',c:四跨完成率,n:四跨完成率>100?'0':(100-四跨完成率).toFixed(2)})
wc.push({ label: '4、5、6跨', quantity: 四跨完成数据.length, weight: 四跨完成数据.reduce((accumulator, currentValue) => {
return accumulator + (currentValue.bcshzl||0)/1000;
}, 0) },)
return {point,wc}
}
}
}
</script>
<style lang="scss" scoped>
.el-header {
margin: 0;
padding: 5px 0;
height: auto;
}
.el-container {
padding: 0;
margin: 0;
}
.el-main {
padding: 0;
}
.el-col {
padding: 0;
}
.el-aside {
background: #fff;
padding: 0;
}
.el-container {
padding: 0;
}
.el-row {
margin-bottom: 5px;
}
.el-row:last-child {
margin-bottom: 0;
}
.tableStyles {
background: #0a76a4;
}
.my-dropdown {
width: 450px;
height: 250px;
background-color: #fff;
border: 1px solid #dcdfe6;
box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
font-size: 12px;
}
::v-deep .mytable .vxe-input {
display: flex !important;
}
::v-deep .el-form-item{
margin-bottom: 0px !important;
}
</style>