9 changed files with 408 additions and 200 deletions
@ -0,0 +1,99 @@ |
|||||
|
<template> |
||||
|
<view class="adv-box relative"> |
||||
|
<swiper v-if="imgs.length > 0" class="swiper" :indicator-dots="indicatorDots" :autoplay="autoplay" circular="true"> |
||||
|
<swiper-item v-for="(item, index) in imgs" :key="index"> |
||||
|
<view class="swiper-item"> |
||||
|
<image :src="item"></image> |
||||
|
</view> |
||||
|
</swiper-item> |
||||
|
</swiper> |
||||
|
|
||||
|
<image v-else src="/common/img/adv.jpg"></image> |
||||
|
|
||||
|
<view class="time-box absolute">{{ time }} 跳过</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script setup> |
||||
|
import { ref, computed, watch } from 'vue'; |
||||
|
import { useStore } from 'vuex'; |
||||
|
|
||||
|
const store = useStore(); |
||||
|
const indicatorDots = true; |
||||
|
const autoplay = true; |
||||
|
const advs = computed(() => store.state.advs); |
||||
|
const imgs = ref([]); |
||||
|
|
||||
|
if (advs.value) { |
||||
|
imgs.value = JSON.parse(advs.value); |
||||
|
} |
||||
|
|
||||
|
watch(advs, () => { |
||||
|
imgs.value = JSON.parse(advs.value); |
||||
|
}) |
||||
|
|
||||
|
const time = ref(5); |
||||
|
|
||||
|
let timer = setInterval(() => { |
||||
|
time.value--; |
||||
|
if (time.value === 0) { |
||||
|
clearInterval(timer); |
||||
|
uni.$storage.setStorageSync('isOpenApp', false); |
||||
|
store.commit('setIsOpenApp', false); |
||||
|
} |
||||
|
}, 1000); |
||||
|
|
||||
|
// setTimeout(() => { |
||||
|
// // 判断是否第一次打开App |
||||
|
// let firstOpenApp = uni.$storage.getStorageSync('firstOpenApp'); |
||||
|
// if (firstOpenApp) { |
||||
|
// // uni.navigateTo({ |
||||
|
// // url: '/pages/index/index' |
||||
|
// // }) |
||||
|
// } else { |
||||
|
// uni.$storage.setStorageSync('firstOpenApp', true); |
||||
|
// store.commit('setFirstOpenApp'); |
||||
|
// // uni.navigateTo({ |
||||
|
// // url: '/pages/guide/guide' |
||||
|
// // }) |
||||
|
// } |
||||
|
// }, 5000); |
||||
|
|
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.adv-box { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
|
||||
|
image { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
object-fit: cover; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.swiper { |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.swiper-item { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.time-box { |
||||
|
bottom: 50px; |
||||
|
right: 10px; |
||||
|
display: inline-block; |
||||
|
width: 60px; |
||||
|
height: 24px; |
||||
|
line-height: 22px; |
||||
|
font-size: 12px; |
||||
|
text-align: center; |
||||
|
background-color: rgba(255, 255, 255, .7); |
||||
|
border-radius: 12px; |
||||
|
color: #666; |
||||
|
border: 1px solid #eee; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,76 @@ |
|||||
|
<template> |
||||
|
<!-- indicator-dots 是否显示面板指示点 --> |
||||
|
<!-- indicator-color 指示点颜色 --> |
||||
|
<!-- indicator-active-color 当前选中的指示点颜色 --> |
||||
|
|
||||
|
<swiper class="swiper" :indicator-dots="indicatorDots" :autoplay="autoplay"> |
||||
|
<swiper-item v-for="(item, index) in imgs" :key="index"> |
||||
|
<view class="swiper-item relative"> |
||||
|
<image :src="item"></image> |
||||
|
<u-button class="btn absolute" v-if="index === imgs.length - 1" @click="toIndex">点击进入APP</u-button> |
||||
|
</view> |
||||
|
</swiper-item> |
||||
|
</swiper> |
||||
|
</template> |
||||
|
|
||||
|
<script setup> |
||||
|
import { ref, computed, watch } from 'vue'; |
||||
|
import { useStore } from 'vuex'; |
||||
|
|
||||
|
const store = useStore(); |
||||
|
const indicatorDots = true; |
||||
|
const autoplay = false; |
||||
|
|
||||
|
const guide = computed(() => store.state.guide); |
||||
|
const imgs = ref([]); |
||||
|
|
||||
|
if (guide.value) { |
||||
|
imgs.value = JSON.parse(guide.value); |
||||
|
} |
||||
|
|
||||
|
watch(guide, () => { |
||||
|
imgs.value = JSON.parse(guide.value); |
||||
|
}) |
||||
|
|
||||
|
function toIndex() { |
||||
|
uni.$storage.setStorageSync('firstOpenApp', true); |
||||
|
store.commit('setFirstOpenApp'); |
||||
|
// uni.navigateTo({ |
||||
|
// url: '/pages/index/index' |
||||
|
// }) |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.swiper { |
||||
|
height: 100%; |
||||
|
|
||||
|
image { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
object-fit: cover; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.swiper-item { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
|
||||
|
.btn { |
||||
|
bottom: 200px; |
||||
|
display: inline-block; |
||||
|
height: 40px; |
||||
|
line-height: 38px; |
||||
|
background-color: #ECF5FF; |
||||
|
left: 50%; |
||||
|
transform: translateX(-50%); |
||||
|
border-radius: 20px; |
||||
|
color: #2B85E4; |
||||
|
border: 1px solid #2B85E4; |
||||
|
|
||||
|
&:after { |
||||
|
border: none; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -1,165 +1,177 @@ |
|||||
<template> |
<template> |
||||
<!-- 这里是适配的状态栏的代码 --> |
<!-- #ifdef APP-PLUS --> |
||||
<view class="statbar"> |
<!-- 广告 --> |
||||
<view class="status_bar"></view> |
<Adv v-if="isOpenApp"></Adv> |
||||
</view> |
|
||||
|
<!-- 引导页 --> |
||||
<!-- <view class="flex flex-col h-full bg-gray-50" @click="openAuth"> --> |
<Guide v-if="!firstOpenApp"></Guide> |
||||
<theme class="flex flex-col h-full bg-gray-50"> |
<!-- #endif --> |
||||
<view class="relative"> |
|
||||
<!-- <view class="relative" @touchmove="onMove"> --> |
<view> |
||||
<!-- 日历 --> |
<!-- 这里是适配的状态栏的代码 --> |
||||
<Calendar @selected-change="onDateChange" :show-back="true" ref="calendar" @handleFindPoint="handleFindPoint" /> |
<view class="statbar"> |
||||
|
<view class="status_bar"></view> |
||||
<!-- 上传 导入wbs --> |
</view> |
||||
<Upload @success="onUploadSuccess" @error="onUploadError" /> |
|
||||
</view> |
<!-- <view class="flex flex-col h-full bg-gray-50" @click="openAuth"> --> |
||||
|
<theme class="flex flex-col h-full bg-gray-50"> |
||||
<u-button class="mt-4" @click="toLogin">登录</u-button> |
<view class="relative"> |
||||
<!-- 项目列表 --> |
<!-- <view class="relative" @touchmove="onMove"> --> |
||||
<Projects @getProjects="getProjects" class="flex-1 overflow-y-auto" /> |
<!-- 日历 --> |
||||
|
<Calendar @selected-change="onDateChange" :show-back="true" ref="calendar" @handleFindPoint="handleFindPoint" /> |
||||
<!-- 全局提示框 --> |
|
||||
<u-top-tips ref="uTips"></u-top-tips> |
<!-- 上传 导入wbs --> |
||||
</theme> |
<Upload @success="onUploadSuccess" @error="onUploadError" /> |
||||
</template> |
</view> |
||||
|
|
||||
<script setup> |
<u-button class="mt-4" @click="toLogin">登录</u-button> |
||||
import { reactive, computed, watchEffect, ref } from 'vue'; |
<!-- 项目列表 --> |
||||
import { useStore } from 'vuex'; |
<Projects @getProjects="getProjects" class="flex-1 overflow-y-auto" /> |
||||
import dayjs from 'dayjs'; |
|
||||
|
<!-- 全局提示框 --> |
||||
const store = useStore(); |
<u-top-tips ref="uTips"></u-top-tips> |
||||
const token = computed(() => store.state.user.token); |
</theme> |
||||
const uTips = ref(null); |
</view> |
||||
|
</template> |
||||
const data = reactive({ |
|
||||
calendar: null, |
<script setup> |
||||
// days: [], |
import { reactive, computed, watchEffect, ref } from 'vue'; |
||||
}); |
import { useStore } from 'vuex'; |
||||
|
import dayjs from 'dayjs'; |
||||
getProjects(); |
|
||||
handleFindPoint(); |
const store = useStore(); |
||||
|
const token = computed(() => store.state.user.token); |
||||
// 监听token |
const uTips = ref(null); |
||||
// watchEffect(() => { |
const firstOpenApp = computed(() => store.state.firstOpenApp); |
||||
// if (!token.value) return; |
const isOpenApp = computed(() => store.state.isOpenApp); // 是否打开APP |
||||
// if (token.value) { |
|
||||
// getProjects(); |
const data = reactive({ |
||||
// handleFindPoint(); |
calendar: null, |
||||
// } |
// days: [], |
||||
// }); |
}); |
||||
|
|
||||
// 获取项目列表 |
getProjects(); |
||||
function getProjects(start = dayjs().startOf('day').valueOf(), end = dayjs().endOf('day').valueOf()) { |
handleFindPoint(); |
||||
uni.$catchReq.getProjects(start, end, (err, data) => { |
|
||||
if (err) { |
// 监听token |
||||
console.error('err: ', err); |
// watchEffect(() => { |
||||
} else { |
// if (!token.value) return; |
||||
data.forEach(item => { |
// if (token.value) { |
||||
item.show = false; |
// getProjects(); |
||||
}); |
// handleFindPoint(); |
||||
store.commit('project/setProjects', data); |
// } |
||||
} |
// }); |
||||
}); |
|
||||
} |
// 获取项目列表 |
||||
|
function getProjects(start = dayjs().startOf('day').valueOf(), end = dayjs().endOf('day').valueOf()) { |
||||
async function handleFindPoint(start, end) { |
uni.$catchReq.getProjects(start, end, (err, data) => { |
||||
try { |
if (err) { |
||||
const startTime = start || dayjs().startOf('month').valueOf(); |
console.error('err: ', err); |
||||
const endTime = end || dayjs().endOf('month').valueOf(); |
} else { |
||||
const res = await uni.$u.api.findRedPoint(startTime, endTime); |
data.forEach(item => { |
||||
store.commit('project/setDotList', res); |
item.show = false; |
||||
} catch (error) { |
}); |
||||
console.log('error: ', error); |
store.commit('project/setProjects', data); |
||||
} |
} |
||||
} |
}); |
||||
|
} |
||||
// 点击了某个日期 |
|
||||
const onDateChange = event => { |
async function handleFindPoint(start, end) { |
||||
const day = dayjs(event.fullDate); |
try { |
||||
const start = day.startOf('date').valueOf(); |
const startTime = start || dayjs().startOf('month').valueOf(); |
||||
const end = day.endOf('date').valueOf(); |
const endTime = end || dayjs().endOf('month').valueOf(); |
||||
getProjects(start, end); |
const res = await uni.$u.api.findRedPoint(startTime, endTime); |
||||
}; |
store.commit('project/setDotList', res); |
||||
|
} catch (error) { |
||||
// 导入成功 |
console.log('error: ', error); |
||||
const onUploadSuccess = () => { |
} |
||||
uni.$ui.showToast('导入成功，即将打开新项目', 3000); |
} |
||||
// uTips.show({ |
|
||||
// title: '导入成功，即将打开新项目', |
// 点击了某个日期 |
||||
// type: 'success', |
const onDateChange = event => { |
||||
// duration: '3000', |
const day = dayjs(event.fullDate); |
||||
// }); |
const start = day.startOf('date').valueOf(); |
||||
}; |
const end = day.endOf('date').valueOf(); |
||||
|
getProjects(start, end); |
||||
// 导入失败 |
}; |
||||
const onUploadError = error => { |
|
||||
uni.$ui.showToast('导入失败', 6000); |
// 导入成功 |
||||
// uTips.show({ |
const onUploadSuccess = () => { |
||||
// title: error || '导入失败', |
uni.$ui.showToast('导入成功，即将打开新项目', 3000); |
||||
// type: 'error', |
// uTips.show({ |
||||
// duration: '6000', |
// title: '导入成功，即将打开新项目', |
||||
// }); |
// type: 'success', |
||||
}; |
// duration: '3000', |
||||
|
// }); |
||||
// 监听触摸滑动 切换日历的模式 月/周 |
}; |
||||
// function onMove(event) { |
|
||||
// const y = event.changedTouches[0].pageY; |
// 导入失败 |
||||
// const prevY = 0; |
const onUploadError = error => { |
||||
// if (y - prevY > 0) { |
uni.$ui.showToast('导入失败', 6000); |
||||
// // 向下滑动 如果是周视图weekMode=true 就 变成 月视图weekMode=false |
// uTips.show({ |
||||
// data.calendar.weekMode && (data.calendar.weekMode = false); |
// title: error || '导入失败', |
||||
// } else if (y - prevY < 0) { |
// type: 'error', |
||||
// // 向上滑动 如果是月视图weekMode=false 就变成 周视图weekMode=true |
// duration: '6000', |
||||
// !data.calendar.weekMode && (data.calendar.weekMode = true); |
// }); |
||||
// } |
}; |
||||
// prevY = y; |
|
||||
// data.calendar.initDate(); |
// 监听触摸滑动 切换日历的模式 月/周 |
||||
// } |
// function onMove(event) { |
||||
|
// const y = event.changedTouches[0].pageY; |
||||
function toLogin() { |
// const prevY = 0; |
||||
uni.navigateTo({ |
// if (y - prevY > 0) { |
||||
url: '/pages/user/login' |
// // 向下滑动 如果是周视图weekMode=true 就 变成 月视图weekMode=false |
||||
}); |
// data.calendar.weekMode && (data.calendar.weekMode = false); |
||||
} |
// } else if (y - prevY < 0) { |
||||
</script> |
// // 向上滑动 如果是月视图weekMode=false 就变成 周视图weekMode=true |
||||
|
// !data.calendar.weekMode && (data.calendar.weekMode = true); |
||||
<style lang="scss" scoped> |
// } |
||||
.statbar { |
// prevY = y; |
||||
width: 750rpx; |
// data.calendar.initDate(); |
||||
height: var(--status-bar-height); |
// } |
||||
|
|
||||
.status_bar { |
function toLogin() { |
||||
height: var(--status-bar-height); |
uni.navigateTo({ |
||||
width: 100%; |
url: '/pages/user/login' |
||||
position: absolute; |
}); |
||||
} |
} |
||||
} |
</script> |
||||
|
|
||||
.content { |
<style lang="scss" scoped> |
||||
display: flex; |
.statbar { |
||||
flex-direction: column; |
width: 750rpx; |
||||
align-items: center; |
height: var(--status-bar-height); |
||||
justify-content: center; |
|
||||
} |
.status_bar { |
||||
|
height: var(--status-bar-height); |
||||
.logo { |
width: 100%; |
||||
height: 200rpx; |
position: absolute; |
||||
width: 200rpx; |
} |
||||
margin-top: 200rpx; |
} |
||||
margin-left: auto; |
|
||||
margin-right: auto; |
.content { |
||||
margin-bottom: 50rpx; |
display: flex; |
||||
} |
flex-direction: column; |
||||
|
align-items: center; |
||||
.text-area { |
justify-content: center; |
||||
display: flex; |
} |
||||
justify-content: center; |
|
||||
} |
.logo { |
||||
|
height: 200rpx; |
||||
.title { |
width: 200rpx; |
||||
font-size: 36rpx; |
margin-top: 200rpx; |
||||
color: #8f8f94; |
margin-left: auto; |
||||
} |
margin-right: auto; |
||||
|
margin-bottom: 50rpx; |
||||
|
} |
||||
|
|
||||
|
.text-area { |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
|
||||
|
.title { |
||||
|
font-size: 36rpx; |
||||
|
color: #8f8f94; |
||||
|
} |
||||
</style> |
</style> |
||||
|
|||||
Loading…
Reference in new issue