|
@@ -1,30 +1,53 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <van-nav-bar title="数据统计" left-text="返回" @click-left="back" fixed left-arrow/>
|
|
|
- <van-date-picker
|
|
|
- v-model="currentDate"
|
|
|
- title="选择日期"
|
|
|
- />
|
|
|
- <van-tabs v-model="checkStatus" sticky @change="clickLabel" offset-top="1.22667rem">
|
|
|
+ <div class="top">
|
|
|
+ <van-nav-bar title="数据统计" left-text="返回" @click-left="back" fixed left-arrow/>
|
|
|
+ </div>
|
|
|
+ <div class="bottom" style="position: relative;">
|
|
|
+ <van-tabs v-model="checkStatus" sticky @change="clickLabel">
|
|
|
+ <van-cell-group>
|
|
|
+ <van-field v-model="startDate" label="开始时间" placeholder="请输入开始时间" @click="chooseDate('start')"/>
|
|
|
+ </van-cell-group>
|
|
|
+ <van-cell-group>
|
|
|
+ <van-field v-model="endDate" label="结束时间" placeholder="请输入结束时间" @click="chooseDate('end')"/>
|
|
|
+ </van-cell-group>
|
|
|
<van-tab v-for="(item, index) in labelList" :title="item.name" :key="index" :name="item.id">
|
|
|
- <van-cell-group v-for="(itemList, indexList) in groupList" :key="indexList" :style="indexList == 0 ? 'margin: 0.5rem 0;' : 'margin-bottom: 0.5rem'">
|
|
|
- <van-cell title="提交日期" :value="itemList.happenDate" />
|
|
|
- <van-cell title="项目名称" :value="itemList.projectName" />
|
|
|
- <van-cell title="提交人" :value="itemList.enterName" />
|
|
|
- <van-cell title="研究中心" :value="itemList.centerName" />
|
|
|
- <van-cell title="阶段" :value="itemList.subDtemplateName" />
|
|
|
- <van-cell title="理由" :label="itemList.reason" v-if="checkStatus != 0"/>
|
|
|
- </van-cell-group>
|
|
|
+ <van-cell-group>
|
|
|
+ <van-cell>总计: 工时:{{totalWorkingTime}}分钟 工价:{{totalCost}}元</van-cell>
|
|
|
+ </van-cell-group>
|
|
|
+ <van-collapse v-model="activeNames">
|
|
|
+ <van-collapse-item v-for="(item,index) in groupList" :key="index" :title="item.createDate+' 工时:'+item.working_time+'分钟 工价:'+item.cost+'元'" :name="index">
|
|
|
+ <van-cell v-for="(item2,index2) in item.subDataList" :key="index2" @click="goDetail(item2)">
|
|
|
+ {{item2.creatorName}}: 工时:{{item2.working_time}}分钟 工价:{{item2.cost}}元
|
|
|
+ </van-cell>
|
|
|
+ </van-collapse-item>
|
|
|
+ </van-collapse>
|
|
|
</van-tab>
|
|
|
</van-tabs>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <van-popup v-model="dateShow" position="bottom" :style="{ height: '30%' }" >
|
|
|
+ <van-datetime-picker
|
|
|
+ v-model="currentDate"
|
|
|
+ type="date"
|
|
|
+ title="选择年月日"
|
|
|
+ @confirm="changeTime"
|
|
|
+ @cancel="dateShow = false"
|
|
|
+ />
|
|
|
+ </van-popup>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import Vue from "vue";
|
|
|
import { ImagePreview } from "vant";
|
|
|
-import { DatePicker } from 'vant';
|
|
|
+import { DatetimePicker } from 'vant';
|
|
|
+import { Collapse, CollapseItem ,Cell, CellGroup } from 'vant';
|
|
|
Vue.use(ImagePreview);
|
|
|
+Vue.use(Collapse);
|
|
|
+Vue.use(CollapseItem);
|
|
|
+Vue.use(Cell);
|
|
|
+Vue.use(CellGroup);
|
|
|
export default {
|
|
|
props: {},
|
|
|
components: {},
|
|
@@ -33,38 +56,98 @@ export default {
|
|
|
checkStatus: '0',
|
|
|
labelList: [{name: '我的统计', id: '0'},{name: '工位统计', id: '1'}],
|
|
|
groupList: [],
|
|
|
- currentDate: ['2021', '01', '01'],
|
|
|
+ currentDate: new Date(),
|
|
|
+ dateShow: false,
|
|
|
+ startDate:this.format(new Date(),"yyyy-MM-dd"),
|
|
|
+ endDate:this.format(new Date(),"yyyy-MM-dd"),
|
|
|
+ chooseType:'',
|
|
|
+ totalWorkingTime:0,
|
|
|
+ totalCost:0,
|
|
|
+ activeNames: ['1'],
|
|
|
};
|
|
|
},
|
|
|
computed: {},
|
|
|
watch: {},
|
|
|
created() {},
|
|
|
- mounted() {},
|
|
|
+ mounted() {
|
|
|
+ this.getData()
|
|
|
+ },
|
|
|
methods: {
|
|
|
+ getData(){
|
|
|
+ let postData = {
|
|
|
+ startDate:this.startDate,
|
|
|
+ endDate:this.endDate,
|
|
|
+ checkStatus:this.checkStatus
|
|
|
+ };
|
|
|
+ this.$axios.post("/report/getPersonWorkHoursWagesDetail", postData)
|
|
|
+ .then(res => {
|
|
|
+ this.saving = false;
|
|
|
+ if(res.code == "ok") {
|
|
|
+ this.groupList=res.data.record
|
|
|
+ console.log(this.groupList,'=============')
|
|
|
+ this.totalWorkingTime=res.data.totalWorkingTime
|
|
|
+ this.totalCost=res.data.totalCost
|
|
|
+ } else {
|
|
|
+ this.$toast.fail(res.msg);
|
|
|
+ }
|
|
|
+ }).catch(err=> {this.$toast.clear();});
|
|
|
+ },
|
|
|
+ // 改变时间
|
|
|
+ changeTime(time) {
|
|
|
+ if(this.chooseType=='start'){
|
|
|
+ this.startDate = this.format(new Date(time),"yyyy-MM-dd");
|
|
|
+ }else{
|
|
|
+ this.endDate = this.format(new Date(time),"yyyy-MM-dd");
|
|
|
+ }
|
|
|
+ this.currentDate = time;
|
|
|
+ this.dateShow = false;
|
|
|
+ this.getData()
|
|
|
+ },
|
|
|
+ chooseDate(type){
|
|
|
+ this.dateShow=true
|
|
|
+ this.chooseType=type
|
|
|
+ },
|
|
|
back() {
|
|
|
- this.$router.go(-1);
|
|
|
+ this.$router.push({
|
|
|
+ path:"/index",
|
|
|
+ })
|
|
|
+ },
|
|
|
+ goDetail(item){
|
|
|
+ this.$router.push({
|
|
|
+ path:"/statisticsDetail",
|
|
|
+ query:{
|
|
|
+ startDate:this.startDate,
|
|
|
+ endDate:this.endDate,
|
|
|
+ checkStatus:this.checkStatus,
|
|
|
+ userId:item.creatorId
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
+ // 时间转换
|
|
|
+ format(date, pattern) {
|
|
|
+ pattern = pattern || "yyyy-MM-dd";
|
|
|
+ var _this = this;
|
|
|
+ return pattern.replace(/([yMdhsm])(\1*)/g, function ($0) {
|
|
|
+ switch ($0.charAt(0)) {
|
|
|
+ case 'y': return _this.padding(date.getFullYear(), $0.length);
|
|
|
+ case 'M': return _this.padding(date.getMonth() + 1, $0.length);
|
|
|
+ case 'd': return _this.padding(date.getDate(), $0.length);
|
|
|
+ case 'w': return date.getDay() + 1;
|
|
|
+ case 'h': return _this.padding(date.getHours(), $0.length);
|
|
|
+ case 'm': return _this.padding(date.getMinutes(), $0.length);
|
|
|
+ case 's': return _this.padding(date.getSeconds(), $0.length);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ padding(s, len) {
|
|
|
+ var len = len - (s + '').length;
|
|
|
+ for (var i = 0; i < len; i++) { s = '0' + s; }
|
|
|
+ return s;
|
|
|
+ },
|
|
|
// 点击标签触发
|
|
|
clickLabel() {
|
|
|
this.getData()
|
|
|
},
|
|
|
- // 获取数据
|
|
|
- getData() {
|
|
|
- // this.$toast.loading({
|
|
|
- // message: '数据加载中...',
|
|
|
- // forbidClick: true,
|
|
|
- // });
|
|
|
- // this.$axios.post("/data-item-detail/getAllDataItemDetail", {
|
|
|
-
|
|
|
- // })
|
|
|
- // .then(res => {
|
|
|
- // if(res.code == "ok") {
|
|
|
-
|
|
|
- // } else {
|
|
|
- // this.$toast.fail('获取失败');
|
|
|
- // }
|
|
|
- // }).catch(err=> {this.$toast.clear();});
|
|
|
- },
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
@@ -124,4 +207,7 @@ export default {
|
|
|
left: 0;
|
|
|
z-index: 2;
|
|
|
}
|
|
|
+.top{
|
|
|
+ height: 50px;
|
|
|
+}
|
|
|
</style>
|