|
@@ -1,12 +1,9 @@
|
|
<template>
|
|
<template>
|
|
<div>
|
|
<div>
|
|
- <div style="position:">
|
|
|
|
- <!-- <van-cell>
|
|
|
|
- <template #default>
|
|
|
|
- <div style="text-align:center">团队填报统计</div>
|
|
|
|
- </template>
|
|
|
|
- </van-cell> -->
|
|
|
|
|
|
+ <div>
|
|
|
|
+
|
|
<div class="title111">
|
|
<div class="title111">
|
|
|
|
+ <van-sticky offset-top="-0.9rem">
|
|
<van-cell :title="'选择月份:' + nowMonthTitle" @click="monthSelectShow = true" class="monthSel" />
|
|
<van-cell :title="'选择月份:' + nowMonthTitle" @click="monthSelectShow = true" class="monthSel" />
|
|
<van-action-sheet v-model="monthSelectShow">
|
|
<van-action-sheet v-model="monthSelectShow">
|
|
<div class="monthSelectContent">
|
|
<div class="monthSelectContent">
|
|
@@ -21,7 +18,8 @@
|
|
/>
|
|
/>
|
|
</div>
|
|
</div>
|
|
</van-action-sheet>
|
|
</van-action-sheet>
|
|
- <van-tabs background="#20a0ff" title-active-color="#fff" title-inactive-color="#3c3c45" @change="dateChange" v-model="nowDay">
|
|
|
|
|
|
+
|
|
|
|
+ <van-tabs background="#20a0ff" title-active-color="#fff" title-inactive-color="#3c3c45" @change="dateChange" v-model="nowDay" style="height:1.17333rem">
|
|
<van-tab v-for="item in dateArray" :key="item.day" :name="item.day">
|
|
<van-tab v-for="item in dateArray" :key="item.day" :name="item.day">
|
|
<template #title>
|
|
<template #title>
|
|
<div style="text-align:center;width:0.6rem;padding-bottom:10px">
|
|
<div style="text-align:center;width:0.6rem;padding-bottom:10px">
|
|
@@ -31,28 +29,42 @@
|
|
</template>
|
|
</template>
|
|
</van-tab>
|
|
</van-tab>
|
|
</van-tabs>
|
|
</van-tabs>
|
|
|
|
+ </van-sticky>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="main" style="width:250px;height:250px;margin:0 auto"></div>
|
|
<div id="main" style="width:250px;height:250px;margin:0 auto"></div>
|
|
-
|
|
|
|
- <van-tabbar v-model="stateActive" :fixed="false" @change="stateChange" class="stateActiveClass">
|
|
|
|
- <van-tabbar-item name="submit">已提交
|
|
|
|
- <template #icon>
|
|
|
|
- <span style="color:#409eff;font-size:0.58rem">{{submitList.length}}</span><span style="font-size:0.32rem;color:#333">人</span>
|
|
|
|
|
|
+ <van-sticky offset-top="1.35333rem">
|
|
|
|
+ <div style="background:#fff;">
|
|
|
|
+ <van-tabs v-model="stateActive" :fixed="false" @change="stateChange" class="stateActiveClass" color="#20a0ff">
|
|
|
|
+ <van-tab name="submit">
|
|
|
|
+ <template #title>
|
|
|
|
+ <div style="text-align:center">
|
|
|
|
+ <span style="color:#409eff;font-size:0.58rem">{{submitList.length}}</span>
|
|
|
|
+ <span style="font-size:0.32rem;color:#333">人</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div style="font-size:0.32rem;color:#333">已提交</div>
|
|
</template>
|
|
</template>
|
|
- </van-tabbar-item>
|
|
|
|
- <van-tabbar-item name="unsubmit">待提交
|
|
|
|
- <template #icon>
|
|
|
|
- <span style="color:#ffa366;font-size:0.58rem">{{unSubmitList.length}}</span><span style="font-size:0.32rem;color:#333">人</span>
|
|
|
|
|
|
+ </van-tab>
|
|
|
|
+ <van-tab name="unsubmit">
|
|
|
|
+ <template #title>
|
|
|
|
+ <div style="text-align:center">
|
|
|
|
+ <span style="color:#ffa366;font-size:0.58rem">{{unSubmitList.length}}</span>
|
|
|
|
+ <span style="font-size:0.32rem;color:#333">人</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div style="font-size:0.32rem;color:#333">待提交</div>
|
|
</template>
|
|
</template>
|
|
- </van-tabbar-item>
|
|
|
|
- <van-tabbar-item name="unfill">未填写
|
|
|
|
- <template #icon>
|
|
|
|
- <span style="color:#ff4500;font-size:0.58rem">{{unFillList.length + unFillLeaveList.length}}</span><span style="font-size:0.32rem;color:#333">人</span>
|
|
|
|
|
|
+ </van-tab>
|
|
|
|
+ <van-tab name="unfill">
|
|
|
|
+ <template #title>
|
|
|
|
+ <div style="text-align:center">
|
|
|
|
+ <span style="color:#ff4500;font-size:0.58rem">{{unFillList.length + unFillLeaveList.length}}</span>
|
|
|
|
+ <span style="font-size:0.32rem;color:#333">人</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div style="font-size:0.32rem;color:#333">未填写</div>
|
|
</template>
|
|
</template>
|
|
- </van-tabbar-item>
|
|
|
|
- </van-tabbar>
|
|
|
|
|
|
+ </van-tab>
|
|
|
|
+ </van-tabs>
|
|
<van-cell v-if="stateActive == 'unfill' && (user.timeType.syncCorpwxTime == 1 || user.timeType.syncDingding == 1 || user.company.packageOa == 1)">
|
|
<van-cell v-if="stateActive == 'unfill' && (user.timeType.syncCorpwxTime == 1 || user.timeType.syncDingding == 1 || user.company.packageOa == 1)">
|
|
<template #default>
|
|
<template #default>
|
|
<van-tabs type="card" @change="unfillSelect" v-model="unfillSelKey" color="#20a0ff">
|
|
<van-tabs type="card" @change="unfillSelect" v-model="unfillSelKey" color="#20a0ff">
|
|
@@ -61,16 +73,23 @@
|
|
</van-tabs>
|
|
</van-tabs>
|
|
</template>
|
|
</template>
|
|
</van-cell>
|
|
</van-cell>
|
|
|
|
+ </div>
|
|
|
|
+ </van-sticky>
|
|
</div>
|
|
</div>
|
|
- <van-cell-group v-if="showList.length">
|
|
|
|
- <van-cell v-for="item in showList" :key="item.id" :title="item.name" :value="item.department" title-style="color:#666"></van-cell>
|
|
|
|
- </van-cell-group>
|
|
|
|
- <van-cell-group v-else>
|
|
|
|
- <van-cell>
|
|
|
|
|
|
+ <van-cell-group>
|
|
|
|
+ <van-cell v-if="listLoading">
|
|
|
|
+ <template #default>
|
|
|
|
+ <van-loading color="#1989fa" size="24" text-size="12" style="text-align:center;">加载中...</van-loading>
|
|
|
|
+ </template>
|
|
|
|
+ </van-cell>
|
|
|
|
+ <van-cell v-if="showList.length == 0">
|
|
<template #default>
|
|
<template #default>
|
|
<div style="text-align:center;color:#7d7e80;font-size:13px">暂无数据</div>
|
|
<div style="text-align:center;color:#7d7e80;font-size:13px">暂无数据</div>
|
|
</template>
|
|
</template>
|
|
</van-cell>
|
|
</van-cell>
|
|
|
|
+ <template v-else>
|
|
|
|
+ <van-cell v-for="item in showList" :key="item.id" :title="item.name" :value="item.department" title-style="color:#666"></van-cell>
|
|
|
|
+ </template>
|
|
</van-cell-group>
|
|
</van-cell-group>
|
|
<Footer page="index"></Footer>
|
|
<Footer page="index"></Footer>
|
|
</div>
|
|
</div>
|
|
@@ -103,6 +122,7 @@ export default {
|
|
unFillList:[], //未填写人员列表
|
|
unFillList:[], //未填写人员列表
|
|
unFillLeaveList:[],
|
|
unFillLeaveList:[],
|
|
showList:[],
|
|
showList:[],
|
|
|
|
+ listLoading: false,
|
|
|
|
|
|
stateActive: 'submit'
|
|
stateActive: 'submit'
|
|
}
|
|
}
|
|
@@ -174,21 +194,25 @@ export default {
|
|
if (this.user.manageDeptId != 0 && !this.reportsCompany && !this.reportsDept) {
|
|
if (this.user.manageDeptId != 0 && !this.reportsCompany && !this.reportsDept) {
|
|
parameter.manageDeptId = this.user.manageDeptId;
|
|
parameter.manageDeptId = this.user.manageDeptId;
|
|
}
|
|
}
|
|
|
|
+ this.listLoading = true
|
|
|
|
+ this.submitList = []
|
|
|
|
+ this.unSubmitList = []
|
|
|
|
+ this.unFillList = []
|
|
|
|
+ this.unFillLeaveList = []
|
|
this.$axios.post('/report/getMembList', parameter)
|
|
this.$axios.post('/report/getMembList', parameter)
|
|
.then(res => {
|
|
.then(res => {
|
|
if(res.code == 'ok'){
|
|
if(res.code == 'ok'){
|
|
- this.submitList = []
|
|
|
|
- this.unSubmitList = []
|
|
|
|
- this.unFillList = []
|
|
|
|
- this.unFillLeaveList = []
|
|
|
|
this.extractUser(res.data)
|
|
this.extractUser(res.data)
|
|
this.drawChart()
|
|
this.drawChart()
|
|
|
|
+ this.listLoading = false
|
|
this.stateChange('submit')
|
|
this.stateChange('submit')
|
|
}else {
|
|
}else {
|
|
|
|
+ this.listLoading = false
|
|
this.$toast.clear();
|
|
this.$toast.clear();
|
|
this.$toast.fail('获取失败:'+res.msg);
|
|
this.$toast.fail('获取失败:'+res.msg);
|
|
}
|
|
}
|
|
}).catch(err=> {
|
|
}).catch(err=> {
|
|
|
|
+ this.listLoading = false
|
|
this.$toast.clear();
|
|
this.$toast.clear();
|
|
});
|
|
});
|
|
},
|
|
},
|
|
@@ -220,6 +244,7 @@ export default {
|
|
},
|
|
},
|
|
|
|
|
|
drawChart(){
|
|
drawChart(){
|
|
|
|
+ this.$echarts.init(document.getElementById('main')).dispose()
|
|
var myChart = this.$echarts.init(document.getElementById('main'));
|
|
var myChart = this.$echarts.init(document.getElementById('main'));
|
|
// 绘制图表
|
|
// 绘制图表
|
|
myChart.setOption({
|
|
myChart.setOption({
|
|
@@ -235,6 +260,15 @@ export default {
|
|
}
|
|
}
|
|
]
|
|
]
|
|
});
|
|
});
|
|
|
|
+ myChart.on('click',(params)=>{
|
|
|
|
+ if(params.dataIndex == 0){
|
|
|
|
+ this.stateChange('submit')
|
|
|
|
+ }else if(params.dataIndex == 1){
|
|
|
|
+ this.stateChange('unsubmit')
|
|
|
|
+ }else{
|
|
|
|
+ this.stateChange('unfill')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
}
|
|
}
|
|
},
|
|
},
|
|
mounted() {
|
|
mounted() {
|
|
@@ -286,6 +320,6 @@ body{
|
|
overflow: hidden;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
.title111 .van-tabs__line{
|
|
.title111 .van-tabs__line{
|
|
- background-color: #eee;
|
|
|
|
|
|
+ background-color: #f7f7f7;
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|