初始化代码
This commit is contained in:
163
uniapp/uni-app/mine/pages/choose-time.vue
Normal file
163
uniapp/uni-app/mine/pages/choose-time.vue
Normal file
@@ -0,0 +1,163 @@
|
||||
<template>
|
||||
<view class="mine-choose-time" v-if="isLoad">
|
||||
<scroll-view class="scroll-left fill-base" scroll-y :scroll-into-view="scrollNav" :scroll-with-animation="true"
|
||||
v-if="sendDay.length> 0">
|
||||
<block v-for="(item,index) in sendDay" :key="index">
|
||||
<view @tap="onChangeNav(index,1)" :id="`scrollNav${index}`"
|
||||
class="item-child flex-center f-paragraph c-title" :class="[{'active':index==scrollInd}]"
|
||||
:style="{color: index == scrollInd ? primaryColor: ''}">
|
||||
<view class="flex-center child ellipsis"
|
||||
:style="{borderLeft: index == scrollInd ? `5rpx solid ${primaryColor}`:''}">
|
||||
{{`${item.date} (${item.week})`}}
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
<view class="scroll-right abs fill-base pl-lg" v-if="sendTime.length > 0">
|
||||
<view @tap="onChangeNav(index,2)" class="item-child flex-center f-paragraph c-paragraph"
|
||||
style="padding-right: 25rpx;" :style="{color: index == checkInd ? primaryColor: ''}"
|
||||
v-for="(item,index) in sendTime" :key="index">
|
||||
<view class="flex-1" :class="[{'text-delete': item.status != 1}]">
|
||||
{{item.time_text}}
|
||||
</view>
|
||||
<i class="iconfont icon-xuanze-fill" v-if="index == checkInd"></i>
|
||||
</view>
|
||||
<view class="mg-lg">
|
||||
<abnor v-if="!loading&&sendTime.length<=0"></abnor>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<abnor v-if="!loading&&sendDay.length<=0"></abnor>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
mapState,
|
||||
mapActions
|
||||
} from 'vuex';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isLoad: false,
|
||||
options: {},
|
||||
today_time: '',
|
||||
sendDay: [],
|
||||
sendTime: [],
|
||||
loading: false,
|
||||
scrollNav: 'scrollNav0',
|
||||
scrollInd: 0,
|
||||
checkInd: -1
|
||||
}
|
||||
},
|
||||
computed: mapState({
|
||||
commonOptions: state => state.user.commonOptions,
|
||||
primaryColor: state => state.config.configInfo.primaryColor,
|
||||
subColor: state => state.config.configInfo.subColor,
|
||||
}),
|
||||
onLoad(options) {
|
||||
let {
|
||||
index = '-1'
|
||||
} = options
|
||||
if (index && index.includes('_')) {
|
||||
let arr = index.split('_')
|
||||
this.scrollInd = arr[0]
|
||||
this.checkInd = arr[1]
|
||||
}
|
||||
this.options = options
|
||||
this.$util.showLoading()
|
||||
this.initIndex()
|
||||
},
|
||||
methods: {
|
||||
async initIndex(type = 0) {
|
||||
let cur_time = new Date().getTime()
|
||||
this.today_time = this.$util.DateToUnix(this.$util.formatTime(cur_time, 'YY-M-D h:m'))
|
||||
let {
|
||||
time = [],
|
||||
date = []
|
||||
} = await this.$api.claim.sendTime()
|
||||
if (date.length > 0) {
|
||||
let {
|
||||
date: cur_day
|
||||
} = date[type]
|
||||
time.map(item => {
|
||||
item.time_text = `${item.start_time} ~ ${item.end_time}`
|
||||
item.end_time_unix = this.$util.DateToUnix(`${cur_day} ${item.end_time}`)
|
||||
item.status = item.end_time_unix < this.today_time ? 0 : 1
|
||||
})
|
||||
}
|
||||
this.sendDay = date
|
||||
this.sendTime = time
|
||||
this.loading = false
|
||||
this.isLoad = true
|
||||
this.$util.hideAll()
|
||||
},
|
||||
async initRefresh() {
|
||||
this.initIndex()
|
||||
},
|
||||
async onChangeNav(index, type = 1) {
|
||||
let key = type == 1 ? 'sendDay' : 'sendTime'
|
||||
if (type == 1) {
|
||||
this.checkInd = this.scrollInd == index ? this.checkInd : -1
|
||||
this.scrollInd = index
|
||||
this.scrollNav = `scrollNav${index}`
|
||||
await this.initIndex(index)
|
||||
} else {
|
||||
let {
|
||||
status,
|
||||
} = this[key][index]
|
||||
if (status != 1) return
|
||||
this.checkInd = index
|
||||
let item = this[key][index]
|
||||
let {
|
||||
date
|
||||
} = this.sendDay[this.scrollInd]
|
||||
item.date = date
|
||||
let send_info = {
|
||||
time_index: `${this.scrollInd}_${index}`,
|
||||
time: item
|
||||
}
|
||||
this.$util.getPage(-1).send_info = send_info
|
||||
this.$util.goUrl({
|
||||
url: 1,
|
||||
openType: 'navigateBack'
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.mine-choose-time {
|
||||
|
||||
.scroll-left {
|
||||
width: 260rpx;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.item-child {
|
||||
height: 98rpx;
|
||||
}
|
||||
|
||||
.item-child.active {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.item-child .child {
|
||||
width: 100%;
|
||||
height: 32rpx;
|
||||
padding: 0 5%;
|
||||
}
|
||||
|
||||
.scroll-right {
|
||||
min-height: 100vh;
|
||||
top: 0;
|
||||
width: 460rpx;
|
||||
margin-left: 292rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user