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.
416 lines
9.9 KiB
416 lines
9.9 KiB
<template>
|
|
<view class="stored-record-pages" style="background-color: #ffffff;min-height:calc(100vh)">
|
|
<fixed>
|
|
<view class="list-time flex-center f-paragraph c-title fill-base b-1px-b">
|
|
<view @tap.stop="toChangeItem(index,'rankInd')" class="item-child flex-center"
|
|
:style="{color: rankInd == index ? primaryColor : ''}" v-for="(item,index) in rankList"
|
|
:key="index">{{item}}
|
|
<i class="iconfont icon-right rotate-90 ml-sm" v-if="item == '日期筛选'"></i>
|
|
</view>
|
|
</view>
|
|
</fixed>
|
|
|
|
<view class="cate-item-area" @tap.stop="toChangeItem(index,'curInd')"
|
|
v-for="(item,index) in list.data" :key="index">
|
|
<view class="contentItem">
|
|
<view class="chongzhiTitle">
|
|
<text>充值</text>
|
|
<view class="c-success">+{{item.true_price}}</view>
|
|
</view>
|
|
<view class="middleCz">
|
|
<text>充值单号</text>
|
|
<view class="jishi" @click="show = true">
|
|
捆绑技师
|
|
</view>
|
|
</view>
|
|
<view class="time">
|
|
<view>{{item.create_time}}</view>
|
|
</view>
|
|
<!-- <view class="flex-between">
|
|
<view class="max-446 ellipsis">{{item.title}}</view>
|
|
|
|
</view>
|
|
<view class="flex-between f-caption c-caption">
|
|
|
|
<view>余额：{{item.now_balance}}</view>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
|
|
<load-more :noMore="list.current_page>=list.last_page&&list.data.length>0" :loading="loading" v-if="loading">
|
|
</load-more>
|
|
<abnor v-if="!loading&&list.data.length<=0&&list.current_page==1"></abnor>
|
|
|
|
<view class="space-footer"></view>
|
|
|
|
<uni-popup ref="show_choose_time" type="top" :custom="true" :maskClick="false">
|
|
<view style="height: 95rpx;"></view>
|
|
<view class="popup-choose-time fill-base f-paragraph c-desc pt-lg pb-lg">
|
|
<view class="flex-center">
|
|
<view @tap.stop="toShowTime('start_time')" class="item-child flex-center flex-column">
|
|
<view>开始时间</view>
|
|
<view class="mt-sm" :style="{color:param.start_time ? primaryColor : '#999'}">
|
|
{{param.start_time || '选择时间'}}
|
|
</view>
|
|
</view>
|
|
<view @tap.stop="toShowTime('end_time')" class="item-child flex-center flex-column b-1px-l">
|
|
<view>结束时间</view>
|
|
<view class="mt-sm" :style="{color:param.end_time ? primaryColor : '#999'}">
|
|
{{param.end_time || '选择时间'}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
|
|
<w-picker mode="date" :startYear="startYear" :endYear="startYear*1 + 100" :value="toDay" :current="false"
|
|
fields="day" @confirm="onConfirm($event)" :disabled-after="false" ref="day" :themeColor="primaryColor"
|
|
:visible.sync="showDate">
|
|
</w-picker>
|
|
<u-popup :show="show" @close="closeHandle" mode="center">
|
|
<view class="slot-content">
|
|
<view class="formItemText">
|
|
充值单号：23097865456789
|
|
</view>
|
|
<view class="formItemText" style="margin:60rpx 0 73rpx 0 ">
|
|
充值金额：<text>￥1000.00</text>
|
|
</view>
|
|
<view class="inputContent">
|
|
<u--input
|
|
placeholder="请输入技师编号"
|
|
border="bottom"
|
|
v-model="value"
|
|
></u--input>
|
|
</view>
|
|
<view class="submit">
|
|
确认充值
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
mapState,
|
|
mapMutations
|
|
} from "vuex"
|
|
import wPicker from "@/components/w-picker/w-picker.vue";
|
|
export default {
|
|
components: {
|
|
wPicker
|
|
},
|
|
data() {
|
|
return {
|
|
toDay: '',
|
|
value:"",
|
|
startYear: '',
|
|
showKey: '',
|
|
showDate: false,
|
|
rankList: ['本月', '日期筛选'],
|
|
rankInd: 0,
|
|
start_time: '',
|
|
param: {
|
|
page: 1,
|
|
start_time: '',
|
|
end_time: ''
|
|
},
|
|
list: {
|
|
data: [
|
|
|
|
]
|
|
},
|
|
loading: true,
|
|
curInd: -1,
|
|
startX: 0, //开始坐标
|
|
startY: 0, //开始坐标
|
|
lockTap: false,
|
|
show:false
|
|
}
|
|
},
|
|
computed: mapState({
|
|
primaryColor: state => state.config.configInfo.primaryColor,
|
|
subColor: state => state.config.configInfo.subColor,
|
|
}),
|
|
onLoad() {
|
|
this.$util.showLoading()
|
|
this.initIndex()
|
|
},
|
|
onPullDownRefresh() {
|
|
// #ifndef APP-PLUS
|
|
uni.showNavigationBarLoading()
|
|
// #endif
|
|
this.initRefresh();
|
|
uni.stopPullDownRefresh()
|
|
},
|
|
onReachBottom() {
|
|
if (this.list.current_page >= this.list.last_page || this.loading) return;
|
|
this.param.page = this.param.page + 1;
|
|
this.loading = true;
|
|
this.getList();
|
|
},
|
|
methods: {
|
|
...mapMutations(['updateUserItem']),
|
|
async initIndex(refresh = false) {
|
|
// #ifdef H5
|
|
if (!refresh && this.$jweixin.isWechat()) {
|
|
await this.$jweixin.initJssdk();
|
|
this.$jweixin.wxReady(() => {
|
|
this.$jweixin.hideOptionMenu()
|
|
})
|
|
}
|
|
// #endif
|
|
let cur_time = new Date(Math.ceil(new Date().getTime()))
|
|
this.toDay = this.$util.formatTime(cur_time, 'YY-M-D')
|
|
this.startYear = this.$util.formatTime(cur_time, 'YY')
|
|
this.start_time = this.$util.formatTime(cur_time, 'YY-M') + '-01'
|
|
await this.getList()
|
|
this.$util.setNavigationBarColor({
|
|
bg: this.primaryColor
|
|
})
|
|
},
|
|
initRefresh() {
|
|
this.param.page = 1
|
|
this.initIndex(true)
|
|
},
|
|
async getList() {
|
|
let {
|
|
list: oldList,
|
|
rankInd,
|
|
start_time,
|
|
toDay
|
|
} = this
|
|
let param = this.$util.deepCopy(this.param)
|
|
if (rankInd == 0) {
|
|
param.start_time = start_time
|
|
param.end_time = toDay
|
|
}
|
|
param.start_time = this.$util.DateToUnix(param.start_time)
|
|
param.end_time = this.$util.DateToUnix(param.end_time) + 24 * 3600 - 1
|
|
let newList = await this.$api.mine.balaceOrder(param);
|
|
|
|
newList.data.map(item => {
|
|
item.isTouchMove = false
|
|
})
|
|
if (this.param.page == 1) {
|
|
this.list = newList
|
|
} else {
|
|
newList.data = oldList.data.concat(newList.data)
|
|
this.list = newList
|
|
}
|
|
this.loading = false
|
|
this.$util.hideAll()
|
|
},
|
|
async toChangeItem(index, key) {
|
|
this[key] = index
|
|
if (key == 'rankInd') {
|
|
let methodModel = index == 1 ? 'open' : 'close'
|
|
this.$refs.show_choose_time[methodModel]()
|
|
if (index == 1) return
|
|
this.param.page = 1
|
|
await this.getList()
|
|
}
|
|
},
|
|
toShowTime(key) {
|
|
if (key == 'end_time' && !this.param.start_time) {
|
|
this.$util.showToast({
|
|
title: `请选择开始时间`
|
|
})
|
|
return
|
|
}
|
|
this.showKey = key
|
|
this.showDate = true
|
|
},
|
|
async onConfirm(val) {
|
|
let {
|
|
start_time,
|
|
end_time
|
|
} = this.param
|
|
let {
|
|
showKey
|
|
} = this
|
|
if (showKey == 'end_time' && this.$util.DateToUnix(start_time) > this.$util.DateToUnix(val.result)) {
|
|
this.$util.showToast({
|
|
title: `结束时间不能小于或等于开始时间`
|
|
})
|
|
return
|
|
}
|
|
this.param[showKey] = val.result;
|
|
if (showKey == 'end_time') {
|
|
this.showDate = false
|
|
this.$refs.show_choose_time.close()
|
|
this.param.page = 1
|
|
await this.getList()
|
|
}
|
|
},
|
|
async toDel(index) {
|
|
let {
|
|
id,
|
|
title
|
|
} = this.list.data[index]
|
|
let [res_del, {
|
|
confirm
|
|
}] = await uni.showModal({
|
|
content: `请确认是否要删除‘${title}'`,
|
|
})
|
|
if (!confirm) return;
|
|
let param = {
|
|
id,
|
|
status: -1
|
|
}
|
|
await this.$api.master.goodsCateUpdate(param)
|
|
this.$util.showToast({
|
|
title: `删除成功`
|
|
})
|
|
this.list.data.splice(index, 1)
|
|
},
|
|
//手指触摸动作开始 记录起点X坐标
|
|
touchstart(e) {
|
|
//开始触摸时 重置所有删除
|
|
this.list.data.forEach(item => {
|
|
if (item.isTouchMove) //只操作为true的
|
|
item.isTouchMove = false;
|
|
})
|
|
this.startX = e.changedTouches[0].clientX
|
|
this.startY = e.changedTouches[0].clientY
|
|
},
|
|
closeHandle(){
|
|
this.show = false
|
|
},
|
|
//滑动事件处理
|
|
touchmove(e) {
|
|
let {
|
|
startX,
|
|
startY
|
|
} = this
|
|
let {
|
|
index
|
|
} = e.currentTarget.dataset //当前索引
|
|
|
|
let {
|
|
clientX,
|
|
clientY
|
|
} = e.changedTouches[0]
|
|
let touchMoveX = clientX
|
|
let touchMoveY = clientY
|
|
//获取滑动角度
|
|
let angle = this.angle({
|
|
X: startX,
|
|
Y: startY
|
|
}, {
|
|
X: touchMoveX,
|
|
Y: touchMoveY
|
|
});
|
|
this.list.data.forEach((v, i) => {
|
|
v.isTouchMove = false
|
|
//滑动超过30度角 return
|
|
if (Math.abs(angle) > 30) return;
|
|
if (i == index) {
|
|
if (touchMoveX > startX) //右滑
|
|
v.isTouchMove = false
|
|
else //左滑
|
|
v.isTouchMove = true
|
|
}
|
|
})
|
|
},
|
|
/**
|
|
* 计算滑动角度
|
|
* @param {Object} start 起点坐标
|
|
* @param {Object} end 终点坐标
|
|
*/
|
|
angle(start, end) {
|
|
var _X = end.X - start.X,
|
|
_Y = end.Y - start.Y
|
|
//返回角度 /Math.atan()返回数字的反正切值
|
|
return 360 * Math.atan(_Y / _X) / (2 * Math.PI);
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
.cate-item-area{
|
|
padding:0 24rpx;
|
|
|
|
.contentItem{
|
|
padding:39rpx 24rpx;
|
|
background-color: #ffffff;
|
|
border-bottom:1px solid #EAEAEA;
|
|
.chongzhiTitle,.middleCz{
|
|
display:flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
.chongzhiTitle{
|
|
text{
|
|
font-size: 34rpx;
|
|
font-family: PingFang SC;
|
|
font-weight: bold;
|
|
color: #333333;
|
|
}
|
|
.c-success{
|
|
|
|
font-size: 34rpx;
|
|
font-family: PingFang SC;
|
|
font-weight: bold;
|
|
color: #F4563C;
|
|
}
|
|
}
|
|
.middleCz{
|
|
margin-top:19rpx;
|
|
text{
|
|
font-size: 26rpx;
|
|
font-family: PingFang SC;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
}
|
|
.jishi{
|
|
padding:18rpx 28rpx;
|
|
background: #08BF77;
|
|
border-radius: 50rpx;
|
|
color:#ffffff;
|
|
}
|
|
|
|
}
|
|
.time{
|
|
font-size: 24rpx;
|
|
font-family: PingFang SC;
|
|
font-weight: 500;
|
|
color: #999999;
|
|
}
|
|
}
|
|
}
|
|
/deep/.u-popup__content{
|
|
border-radius: 30rpx;
|
|
overflow: hidden;
|
|
}
|
|
.slot-content{
|
|
padding:50rpx;
|
|
.formItemText{
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
text{
|
|
font-size:28rpx;
|
|
color:#F4563C;
|
|
}
|
|
}
|
|
.submit{
|
|
padding:36rpx 81rpx;
|
|
font-size: 30rpx;
|
|
font-family: PingFang SC;
|
|
font-weight: 500;
|
|
color: #FFFFFF;
|
|
background: #08BF77;
|
|
border-radius: 60rpx;
|
|
width: fit-content;
|
|
|
|
margin:0 auto;
|
|
margin-top:41rpx;
|
|
}
|
|
|
|
}
|
|
</style>
|
|
|