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.
 
 
 
 

137 lines
3.5 KiB

<template>
<view class="flex flex-col h-full bg-gray-50" @click="openAuth">
<view class="relative" @touchmove="onMove">
<!-- 日历 -->
<Calendar @selected-change="onDateChange" :show-back="true" ref="calendar" @handleFindPoint="handleFindPoint" />
<!-- 上传 导入wbs -->
<Upload @success="onUploadSuccess" @error="onUploadError" />
<!-- #ifdef H5 -->
<!-- #endif -->
</view>
<!-- 项目列表 -->
<Projects @getProjects="getProjects" class="flex-1 overflow-y-auto" />
<!-- 全局提示框 -->
<u-top-tips ref="uTips"></u-top-tips>
</view>
</template>
<script>
import { mapState, mapMutations } from 'vuex';
import UserAuthMixin from '@/mixins/userAuth';
let prevY = 0;
export default {
mixins: [UserAuthMixin],
data() {
return {
calendar: null,
days: [],
};
},
computed: mapState('user', ['token', 'user']),
watch: {
token(value) {
if (!value) return;
this.getProjects();
this.handleFindPoint();
},
},
onShow() {
if (!this.token) return;
this.getProjects();
this.handleFindPoint();
},
onReady() {
this.calendar = this.$refs.calendar;
},
methods: {
...mapMutations('project', ['setProjects', 'setDotList']),
// 获取项目列表
getProjects(start = this.$moment().startOf('day').valueOf(), end = this.$moment().endOf('day').valueOf()) {
// const data = await this.$u.api.getProjects(start, end);
this.$t.$q.getProjects(start, end, (err, data) => {
if (err) {
console.error('err: ', err);
} else {
data.forEach(item => {
item.show = false;
});
this.setProjects(data);
}
});
},
/**
* 查询小红点
* @param { string } endTime 结束时间
* @param { string } startTime 开始时间
*/
async handleFindPoint(start, end) {
try {
const startTime = start || this.$moment().startOf('month').valueOf();
const endTime = end || this.$moment().endOf('month').valueOf();
const data = await this.$u.api.findRedPoint(startTime, endTime);
this.setDotList(data);
} catch (error) {
console.log('error: ', error);
}
},
// 点击了某个日期
onDateChange(event) {
const day = this.$moment(event.fullDate);
const start = day.startOf('date').valueOf();
const end = day.endOf('date').valueOf();
this.getProjects(start, end);
},
// 监听触摸滑动 切换日历的模式 月/周
onMove(event) {
const y = event.changedTouches[0].pageY;
if (y - prevY > 0) {
// 向下滑动 如果是周视图weekMode=true 就 变成 月视图weekMode=false
this.calendar.weekMode && (this.calendar.weekMode = false);
} else if (y - prevY < 0) {
// 向上滑动 如果是月视图weekMode=false 就变成 周视图weekMode=true
!this.calendar.weekMode && (this.calendar.weekMode = true);
}
prevY = y;
this.calendar.initDate();
},
// 导入成功
onUploadSuccess() {
this.$refs.uTips.show({
title: '导入成功,即将打开新项目',
type: 'success',
duration: '3000',
});
},
// 导入失败
onUploadError(error) {
this.$refs.uTips.show({
title: error || '导入失败',
type: 'error',
duration: '6000',
});
},
},
};
</script>
<style lang="scss" scoped>
page {
height: 100%;
overflow: hidden;
}
</style>