初始化
This commit is contained in:
魏啾
325
pages/my/address/edit.vue
Normal file
325
pages/my/address/edit.vue
Normal file
@@ -0,0 +1,325 @@
|
||||
<template>
|
||||
<view class="content" :style="[theme]">
|
||||
<view class="content_box">
|
||||
<view class="content_box_item flex-start">
|
||||
<view class="content_box_item_one">
|
||||
联系人
|
||||
</view>
|
||||
<view class="content_box_item_tow">
|
||||
<input type="text" v-model="form.name" placeholder="请填写收货人姓名" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="content_box_item flex-start">
|
||||
<view class="content_box_item_one">
|
||||
联系电话
|
||||
</view>
|
||||
<view class="content_box_item_tow">
|
||||
<input type="number" v-model="form.mobile" maxlength="11"
|
||||
placeholder="请填写收货人手机号码" />
|
||||
</view>
|
||||
</view>
|
||||
<pick-regions :defaultRegion="defaultRegionCode" @getRegion="handleGetRegion">
|
||||
<view class="content_box_item flex-start">
|
||||
<view class="content_box_item_one">
|
||||
所在地区
|
||||
</view>
|
||||
<view class="content_box_item_tow flex-start">
|
||||
<input type="text" v-model="regionName" disabled="disabled" placeholder="省市区、乡镇等" />
|
||||
<!-- <image class="content_box_itemimage" @click="chooseLocation" src="@/static/address.png" mode="aspectFill">
|
||||
</image> -->
|
||||
</view>
|
||||
</view>
|
||||
</pick-regions>
|
||||
<!-- <view class="content_box_item flex-start">
|
||||
<view class="content_box_item_one">
|
||||
所在街道
|
||||
</view>
|
||||
<view class="content_box_item_tow">
|
||||
<input type="text" v-model="form.name" placeholder="填写街道" />
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="content_box_item flex-start">
|
||||
<view class="content_box_item_one">
|
||||
详细地址
|
||||
</view>
|
||||
<view class="content_box_item_tow">
|
||||
<input type="text" v-model="form.address" placeholder="请填写详细地址" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content_box_tow flex-between">
|
||||
<view class="content_box_tow_one">
|
||||
设为默认地址
|
||||
</view>
|
||||
<u-switch v-model="showis_default" size="20" @change="change"></u-switch>
|
||||
</view>
|
||||
<view class="positionfixed flex-center" @click="usereditaddress">
|
||||
保存
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import pickRegions from '@/components/pick-regions/pick-regions.vue'
|
||||
export default {
|
||||
components: {
|
||||
pickRegions
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
region: [],
|
||||
showis_default: true,
|
||||
defaultRegionCode: '610112', //默认未央区
|
||||
height: '',
|
||||
form: {
|
||||
regionName: '',
|
||||
type: ''
|
||||
},
|
||||
valueswitch: false
|
||||
};
|
||||
},
|
||||
async onLoad(e) {
|
||||
this.form.id = e.id
|
||||
if (e.type == 1) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '添加地址'
|
||||
})
|
||||
} else {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '修改地址'
|
||||
})
|
||||
let res = await this.api.usereaddressshow({
|
||||
id: this.form.id
|
||||
})
|
||||
console.log(res)
|
||||
if (res) {
|
||||
this.form = res
|
||||
if (res.is_default == 1) {
|
||||
this.showis_default = true
|
||||
} else {
|
||||
this.showis_default = false
|
||||
}
|
||||
}
|
||||
}
|
||||
this.form.type = e.type
|
||||
},
|
||||
onShow() {},
|
||||
watch: {},
|
||||
computed: {
|
||||
theme() {
|
||||
return this.$store.getters.theme
|
||||
},
|
||||
regionName() {
|
||||
// 转为字符串
|
||||
let res = null
|
||||
if (this.region.length == 0) {
|
||||
res = this.form.province + this.form.city + this.form.area
|
||||
} else {
|
||||
res = this.region.map(item => item.name).join(' ')
|
||||
}
|
||||
return res
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
change(e) {
|
||||
this.showis_default = e
|
||||
console.log('change', e);
|
||||
},
|
||||
async usereditaddress() {
|
||||
if (this.form.name == null || this.form.name == '') {
|
||||
uni.showToast({
|
||||
title: '请输入姓名',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.mobile == null || this.form.mobile == '') {
|
||||
uni.showToast({
|
||||
title: '请输入电话号码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.province == null || this.form.province == '') {
|
||||
uni.showToast({
|
||||
title: '请选择省，市，区',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.address == null || this.form.address == '') {
|
||||
uni.showToast({
|
||||
title: '请输入详细地址',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
let res = await this.api.usereditaddress({
|
||||
id: this.form.id, //地址ID
|
||||
province: this.form.province, //省
|
||||
city: this.form.city, //市
|
||||
area: this.form.area, //区
|
||||
address: this.form.address, //详细地址
|
||||
name: this.form.name, //姓名
|
||||
mobile: this.form.mobile, //电话
|
||||
lng: this.form.lng, //经度
|
||||
is_default: this.showis_default == true ? 1 : '', //1 默认
|
||||
lat: this.form.lat, //维度
|
||||
type: this.form.type //1 添加 2修改
|
||||
})
|
||||
console.log(res)
|
||||
if (res == 1) {
|
||||
uni.showToast({
|
||||
title: this.form.type == 1 ? '添加成功' : '修改成功',
|
||||
icon: 'none'
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.navigateBack()
|
||||
}, 1000);
|
||||
}
|
||||
},
|
||||
handleGetRegion(region) {
|
||||
console.log(111, region)
|
||||
this.region = region
|
||||
this.form.province = region[0].name
|
||||
this.form.city = region[1].name
|
||||
this.form.area = region[2].name
|
||||
|
||||
},
|
||||
chooseLocation() {
|
||||
uni.chooseAddress({
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
this.form.address = res.address
|
||||
this.form.lat = res.latitude
|
||||
this.form.lng = res.longitude
|
||||
this.lnglat = res.latitude + '-' + res.longitude
|
||||
console.log('位置名称：' + res.name);
|
||||
console.log('详细地址：' + res.address);
|
||||
console.log('纬度：' + res.latitude);
|
||||
console.log('经度：' + res.longitude);
|
||||
},
|
||||
fail: (e) => {
|
||||
console.log(e)
|
||||
// uni.getSetting({
|
||||
// success: function(res) {
|
||||
// var statu = res.authSetting;
|
||||
// console.log(statu);
|
||||
// if (!statu['scope.userLocation']) {
|
||||
// console.log(123);
|
||||
// uni.showModal({
|
||||
// title: '是否授权当前位置',
|
||||
// content: '需要获取您的地理位置，请确认授权，否则地图功能将无法使用',
|
||||
// success(tip) {
|
||||
// if (tip.confirm) {
|
||||
// uni.authorize({
|
||||
// scope: 'scope.userLocation',
|
||||
// success:()=> {
|
||||
// this.chooseLocation()
|
||||
// }
|
||||
// })
|
||||
// } else {
|
||||
// uni.showToast({
|
||||
// title: '授权失败',
|
||||
// icon: 'none',
|
||||
// duration: 1000
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
}
|
||||
})
|
||||
},
|
||||
edit(e) {
|
||||
uni.pro.navigateTo('my/address/edit', e.id)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 0 30rpx;
|
||||
|
||||
.content_box {
|
||||
padding-left: 40rpx;
|
||||
background: #FFF;
|
||||
|
||||
.content_box_item {
|
||||
margin-top: 24rpx;
|
||||
width: 100%;
|
||||
padding: 32rpx;
|
||||
border-bottom: 1rpx solid #F6F6F6;
|
||||
|
||||
.content_box_item_one {
|
||||
width: 112rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.content_box_item_tow {
|
||||
flex: auto;
|
||||
padding-left: 80rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #CCCCCC;
|
||||
|
||||
input {
|
||||
flex: auto;
|
||||
height: 100%;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #CCCCCC;
|
||||
}
|
||||
}
|
||||
|
||||
.content_box_itemimage {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content_box_tow {
|
||||
margin-top: 24rpx;
|
||||
padding: 34rpx 44rpx;
|
||||
background: #FFF;
|
||||
|
||||
.content_box_tow_one {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.positionfixed {
|
||||
position: fixed;
|
||||
background: #f6f6f6;
|
||||
width: 90%;
|
||||
bottom: 50rpx;
|
||||
left: 5%;
|
||||
padding: 24rpx 34rpx;
|
||||
text-align: center;
|
||||
background: var(--bg-color-button);
|
||||
border-radius: 46rpx;
|
||||
font-size: 30rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
248
pages/my/address/index.vue
Normal file
248
pages/my/address/index.vue
Normal file
@@ -0,0 +1,248 @@
|
||||
<template>
|
||||
<view class="content" :style="[theme]">
|
||||
<view class="contentitem" v-for="(item,index) in list" :key="index" @click.stop="order_fn(item)">
|
||||
<view class="contentitemone flex-start">
|
||||
<view class="contentitemone_textone">
|
||||
{{item.name}}
|
||||
</view>
|
||||
<view class="contentitemone_textyow">
|
||||
{{item.mobile.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="contentitemtow ">
|
||||
{{item.province}}{{item.area}}{{item.city}}{{item.address}}
|
||||
</view>
|
||||
<view class="contentitemthere flex-between">
|
||||
<view class="contentitemthereone flex-start" @click.stop="edit(item)">
|
||||
<u-icon v-if="item.is_default == 1" style="margin-right: 10rpx;" name="checkmark-circle-fill"
|
||||
color="##9397c1" size="18"></u-icon>
|
||||
<view v-else class="contentitemthereonecircle">
|
||||
|
||||
</view>
|
||||
默认地址
|
||||
</view>
|
||||
<view class="contentitemtheretow flex-start">
|
||||
<text @click.stop="edit(item)">编辑</text>
|
||||
<text style="margin-left: 60rpx;" @click.stop="clickdelete(item)">删除</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="positionfixed flex-center" @click="add">
|
||||
<u-icon name="plus" color="#FFF" size="14"></u-icon>
|
||||
<view style="margin-left: 20rpx;">添加地址</view>
|
||||
</view>
|
||||
<view v-if="list.length==0 && is_end == true" class="flex-colum">
|
||||
<image style="margin-top: 100rpx;" :src="bgnothave" mode="aspectFill">
|
||||
</image>
|
||||
</view>
|
||||
<u-loadmore :status="form.status" />
|
||||
<view :style="{height:height}"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
bgnothave: uni.getStorageSync('bgnothave'),
|
||||
height: '',
|
||||
is_order: 0,
|
||||
list: [],
|
||||
is_end: false,
|
||||
form: {
|
||||
page: 1,
|
||||
status: 'loadmore',
|
||||
},
|
||||
|
||||
};
|
||||
},
|
||||
onLoad(e) {
|
||||
this.is_order = e.order
|
||||
},
|
||||
onReachBottom() {
|
||||
this.usermyaddresslist()
|
||||
},
|
||||
computed: {
|
||||
theme() {
|
||||
return this.$store.getters.theme
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
var query = uni.createSelectorQuery().in(this).select('.positionfixed')
|
||||
query.boundingClientRect(ele => {
|
||||
var that = this;
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
that.height = ele.height + 50 + "px";
|
||||
that = null;
|
||||
}
|
||||
})
|
||||
}).exec();
|
||||
},
|
||||
onShow() {
|
||||
this.inif()
|
||||
},
|
||||
methods: {
|
||||
async usermyaddresslist() {
|
||||
let res = await this.api.usermyaddresslist({
|
||||
page: this.form.page
|
||||
})
|
||||
if (res.length == 0) {
|
||||
this.is_end = true
|
||||
this.form.status = 'nomore'
|
||||
return false;
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
this.form.page = ++this.form.page;
|
||||
setTimeout(() => {
|
||||
this.list = [...this.list, ...res];
|
||||
if (res.length == 10) {
|
||||
this.form.status = 'loading';
|
||||
} else {
|
||||
this.is_end = true;
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
},
|
||||
order_fn(item) {
|
||||
if (this.is_order == 1) {
|
||||
uni.$emit('update', JSON.stringify(item));
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
|
||||
}
|
||||
},
|
||||
add() {
|
||||
uni.pro.navigateTo('my/address/edit', {
|
||||
type: 1
|
||||
})
|
||||
},
|
||||
edit(e) {
|
||||
uni.pro.navigateTo('my/address/edit', {
|
||||
type: 2,
|
||||
id: e.id
|
||||
})
|
||||
},
|
||||
inif() {
|
||||
this.list = []
|
||||
this.is_end = false,
|
||||
this.form = {
|
||||
page: 1,
|
||||
status: 'loadmore',
|
||||
},
|
||||
this.usermyaddresslist()
|
||||
},
|
||||
async clickdelete(e) {
|
||||
var this_ = this
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确认删除该地址吗？',
|
||||
async success(data) {
|
||||
if (data.confirm) {
|
||||
let res = await this_.api.useredeleteaddress({
|
||||
id: e.id
|
||||
})
|
||||
if (res) {
|
||||
this_.inif()
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 0 30rpx;
|
||||
|
||||
.positionfixed {
|
||||
position: fixed;
|
||||
background: #f6f6f6;
|
||||
width: 80%;
|
||||
bottom: 50rpx;
|
||||
left: 10%;
|
||||
padding: 24rpx 34rpx;
|
||||
text-align: center;
|
||||
background: var(--bg-color-button);
|
||||
border-radius: 46rpx;
|
||||
font-size: 30rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.contentitem {
|
||||
padding: 32rpx 40rpx;
|
||||
margin-top: 24rpx;
|
||||
width: 100%;
|
||||
background: #ffffff;
|
||||
border-radius: 18rpx;
|
||||
|
||||
.contentitemone {
|
||||
.contentitemone_textone {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.contentitemone_textyow {
|
||||
margin-left: 40rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.contentitemtow {
|
||||
margin-top: 12rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.contentitemtow::after {
|
||||
display: inline-block;
|
||||
content: '';
|
||||
margin: 32rpx 0 20rpx 0;
|
||||
width: 100%;
|
||||
height: 1rpx;
|
||||
background: #f6f6f6;
|
||||
}
|
||||
|
||||
.contentitemthere {
|
||||
.contentitemthereone {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #5C685D;
|
||||
}
|
||||
|
||||
.contentitemthereonecircle {
|
||||
margin-right: 10rpx;
|
||||
border-radius: 50%;
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
border: 2rpx solid #666666;
|
||||
}
|
||||
|
||||
.contentitemtheretow {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
412
pages/my/index.vue
Normal file
412
pages/my/index.vue
Normal file
@@ -0,0 +1,412 @@
|
||||
<template>
|
||||
<view>
|
||||
<navbar :collapse='false' :Background='Background' :navtitle='navtitle' :navboxshow="navboxshow"
|
||||
@fatherMethod='navfatherMethod'></navbar>
|
||||
<view class="index_box">
|
||||
<image class="index_boximge" :src="userlist.background" mode="aspectFill"></image>
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<navigator :url="'/pages/my/setup/index'" class="index_boxone flex-between"
|
||||
:style="[{'padding-top':HeighT.customBar+'px'}]">
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef MP-WEIXIN -->
|
||||
<navigator :url="'/pages/my/setup/index'" class="index_boxone flex-between" style="padding-top:44px;">
|
||||
<!-- #endif -->
|
||||
<view class="index_boxone_one flex-start" v-if="userlist.user">
|
||||
<image :src="userlist.user.avatar" mode="aspectFill"></image>
|
||||
<view class="index_boxone_tow flex-colum-start">
|
||||
<text class="index_boxone_tow_one">{{userlist.user.nickname || "暂无昵称"}}</text>
|
||||
<text class="index_boxone_tow_tow">{{userlist.user.user_id}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<u-icon name="setting" color="#fff" size="20"></u-icon>
|
||||
</navigator>
|
||||
<view class="onebox">
|
||||
<view class="onebox_one">
|
||||
<view class="onebox_one_text flex-between">
|
||||
<text>我的订单</text>
|
||||
<text @click="order(10)">查看全部</text>
|
||||
</view>
|
||||
<view class="onebox_one_one flex-around">
|
||||
<view class="flex-colum" v-for="(item,index) in userlist.user_order" :key="index"
|
||||
@click="order(index)">
|
||||
<image :src="item.img" mode="aspectFill"></image>
|
||||
<text>{{item.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="towbox flex-between">
|
||||
<view class="towbox_item flex-start" v-for="(item,index) in userlist.t_user" :key="index"
|
||||
@click="toworder(index)">
|
||||
<image :src="item.img" mode="aspectFill"></image>
|
||||
<view class="flex-colum">
|
||||
<text>{{item.name}}</text>
|
||||
<view v-if="index==0">{{item.balance}}<text>元</text></view>
|
||||
<view v-if="index==1">{{item.card_count}}<text>张</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="therebox">
|
||||
<view class="therebox_item flex-between" v-for="(item,index) in userlist.list" :key="index"
|
||||
@click="mobilemobile(item)">
|
||||
<view class="flex-start">
|
||||
<image :src="item.img" mode="aspectFill"></image>
|
||||
<text>{{item.name}}</text>
|
||||
</view>
|
||||
<u-icon name="arrow-right" color="#9b9b9b" size="14"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<bottombbar :valuebbar='4'></bottombbar>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import navbar from '@/components/navbar.vue'
|
||||
import bottombbar from '@/components/bottombbar.vue'
|
||||
export default {
|
||||
components: {
|
||||
navbar,
|
||||
bottombbar
|
||||
},
|
||||
computed: {
|
||||
HeighT() {
|
||||
return this.$store.getters.is_BarHeight
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
navtitle: '', //名称
|
||||
navboxshow: '0', //显示
|
||||
Background: 'none',
|
||||
userlist: {
|
||||
user: {
|
||||
avatar: "https://door.sxczgkj.cn//assets/img/avatar.png",
|
||||
nickname: "超掌柜",
|
||||
user_id: 1001,
|
||||
},
|
||||
t_user: [{
|
||||
balance: "0.00",
|
||||
img: "https://door.sxczgkj.cn//apple/qb.png"
|
||||
}, {
|
||||
card_count: "0",
|
||||
img: "https://door.sxczgkj.cn//apple/kx.png"
|
||||
}],
|
||||
list: [{
|
||||
img: "https://door.sxczgkj.cn//apple/kf.png",
|
||||
mobile: "0290102212",
|
||||
name: "联系客服",
|
||||
url: ""
|
||||
}, {
|
||||
img: "https://door.sxczgkj.cn//apple/aq.png",
|
||||
name: "安全密码",
|
||||
url: "my/setup/repairpassword",
|
||||
}]
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
onShow() {
|
||||
this.$store.dispatch("actionsclassification");
|
||||
this.usermy()
|
||||
this.useruserinfo()
|
||||
},
|
||||
methods: {
|
||||
async useruserinfo() {
|
||||
let res = await this.api.useruserinfo() //p判断是否完成手机号
|
||||
uni.cache.set('loginuser', res);
|
||||
},
|
||||
async mobilemobile(e) {
|
||||
switch (e.name) {
|
||||
case '联系客服':
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: e.mobile //打电话
|
||||
});
|
||||
break;
|
||||
case '安全密码':
|
||||
|
||||
if (uni.cache.get('loginuser').userinfo.mobile) {
|
||||
uni.pro.navigateTo(e.url)
|
||||
} else {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确认订单需要获取您的手机号',
|
||||
success: function(res) {
|
||||
if (res.confirm) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/my/setup/index'
|
||||
});
|
||||
} else if (res.cancel) {}
|
||||
}
|
||||
});
|
||||
}
|
||||
break;
|
||||
case '我的地址':
|
||||
uni.pro.navigateTo(e.url)
|
||||
break;
|
||||
}
|
||||
},
|
||||
async usermy() {
|
||||
let res = await this.api.usermy({
|
||||
store_id: uni.cache.get('store_id') // 判断显示哪家的作品,
|
||||
})
|
||||
this.userlist = res
|
||||
console.log(res)
|
||||
},
|
||||
threelist(e) {
|
||||
uni.pro.navigateTo('my/order/index', {
|
||||
e: e
|
||||
})
|
||||
},
|
||||
toworder(e) {
|
||||
if (e == 0) {
|
||||
uni.pro.navigateTo('my/member/memberone', e)
|
||||
} else {
|
||||
uni.pro.navigateTo('my/member/index', {
|
||||
e: e
|
||||
})
|
||||
}
|
||||
},
|
||||
order(e) {
|
||||
switch (e) {
|
||||
case 10:
|
||||
if (uni.cache.get('loginuser').style_type == 2) {
|
||||
uni.pro.navigateTo('mall/order/index', {
|
||||
e: 0
|
||||
})
|
||||
} else {
|
||||
uni.pro.navigateTo('my/order/index', {
|
||||
e: 0
|
||||
})
|
||||
}
|
||||
break;
|
||||
case 0:
|
||||
if (uni.cache.get('loginuser').style_type == 2) {
|
||||
uni.pro.navigateTo('mall/order/index', {
|
||||
e: 1
|
||||
})
|
||||
} else {
|
||||
uni.pro.navigateTo('my/order/index', {
|
||||
e: 1
|
||||
})
|
||||
}
|
||||
break;
|
||||
case 1:
|
||||
if (uni.cache.get('loginuser').style_type == 2) {
|
||||
uni.pro.navigateTo('mall/order/index', {
|
||||
e: 2
|
||||
})
|
||||
} else {
|
||||
uni.pro.navigateTo('my/order/index', {
|
||||
e: 2
|
||||
})
|
||||
}
|
||||
break;
|
||||
case 2:
|
||||
if (uni.cache.get('loginuser').style_type == 2) {
|
||||
uni.pro.navigateTo('mall/order/index', {
|
||||
e: 3
|
||||
})
|
||||
} else {
|
||||
uni.pro.navigateTo('my/order/index', {
|
||||
e: 3
|
||||
})
|
||||
}
|
||||
break;
|
||||
case 3:
|
||||
if (uni.cache.get('loginuser').style_type == 2) {
|
||||
uni.pro.navigateTo('mall/order/index', {
|
||||
e: 4
|
||||
})
|
||||
} else {
|
||||
uni.pro.navigateTo('my/order/index', {
|
||||
e: 4
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.index_box {
|
||||
position: relative;
|
||||
padding: 0 32rpx;
|
||||
width: 100%;
|
||||
height: 502rpx;
|
||||
// background: url(@/static/1.png) no-repeat;
|
||||
background-size: cover;
|
||||
|
||||
.index_boximge {
|
||||
z-index: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.index_boxone {
|
||||
z-index: 9;
|
||||
|
||||
.index_boxone_one {
|
||||
image {
|
||||
z-index: 999;
|
||||
width: 124rpx;
|
||||
height: 124rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.index_boxone_tow {
|
||||
margin-left: 32rpx;
|
||||
height: 100rpx;
|
||||
justify-content: space-around;
|
||||
|
||||
.index_boxone_tow_one {
|
||||
z-index: 9;
|
||||
font-size: 40rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.index_boxone_tow_tow {
|
||||
z-index: 9;
|
||||
font-size: 28rpx;
|
||||
font-family: Segoe UI-Regular, Segoe UI;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.onebox {
|
||||
position: relative;
|
||||
top: 40rpx;
|
||||
|
||||
.onebox_one {
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
padding: 32rpx;
|
||||
|
||||
.onebox_one_text{
|
||||
width: 100%;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
text:nth-child(2){
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
|
||||
.onebox_one_one {
|
||||
margin-top: 32rpx;
|
||||
|
||||
.flex-colum {
|
||||
image {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
|
||||
text {
|
||||
margin-top: 16rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.towbox {
|
||||
margin-top: 64rpx;
|
||||
|
||||
.towbox_item {
|
||||
width: 48%;
|
||||
background: #FFFFFF;
|
||||
padding: 32rpx 24rpx;
|
||||
border-radius: 12rpx;
|
||||
|
||||
image {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
}
|
||||
|
||||
.flex-colum {
|
||||
width:50%;
|
||||
margin-left: 28rpx;
|
||||
align-items: flex-start;
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
view {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
|
||||
text {
|
||||
color: #333333;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.therebox {
|
||||
margin-top: 32rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
padding: 0 32rpx 32rpx 32rpx;
|
||||
|
||||
.therebox_item {
|
||||
padding-top: 32rpx;
|
||||
|
||||
.flex-start {
|
||||
image {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
|
||||
text {
|
||||
margin-left: 24rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
179
pages/my/member/index.vue
Normal file
179
pages/my/member/index.vue
Normal file
@@ -0,0 +1,179 @@
|
||||
<template>
|
||||
<view class="content" :style="[theme]">
|
||||
<view class="onecontentone">
|
||||
我的会员卡<text v-if="list.length!=0">({{list.length}})</text>
|
||||
</view>
|
||||
<view class="flex-colum">
|
||||
<view class="towcontentitem" v-if="list.length>0" v-for="(item,index) in list" :key="index"
|
||||
@click="eeInfo(item)">
|
||||
<image class="towcontentitemimage"
|
||||
src="https://ointmentweapp.oss-cn-beijing.aliyuncs.com/my/recharge.png" mode="aspectFill"></image>
|
||||
<view class="towcontentitemone flex-start">
|
||||
<image class="towcontentitemoneimage" :src="item.store_avatar" mode="aspectFill"></image>
|
||||
<text class="towcontentitemonetext" style="color: #333333;">{{item.store_title}}</text>
|
||||
</view>
|
||||
<view class="towcontentitemtow flex-between">
|
||||
<text class="towcontentitemtowetext" style="color:#333333;">{{item.vip_number}}</text>
|
||||
<text>{{item.end_time}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="list.length==0 && is_end == true" class="flex-colum">
|
||||
<image :src="bgnothave" mode="aspectFill">
|
||||
</image>
|
||||
</view>
|
||||
<u-loadmore :status="form.status" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
bgnothave:uni.getStorageSync('bgnothave'),
|
||||
list: [],
|
||||
is_end: false,
|
||||
nickname: uni.cache.get('loginuser').userinfo.nickname,
|
||||
form: {
|
||||
page: 1,
|
||||
status: 'loadmore',
|
||||
},
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.userusercarlist()
|
||||
},
|
||||
onReachBottom() {
|
||||
this.userusercarlist()
|
||||
},
|
||||
computed: {
|
||||
theme() {
|
||||
return this.$store.getters.theme
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
async userusercarlist() {
|
||||
let res = await this.api.userusercarlist({
|
||||
page: this.form.page,
|
||||
store_id:uni.cache.get('store_id')
|
||||
})
|
||||
if (res.length == 0) {
|
||||
this.is_end = true
|
||||
this.form.status = 'nomore'
|
||||
return false;
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
this.form.page = ++this.form.page;
|
||||
setTimeout(() => {
|
||||
this.list = [...this.list, ...res];
|
||||
if (res.length == 10) {
|
||||
this.form.status = 'loading';
|
||||
} else {
|
||||
this.is_end = true;
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
}, 500)
|
||||
|
||||
}
|
||||
},
|
||||
eeInfo(e) {
|
||||
uni.pro.navigateTo('my/member/memberinfo',{
|
||||
id: e.vip_id,
|
||||
lang:1
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #FFFFFF;
|
||||
}
|
||||
|
||||
.content {
|
||||
border-top: 16rpx solid #f7f7f7;
|
||||
padding: 28rpx;
|
||||
padding-bottom: 40rpx;
|
||||
|
||||
.flex-colum_image {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
|
||||
text {
|
||||
margin-top: 30rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.onecontentone {
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.flex-colum {
|
||||
.towcontentitem {
|
||||
margin-top: 22rpx;
|
||||
width: 96%;
|
||||
position: relative;
|
||||
height: 224rpx;
|
||||
padding: 32rpx;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.towcontentitemimage {
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 12rpx;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.towcontentitemone {
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
.towcontentitemoneimage {
|
||||
width: 76rpx;
|
||||
height: 76rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.towcontentitemonetext {
|
||||
width: 60%;
|
||||
margin-left: 16rpx;
|
||||
font-size: 32rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #422A07;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentitemtow {
|
||||
z-index: 10;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
bottom: 18rpx;
|
||||
padding:0 32rpx;
|
||||
// margin-top: 52rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #422A07;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
399
pages/my/member/memberinfo.vue
Normal file
399
pages/my/member/memberinfo.vue
Normal file
@@ -0,0 +1,399 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<view class="towcontentitem">
|
||||
<image class="towcontentitemimage" :src="data.img" mode="aspectFill"></image>
|
||||
<view class="fourcontentitemabsolute">
|
||||
<!-- 年卡会员 -->
|
||||
</view>
|
||||
<view class="towcontentitemone flex-start">
|
||||
<image class="towcontentitemoneimage" :src="data.store_avatar" mode="aspectFill"></image>
|
||||
<view class="towcontentitemonetext flex-colum-start">
|
||||
<text class="towcontentitemonetextone">{{data.title}}</text>
|
||||
<text class="towcontentitemonetexttow">{{data.show}}</text>
|
||||
</view>
|
||||
<view class="towcontentitemoneabsolute" @click="overlayshow = true">
|
||||
加购
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontentitemprogress">
|
||||
{{Number(data.user_sec_y_frequ)}}/{{Number(data.user_sec_z_frequ)}} 次
|
||||
</view>
|
||||
<view class="towcontentitemtow flex-between">
|
||||
<text class="towcontentitemtowetext">{{data.vip_number || ''}}</text>
|
||||
<text class="towcontentitemtowetext">{{data.end_time}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="therecontentitem">
|
||||
<view class="therecontentitemtext">
|
||||
会员详情
|
||||
</view>
|
||||
<view class="therecontentitemone">
|
||||
<!-- <view class="therecontentitemoneiten flex-between" @click="order">
|
||||
<text class="therecontentitemoneitentetxt">账单明细</text>
|
||||
<u-icon name="arrow-right" color="#808080" size="18"></u-icon>
|
||||
</view> -->
|
||||
<view class="therecontentitemoneiten flex-between" @click="overlayshow = true">
|
||||
<text class="therecontentitemoneitentetxt">订单明细</text>
|
||||
<u-icon name="arrow-right" color="#808080" size="18"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-overlay :show="overlayshow" @click="overlayshow = false">
|
||||
<view class="warp">
|
||||
<view class="rect" @tap.stop>
|
||||
<view class="onerect flex-center">
|
||||
<view>{{data.store_title}}</view>
|
||||
<u-icon @click="overlayshow = false" class="onerecticon" name="backspace" color="#000000"
|
||||
size="28"></u-icon>
|
||||
</view>
|
||||
<view class="towrect">
|
||||
商品
|
||||
</view>
|
||||
<view class="thererect flex-between">
|
||||
<view class="thererectone">
|
||||
{{data.title}}
|
||||
</view>
|
||||
<view class="thererecttow">
|
||||
<text>￥</text>{{data.price}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="fourrect flex-between">
|
||||
<view class="fourrectone">
|
||||
<text>共计:</text>￥{{data.price}}
|
||||
</view>
|
||||
<view class="fourrecttow" @tap="$u.debounce(showpopupclick,1000)">
|
||||
立即购买
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-overlay>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
overlayshow: false,
|
||||
numberbox: "",
|
||||
data: {}
|
||||
}
|
||||
},
|
||||
async onLoad(e) {
|
||||
console.log(e)
|
||||
let res = await this.api.reservationvipdetail({
|
||||
id: e.id
|
||||
})
|
||||
this.data = res
|
||||
console.log(this.data)
|
||||
},
|
||||
methods: {
|
||||
async showpopupclick() {
|
||||
try {
|
||||
let res = await this.api.useropenuserseccrd({
|
||||
id: this.data.id
|
||||
}) //判断是否支付成功
|
||||
if (res) {
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.requestPayment({
|
||||
provider: 'wxpay', //支付类型-固定值
|
||||
partnerid: res.payAppId, // 微信支付商户号
|
||||
timeStamp: res.payTimeStamp, // 时间戳（单位：秒）
|
||||
nonceStr: res.paynonceStr, // 随机字符串
|
||||
package: res.payPackage, // 固定值
|
||||
signType: res.paySignType, //固定值
|
||||
paySign: res.paySign, //签名
|
||||
success: (res) => {
|
||||
uni.showToast({
|
||||
title: "支付成功"
|
||||
})
|
||||
uni.redirectTo({
|
||||
url: "/my/member/index?e=" + 1,
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
setTimeout(res => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '支付失败'
|
||||
})
|
||||
uni.hideLoading()
|
||||
}, 2000)
|
||||
uni.redirectTo({
|
||||
url: "/my/member/index?e=" + 1,
|
||||
});
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
}
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
},
|
||||
order(e) {
|
||||
uni.pro.navigateTo('my/order/index', {
|
||||
e: 0
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 32rpx 28rpx;
|
||||
|
||||
.towcontentitem {
|
||||
margin-top: 22rpx;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
padding: 32rpx;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.fourcontentitemabsolute {
|
||||
z-index: 9;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
padding: 6rpx 28rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
text-shadow: 0px 6rpx 12rpx rgba(255, 255, 255, 0.19);
|
||||
background: linear-gradient(NaNdeg, #4A4A4A 0%, #919191 100%);
|
||||
border-radius: 0px 12rpx 0px 12rpx;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.towcontentitemimage {
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 12rpx;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.towcontentitemone {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
z-index: 9;
|
||||
|
||||
.towcontentitemoneimage {
|
||||
width: 76rpx;
|
||||
height: 76rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.towcontentitemoneabsolute {
|
||||
position: absolute;
|
||||
padding: 8rpx 44rpx;
|
||||
right: 0;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
background: linear-gradient(130deg, #F4AE46 0%, #EE9437 100%);
|
||||
box-shadow: 0px 4rpx 8rpx 2rpx rgba(243, 169, 67, 0.37);
|
||||
border-radius: 28rpx;
|
||||
}
|
||||
|
||||
.towcontentitemonetext {
|
||||
width: 80%;
|
||||
height: 76rpx;
|
||||
margin-left: 16rpx;
|
||||
|
||||
.towcontentitemonetextone {
|
||||
width: 80%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #422A07;
|
||||
}
|
||||
|
||||
.towcontentitemonetexttow {
|
||||
width: 80%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
width:400rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #422A07;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentitemprogressa {
|
||||
padding: 8rpx 44rpx;
|
||||
width: 50%;
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
margin-top: 54rpx;
|
||||
}
|
||||
|
||||
.towcontentitemprogress {
|
||||
position: relative;
|
||||
z-index: 99;
|
||||
margin-top: 24rpx;
|
||||
border-radius: 28rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.towcontentitemtow {
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
margin-top: 68rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #422A07;
|
||||
}
|
||||
}
|
||||
|
||||
.therecontentitem {
|
||||
margin-top: 32rpx;
|
||||
width: 100%;
|
||||
padding: 32rpx 32rpx 0 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 24rpx;
|
||||
|
||||
.therecontentitemtext {
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.therecontentitemone {
|
||||
.therecontentitemoneiten:nth-child(1) {
|
||||
border-top: none !important;
|
||||
}
|
||||
|
||||
.therecontentitemoneiten {
|
||||
padding: 32rpx 0;
|
||||
border-top: 1px solid #F7F7F7;
|
||||
|
||||
.therecontentitemoneitentetxt {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.warp {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
|
||||
.rect {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 60rpx 60rpx 0px 0px;
|
||||
padding: 48rpx 32rpx 32rpx 32rpx;
|
||||
|
||||
.onerect {
|
||||
position: relative;
|
||||
padding-bottom: 48rpx;
|
||||
|
||||
image {
|
||||
width: 124rpx;
|
||||
height: 124rpx;
|
||||
}
|
||||
|
||||
view {
|
||||
margin-left: 16rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.onerecticon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.towrect {
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.thererect {
|
||||
margin-top: 16rpx;
|
||||
|
||||
.thererectone {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.thererecttow {
|
||||
text {
|
||||
font-size: 16rpx;
|
||||
}
|
||||
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Heavy,
|
||||
PingFang SC;
|
||||
font-weight: 800;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.fourrect {
|
||||
margin-top: 44rpx;
|
||||
|
||||
.fourrectone {
|
||||
text {
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
font-size: 40rpx;
|
||||
font-family: PingFang SC-Bold,
|
||||
PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FC5F69;
|
||||
}
|
||||
|
||||
.fourrecttow {
|
||||
background: linear-gradient(143deg, #8689AF 0%, #494A5F 100%);
|
||||
border-radius: 34rpx;
|
||||
padding: 10rpx 44rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
564
pages/my/member/memberinfos.vue
Normal file
564
pages/my/member/memberinfos.vue
Normal file
@@ -0,0 +1,564 @@
|
||||
<template>
|
||||
<view class="content" :style="[theme]">
|
||||
<view class="towcontentitem">
|
||||
<image class="towcontentitemimage" :src="data.img" mode="aspectFill"></image>
|
||||
<view class="towcontentitemone flex-start">
|
||||
<view class="towcontentitemonetext flex-colum-start">
|
||||
<text class="towcontentitemonetextone" style="color: #fff;">{{data.title}}</text>
|
||||
<text class="towcontentitemonetexttow" style="color: #fff;">{{data.show}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontentitemtow flex-between">
|
||||
<text class="towcontentitemtowetext" style="color: #fff;">￥{{data.price}}<text
|
||||
class="towcontentitemtowetexts" style="color: #fff;">/{{data.frequ}}次</text></text>
|
||||
<text class="towcontentitemtowetext_s" style="color: #fff;">{{data.end_time}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="therecontentitem">
|
||||
<view class="therecontentitemtext">
|
||||
商品
|
||||
</view>
|
||||
<view class="therecontentitemtextitem flex-between">
|
||||
<view class="therecontentitemtextitem_left">
|
||||
{{data.title}}
|
||||
</view>
|
||||
<view class="therecontentitemtextitem_right">
|
||||
￥{{data.price}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="therecontentitemtextitemt_one">
|
||||
{{data.show}}
|
||||
</view>
|
||||
<view class="therecontentitemtext" style="margin-top: 14rpx;">
|
||||
权益
|
||||
</view>
|
||||
<view class="therecontentitemtextitemt_one">
|
||||
<text style="color: #333333;">{{data.frequ}}次</text>{{data.show}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="therecontentitem">
|
||||
<view class="therecontentitem_tow flex-start">
|
||||
手机号码<text>{{data.mobile}}</text>
|
||||
</view>
|
||||
<view class="therecontentitem_tows">
|
||||
该号码不会提供给商家，仅用于接收平台通知信息
|
||||
</view>
|
||||
</view>
|
||||
<view class="therecontentitem">
|
||||
<view class="therecontentitemtext">
|
||||
使用说明
|
||||
</view>
|
||||
<view class="therecontentitemtextthere" style="margin-top: 14rpx;margin-bottom: 30rpx;"
|
||||
v-html="data.notice">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="fixedview flex-between">
|
||||
<view class="fixedview_one flex-start">
|
||||
<view class="fixedview_oneone">
|
||||
应付金额：
|
||||
</view>
|
||||
<view class="fixedview_onetow flex-colum-start">
|
||||
<text>￥{{data.price}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fixedview_tow" @tap="$u.debounce(showpopupclick,1000)">
|
||||
立即付款
|
||||
</view>
|
||||
</view>
|
||||
<u-overlay :show="overlayshow" @click="overlayshow = false">
|
||||
<view class="warp">
|
||||
<view class="rect" @tap.stop>
|
||||
<view class="onerect flex-center">
|
||||
<view>【洗剪吹】新娘造型</view>
|
||||
<u-icon @click="overlayshow = false" class="onerecticon" name="backspace" color="#000000"
|
||||
size="28"></u-icon>
|
||||
</view>
|
||||
<view class="towrect">
|
||||
商品
|
||||
</view>
|
||||
<view class="thererect flex-between">
|
||||
<view class="thererectone">
|
||||
年卡会员
|
||||
</view>
|
||||
<view class="thererecttow">
|
||||
<text>￥</text>300
|
||||
</view>
|
||||
</view>
|
||||
<view class="fourrect flex-between">
|
||||
<view class="fourrectone">
|
||||
<text>共计:</text>￥300
|
||||
</view>
|
||||
<view class="fourrecttow">
|
||||
立即购买
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-overlay>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
overlayshow: false,
|
||||
numberbox: "",
|
||||
data: {
|
||||
mobile: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
theme() {
|
||||
return this.$store.getters.theme
|
||||
},
|
||||
},
|
||||
async onLoad(e) {
|
||||
console.log(e)
|
||||
let res = await this.api.reservationvipdetail({
|
||||
id: e.id
|
||||
})
|
||||
this.data = res
|
||||
this.data.notice = res.notice.replace(/\<img/g, '<img style="max-width:100%;height:auto" ');
|
||||
this.data.mobile = uni.cache.get('loginuser').userinfo.mobile
|
||||
},
|
||||
async onShow() {
|
||||
let res = await this.api.useruserinfo()
|
||||
uni.cache.set('loginuser', res);
|
||||
},
|
||||
mounted() {
|
||||
var query = uni.createSelectorQuery().in(this).select('.fixedview')
|
||||
query.boundingClientRect(ele => {
|
||||
var that = this;
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
that.height = (ele.height) + "px";
|
||||
that = null;
|
||||
}
|
||||
})
|
||||
}).exec();
|
||||
},
|
||||
methods: {
|
||||
async showpopupclick() {
|
||||
if (!uni.cache.get('loginuser').userinfo.mobile) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确认订单需要获取您的手机号',
|
||||
success: function(res) {
|
||||
if (res.confirm) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/my/setup/index'
|
||||
});
|
||||
} else if (res.cancel) {}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
try {
|
||||
let res = await this.api.useropenuserseccrd({
|
||||
id: this.data.id
|
||||
}) //判断是否支付成功
|
||||
if (res) {
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.requestPayment({
|
||||
provider: 'wxpay', //支付类型-固定值
|
||||
partnerid: res.payAppId, // 微信支付商户号
|
||||
timeStamp: res.payTimeStamp, // 时间戳（单位：秒）
|
||||
nonceStr: res.paynonceStr, // 随机字符串
|
||||
package: res.payPackage, // 固定值
|
||||
signType: res.paySignType, //固定值
|
||||
paySign: res.paySign, //签名
|
||||
success: (res) => {
|
||||
uni.showToast({
|
||||
title: "支付成功"
|
||||
})
|
||||
uni.redirectTo({
|
||||
url: "/my/member/index?e=" + 1,
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
setTimeout(res => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '支付失败'
|
||||
})
|
||||
uni.hideLoading()
|
||||
}, 2000)
|
||||
uni.redirectTo({
|
||||
url: "/my/member/index?e=" + 1,
|
||||
});
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
}
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
order(e) {
|
||||
uni.pro.navigateTo('my/order/index', {
|
||||
e: 0
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 32rpx 28rpx;
|
||||
|
||||
.towcontentitem {
|
||||
margin-top: 22rpx;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
padding: 32rpx;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.fourcontentitemabsolute {
|
||||
z-index: 9;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
padding: 6rpx 28rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
text-shadow: 0px 6rpx 12rpx rgba(255, 255, 255, 0.19);
|
||||
background: linear-gradient(NaNdeg, #4A4A4A 0%, #919191 100%);
|
||||
border-radius: 0px 12rpx 0px 12rpx;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.towcontentitemimage {
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 12rpx;
|
||||
z-index: 5;
|
||||
}
|
||||
|
||||
.towcontentitemone {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
z-index: 9;
|
||||
|
||||
.towcontentitemoneimage {
|
||||
width: 76rpx;
|
||||
height: 76rpx;
|
||||
}
|
||||
|
||||
.towcontentitemoneabsolute {
|
||||
position: absolute;
|
||||
padding: 8rpx 44rpx;
|
||||
right: 0;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
background: linear-gradient(130deg, #F4AE46 0%, #EE9437 100%);
|
||||
box-shadow: 0px 4rpx 8rpx 2rpx rgba(243, 169, 67, 0.37);
|
||||
border-radius: 28rpx;
|
||||
}
|
||||
|
||||
.towcontentitemonetext {
|
||||
margin-left: 16rpx;
|
||||
|
||||
.towcontentitemonetextone {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #422A07;
|
||||
}
|
||||
|
||||
.towcontentitemonetexttow {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-top: 16rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #422A07;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentitemprogressa {
|
||||
padding: 8rpx 44rpx;
|
||||
width: 50%;
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
margin-top: 54rpx;
|
||||
}
|
||||
|
||||
.towcontentitemprogress {
|
||||
margin-top: 24rpx;
|
||||
background: linear-gradient(318deg, #6E6E6E 0%, #404040 100%);
|
||||
box-shadow: 0px 4rpx 8rpx 2rpx #8D8D8D;
|
||||
border-radius: 28rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.towcontentitemtow {
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
margin-top: 68rpx;
|
||||
font-size: 24rpx;
|
||||
|
||||
.towcontentitemtowetext {
|
||||
font-size: 30rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
|
||||
.towcontentitemtowetexts {
|
||||
font-size: 20rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentitemtowetext_s {
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.therecontentitem {
|
||||
margin-top: 32rpx;
|
||||
width: 100%;
|
||||
padding: 32rpx 32rpx 0 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.therecontentitem_tow {
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #999999;
|
||||
|
||||
text {
|
||||
margin-left: 20rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.therecontentitem_tows {
|
||||
margin-top: 16rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #999999;
|
||||
padding-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.therecontentitemtext {
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.therecontentitemtextthere {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.therecontentitemtextitem {
|
||||
margin-top: 24rpx;
|
||||
|
||||
.therecontentitemtextitem_left {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.therecontentitemtextitem_right {
|
||||
font-size: 32rpx;
|
||||
font-family: Roboto-Bold, Roboto;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.therecontentitemtextitemt_one {
|
||||
margin-top: 6rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
padding-bottom: 16rpx;
|
||||
border-bottom: 1rpx dashed #F7F7F7;
|
||||
}
|
||||
}
|
||||
|
||||
.fixedview {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 24rpx 28rpx;
|
||||
background: #FFFFFF;
|
||||
|
||||
.fixedview_one {
|
||||
.fixedview_oneone {
|
||||
font-size: 28rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.fixedview_onetow {
|
||||
font-size: 44rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #F45C4C;
|
||||
font-weight: bold;
|
||||
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fixedview_tow {
|
||||
background: var(--bg-color-button);
|
||||
border-radius: 34rpx;
|
||||
padding: 10rpx 44rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.warp {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
|
||||
.rect {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 60rpx 60rpx 0px 0px;
|
||||
padding: 48rpx 32rpx 32rpx 32rpx;
|
||||
|
||||
.onerect {
|
||||
position: relative;
|
||||
padding-bottom: 48rpx;
|
||||
|
||||
image {
|
||||
width: 124rpx;
|
||||
height: 124rpx;
|
||||
}
|
||||
|
||||
view {
|
||||
margin-left: 16rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.onerecticon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.towrect {
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.thererect {
|
||||
margin-top: 16rpx;
|
||||
|
||||
.thererectone {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.thererecttow {
|
||||
text {
|
||||
font-size: 16rpx;
|
||||
}
|
||||
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Heavy,
|
||||
PingFang SC;
|
||||
font-weight: 800;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.fourrect {
|
||||
margin-top: 44rpx;
|
||||
|
||||
.fourrectone {
|
||||
text {
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
font-size: 40rpx;
|
||||
font-family: PingFang SC-Bold,
|
||||
PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FC5F69;
|
||||
}
|
||||
|
||||
.fourrecttow {
|
||||
background: linear-gradient(143deg, #8689AF 0%, #494A5F 100%);
|
||||
border-radius: 34rpx;
|
||||
padding: 10rpx 44rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
339
pages/my/member/memberone.vue
Normal file
339
pages/my/member/memberone.vue
Normal file
@@ -0,0 +1,339 @@
|
||||
<template>
|
||||
<view class="content" :style="[theme]">
|
||||
<view class="towcontentitem">
|
||||
<image class="towcontentitemimage" src="https://ointmentweapp.oss-cn-beijing.aliyuncs.com/my/recharges.png"
|
||||
mode="widthFix"></image>
|
||||
<!-- <view class="fourcontentitemabsolute">
|
||||
{{memberlist.store_title}}
|
||||
</view> -->
|
||||
<view class="towcontentitemone flex-start">
|
||||
<image class="towcontentitemoneimage" :src="memberlist.store_avatar" mode="aspectFill"></image>
|
||||
<view class="towcontentitemonetext flex-colum-start">
|
||||
<text class="towcontentitemonetextone">{{nickname || '暂无昵称'}}</text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="towcontentitemprogress">
|
||||
可用余额:{{memberlist.money || '0.00'}}
|
||||
<!-- <text style="font-size: 16rpx; color:#000 ; margin-left: 10rpx;">冻结金额:{{memberlist.freeze_money}}</text> -->
|
||||
<!-- <view class="towcontentitemoneabsolute">
|
||||
加购
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="towcontentitemtow flex-between">
|
||||
<text class="towcontentitemtowetext">{{memberlist.vip_number}}</text>
|
||||
<!-- <text class="towcontentitemtowetext" style="color: #fff;">保洁清洗卡</text> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="therecontent">
|
||||
<input type="number" v-model="amount" placeholder="自定义金额">
|
||||
</view>
|
||||
<view class="fourcontent flex-start">
|
||||
<view class="fourcontentlnage" v-for="(item,index) in listdata" :key="index">
|
||||
<view class="flex-colum" :class="index == inputshow?'fourcontentitems':'fourcontentitem'"
|
||||
@click="clickinput(item,index)">
|
||||
<text>充{{item.amount}}元</text>
|
||||
<text style="margin-top: 10rpx;">送{{item.deliver}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fivecontent" @click="userbalancerechangesub">
|
||||
立即充值
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
nickname: uni.cache.get('loginuser').userinfo.nickname,
|
||||
inputshow: 0,
|
||||
memberlist: {},
|
||||
listdata: [],
|
||||
amount: '',
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
// console.log(e)
|
||||
// this.memberlist = e
|
||||
this.useruserbalance()
|
||||
},
|
||||
onShow() {
|
||||
this.userbalancerechange()
|
||||
},
|
||||
computed: {
|
||||
theme() {
|
||||
return this.$store.getters.theme
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
async useruserbalance(){
|
||||
let res = await this.api.useruserbalance({
|
||||
store_id: uni.cache.get('store_id') // 判断显示哪家的作品,
|
||||
})
|
||||
this.memberlist = res
|
||||
},
|
||||
async userbalancerechange() {
|
||||
let res = await this.api.userbalancerechange({
|
||||
store_id: uni.cache.get('store_id') // 判断显示哪家的作品,
|
||||
})
|
||||
this.listdata = res
|
||||
this.amount = res[0].amount
|
||||
},
|
||||
async userbalancerechangesub() {
|
||||
if (this.amount == null || this.amount == '') {
|
||||
uni.showToast({
|
||||
title: '金额不能为空',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
let res = await this.api.userbalancerechangesub({
|
||||
amount: this.amount,
|
||||
store_id: this.memberlist.store_id
|
||||
})
|
||||
if (res) {
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.requestPayment({
|
||||
provider: 'wxpay', //支付类型-固定值
|
||||
partnerid: res.payAppId, // 微信支付商户号
|
||||
timeStamp: res.payTimeStamp, // 时间戳（单位：秒）
|
||||
nonceStr: res.paynonceStr, // 随机字符串
|
||||
package: res.payPackage, // 固定值
|
||||
signType: res.paySignType, //固定值
|
||||
paySign: res.paySign, //签名
|
||||
success: (res) => {
|
||||
uni.showToast({
|
||||
title: "支付成功"
|
||||
})
|
||||
uni.navigateBack()
|
||||
},
|
||||
fail: (err) => {
|
||||
setTimeout(res => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '支付失败'
|
||||
})
|
||||
uni.hideLoading()
|
||||
}, 2000)
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
clickinput(a, b) {
|
||||
console.log(a, b)
|
||||
this.inputshow = b
|
||||
this.amount = a.amount
|
||||
},
|
||||
eeInfo(e) {
|
||||
uni.pro.navigateTo('my/member/memberinfo', {
|
||||
id: e,
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 0 28rpx;
|
||||
|
||||
.towcontentitem {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
padding: 32rpx;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.fourcontentitemabsolute {
|
||||
z-index: 9;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
padding: 6rpx 28rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
text-shadow: 0px 6rpx 12rpx rgba(255, 255, 255, 0.19);
|
||||
background: linear-gradient(NaNdeg, #4A4A4A 0%, #919191 100%);
|
||||
border-radius: 0px 12rpx 0px 12rpx;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.towcontentitemimage {
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 12rpx;
|
||||
z-index: 5;
|
||||
}
|
||||
|
||||
.towcontentitemone {
|
||||
margin-top: 42rpx;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
z-index: 9;
|
||||
|
||||
.towcontentitemoneimage {
|
||||
width: 76rpx;
|
||||
height: 76rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.towcontentitemonetext {
|
||||
height: 76rpx;
|
||||
margin-left: 16rpx;
|
||||
|
||||
.towcontentitemonetextone {
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #422A07;
|
||||
}
|
||||
|
||||
.towcontentitemonetexttow {
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #422A07;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentitemprogressa {
|
||||
padding: 8rpx 44rpx;
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
margin-top: 54rpx;
|
||||
}
|
||||
|
||||
.towcontentitemprogress {
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
margin-top: 24rpx;
|
||||
border-radius: 28rpx;
|
||||
font-size: 32rpx;
|
||||
height: 56rpx;
|
||||
line-height: 56rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
|
||||
.towcontentitemoneabsolute {
|
||||
position: absolute;
|
||||
padding: 0 44rpx;
|
||||
height: 56rpx;
|
||||
line-height: 56rpx;
|
||||
top: 0;
|
||||
right: 0;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
background: linear-gradient(130deg, #F4AE46 0%, #EE9437 100%);
|
||||
box-shadow: 0px 4rpx 8rpx 2rpx rgba(243, 169, 67, 0.37);
|
||||
border-radius: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentitemtow {
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
margin-top: 42rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #422A07;
|
||||
}
|
||||
}
|
||||
|
||||
.therecontent {
|
||||
margin-top: 32rpx;
|
||||
position: relative;
|
||||
padding: 22rpx 32rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8rpx;
|
||||
|
||||
input {
|
||||
padding-left: 30rpx;
|
||||
text-align: right;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.therecontent::after {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 32rpx;
|
||||
transform: translateY(-50%);
|
||||
content: '￥';
|
||||
display: inline-block;
|
||||
width: 28rpx;
|
||||
height: 40rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.fourcontent {
|
||||
.fourcontentlnage {
|
||||
width: 33.33%;
|
||||
|
||||
.fourcontentitem {
|
||||
margin: 24rpx 10rpx;
|
||||
padding: 16rpx 0;
|
||||
text-align: center;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8rpx;
|
||||
border: 1rpx solid #333333;
|
||||
font-size: 28rpx;
|
||||
font-family: Roboto-Medium, Roboto;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.fourcontentitems {
|
||||
margin: 24rpx 10rpx;
|
||||
padding: 16rpx 0;
|
||||
text-align: center;
|
||||
border-radius: 8rpx;
|
||||
background: var(--bg-color-button);
|
||||
font-size: 28rpx;
|
||||
font-family: Roboto-Medium, Roboto;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.fivecontent {
|
||||
margin-top: 62rpx;
|
||||
padding: 20rpx 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
font-size: 36rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
border-radius: 8rpx;
|
||||
background: var(--bg-color-button);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
425
pages/my/order/applylrefund.vue
Normal file
425
pages/my/order/applylrefund.vue
Normal file
@@ -0,0 +1,425 @@
|
||||
<template>
|
||||
<view class="index">
|
||||
<view class="boxcontent">
|
||||
<u-steps :current="datalist.status.status_b" dot direction="column">
|
||||
<u-steps-item v-for="(item,index) in datalist.status.refund" :key="index" :title="item"></u-steps-item>
|
||||
</u-steps>
|
||||
</view>
|
||||
<view class="onecontent" style="margin-top: 32rpx;">
|
||||
<view class="onecontentone_one">
|
||||
退款信息
|
||||
</view>
|
||||
<view class="onecontentone_otow flex-between" @click="detailsInfo(datalist.store_service_id)">
|
||||
<image :src="datalist.order_img" mode="aspectFill"></image>
|
||||
<view class="flex-colum-start">
|
||||
<view class="onecontentone">
|
||||
{{datalist.order_title}}
|
||||
</view>
|
||||
<view class="onecontenttow">
|
||||
<view class="onecontenttowabsolute">
|
||||
x{{datalist.number}}
|
||||
</view>
|
||||
<text style="font-size:28rpx;">¥</text>{{datalist.order_price}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontentone_item flex-between">
|
||||
<view class="onecontentone_itemone">
|
||||
退款原因
|
||||
</view>
|
||||
<view class="onecontentone_itemtow">
|
||||
{{datalist.reason}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontentone_item flex-between">
|
||||
<view class="onecontentone_itemone">
|
||||
退款金额
|
||||
</view>
|
||||
<view class="onecontentone_itemtow">
|
||||
{{datalist.order_price}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontentone_item flex-between">
|
||||
<view class="onecontentone_itemone">
|
||||
申请件数
|
||||
</view>
|
||||
<view class="onecontentone_itemtow">
|
||||
{{datalist.number}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontentone_item flex-between">
|
||||
<view class="onecontentone_itemone">
|
||||
申请时间
|
||||
</view>
|
||||
<view class="onecontentone_itemtow">
|
||||
{{datalist.createtime}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontentone_item flex-between">
|
||||
<view class="onecontentone_itemone">
|
||||
退款编号
|
||||
</view>
|
||||
<view class="onecontentone_itemtow flex-start">
|
||||
{{datalist.out_trade_no}}
|
||||
<text class="therecontentfive_box" @click="copy(datalist.out_trade_no)">复制</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view :style="{height:height}">
|
||||
|
||||
</view>
|
||||
<view class="fixedview flex-between" v-if="datalist.status.status == 0 || datalist.status.status == 2">
|
||||
<view class="fixedview_one flex-start">
|
||||
<!-- <view class="fixedview_oneone">
|
||||
应付金额：
|
||||
</view>
|
||||
<view class="fixedview_onetow">
|
||||
<text>¥</text>11
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="fixedview_tow" @click="cancelrefund">
|
||||
取消退款
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadImage from "@/js_sdk/yushijie-ossutil/ossutil/uploadFile.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
height: '',
|
||||
datalist: {
|
||||
status: {
|
||||
status_b: '',
|
||||
status: ''
|
||||
}
|
||||
},
|
||||
order_id: ""
|
||||
}
|
||||
},
|
||||
async onLoad(e) {
|
||||
this.order_id = e.id
|
||||
try {
|
||||
let res = await this.api.orderrefunddetail({
|
||||
order_id: this.order_id
|
||||
})
|
||||
if (res) {
|
||||
this.datalist = res
|
||||
}
|
||||
} catch (e) {}
|
||||
// this.generate()
|
||||
},
|
||||
mounted() {
|
||||
var query = uni.createSelectorQuery().in(this).select('.fixedview')
|
||||
query.boundingClientRect(ele => {
|
||||
var that = this;
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
that.height = (ele.height) + "px";
|
||||
that = null;
|
||||
}
|
||||
})
|
||||
}).exec();
|
||||
},
|
||||
methods: {
|
||||
detailsInfo(e) { //查看订单详情
|
||||
uni.pro.navigateTo('order/orderInfo', {
|
||||
id: e,
|
||||
})
|
||||
},
|
||||
copy(value) {
|
||||
//提示模板
|
||||
uni.setClipboardData({
|
||||
data: value, //要被复制的内容
|
||||
success: () => { //复制成功的回调函数
|
||||
uni.showToast({
|
||||
title: '复制成功'
|
||||
})
|
||||
}
|
||||
});
|
||||
},
|
||||
async orderorderrefundcancel() {
|
||||
let res = await this.api.orderorderrefundcancel({
|
||||
order_id: this.datalist.order_id
|
||||
})
|
||||
if (res) {
|
||||
uni.showToast({
|
||||
title: '成功取消退款',
|
||||
icon: 'none'
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.redirectTo({
|
||||
url: '/pages/my/order/index?e=0'
|
||||
});
|
||||
}, 1500);
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
cancelrefund() {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确定取消退款吗?',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
this.orderorderrefundcancel()
|
||||
} else if (res.cancel) {}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F6F6F6;
|
||||
}
|
||||
|
||||
.index {
|
||||
padding: 32rpx 28rpx;
|
||||
|
||||
.boxcontent {
|
||||
padding: 24rpx 32rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
|
||||
.onecontent {
|
||||
width: 100%;
|
||||
padding: 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.onecontentone_one {
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.onecontentone_otow {
|
||||
margin-top: 32rpx;
|
||||
|
||||
image {
|
||||
width: 176rpx;
|
||||
height: 176rpx;
|
||||
}
|
||||
|
||||
.flex-colum-start {
|
||||
flex: auto;
|
||||
margin-left: 20rpx;
|
||||
height: 176rpx;
|
||||
justify-content: space-around;
|
||||
|
||||
.onecontentone {
|
||||
width: 400rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.onecontenttow {
|
||||
position: relative;
|
||||
margin-top: 16rpx;
|
||||
width: 100%;
|
||||
font-size: 40rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
|
||||
.onecontenttowabsolute {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
font-size: 28rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.onecontentone_item {
|
||||
margin-top: 16rpx;
|
||||
width: 100%;
|
||||
|
||||
.onecontentone_itemone {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.onecontentone_itemtow {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
|
||||
.therecontentfive_box {
|
||||
padding: 6rpx 10rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #666666;
|
||||
background: #FFFFFF;
|
||||
margin-left: 6rpx;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid #D5D5D5;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fixedview {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 24rpx 28rpx;
|
||||
background: #FFFFFF;
|
||||
|
||||
.fixedview_one {
|
||||
.fixedview_oneone {
|
||||
font-size: 28rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.fixedview_onetow {
|
||||
font-size: 44rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #F45C4C;
|
||||
font-weight: bold;
|
||||
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fixedview_tow {
|
||||
background: linear-gradient(143deg, #8689AF 0%, #494A5F 100%);
|
||||
border-radius: 34rpx;
|
||||
padding: 10rpx 44rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.buoot {
|
||||
margin: 40rpx auto;
|
||||
width: 80%;
|
||||
padding: 16rpx 0;
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
background: linear-gradient(115deg, #7E81A5 0%, #4D4E64 100%);
|
||||
border-radius: 40rpx;
|
||||
}
|
||||
|
||||
.therecontent {
|
||||
margin-top: 24rpx;
|
||||
padding: 32rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 18rpx;
|
||||
|
||||
.therecontentone {
|
||||
width: 100%;
|
||||
padding: 10rpx 0;
|
||||
border-bottom: 1px solid #F7F7F7;
|
||||
|
||||
.therecontentone_one {
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.therecontentone_text {
|
||||
flex: auto;
|
||||
margin-left: 20rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.fourcontent_items {
|
||||
position: relative;
|
||||
margin-top: 16rpx;
|
||||
margin-left: 20rpx;
|
||||
width: 112rpx;
|
||||
height: 112rpx;
|
||||
background: #f9f9f9;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.fourcontent {
|
||||
.fourcontent_item {
|
||||
position: relative;
|
||||
margin-top: 16rpx;
|
||||
margin-left: 20rpx;
|
||||
width: 112rpx;
|
||||
height: 112rpx;
|
||||
border-radius: 16rpx;
|
||||
|
||||
image {
|
||||
width: 112rpx;
|
||||
height: 112rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.fourcontent_itemtext {
|
||||
position: absolute;
|
||||
top: 0rpx;
|
||||
right: 0rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.entowakst {
|
||||
font-size: 28rpx;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.therecontentfive_box {
|
||||
padding: 6rpx 10rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #666666;
|
||||
background: #FFFFFF;
|
||||
margin-left: 6rpx;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid #D5D5D5;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
838
pages/my/order/cporderinfo.vue
Normal file
838
pages/my/order/cporderinfo.vue
Normal file
@@ -0,0 +1,838 @@
|
||||
<template>
|
||||
<view class="index">
|
||||
<view class="onecontent">
|
||||
<view class="onecontentone flex-start">
|
||||
<image class="onecontentone_image" :src="listdata.img" mode="aspectFill"></image>
|
||||
<view class="onecontentone_one flex-colum-start">
|
||||
<text class="onecontentone_one_top">{{listdata.title}}</text>
|
||||
<view class="onecontentone_one_view"><text>¥</text>{{listdata.price}}</view>
|
||||
<!-- <view class="onecontentone_one_ts" @click="infoshow = true">
|
||||
查看详情
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="onecontenttow ">
|
||||
<view class="onecontenttowone flex-start">
|
||||
<view class="onecontenttowone_one">
|
||||
预约时间<text>（必填）</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontenttowtow flex-between">
|
||||
<view class="onecontenttowtow_item flex-between">
|
||||
<view class=" flex-colum" v-for="(item,index) in reservationlist" :key="index"
|
||||
:class="reservationshow == index ? 'onecontenttowtow_item_ones':'onecontenttowtow_item_one'"
|
||||
@click="reservation(item,index)">
|
||||
<text class="onecontenttowtow_item_one_textone">{{item.week}}</text>
|
||||
<text class="onecontenttowtow_item_one_texttow">{{item.date.slice(5,10)}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontenttowtow_left flex-colum" @click="calendarshow = true">
|
||||
<u-icon name="calendar" color="#b4b4b4" size="20"></u-icon>
|
||||
<text class="onecontenttowtow_lefttext">选择</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontenttowthere flex-start">
|
||||
<view v-for="(item,index) in 14" :key="index" @click="clicktime(item,index)"
|
||||
:class="timeshow == index?'onecontenttowthere_items':'onecontenttowthere_item'">
|
||||
10:00
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontenttere">
|
||||
<view class="onecontentterewone flex-start">
|
||||
<view class="onecontenttereone_one">
|
||||
发型师
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontentterewtow flex-start">
|
||||
<view class="onecontentterewtow_item flex-colum" v-for="(item,index) in 1">
|
||||
<image src="@/static/logo.png" mode="aspectFill"></image>
|
||||
<text>John</text>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="introduction">
|
||||
<view class="introduction_one">
|
||||
【服务简介}
|
||||
</view>
|
||||
<view class="introduction_yow" v-html="listdata.details">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="onecontentfour">
|
||||
<view class="onecontentfourone flex-start">
|
||||
<view class="onecontentfourone_one">
|
||||
备注
|
||||
</view>
|
||||
</view>
|
||||
<u--textarea v-model="textarea" placeholder="请输入内容" autoHeight></u--textarea>
|
||||
</view> -->
|
||||
<u-overlay :show="infoshow" @click="infoshow = false">
|
||||
<view class="infowarp">
|
||||
<view class="inforect" @tap.stop>
|
||||
<view class="onerect flex-start">
|
||||
<view>服务详情</view>
|
||||
<u-icon @click="infoshow = false" class="onerecticon" name="backspace" color="#000000"
|
||||
size="28"></u-icon>
|
||||
</view>
|
||||
<view class="infotowrect flex-start">
|
||||
<image src="@/static/logo.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="infothererect flex-colum-start">
|
||||
<view class="infothererect_one">
|
||||
【洗剪吹】新娘造型
|
||||
</view>
|
||||
<view class="infothererect_one">
|
||||
¥120
|
||||
</view>
|
||||
</view>
|
||||
<view class="infofourrect">
|
||||
<view class="infofourrect_one">
|
||||
【服务简介
|
||||
</view>
|
||||
<view class="infofourrect_yow">
|
||||
烫发、编发、洗头、定型。
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-overlay>
|
||||
<u-overlay :show="overlayshow" @click="overlayshow = false">
|
||||
<view class="warp">
|
||||
<view class="rect" @tap.stop>
|
||||
<view class="onerect flex-start">
|
||||
<image class="onecontentone_image" :src="listdata.img" mode="aspectFill"></image>
|
||||
<view class="nonecontentone_view">{{listdata.title}}</view>
|
||||
<view class="onerecticon">
|
||||
<u-icon @click="overlayshow = false" name="backspace" color="#000000" size="28"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="towrect">
|
||||
<view class="towrect_one">
|
||||
预约时间：2023-06-16
|
||||
</view>
|
||||
<view class="towrect_tow">
|
||||
<text>10:00</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="thererect flex-between">
|
||||
<view class="thererect_one">
|
||||
预约服务
|
||||
</view>
|
||||
<view class="thererect_tow">
|
||||
<u-number-box v-model="numberbox" button-size="24" color="#ffffff" bgColor="#9397c1"
|
||||
iconStyle="color: #fff" integer @change="numberboxchange"></u-number-box>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="fuorrect flex-between">
|
||||
<view class="fuorrect_one">
|
||||
合计
|
||||
</view>
|
||||
<view class="fuorrect_tow">
|
||||
¥{{listdata.price}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="fvirect flex-center" @click="overlayshowclick">
|
||||
确定
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-overlay>
|
||||
<u-calendar mode="single" @confirm="confirm" :show="calendarshow" @close="calendarshow = false"></u-calendar>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
overlayshow: false,
|
||||
infoshow: false,
|
||||
numberbox: "",
|
||||
height: '',
|
||||
timeshow: '',
|
||||
textarea: '',
|
||||
reservationshow: 0,
|
||||
calendarshow: false,
|
||||
reservationlist: [],
|
||||
inifid: '',
|
||||
listdata: {}
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
this.inifid = e.id
|
||||
this.confirm()
|
||||
this.reservationdetail()
|
||||
|
||||
},
|
||||
mounted() {
|
||||
var query = uni.createSelectorQuery().in(this).select('.fixedview')
|
||||
query.boundingClientRect(ele => {
|
||||
var that = this;
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
that.height = (ele.height) + "px";
|
||||
that = null;
|
||||
}
|
||||
})
|
||||
}).exec();
|
||||
},
|
||||
methods: {
|
||||
async reservationdetail() {
|
||||
let res = await this.api.reservationdetail({
|
||||
id: this.inifid
|
||||
})
|
||||
this.listdata = res
|
||||
this.listdata.details = res.details.replace(/\<img/g, '<img style="max-width:100%;height:auto" ');
|
||||
console.log(this.listdata)
|
||||
},
|
||||
reservation(a, b) {
|
||||
this.reservationshow = b
|
||||
console.log(a, b)
|
||||
},
|
||||
clicktime(a, b) {
|
||||
this.timeshow = b
|
||||
console.log(a, b)
|
||||
},
|
||||
numberboxchange(e) {
|
||||
console.log('当前值为: ' + e.value)
|
||||
},
|
||||
async overlayshowclick() {
|
||||
let res = await this.api.useruserinfo() //p判断是否完成手机号
|
||||
uni.cache.set('loginuser', res);
|
||||
this.overlayshow = false
|
||||
if (res.userinfo.mobile) {
|
||||
uni.pro.navigateTo('order/confirm', {
|
||||
id: this.inifid
|
||||
})
|
||||
} else {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确认订单需要获取您的手机号',
|
||||
success: function(res) {
|
||||
if (res.confirm) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/my/setup/index'
|
||||
});
|
||||
} else if (res.cancel) {}
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
confirm(e) {
|
||||
if (e) {
|
||||
this.calendarshow = false
|
||||
console.log(new Date(e[0]));
|
||||
var now = new Date(e[0]);
|
||||
} else {
|
||||
//获取当前年月日
|
||||
var now = new Date();
|
||||
// var year = now.getFullYear(); //得到年份
|
||||
// var month = now.getMonth() + 1; //得到月份
|
||||
// var date = now.getDate(); //得到日期
|
||||
// data = year + "年" + month + "月" + date + "日";
|
||||
}
|
||||
this.reservationlist = []
|
||||
for (let i = 0; i < 7; i++) {
|
||||
var date = new Date(now.getTime() + i * 24 * 3600 * 1000);
|
||||
var year = date.getFullYear();
|
||||
var month = (date.getMonth() + 1) > 9 ? (date.getMonth() + 1) : '0' + (date.getMonth() + 1);
|
||||
var day = (date.getDate()) > 9 ? (date.getDate()) : '0' + (date.getDate());
|
||||
var dt2 = new Date(now.getTime() + i * 24 * 3600 * 1000);
|
||||
var weekDay = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
|
||||
// var weekDays = ["sun", "mon", "tue", "wed", "thu", "fri", "sat"];
|
||||
this.reservationlist.push({
|
||||
date: year + "-" + month + "-" + day,
|
||||
// date: month + "-" + day,
|
||||
// day: day,
|
||||
// weekday: weekDays[dt2.getDay()],
|
||||
week: weekDay[dt2.getDay()],
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F6F6F6;
|
||||
}
|
||||
|
||||
/deep/ .mystyle {
|
||||
width: 100% !important;
|
||||
height: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.index {
|
||||
padding: 32rpx 28rpx;
|
||||
|
||||
.onecontent {
|
||||
width: 100%;
|
||||
padding: 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.onecontentone {
|
||||
flex-wrap: nowrap;
|
||||
font-size: 32rpx;
|
||||
font-family: SourceHanSansCN-Medium-, SourceHanSansCN-Medium;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
|
||||
.onecontentone_image {
|
||||
width: 176rpx;
|
||||
height: 176rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.nonecontentone_view {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.onecontentone_one {
|
||||
position: relative;
|
||||
justify-content: space-evenly;
|
||||
flex: 1;
|
||||
margin-left: 24rpx;
|
||||
height: 176rpx;
|
||||
|
||||
.onecontentone_one_ts {
|
||||
padding: 8rpx 22rpx;
|
||||
position: absolute;
|
||||
top: 70%;
|
||||
transform: translateY(-50%);
|
||||
right: 0;
|
||||
background: #F7F7F7;
|
||||
border-radius: 28rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.onecontentone_one_top {
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.onecontentone_one_view {
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
font-size: 40rpx;
|
||||
font-family: SourceHanSansCN-Bold-,
|
||||
SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.onecontenttow {
|
||||
margin-top: 24rpx;
|
||||
width: 100%;
|
||||
padding: 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.onecontenttowone::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 4rpx;
|
||||
height: 24rpx;
|
||||
background: #1A1A1A;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
.onecontenttowone {
|
||||
.onecontenttowone_one {
|
||||
margin-left: 16rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
|
||||
text {
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.onecontenttowtow {
|
||||
margin-top: 32rpx;
|
||||
|
||||
.onecontenttowtow_item {
|
||||
flex: 1;
|
||||
flex-wrap: nowrap;
|
||||
|
||||
.onecontenttowtow_item_one:nth-child(1) {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.onecontenttowtow_item_one {
|
||||
padding: 6rpx;
|
||||
|
||||
.onecontenttowtow_item_one_textone {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.onecontenttowtow_item_one_texttow {
|
||||
margin-top: 5rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.onecontenttowtow_item_ones {
|
||||
padding: 6rpx;
|
||||
border-radius: 10rpx;
|
||||
background: #1A1A1A;
|
||||
|
||||
.onecontenttowtow_item_one_textone {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.onecontenttowtow_item_one_texttow {
|
||||
margin-top: 5rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.onecontenttowtow_left {
|
||||
border-left: 1rpx solid #f9f9f9;
|
||||
background: #FFFFFF;
|
||||
padding-left: 24rpx;
|
||||
box-shadow: -2rpx 0px 4rpx 2rpx rgba(193, 193, 193, 0.09);
|
||||
|
||||
.onecontenttowtow_lefttext {
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.onecontenttowthere {
|
||||
.onecontenttowthere_item {
|
||||
width: 20%;
|
||||
margin: 16rpx 2.5%;
|
||||
text-align: center;
|
||||
background: #F7F7F7;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid #F7F7F7;
|
||||
padding: 8rpx 26rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.onecontenttowthere_items {
|
||||
width: 20%;
|
||||
margin: 16rpx 2.5%;
|
||||
background: #F7F7F7;
|
||||
border-radius: 8rpx;
|
||||
border: 1rpx solid var(--bg-color-buttontow);
|
||||
padding: 8rpx 26rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: var(--bg-color-buttontow);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.onecontenttere {
|
||||
margin-top: 24rpx;
|
||||
width: 100%;
|
||||
padding: 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.onecontentterewone::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 4rpx;
|
||||
height: 24rpx;
|
||||
background: #1A1A1A;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
.onecontentterewone {
|
||||
.onecontenttereone_one {
|
||||
margin-left: 16rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
|
||||
text {
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.onecontentterewtow {
|
||||
|
||||
|
||||
.onecontentterewtow_item {
|
||||
margin: 0 15rpx;
|
||||
margin-top: 22rpx;
|
||||
padding: 20rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid #F7F7F7;
|
||||
|
||||
image {
|
||||
width: 76rpx;
|
||||
height: 76rpx;
|
||||
}
|
||||
|
||||
text {
|
||||
margin-top: 6rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.introduction {
|
||||
margin-top: 24rpx;
|
||||
width: 100%;
|
||||
padding: 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.introduction_one {
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.introduction_yow {
|
||||
margin-top: 18rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #1A1A1A;
|
||||
width: 100%;
|
||||
|
||||
/deep/ [alt] {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/deep/ img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/deep/ p {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.onecontentfour {
|
||||
margin-top: 24rpx;
|
||||
width: 100%;
|
||||
padding: 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.onecontentfourone::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 4rpx;
|
||||
height: 24rpx;
|
||||
background: #1A1A1A;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
.onecontentfourone {
|
||||
padding-bottom: 16rpx;
|
||||
|
||||
.onecontentfourone_one {
|
||||
margin-left: 16rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
|
||||
text {
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.fixedview {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 24rpx 28rpx;
|
||||
background: #FFFFFF;
|
||||
|
||||
.fixedview_one {
|
||||
.fixedview_oneone {
|
||||
font-size: 28rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.fixedview_onetow {
|
||||
font-size: 44rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #F45C4C;
|
||||
font-weight: bold;
|
||||
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fixedview_tow {
|
||||
background: linear-gradient(143deg, #8689AF 0%, #494A5F 100%);
|
||||
border-radius: 34rpx;
|
||||
padding: 10rpx 44rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.infowarp {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
|
||||
.inforect {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 60rpx 60rpx 0px 0px;
|
||||
padding: 48rpx 32rpx 32rpx 32rpx;
|
||||
|
||||
.onerect {
|
||||
position: relative;
|
||||
padding-bottom: 34rpx;
|
||||
border-bottom: 1rpx solid #F7F7F7;
|
||||
|
||||
view {
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.onerecticon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.infotowrect {
|
||||
width: 686rpx;
|
||||
height: 640rpx;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.infothererect {
|
||||
padding-bottom: 16rpx;
|
||||
border-bottom: 4rpx solid #F9F9F9;
|
||||
|
||||
.infothererect_one {
|
||||
margin-top: 22rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
}
|
||||
|
||||
.infofourrect {
|
||||
.infofourrect_one {
|
||||
margin-top: 32rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.infofourrect_yow {
|
||||
margin-top: 18rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.warp {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
|
||||
.rect {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 60rpx 60rpx 0px 0px;
|
||||
padding: 48rpx 32rpx 32rpx 32rpx;
|
||||
|
||||
.onerect {
|
||||
position: relative;
|
||||
padding-bottom: 34rpx;
|
||||
border-bottom: 1rpx solid #F7F7F7;
|
||||
|
||||
image {
|
||||
width: 124rpx;
|
||||
height: 124rpx;
|
||||
}
|
||||
|
||||
.nonecontentone_view {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-left: 16rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.onerecticon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.towrect {
|
||||
padding-bottom: 34rpx;
|
||||
border-bottom: 1rpx solid #F7F7F7;
|
||||
padding-top: 34rpx;
|
||||
|
||||
.towrect_one {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.towrect_tow {
|
||||
margin-top: 16rpx;
|
||||
|
||||
text {
|
||||
background: #F7F7F7;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid #333333;
|
||||
padding: 8rpx 26rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.thererect {
|
||||
padding: 34rpx 0;
|
||||
border-bottom: 1rpx solid #F7F7F7;
|
||||
border-top: 1rpx solid #F7F7F7;
|
||||
|
||||
.thererect_one {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.thererect_tow {}
|
||||
}
|
||||
|
||||
.fuorrect {
|
||||
margin-top: 32rpx;
|
||||
|
||||
.fuorrect_one {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.fuorrect_tow {
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.fvirect {
|
||||
margin-top: 200rpx;
|
||||
padding: 16rpx;
|
||||
text-align: center;
|
||||
background: linear-gradient(115deg, #7E81A5 0%, #4D4E64 100%);
|
||||
border-radius: 40rpx;
|
||||
font-size: 36rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
895
pages/my/order/index.vue
Normal file
895
pages/my/order/index.vue
Normal file
@@ -0,0 +1,895 @@
|
||||
<template>
|
||||
<view class="content" :style="[theme]">
|
||||
<view class="onecontent">
|
||||
<view class="flex-start">
|
||||
<view class="onecontent_oen flex-start">
|
||||
<input class="onecontent_oen_input" type="text" v-model="like" placeholder="搜索订单/商家名/商品名">
|
||||
<text class="onecontent_oen_text" @click="init_fn">搜索</text>
|
||||
</view>
|
||||
<view class="onecontent_oen_right flex-start" @click="showpicker = true" v-if="model_type != 'Wedding'">
|
||||
<image class="onecontent_oen_rightimage" src="@/static/screen.png" mode="aspectFill"></image>
|
||||
<view class="onecontent_oen_rightimageview">筛选</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontent_tow flex-between">
|
||||
<view ref="uTabs" class="onecontent_tow_item flex-colum" v-for="(item,index) in swipercurrentdata"
|
||||
:key="index" @click="orderswitch(index)">
|
||||
<view :class="swiperCurrent == index?'onecontent_tow_itemtexts':'onecontent_tow_itemtext'">
|
||||
{{item.name}}
|
||||
</view>
|
||||
<image class="onecontent_tow_itemtextsimges" v-if="swiperCurrent == index" :src="selected"
|
||||
mode="aspectFill"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontent">
|
||||
<swiper :current="swiperCurrent" @animationfinish="animationfinish" :style="{height:height}">
|
||||
<swiper-item v-for="(item,index) in list_" :key="index">
|
||||
<scroll-view scroll-y style="width: 100%;" :style="{height:height}" @scrolltolower="lower">
|
||||
<view class="towcontentitem" v-for="(item1,index1) in list_[index].data" :key="index1"
|
||||
@click="eeInfo(item1)">
|
||||
<view class="towcontentitemone flex-between">
|
||||
<text class="towcontentitemone_one">{{item1.store_title}}</text>
|
||||
<view class="towcontentitemone_tow flex-start">
|
||||
<!-- <image class="towcontentitemone_towimage"
|
||||
:src="item.store_avatar"
|
||||
mode="aspectFill">
|
||||
</image> -->
|
||||
<text v-if="item1.status == 0">待支付</text>
|
||||
<text v-if="item1.status == 1">已支付</text>
|
||||
<text v-if="item1.status == 2">等待确认</text>
|
||||
<text v-if="item1.status == 3">已确认</text>
|
||||
<text v-if="item1.status == 4">已完成 </text>
|
||||
<text v-if="item1.status == 5">已取消</text>
|
||||
<text v-if="item1.status == 6">退款中</text>
|
||||
<text v-if="item1.status == 7">已退款</text>
|
||||
<text v-if="item1.status == 8">已拒绝</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontentitemtow flex-start">
|
||||
<image class="towcontentitemtow_imge" :src="item1.store_avatar" mode="aspectFill">
|
||||
</image>
|
||||
<view class="towcontentitemtow_one flex-colum-start">
|
||||
<text class="towcontentitemtow_one_one">{{item1.title}}</text>
|
||||
<text class="towcontentitemtow_one_tow"><text
|
||||
style="font-size:28rpx;">¥</text>{{item1.total_price}}</text>
|
||||
<text class="towcontentitemtow_one_there"><text
|
||||
style="font-size:28rpx;"></text>{{item1.time}}</text>
|
||||
</view>
|
||||
<view class="towcontentitemtow_tow">
|
||||
{{item1.number}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontentitemthere">
|
||||
<view v-if="item1.status == 0"
|
||||
class="towcontentitemthereitem towcontentitemthereitem_tow"
|
||||
@click.stop="orderordercancel(item1)">
|
||||
取消订单
|
||||
</view>
|
||||
<view
|
||||
v-if="item1.status == 1 || item1.status == 2 || (item1.status == 3 && item1.pay_status == 1)"
|
||||
class="towcontentitemthereitem towcontentitemthereitem_tow"
|
||||
@click.stop="orderordercancelrefund(item1)">
|
||||
申请售后
|
||||
</view>
|
||||
<view v-if="item1.status == 6 || item1.status == 7"
|
||||
class="towcontentitemthereitem towcontentitemthereitem_tow"
|
||||
@click.stop="applylrefund(item1)">
|
||||
查看退款
|
||||
</view>
|
||||
<view class="towcontentitemthereitem towcontentitemthereitem_tow"
|
||||
v-if="item1.status == 5 || item1.status == 4 "
|
||||
@click.stop="orderorderdelete(item1)">
|
||||
删除订单
|
||||
</view>
|
||||
<!-- <view class="towcontentitemthereitem towcontentitemthereitem_there">
|
||||
待服务
|
||||
</view> -->
|
||||
<view class="towcontentitemthereitem towcontentitemthereitem_one"
|
||||
v-if=" item1.status != 8 && item1.pay_status == 0 && (item1.status == 0 || item1.status == 1 || item1.status == 2)"
|
||||
@click.stop="overlayshowclick(item1)">
|
||||
去付款
|
||||
</view>
|
||||
</view>
|
||||
<u-overlay :show="overlayshow" @click.stop="overlayshow = false" opacity='0.1'>
|
||||
<view class="warp">
|
||||
<view class="rect flex-colum" @tap.stop>
|
||||
<view class="rectone">
|
||||
确定{{clickoverlayshowtext}}吗?
|
||||
</view>
|
||||
<view class="recttow flex-between">
|
||||
<view class="recttow_one" @click="cancelOrder(item.status)">
|
||||
确定
|
||||
</view>
|
||||
<view class="recttow_tow" @click="overlayshow = false">
|
||||
取消
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-overlay>
|
||||
</view>
|
||||
<view v-if="list_[index].data.length == 0 && list_[index].is_end == true" class="flex-colum"
|
||||
style="margin-bottom: 10rpx;">
|
||||
<image style="margin-top:100rpx;" class="" :src="bgnothave" mode="widthFix">
|
||||
</image>
|
||||
</view>
|
||||
<u-loadmore :status="form.status" />
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
<u-picker :show="showpicker" :columns="columns" keyName="label" @cancel='showpicker = false'
|
||||
@confirm='confirmpicker'></u-picker>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
selected: uni.getStorageSync('selected'),
|
||||
model_type: uni.getStorageSync('loginuser').model_type,
|
||||
showpicker: false,
|
||||
columns: [
|
||||
[{
|
||||
label: '店铺订单',
|
||||
// 其他属性值
|
||||
id: 1
|
||||
// ...
|
||||
}, {
|
||||
label: '商城订单',
|
||||
id: 2
|
||||
}]
|
||||
],
|
||||
bgnothave: uni.getStorageSync('bgnothave'),
|
||||
height: "",
|
||||
// 因为内部的滑动机制限制，请将tabs组件和swiper组件的current用不同变量赋值
|
||||
current: 0, // tabs组件的current值，表示当前活动的tab选项
|
||||
swiperCurrent: 0, // swiper组件的current值，表示当前那个swiper-item是活动的
|
||||
overlayshow: false,
|
||||
list_: {
|
||||
list1: { //全部
|
||||
data: [],
|
||||
page: 1,
|
||||
is_end: false,
|
||||
},
|
||||
list2: { //代付款
|
||||
data: [],
|
||||
page: 1,
|
||||
is_end: false,
|
||||
},
|
||||
list3: { //待服务
|
||||
data: [],
|
||||
page: 1,
|
||||
is_end: false,
|
||||
},
|
||||
list4: { //已完成
|
||||
data: [],
|
||||
page: 1,
|
||||
is_end: false,
|
||||
},
|
||||
list5: { //退款
|
||||
data: [],
|
||||
page: 1,
|
||||
is_end: false,
|
||||
}
|
||||
},
|
||||
like: '', //备注
|
||||
clickoverlayshowtext: "",
|
||||
swipercurrentdata: [{
|
||||
name: '全部'
|
||||
}, {
|
||||
name: '待付款'
|
||||
}, {
|
||||
name: '待服务' //待确认
|
||||
}, {
|
||||
name: '已完成' //已确认
|
||||
}, {
|
||||
name: '退款/售后'
|
||||
}],
|
||||
form: {
|
||||
status: 'loadmore',
|
||||
},
|
||||
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
this.swiperCurrent = e.e;
|
||||
if (this.model_type == 'Hotel') {
|
||||
this.swipercurrentdata = [{
|
||||
name: '全部'
|
||||
}, {
|
||||
name: '待付款'
|
||||
}, {
|
||||
name: '待确认' //待确认
|
||||
}, {
|
||||
name: '已确认' //已确认
|
||||
}, {
|
||||
name: '退款/售后'
|
||||
}]
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.init_fn();
|
||||
},
|
||||
computed: {
|
||||
HeighTpadding() {
|
||||
return this.$store.getters.is_BarHeight.bottompadding
|
||||
},
|
||||
theme() {
|
||||
return this.$store.getters.theme
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
var query = uni.createSelectorQuery().in(this).select('.onecontent')
|
||||
query.boundingClientRect(ele => {
|
||||
var that = this;
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
that.height = (res.windowHeight - ele.height - (that.HeighTpadding / 2)) +
|
||||
"px";
|
||||
that = null;
|
||||
}
|
||||
})
|
||||
}).exec();
|
||||
},
|
||||
|
||||
methods: {
|
||||
confirmpicker(e) {
|
||||
if (e.value[0].label == '店铺订单') {
|
||||
uni.redirectTo({
|
||||
url: '/pages/my/order/index?e=0'
|
||||
})
|
||||
} else {
|
||||
uni.redirectTo({
|
||||
url: '/pages/mall/order/index?e=0'
|
||||
})
|
||||
}
|
||||
},
|
||||
init_fn() {
|
||||
this.list_ = {
|
||||
list1: { //全部
|
||||
data: [],
|
||||
page: 1,
|
||||
is_end: false,
|
||||
},
|
||||
list2: { //代付款
|
||||
data: [],
|
||||
page: 1,
|
||||
is_end: false,
|
||||
},
|
||||
list3: { //待发货
|
||||
data: [],
|
||||
page: 1,
|
||||
is_end: false,
|
||||
},
|
||||
list4: { //已完成
|
||||
data: [],
|
||||
page: 1,
|
||||
is_end: false,
|
||||
},
|
||||
list5: { //退款
|
||||
data: [],
|
||||
page: 1,
|
||||
is_end: false,
|
||||
}
|
||||
}
|
||||
for (let i = 0; i <= 4; i++) {
|
||||
this.get_order_list(i);
|
||||
}
|
||||
},
|
||||
async get_order_list(i) {
|
||||
console.log(i, 2233)
|
||||
this.form.status = 'loading';
|
||||
let page = null; //页数
|
||||
let order_type = 10;
|
||||
switch (i) {
|
||||
case 0:
|
||||
order_type = 10;
|
||||
page = this.list_.list1.page;
|
||||
break;
|
||||
case 1:
|
||||
order_type = 0;
|
||||
page = this.list_.list2.page;
|
||||
break;
|
||||
case 2:
|
||||
order_type = 3;
|
||||
page = this.list_.list3.page;
|
||||
break;
|
||||
case 3:
|
||||
order_type = 4;
|
||||
page = this.list_.list4.page;
|
||||
break;
|
||||
case 4:
|
||||
order_type = 5;
|
||||
page = this.list_.list5.page;
|
||||
break;
|
||||
}
|
||||
let res = await this.api.orderlist({
|
||||
order_type: order_type,
|
||||
page: page,
|
||||
like: this.like,
|
||||
store_id: uni.cache.get('store_id') // 判断显示哪家的作品
|
||||
})
|
||||
// let res = []
|
||||
// res.data.forEach(item=>{//计算待支付订单剩余时间
|
||||
// if(item.order_type==0){
|
||||
// item.timeDiff=(new Date(item.estimate_close_at).getTime() -new Date().getTime())/1000;
|
||||
// }
|
||||
// })
|
||||
switch (order_type) {
|
||||
case 10:
|
||||
this.paging(res, this.list_.list1)
|
||||
break;
|
||||
case 0:
|
||||
this.paging(res, this.list_.list2)
|
||||
break;
|
||||
case 3:
|
||||
this.paging(res, this.list_.list3)
|
||||
break;
|
||||
case 4:
|
||||
this.paging(res, this.list_.list4)
|
||||
break;
|
||||
case 5:
|
||||
this.paging(res, this.list_.list5)
|
||||
break;
|
||||
}
|
||||
uni.hideLoading();
|
||||
},
|
||||
paging(res, list) {
|
||||
if (res.length == 0) {
|
||||
this.form.status = 'nomore';
|
||||
list.is_end = true;
|
||||
return false;
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
list.page = list.page + 1;
|
||||
setTimeout(() => {
|
||||
list.data = [...list.data, ...res];
|
||||
if (res.length != 10) {
|
||||
list.is_end = true;
|
||||
this.form.status = 'nomore';
|
||||
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
}
|
||||
this.$forceUpdate();
|
||||
}, 500)
|
||||
}
|
||||
},
|
||||
async overlayshowclick(e) {
|
||||
uni.pro.navigateTo('order/confirm', {
|
||||
order_id: e.order_id
|
||||
})
|
||||
console.log(e)
|
||||
let res = await this.api.paygetpayparams({
|
||||
order_id: e.order_id
|
||||
}) //判断是否支付成功
|
||||
// console.log(res)
|
||||
// if (res.data.pay_status == 0) {
|
||||
// // #ifdef MP-WEIXIN
|
||||
// uni.requestPayment({
|
||||
// provider: 'wxpay', //支付类型-固定值
|
||||
// partnerid: res.data.pay_data.payAppId, // 微信支付商户号
|
||||
// timeStamp: res.data.pay_data.payTimeStamp, // 时间戳（单位：秒）
|
||||
// nonceStr: res.data.pay_data.paynonceStr, // 随机字符串
|
||||
// package: res.data.pay_data.payPackage, // 固定值
|
||||
// signType: res.data.pay_data.paySignType, //固定值
|
||||
// paySign: res.data.pay_data.paySign, //签名
|
||||
// success: (res) => {
|
||||
// console.log(res,'11111111')
|
||||
// uni.showToast({
|
||||
// title: "支付成功"
|
||||
// })
|
||||
// uni.redirectTo({
|
||||
// url: "/pages/order/ordersuccess?id=" + e.order_id,
|
||||
// });
|
||||
// },
|
||||
// fail: (err) => {
|
||||
// uni.showToast({
|
||||
// icon: 'none',
|
||||
// title: '支付失败'
|
||||
// })
|
||||
// console.log('fail:' + JSON.stringify(err));
|
||||
// }
|
||||
// });
|
||||
// // #endif
|
||||
// } else {
|
||||
// console.log(res,'22222')
|
||||
// uni.redirectTo({
|
||||
// url: "/pages/order/ordersuccess?id=" + e.order_id,
|
||||
// });
|
||||
// }
|
||||
|
||||
},
|
||||
lower() {
|
||||
switch (this.current) {
|
||||
case 0:
|
||||
this.onReachBottom_fn(this.list_.list1)
|
||||
break;
|
||||
case 1:
|
||||
this.onReachBottom_fn(this.list_.list2)
|
||||
break;
|
||||
case 2:
|
||||
this.onReachBottom_fn(this.list_.list3)
|
||||
break;
|
||||
case 3:
|
||||
this.onReachBottom_fn(this.list_.list4)
|
||||
break;
|
||||
case 4:
|
||||
this.onReachBottom_fn(this.list_.list5)
|
||||
break;
|
||||
}
|
||||
},
|
||||
onReachBottom_fn(list) {
|
||||
if (!list.is_end) {
|
||||
this.get_order_list(this.current);
|
||||
} else {
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
},
|
||||
// tabs通知swiper切换
|
||||
orderswitch(index) {
|
||||
try {
|
||||
switch (index) {
|
||||
case 0:
|
||||
if (this.list_list1.data.length < 10) {
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
break;
|
||||
case 1:
|
||||
if (this.list_.list2.data.length < 10) {
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
break;
|
||||
case 2:
|
||||
if (this.list_.list3.data.length < 10) {
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
break;
|
||||
case 3:
|
||||
if (this.list_.list4.data.length < 10) {
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
break;
|
||||
case 4:
|
||||
if (this.list_.list5.data.length < 10) {
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
break;
|
||||
}
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
this.swiperCurrent = index;
|
||||
},
|
||||
// swiper-item左右移动，通知tabs的滑块跟随移动
|
||||
transition(e) {
|
||||
let dx = e.detail.dx
|
||||
console.log(e, dx)
|
||||
// this.$refs.uTabs.setDx(dx);
|
||||
},
|
||||
// 由于swiper的内部机制问题，快速切换swiper不会触发dx的连续变化，需要在结束时重置状态 swiper滑动结束，分别设置tabs和swiper的状态
|
||||
animationfinish(e) {
|
||||
let current = e.detail.current;
|
||||
try {
|
||||
switch (current) {
|
||||
case 0:
|
||||
if (this.list_list1.data.length < 10) {
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
break;
|
||||
case 1:
|
||||
if (this.list_.list2.data.length < 10) {
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
break;
|
||||
case 2:
|
||||
if (this.list_.list3.data.length < 10) {
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
break;
|
||||
case 3:
|
||||
if (this.list_.list4.data.length < 10) {
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
break;
|
||||
case 4:
|
||||
if (this.list_.list5.data.length < 10) {
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
break;
|
||||
}
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
|
||||
this.swiperCurrent = current;
|
||||
this.current = current;
|
||||
},
|
||||
// clickoverlayshow(e) { //切换文字
|
||||
// switch (e) {
|
||||
// case 1:
|
||||
// this.clickoverlayshowtext = '取消订单'
|
||||
// break;
|
||||
// case 2:
|
||||
// this.clickoverlayshowtext = '删除订单'
|
||||
// break;
|
||||
// }
|
||||
// this.overlayshow = true
|
||||
// },
|
||||
orderordercancel(item) { //取消订单
|
||||
uni.showModal({
|
||||
content: '确定取消订单吗?',
|
||||
confirmColor: '#f55850',
|
||||
cancelColor: '#333333',
|
||||
success: async (resdata) => {
|
||||
console.log(resdata)
|
||||
if (resdata.confirm) {
|
||||
let res = await this.api.orderordercancel({
|
||||
order_id: item.order_id
|
||||
})
|
||||
this.init_fn()
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
orderordercancelrefund(item) { //取消订单去退款
|
||||
uni.pro.navigateTo('my/order/refund', {
|
||||
id: item.order_id
|
||||
})
|
||||
},
|
||||
applylrefund(item) {
|
||||
uni.pro.navigateTo('my/order/applylrefund', {
|
||||
id: item.order_id
|
||||
})
|
||||
},
|
||||
orderorderdelete(item) {
|
||||
uni.showModal({
|
||||
content: '确定删除订单吗?',
|
||||
confirmColor: '#f55850',
|
||||
cancelColor: '#333333',
|
||||
success: async (resdata) => {
|
||||
if (resdata.confirm) {
|
||||
let res = await this.api.orderorderdelete({
|
||||
order_id: item.order_id
|
||||
})
|
||||
}
|
||||
this.init_fn()
|
||||
}
|
||||
})
|
||||
},
|
||||
async cancelOrder(item) { //取消订单
|
||||
console.log(item)
|
||||
// let res
|
||||
// switch (this.clickoverlayshowtext) {
|
||||
// case '取消订单':
|
||||
// if (item.status == 0) {
|
||||
// res = await this.api.orderordercancel({
|
||||
// order_id: item.order_id
|
||||
// })
|
||||
// } else {
|
||||
// uni.pro.navigateTo('my/order/orderInfo', {
|
||||
// id: e,
|
||||
// e: e
|
||||
// })
|
||||
// }
|
||||
// break;
|
||||
// case '删除订单':
|
||||
// res = await this.api.orderorderdelete({
|
||||
// order_id: item.order_id
|
||||
// })
|
||||
// break;
|
||||
// }
|
||||
// this.overlayshow = false
|
||||
// this.init_fn()
|
||||
},
|
||||
eeInfo(e) { //查看订单详情
|
||||
uni.pro.navigateTo('my/order/orderInfo', {
|
||||
id: e.order_id
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F6F6F6;
|
||||
}
|
||||
|
||||
.content {
|
||||
|
||||
.onecontent {
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
padding: 10rpx 28rpx;
|
||||
|
||||
.flex-start {
|
||||
flex-wrap: nowrap;
|
||||
|
||||
.onecontent_oen {
|
||||
margin: 0 auto;
|
||||
flex: auto;
|
||||
height: 70rpx;
|
||||
border-radius: 36rpx;
|
||||
border: 1rpx solid var(--bg-color-button);
|
||||
padding-right: 8rpx;
|
||||
|
||||
.onecontent_oen_input {
|
||||
padding-left: 32rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.onecontent_oen_text {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
line-height: 56rpx;
|
||||
width: 116rpx;
|
||||
height: 56rpx;
|
||||
background: var(--bg-color-button);
|
||||
border-radius: 36rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.onecontent_oen_right {
|
||||
margin-left: 26rpx;
|
||||
|
||||
.onecontent_oen_rightimage {
|
||||
width: 17.9rpx;
|
||||
height: 19.34rpx;
|
||||
}
|
||||
|
||||
.onecontent_oen_rightimageview {
|
||||
text-align: center;
|
||||
width: 56rpx;
|
||||
margin-left: 10rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.onecontent_tow {
|
||||
padding: 32rpx 0 32rpx 0;
|
||||
width: 100%;
|
||||
|
||||
.onecontent_tow_item {
|
||||
position: relative;
|
||||
|
||||
.onecontent_tow_itemtexts {
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.onecontent_tow_itemtext {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.onecontent_tow_itemtextsimges {
|
||||
position: absolute;
|
||||
bottom: -10rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 20rpx;
|
||||
height: 8rpx;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.towcontent {
|
||||
padding: 0 28rpx;
|
||||
|
||||
.flex-colum_image {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
|
||||
text {
|
||||
margin-top: 30rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentitem {
|
||||
margin-top: 32rpx;
|
||||
padding: 24rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.towcontentitemone {
|
||||
padding-bottom: 16rpx;
|
||||
border-bottom: 1px solid #F6F6F6;
|
||||
|
||||
.towcontentitemone_one {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.towcontentitemone_tow {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
|
||||
.towcontentitemone_towimage {
|
||||
margin-right: 10rpx;
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentitemtow {
|
||||
position: relative;
|
||||
padding: 22rpx 0;
|
||||
border-bottom: 1px solid #F6F6F6;
|
||||
|
||||
.towcontentitemtow_imge {
|
||||
width: 144rpx;
|
||||
height: 144rpx;
|
||||
background: #666666;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
|
||||
.towcontentitemtow_one {
|
||||
margin-left: 32rpx;
|
||||
width: 60%;
|
||||
|
||||
.towcontentitemtow_one_one {
|
||||
width:80%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.towcontentitemtow_one_tow {
|
||||
margin-top: 24rpx;
|
||||
font-size: 40rpx;
|
||||
font-family: Roboto-Bold, Roboto;
|
||||
font-weight: bold;
|
||||
color: #FC5F69;
|
||||
}
|
||||
|
||||
.towcontentitemtow_one_there {
|
||||
margin-top: 32rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Roboto-Bold, Roboto;
|
||||
font-weight: 500;
|
||||
color: #666;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentitemtow_tow {
|
||||
position: absolute;
|
||||
bottom: 32rpx;
|
||||
right: 0;
|
||||
font-size: 28rpx;
|
||||
font-family: Roboto-Regular, Roboto;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentitemthere {
|
||||
width: 100%;
|
||||
margin-top: 16rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.towcontentitemthereitem {
|
||||
margin-left: 24rpx;
|
||||
padding: 8rpx 32rpx;
|
||||
font-size: 28rpx;
|
||||
border-radius: 28rpx;
|
||||
}
|
||||
|
||||
.towcontentitemthereitem_one {
|
||||
background: var(--bg-color-button);
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.towcontentitemthereitem_tow {
|
||||
background: #F6F6F6;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.towcontentitemthereitem_there {
|
||||
background: var(--bg-color-buttonone);
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.warp {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
|
||||
.rect {
|
||||
padding: 40rpx 68rpx;
|
||||
width: 480rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 42rpx;
|
||||
|
||||
.rectone {
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.recttow {
|
||||
width: 100%;
|
||||
margin-top: 32rpx;
|
||||
|
||||
.recttow_one {
|
||||
padding: 8rpx 40rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 26rpx;
|
||||
border: 2rpx solid #999999;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.recttow_tow {
|
||||
padding: 8rpx 40rpx;
|
||||
background: #333333;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
border-radius: 26rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
628
pages/my/order/orderInfo.vue
Normal file
628
pages/my/order/orderInfo.vue
Normal file
@@ -0,0 +1,628 @@
|
||||
<template>
|
||||
<view class="index" :style="[theme]">
|
||||
<view class="onecontent">
|
||||
<view class="onecontentone">
|
||||
<text v-if="datalist.status == 0">待支付</text>
|
||||
<text v-if="datalist.status == 1">已支付</text>
|
||||
<text v-if="datalist.status == 2">等待确认</text>
|
||||
<text v-if="datalist.status == 3">已确认</text>
|
||||
<text v-if="datalist.status == 4">已完成 </text>
|
||||
<text v-if="datalist.status == 5">已取消</text>
|
||||
<text v-if="datalist.status == 6">退款中</text>
|
||||
<text v-if="datalist.status == 7">已退款</text>
|
||||
<text v-if="datalist.status == 8">已拒绝</text>
|
||||
</view>
|
||||
<view class="onecontenttow">
|
||||
感谢您的支持，欢迎再次光临
|
||||
</view>
|
||||
<view class="onecontentthere flex-between">
|
||||
<view class="onecontentthere_one" v-if="datalist.status == 5 || datalist.status == 4 "
|
||||
@click="orderorderdelete(datalist)">
|
||||
删除订单
|
||||
</view>
|
||||
<view class="onecontentthere_tow"
|
||||
v-if="datalist.status == 1 || datalist.status == 2 ||datalist.status == 3"
|
||||
@click="orderordercancelrefund(datalist)">
|
||||
申请退款
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontent">
|
||||
<view class="towcontentone flex-between">
|
||||
<view class="towcontentone_one flex-start">
|
||||
<u-icon name="home" color="#ffffff" size="20"></u-icon>
|
||||
<text class="towcontentone_one_text">{{datalist.store_title}}</text>
|
||||
</view>
|
||||
<u-icon @click="phonefill(datalist.store_mobile)" name="phone-fill" color="#ffffff" size="20"></u-icon>
|
||||
</view>
|
||||
<view class="towcontenttow flex-start" @click="detailsInfo(datalist.store_service_id)">
|
||||
<image class="towcontenttow_image" :src="datalist.store_avatar" mode="aspectFill"></image>
|
||||
<view class="towcontenttowone flex-colum-start">
|
||||
<view class="towcontenttowone_one">
|
||||
{{datalist.title}}
|
||||
</view>
|
||||
<view class="towcontenttowone_tow flex-start">
|
||||
<view class="towcontenttowone_tow_one flex-start">
|
||||
<u-icon name="checkmark-circle" color="#999999" size="14"></u-icon>
|
||||
随时退
|
||||
</view>
|
||||
<view class="towcontenttowone_tow_one flex-start">
|
||||
<u-icon name="checkmark-circle" color="#999999" size="14"></u-icon>
|
||||
过期退
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontenttowone_there">
|
||||
{{datalist.time||''}}
|
||||
</view>
|
||||
<view class="towcontenttowone_four">
|
||||
¥{{datalist.total_price}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!--<view class="towcontentthere flex-between">
|
||||
<text class="towcontentthere_text"></text>
|
||||
</view>
|
||||
<view class="qr-box flex-colum" @longpress="save()">
|
||||
<canvas canvas-id="qrcode" style="width:288rpx;" />
|
||||
</view>
|
||||
<view class="towcontenttfour flex-colum">
|
||||
123 2345 567
|
||||
</view> -->
|
||||
<!-- <view class="towcontenttfive flex-between">
|
||||
<view class="towcontenttfive_one flex-start">
|
||||
<view class="towcontenttfive_oneone">
|
||||
退款:
|
||||
</view>
|
||||
<view class="towcontenttfive_onetow">
|
||||
08-22 23:59:59到期
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontenttfive_tow">
|
||||
申请退款
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="therecontent">
|
||||
<view class="therecontentone">
|
||||
订单信息
|
||||
</view>
|
||||
<view class="therecontentsix entowakst" v-if="datalist.people_nickname">
|
||||
发型师：{{datalist.people_nickname}}
|
||||
</view>
|
||||
<view class="therecontentow entowakst">
|
||||
实付金额：<text>¥{{datalist.money}}</text>
|
||||
</view>
|
||||
<view class="therecontentthere entowakst">
|
||||
购买数量：{{datalist.number}}
|
||||
</view>
|
||||
<view class="therecontenfour entowakst">
|
||||
手机号码：{{datalist.mobile.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2') || '-'}}
|
||||
</view>
|
||||
<view class="therecontentfive flex-start entowakst" @click="copy(datalist.out_trade_no)">
|
||||
订单编号：{{datalist.out_trade_no}}
|
||||
<text class="therecontentfive_box">复制</text>
|
||||
</view>
|
||||
<view class="therecontentsix entowakst">
|
||||
下单时间：{{datalist.createtime}}
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<!-- <view class="fourcontent">
|
||||
<view class="fourcontentone">
|
||||
购买须知
|
||||
</view>
|
||||
<view v-html="datalist.details">
|
||||
|
||||
</view>
|
||||
<view class="entowakst" v-html="datalist.details">
|
||||
·预约须知：请您提前1小时预约
|
||||
</view>
|
||||
</view> -->
|
||||
<!-- <view class="fivecontent">
|
||||
<view class="fivecontentone">
|
||||
用户评价
|
||||
</view>
|
||||
<view class="fivecontenttow flex-between">
|
||||
<view class="fivecontenttow_one flex-start">
|
||||
<text class="fivecontenttow_text">综合评分</text>
|
||||
<u-rate :count="5" value="4" active-color="#f1cb66" inactive-color="#F1CB66"></u-rate>
|
||||
</view>
|
||||
<view class="fivecontenttow_tow">
|
||||
满意
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uQRCode from '@/common/js/uqrCode.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
datalist: {
|
||||
mobile: ''
|
||||
},
|
||||
imgCode: '', // 后续保存到手机相册所需要用到的字段}
|
||||
form: {
|
||||
phone: '18092171236'
|
||||
}
|
||||
}
|
||||
},
|
||||
async onLoad(e) {
|
||||
try {
|
||||
let res = await this.api.orderorderdetail({
|
||||
order_id: e.id
|
||||
})
|
||||
if (res) {
|
||||
console.log(res)
|
||||
this.datalist = res
|
||||
this.datalist.details = res.details.replace(/\<img/g, '<img style="max-width:100%;height:auto" ');
|
||||
}
|
||||
} catch (e) {}
|
||||
// this.generate()
|
||||
},
|
||||
computed: {
|
||||
theme() {
|
||||
return this.$store.getters.theme
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
orderorderdelete(item) { //删除订单
|
||||
uni.showModal({
|
||||
content: '确定删除订单吗?',
|
||||
confirmColor: '#f55850',
|
||||
cancelColor: '#333333',
|
||||
success: async (resdata) => {
|
||||
if (resdata.confirm) {
|
||||
await this.api.orderorderdelete({
|
||||
order_id: item.order_id
|
||||
})
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
orderordercancelrefund(item) { //取消订单去退款
|
||||
console.log(item)
|
||||
uni.pro.navigateTo('my/order/refund', {
|
||||
id: item.order_id
|
||||
})
|
||||
},
|
||||
// 生成二维码事件
|
||||
generate(e) {
|
||||
uQRCode.make({
|
||||
canvasId: 'qrcode',
|
||||
componentInstance: this,
|
||||
text: "https://ky.sxczgkj.cn/wap/merchant/authPay?userAppId=244", // 想生成二维码到内容
|
||||
size: 150,
|
||||
margin: 0,
|
||||
backgroundColor: '#ffffff',
|
||||
foregroundColor: '#000000',
|
||||
fileType: 'jpg',
|
||||
errorCorrectLevel: uQRCode.errorCorrectLevel.H,
|
||||
success: res => {
|
||||
this.imgCode = res // base64的图片格式
|
||||
}
|
||||
})
|
||||
},
|
||||
// 保存到手机
|
||||
save() {
|
||||
uni.getSetting({ //获取用户的当前设置
|
||||
success: (res) => {
|
||||
if (res.authSetting['scope.writePhotosAlbum']) { //验证用户是否授权可以访问相册
|
||||
this.aveImageToPhotosAlbum();
|
||||
} else {
|
||||
uni.authorize({ //如果没有授权，向用户发起请求
|
||||
scope: 'scope.writePhotosAlbum',
|
||||
success: () => {
|
||||
this.aveImageToPhotosAlbum();
|
||||
},
|
||||
fail: () => {
|
||||
// 提示
|
||||
uni.showToast({
|
||||
title: "请打开保存相册权限，再点击保存到手机",
|
||||
icon: "none",
|
||||
duration: 3000
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.openSetting({ //调起客户端小程序设置界面,让用户开启访问相册
|
||||
success: (res2) => {
|
||||
// console.log(res2.authSetting)
|
||||
}
|
||||
});
|
||||
}, 3000);
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
copy(value) {
|
||||
//提示模板
|
||||
uni.setClipboardData({
|
||||
data: value, //要被复制的内容
|
||||
success: () => { //复制成功的回调函数
|
||||
uni.showToast({
|
||||
title: '复制成功'
|
||||
})
|
||||
},
|
||||
fail: (res) => {
|
||||
console.log(res)
|
||||
}
|
||||
});
|
||||
},
|
||||
detailsInfo(e) { //查看订单详情
|
||||
uni.pro.navigateTo('my/order/cporderinfo', {
|
||||
id: e,
|
||||
})
|
||||
},
|
||||
phonefill(value) {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: value //仅为示例
|
||||
});
|
||||
},
|
||||
aveImageToPhotosAlbum() {
|
||||
let base64 = this.imgCode.replace(/^data:image\/\w+;base64,/, ""); //去掉data:image/png;base64,
|
||||
let filePath = wx.env.USER_DATA_PATH + '/ph_fit_qrcode.png'; // 路径文件名
|
||||
uni.showLoading({
|
||||
title: '加载中',
|
||||
mask: true
|
||||
})
|
||||
uni.getFileSystemManager().writeFile({ // 获取全局唯一的文件管理器
|
||||
filePath: filePath, //创建一个临时文件名
|
||||
data: base64, //写入的文本或二进制数据
|
||||
encoding: 'base64', //写入当前文件的字符编码
|
||||
success: res => {
|
||||
uni.saveImageToPhotosAlbum({ // 保存图片到系统相册
|
||||
filePath: filePath,
|
||||
success: function(res2) {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '保存成功',
|
||||
icon: "none",
|
||||
duration: 5000
|
||||
})
|
||||
},
|
||||
fail: function(err) {
|
||||
uni.hideLoading();
|
||||
// console.log(err.errMsg);
|
||||
}
|
||||
})
|
||||
},
|
||||
fail: err => {
|
||||
uni.hideLoading();
|
||||
//console.log(err)
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F6F6F6;
|
||||
}
|
||||
|
||||
.index {
|
||||
padding: 32rpx 28rpx;
|
||||
|
||||
.onecontent {
|
||||
width: 100%;
|
||||
padding: 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.onecontentone {
|
||||
font-size: 32rpx;
|
||||
font-family: SourceHanSansCN-Medium-, SourceHanSansCN-Medium;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.onecontenttow {
|
||||
margin-top: 16rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.onecontentthere {
|
||||
margin-top: 24rpx;
|
||||
|
||||
.onecontentthere_one {
|
||||
background: #333333;
|
||||
border-radius: 8rpx;
|
||||
padding: 16rpx 94rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.onecontentthere_tow {
|
||||
background: #F7F7F7;
|
||||
border-radius: 8rpx;
|
||||
padding: 16rpx 94rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.towcontent {
|
||||
margin-top: 24rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 18rpx;
|
||||
|
||||
.towcontentone {
|
||||
position: relative;
|
||||
padding: 16rpx 32rpx;
|
||||
border-radius: 18rpx 18rpx 0 0;
|
||||
background: var(--bg-color-buttonone);
|
||||
|
||||
.towcontentone_one {
|
||||
.towcontentone_one_image {
|
||||
width: 33.04rpx;
|
||||
height: 29.79rpx;
|
||||
}
|
||||
|
||||
.towcontentone_one_text {
|
||||
margin-left: 10rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentone_one::after {
|
||||
z-index: 10;
|
||||
position: absolute;
|
||||
bottom: -22rpx;
|
||||
content: '';
|
||||
display: inline-block;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 44rpx;
|
||||
height: 44rpx;
|
||||
border-radius: 0 0 22rpx 22rpx;
|
||||
background: var(--bg-color-buttonone);
|
||||
}
|
||||
}
|
||||
|
||||
.towcontenttow {
|
||||
position: relative;
|
||||
padding: 32rpx;
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
|
||||
.towcontenttow_image {
|
||||
width: 128rpx;
|
||||
height: 128rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.towcontenttowone {
|
||||
margin-left: 36rpx;
|
||||
justify-content: space-around;
|
||||
width: 60%;
|
||||
.towcontenttowone_one {
|
||||
width: 100%;
|
||||
font-size: 28rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.towcontenttowone_tow {
|
||||
.towcontenttowone_tow_one {
|
||||
font-size: 24rpx;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontenttowone_there {
|
||||
font-size: 32rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.towcontenttowone_four {
|
||||
// position: absolute;
|
||||
font-weight: bold;
|
||||
// top: 32rpx;
|
||||
// right: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentthere {
|
||||
position: relative;
|
||||
height: 44rpx;
|
||||
width: 100%;
|
||||
|
||||
.towcontentthere_text {
|
||||
width: 100%;
|
||||
height: 0px;
|
||||
border: 1rpx dashed #EAEAEA;
|
||||
}
|
||||
|
||||
.towcontentthere_text::after {
|
||||
z-index: 10;
|
||||
position: absolute;
|
||||
content: '';
|
||||
display: inline-block;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 22rpx;
|
||||
height: 44rpx;
|
||||
border-radius: 0 44rpx 44rpx 0;
|
||||
background: #f6f6f6;
|
||||
}
|
||||
|
||||
.towcontentthere_text::before {
|
||||
z-index: 10;
|
||||
position: absolute;
|
||||
content: '';
|
||||
display: inline-block;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 22rpx;
|
||||
height: 44rpx;
|
||||
border-radius: 44rpx 0 0 44rpx;
|
||||
background: #f6f6f6;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontenttfour {
|
||||
margin-top: 16rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.towcontenttfive {
|
||||
padding: 32rpx;
|
||||
width: 100%;
|
||||
|
||||
.towcontenttfive_one {
|
||||
font-size: 32rpx;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.towcontenttfive_onetow {
|
||||
margin-left: 16rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.towcontenttfive_tow {
|
||||
padding: 10rpx 16rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid #D5D5D5;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.therecontent {
|
||||
margin-top: 24rpx;
|
||||
padding: 32rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 18rpx;
|
||||
|
||||
.therecontentone {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.entowakst {
|
||||
font-size: 28rpx;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.therecontentfive_box {
|
||||
padding: 6rpx 10rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #666666;
|
||||
background: #FFFFFF;
|
||||
margin-left: 6rpx;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid #D5D5D5;
|
||||
}
|
||||
}
|
||||
|
||||
.fourcontent {
|
||||
margin-top: 24rpx;
|
||||
padding: 32rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 18rpx;
|
||||
|
||||
.fourcontentone {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.fourcontentone::after {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 1rpx;
|
||||
border: 1px solid #F7F7F7;
|
||||
}
|
||||
|
||||
.entowakst {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFang SC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.fivecontent {
|
||||
margin-top: 24rpx;
|
||||
padding: 32rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 18rpx;
|
||||
|
||||
.fivecontentone {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.fivecontenttow {
|
||||
margin-top: 16rpx;
|
||||
|
||||
.fivecontenttow_one {
|
||||
.fivecontenttow_text {
|
||||
padding-right: 24rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.fivecontenttow_tow {
|
||||
font-size: 24rpx;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
368
pages/my/order/refund.vue
Normal file
368
pages/my/order/refund.vue
Normal file
@@ -0,0 +1,368 @@
|
||||
<template>
|
||||
<view class="index" :style="[theme]">
|
||||
<view class="onecontent flex-between">
|
||||
<image :src="datalist.store_avatar" mode="aspectFill"></image>
|
||||
<view class="flex-colum-start">
|
||||
<view class="onecontentone">
|
||||
{{datalist.title}}
|
||||
</view>
|
||||
<view class="onecontenttow">
|
||||
<view class="onecontenttowabsolute">
|
||||
x{{datalist.number}}
|
||||
</view>
|
||||
<text style="font-size:28rpx;">¥</text>{{datalist.total_price}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="therecontent">
|
||||
<view class="therecontentone flex-between" @click="showpicke = true">
|
||||
<view class="therecontentone_one">
|
||||
退款原因
|
||||
</view>
|
||||
<text class="therecontentone_text" style="font-weight: 400;">{{reason}}</text>
|
||||
<u-icon name="arrow-right" color="#9b9b9b" size="14"></u-icon>
|
||||
</view>
|
||||
<view class="therecontentone flex-between">
|
||||
<view class="therecontentone_one">
|
||||
退款金额
|
||||
</view>
|
||||
<input disabled style="padding: 16rpx; color: red;" type="text" v-model="money"
|
||||
class="therecontentone_text" :placeholder="'最多可退￥'+money">
|
||||
</view>
|
||||
<view class="therecontentone">
|
||||
<view class="therecontentone_one">
|
||||
详细说明
|
||||
</view>
|
||||
<view class="" style="margin-top: 10rpx;">
|
||||
<u--textarea v-model="remarks" placeholder="请输入内容"></u--textarea>
|
||||
</view>
|
||||
</view>
|
||||
<view class="therecontentone flex-between">
|
||||
<view class="therecontentone_one">
|
||||
图片凭证
|
||||
</view>
|
||||
<view class="therecontentone_text" style="text-align: right;">最多三张</view>
|
||||
</view>
|
||||
<view class="flex-start">
|
||||
<view class="fourcontent flex-start" v-if="avatar.length!=0">
|
||||
<view class="fourcontent_item" v-for="(item,index) in avatar" :key="index">
|
||||
<image :src="item" mode="aspectFill"></image>
|
||||
<text class="fourcontent_itemtext" @click="avatardelete(index)">
|
||||
<u-icon name="close-circle-fill" color="#000" size="16"></u-icon>
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="avatar.length<3" class="fourcontent_items flex-colum" @click="chooseImagelist">
|
||||
<u-icon name="camera-fill" color="#000" size="30"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="buoot" @click="orderorderrefund">
|
||||
提交
|
||||
</view>
|
||||
<u-picker :show="showpicke" title='退款原因' :columns="columnspicke" @cancel='showpicke = false'
|
||||
@confirm='confirm'></u-picker>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadImage from "@/js_sdk/yushijie-ossutil/ossutil/uploadFile.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
showpicke: false,
|
||||
reason: "",
|
||||
money: '',
|
||||
columnspicke: [
|
||||
['7天无理由', '拍错/多拍/不想要', '其他']
|
||||
],
|
||||
imgCode: '', // 后续保存到手机相册所需要用到的字段
|
||||
remarks: '',
|
||||
form: {
|
||||
phone: '18092171236'
|
||||
},
|
||||
datalist: {},
|
||||
avatar: [],
|
||||
order_id: ""
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
theme() {
|
||||
return this.$store.getters.theme
|
||||
},
|
||||
},
|
||||
async onLoad(e) {
|
||||
this.order_id = e.id
|
||||
try {
|
||||
let res = await this.api.orderorderdetail({
|
||||
order_id: this.order_id
|
||||
})
|
||||
if (res) {
|
||||
this.datalist = res
|
||||
this.money = res.money
|
||||
}
|
||||
} catch (e) {}
|
||||
// this.generate()
|
||||
},
|
||||
methods: {
|
||||
// / 更换头像
|
||||
chooseImagelist(e) {
|
||||
// uni.showLoading({
|
||||
// title: '上传中',
|
||||
// mask: true
|
||||
// })
|
||||
uni.chooseImage({
|
||||
count: 1, //默认9
|
||||
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
|
||||
sourceType: ['album'], //从相册选择
|
||||
success: (res) => {
|
||||
let file = res.tempFilePaths[0];
|
||||
uploadImage(file, 'refund/',
|
||||
result => {
|
||||
this.avatar.push(result)
|
||||
uni.hideLoading()
|
||||
}, result => {
|
||||
console.log(result)
|
||||
uni.hideLoading()
|
||||
})
|
||||
}
|
||||
});
|
||||
},
|
||||
async orderorderrefund() {
|
||||
if (this.reason == null || this.reason == '') {
|
||||
uni.showToast({
|
||||
title: '请选择退款原因',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
let res = await this.api.orderorderrefund({
|
||||
order_id: this.order_id,
|
||||
reason: this.reason,
|
||||
remarks: this.remarks,
|
||||
img: this.avatar,
|
||||
// money:""
|
||||
})
|
||||
if (res == 1) {
|
||||
uni.showToast({
|
||||
title: '操作成功，请等待审核',
|
||||
icon: 'none'
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
}, 1000);
|
||||
}
|
||||
|
||||
},
|
||||
avatardelete(e) {
|
||||
this.avatar.splice(e, 1)
|
||||
console.log(this.avatar)
|
||||
},
|
||||
confirm(e) {
|
||||
this.reason = e.value[0]
|
||||
this.showpicke = false
|
||||
console.log(e.value[0])
|
||||
},
|
||||
aveImageToPhotosAlbum() {
|
||||
let base64 = this.imgCode.replace(/^data:image\/\w+;base64,/, ""); //去掉data:image/png;base64,
|
||||
let filePath = wx.env.USER_DATA_PATH + '/ph_fit_qrcode.png'; // 路径文件名
|
||||
uni.showLoading({
|
||||
title: '加载中',
|
||||
mask: true
|
||||
})
|
||||
uni.getFileSystemManager().writeFile({ // 获取全局唯一的文件管理器
|
||||
filePath: filePath, //创建一个临时文件名
|
||||
data: base64, //写入的文本或二进制数据
|
||||
encoding: 'base64', //写入当前文件的字符编码
|
||||
success: res => {
|
||||
uni.saveImageToPhotosAlbum({ // 保存图片到系统相册
|
||||
filePath: filePath,
|
||||
success: function(res2) {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '保存成功',
|
||||
icon: "none",
|
||||
duration: 5000
|
||||
})
|
||||
},
|
||||
fail: function(err) {
|
||||
uni.hideLoading();
|
||||
// console.log(err.errMsg);
|
||||
}
|
||||
})
|
||||
},
|
||||
fail: err => {
|
||||
uni.hideLoading();
|
||||
//console.log(err)
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F6F6F6;
|
||||
}
|
||||
|
||||
.index {
|
||||
padding: 32rpx 28rpx;
|
||||
|
||||
.onecontent {
|
||||
width: 100%;
|
||||
padding: 26rpx 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
|
||||
image {
|
||||
width: 176rpx;
|
||||
height: 176rpx;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
|
||||
.flex-colum-start {
|
||||
height: 176rpx;
|
||||
flex: auto;
|
||||
margin-left: 20rpx;
|
||||
justify-content: flex-start;
|
||||
|
||||
.onecontentone {
|
||||
width: 400rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.onecontenttow {
|
||||
top: 32rpx;
|
||||
position: relative;
|
||||
margin-top: 16rpx;
|
||||
width: 100%;
|
||||
font-size: 40rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
|
||||
.onecontenttowabsolute {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
font-size: 28rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.buoot {
|
||||
margin: 40rpx auto;
|
||||
width: 80%;
|
||||
padding: 16rpx 0;
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
background: var(--bg-color-button);
|
||||
border-radius: 40rpx;
|
||||
}
|
||||
|
||||
.therecontent {
|
||||
margin-top: 24rpx;
|
||||
padding: 32rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 18rpx;
|
||||
|
||||
.therecontentone {
|
||||
width: 100%;
|
||||
padding: 10rpx 0;
|
||||
border-bottom: 1px solid #F7F7F7;
|
||||
|
||||
.therecontentone_one {
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: 700;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.therecontentone_text {
|
||||
flex: auto;
|
||||
margin-left: 20rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.fourcontent_items {
|
||||
position: relative;
|
||||
margin-top: 16rpx;
|
||||
margin-left: 20rpx;
|
||||
width: 112rpx;
|
||||
height: 112rpx;
|
||||
background: #f9f9f9;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.fourcontent {
|
||||
.fourcontent_item {
|
||||
position: relative;
|
||||
margin-top: 16rpx;
|
||||
margin-left: 20rpx;
|
||||
width: 112rpx;
|
||||
height: 112rpx;
|
||||
border-radius: 16rpx;
|
||||
|
||||
image {
|
||||
width: 112rpx;
|
||||
height: 112rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.fourcontent_itemtext {
|
||||
position: absolute;
|
||||
top: 0rpx;
|
||||
right: 0rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.entowakst {
|
||||
font-size: 28rpx;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.therecontentfive_box {
|
||||
padding: 6rpx 10rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #666666;
|
||||
background: #FFFFFF;
|
||||
margin-left: 6rpx;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid #D5D5D5;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
313
pages/my/setup/index.vue
Normal file
313
pages/my/setup/index.vue
Normal file
@@ -0,0 +1,313 @@
|
||||
<template>
|
||||
<view class="index" :style="[theme]">
|
||||
<view class="onecontent">
|
||||
个人信息
|
||||
</view>
|
||||
<view class="towcontent">
|
||||
<view class="towcontent_item flex-between">
|
||||
<view class="towcontent_item_text">
|
||||
头像
|
||||
</view>
|
||||
<view class="towcontent_item_box">
|
||||
<button open-type="chooseAvatar" @chooseavatar='onChooseAvatar' style="padding: 0;margin: 0;">
|
||||
<image class="towcontent_item_box_imge" :src="urlavatar" mode="aspectFill"></image>
|
||||
<!-- <image v-else class="towcontent_item_box_imge" src="@/static/logo.png" mode="aspectFill"></image> -->
|
||||
</button>
|
||||
<!-- <image v-if="userlist.avatar" class="towcontent_item_box_imge" :src="userlist.avatar" mode="aspectFill">
|
||||
</image>
|
||||
-->
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontent_item flex-between">
|
||||
<view class="towcontent_item_text">
|
||||
UID
|
||||
</view>
|
||||
<view class="towcontent_item_box flex-start">
|
||||
<text class="towcontent_item_box_text">ID:{{userlist.user_id}}</text>
|
||||
<!-- <u-icon name="arrow-right" color="#909399" size="14"></u-icon> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontent_item flex-between">
|
||||
<view class="towcontent_item_text">
|
||||
昵称
|
||||
</view>
|
||||
<view class="towcontent_item_box flex-start">
|
||||
<input class="towcontent_item_box_text" style="text-align: right;" type="nickname" @blur="blurname"
|
||||
v-model="userlist.nickname" placeholder="请输入昵称">
|
||||
<!-- <text class="towcontent_item_box_text">{{userlist.nickname||'暂无您称'}}</text> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontent_item flex-between">
|
||||
<view class="towcontent_item_text">
|
||||
性别
|
||||
</view>
|
||||
<view class="towcontent_item_box flex-start">
|
||||
<u-radio-group v-model="userlist.gender" placement="row" @change="groupChange">
|
||||
<u-radio shape="circle" label="男" name="1"></u-radio>
|
||||
<u-radio style="margin-left: 10rpx;" shape="circle" label="女" name="2"></u-radio>
|
||||
</u-radio-group>
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontent_item flex-between" @click="datetimeshow = true">
|
||||
<view class="towcontent_item_text">
|
||||
生日
|
||||
</view>
|
||||
<view class="towcontent_item_box flex-start">
|
||||
<text class="towcontent_item_box_text">{{userlist.birthday || ''}}</text>
|
||||
<u-icon name="arrow-right" color="#909399" size="14"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontent_item flex-between">
|
||||
<view class="towcontent_item_text">
|
||||
手机号
|
||||
</view>
|
||||
<view class="towcontent_item_box flex-start" v-if="userlist.mobile">
|
||||
<text
|
||||
class="towcontent_item_box_text">{{userlist.mobile.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2') }}</text>
|
||||
<!-- <navigator :url="'/pages/my/setup/phone'" class="towcontent_item_box_ghbd">
|
||||
更换绑定
|
||||
</navigator>
|
||||
<button class="towcontent_item_box_ghbd" open-type="getPhoneNumber"
|
||||
@getphonenumber="getPhoneNumber">获取电话</button>-->
|
||||
</view>
|
||||
<!-- <navigator :url="'/pages/my/setup/phone'" v-else class="towcontent_item_box flex-start">
|
||||
<text class="towcontent_item_box_text">去绑定</text>
|
||||
<u-icon name="arrow-right" color="#909399" size="14"></u-icon>
|
||||
</navigator> -->
|
||||
<view v-else class="towcontent_item_box flex-start">
|
||||
<button class="towcontent_item_box_ghbd" open-type="getPhoneNumber"
|
||||
@getphonenumber="getPhoneNumber">获取电话</button>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="thereconse thereconses" @click="useruserinfoedit">
|
||||
保存
|
||||
</view>
|
||||
<u-datetime-picker :minDate="-946800000000" :maxDate="2240409600000" :show="datetimeshow"
|
||||
v-model="datetimevalue" @cancel='datetimeshow = false' @confirm="confirmdatetime"
|
||||
mode="date"></u-datetime-picker>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadImage from "@/js_sdk/yushijie-ossutil/ossutil/uploadFile.js";
|
||||
import WXBizDataCrypt from "@/common/js/WXBizDataCrypt.js" // 需要引入
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
urlavatar: '',
|
||||
userlist: {},
|
||||
datetimeshow: false,
|
||||
datetimevalue: '',
|
||||
// u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
|
||||
};
|
||||
},
|
||||
onLoad() {},
|
||||
computed: {
|
||||
theme() {
|
||||
return this.$store.getters.theme
|
||||
},
|
||||
},
|
||||
onShow() {
|
||||
this.useruserinfo()
|
||||
|
||||
},
|
||||
watch: {},
|
||||
methods: {
|
||||
// / 更换头像
|
||||
onChooseAvatar(e) {
|
||||
uni.showLoading({
|
||||
title: '上传中',
|
||||
mask: true
|
||||
})
|
||||
console.log(e.detail.avatarUrl)
|
||||
let file = e.detail.avatarUrl;
|
||||
uploadImage(file, '',
|
||||
result => {
|
||||
//将上传后的图片以对象（官方要求的格式）的形式存入uni-file-picker的value值imageValue（imageValue值的结构为数组包对象）用于图片回显
|
||||
// let objAge = {
|
||||
// 'url': result,
|
||||
// 'extname': 'png',
|
||||
// 'name': 'imgss.png'
|
||||
// };
|
||||
// this.userlist.avatar.push(objAge)
|
||||
this.urlavatar = result
|
||||
console.log(this.urlavatar)
|
||||
uni.hideLoading()
|
||||
}, result => {
|
||||
uni.hideLoading()
|
||||
})
|
||||
},
|
||||
// 获取昵称
|
||||
blurname(e) {
|
||||
console.log(e);
|
||||
this.userlist.nickname = e.detail.value
|
||||
},
|
||||
async useruserinfo() {
|
||||
let res = await this.api.useruserinfo()
|
||||
uni.cache.set('loginuser', res);
|
||||
this.userlist = res.userinfo
|
||||
this.userlist.gender = String(res.userinfo.gender)
|
||||
this.urlavatar = res.userinfo.avatar
|
||||
|
||||
},
|
||||
async useruserinfoedit() {
|
||||
if (this.userlist.mobile == '' || this.userlist.mobile == null) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '请先绑定手机号'
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (this.urlavatar == '' || this.urlavatar == null) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '头像不能为空'
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (this.userlist.gender == '' || this.userlist.gender == null) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '性别不能为空'
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (this.userlist.birthday == '' || this.userlist.birthday == null) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '生日不能为空'
|
||||
});
|
||||
return;
|
||||
}
|
||||
let res = await this.api.useruserinfoedit({
|
||||
avatar: this.urlavatar,
|
||||
nickname: this.userlist.nickname,
|
||||
gender: this.userlist.gender,
|
||||
birthday: this.userlist.birthday
|
||||
})
|
||||
uni.showToast({
|
||||
title: '修改成功',
|
||||
icon: 'none'
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
}, 2000);
|
||||
console.log(res)
|
||||
},
|
||||
confirmdatetime(e) {
|
||||
console.log(e)
|
||||
this.datetimeshow = false
|
||||
this.userlist.birthday = uni.$u.date(e.value, 'yyyy-mm-dd')
|
||||
},
|
||||
groupChange(n) {
|
||||
console.log(n)
|
||||
this.userlist.gender = n
|
||||
},
|
||||
async getPhoneNumber(res) { // 获取手机号
|
||||
var resdataa = res
|
||||
console.log(res)
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.login({
|
||||
provider: 'weixin',
|
||||
success: async (data) => {
|
||||
let resdata = await this.api.usergetwechatphone({
|
||||
code: data.code,
|
||||
iv: resdataa.detail.iv,
|
||||
encryptedData: resdataa.detail.encryptedData
|
||||
})
|
||||
this.userlist.mobile = resdata.mobile
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
|
||||
// #endif
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
::v-deep .u-radio{
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
.index {
|
||||
padding: 28rpx;
|
||||
|
||||
.onecontent {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.towcontent {
|
||||
padding: 0 32rpx;
|
||||
margin-top: 24rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.towcontent_item:nth-child(1) {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
.towcontent_item {
|
||||
padding: 22rpx;
|
||||
border-top: 1rpx dotted #ccc;
|
||||
|
||||
.towcontent_item_text {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.towcontent_item_box {
|
||||
.towcontent_item_box_imge {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
|
||||
.towcontent_item_box_text {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.towcontent_item_box_ghbd {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #9397C1;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.thereconse {
|
||||
width: 630rpx;
|
||||
height: 80rpx;
|
||||
background: #999999;
|
||||
border-radius: 40rpx;
|
||||
font-size: 36rpx;
|
||||
text-align: center;
|
||||
margin: 84rpx auto;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
line-height: 80rpx;
|
||||
}
|
||||
|
||||
.thereconses {
|
||||
background: var(--bg-color-button);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
249
pages/my/setup/phone.vue
Normal file
249
pages/my/setup/phone.vue
Normal file
@@ -0,0 +1,249 @@
|
||||
<template>
|
||||
<view class="Box">
|
||||
<!-- <view class="Box_one">设置新手机</view>
|
||||
<view class="Box_T">设置新手机号需要通过短信验证</view>
|
||||
<view class="Box_there">当前手机号：{{ form.mobile.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2') }}</view> -->
|
||||
<view class="Box_consitem">
|
||||
<view class="Box_box flex-start">
|
||||
<text class="top_box_one_text">中国大陆+86</text>
|
||||
<input type="number" class="top_box_one_textinput" v-model="form.mobile" style="font-size: 24rpx;"
|
||||
placeholder="请输入手机号" maxlength="11" data-key="mobile" />
|
||||
</view>
|
||||
<view class="Box_box flex-between"
|
||||
style="padding: 14rpx 0;border-top: 1rpx solid #efefef;border-bottom: 1rpx solid #efefef; margin-top: 0;">
|
||||
<text class="top_box_one_text" style="border-right:none;">验证码</text>
|
||||
<input type="number" style="font-size: 24rpx;" v-model="form.code" placeholder="请输入短信验证码" />
|
||||
<view class="top_box_one_texts">
|
||||
<view v-if="showText == true" class="yzm" @click="CodeRegister">{{ Recapture }}</view>
|
||||
<view v-else style="color: #ccc; background-color: #f9f9f9; border-radius:16px; padding: 10rpx;">
|
||||
{{ second }}s重新发送
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="agreement flex-start">
|
||||
<u-checkbox-group><u-checkbox shape="circle" @change="radioChange"
|
||||
size="12"></u-checkbox></u-checkbox-group>
|
||||
<text>阅读并同意银收客预约</text>
|
||||
<view class="agreement-Item" @click="Privacy(1)">《用户协议》</view>
|
||||
及
|
||||
<view class="agreement-Item" @click="Privacy(2)">《隐私政策》</view>
|
||||
</view>
|
||||
<view class="flex-colum">
|
||||
<view class="Box_bottom" @click="userInfochangePhone">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
radioChangeItem: false, //单选框
|
||||
form: {
|
||||
mobile: '',
|
||||
code: '',
|
||||
oldPhone: '',
|
||||
password: ''
|
||||
},
|
||||
// 注册定时器 初始值
|
||||
second: 60,
|
||||
showText: true,
|
||||
Recapture: '发送验证码'
|
||||
};
|
||||
},
|
||||
onLoad() {},
|
||||
computed: {},
|
||||
methods: {
|
||||
async CodeRegister() {
|
||||
//发起验证码
|
||||
if (this.form.mobile == null || this.form.mobile == '') {
|
||||
uni.showToast({
|
||||
title: '请输入电话号码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
const res = await this.api.smssend({
|
||||
// post 手机验证码
|
||||
mobile: this.form.mobile,
|
||||
event: 'binding'
|
||||
});
|
||||
console.log(res);
|
||||
uni.showToast({
|
||||
title: '验证码获取成功',
|
||||
icon: 'none'
|
||||
});
|
||||
// 定时器
|
||||
this.showText = false;
|
||||
this.Recapture = '重新获取';
|
||||
var interval = setInterval(() => {
|
||||
let times = --this.second;
|
||||
this.second = times < 10 ? '0' + times : times; //小于10秒补 0
|
||||
}, 1000);
|
||||
setTimeout(() => {
|
||||
clearInterval(interval);
|
||||
this.second = 60;
|
||||
this.showText = true;
|
||||
}, 60000);
|
||||
},
|
||||
radioChange(n) {
|
||||
//是否同意
|
||||
this.radioChangeItem = n;
|
||||
},
|
||||
async Privacy(e) {
|
||||
let res = await this.api.useruserpolicy();
|
||||
if (e == 1) {
|
||||
//用户协议
|
||||
uni.pro.navigateTo('webview/html', {
|
||||
src: res.agreement
|
||||
});
|
||||
} else {
|
||||
uni.pro.navigateTo('webview/html', {
|
||||
src: res.policy
|
||||
});
|
||||
}
|
||||
},
|
||||
async userInfochangePhone() {
|
||||
if (this.form.mobile == null || this.form.mobile == '') {
|
||||
uni.showToast({
|
||||
title: '请输入电话号码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.code == null || this.form.code == '') {
|
||||
uni.showToast({
|
||||
title: '请输入验证码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.radioChangeItem == false) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '请先阅读《用户协议》和《隐私政策》'
|
||||
});
|
||||
return;
|
||||
}
|
||||
let res = await this.api.userbindingphone({
|
||||
captcha: this.form.code,
|
||||
mobile: this.form.mobile,
|
||||
event: 'binding'
|
||||
});
|
||||
if (res) {
|
||||
uni.showToast({
|
||||
title: '成功',
|
||||
icon: 'none'
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.navigateBack()
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.Box {
|
||||
padding: 0 28rpx;
|
||||
|
||||
.Box_one {
|
||||
padding-top: 38rpx;
|
||||
font-size: 40rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.Box_T {
|
||||
margin-top: 2rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.Box_there {
|
||||
margin-top: 70rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.Box_consitem {
|
||||
background: #ffffff;
|
||||
padding: 32rpx;
|
||||
border-radius: 24rpx;
|
||||
margin-top: 22rpx;
|
||||
|
||||
.Box_box {
|
||||
padding: 18rpx 0;
|
||||
|
||||
.top_box_one_text {
|
||||
width: auto;
|
||||
padding: 0 20rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
border-right: 1rpx solid #ccc;
|
||||
}
|
||||
|
||||
.top_box_one_textinput {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
input {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.top_box_one_texts {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #5082fd;
|
||||
}
|
||||
}
|
||||
|
||||
.agreement {
|
||||
margin-top: 14rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #7c8e97;
|
||||
|
||||
.agreement-Item {
|
||||
color: #4ca1fc;
|
||||
}
|
||||
}
|
||||
|
||||
.flex-colum {
|
||||
width: 100%;
|
||||
margin-top: 64rpx;
|
||||
|
||||
.Box_bottom {
|
||||
width: 558rpx;
|
||||
height: 72rpx;
|
||||
background: linear-gradient(115deg, #7E81A5 0%, #4D4E64 100%);
|
||||
border-radius: 50rpx;
|
||||
font-size: 36rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
line-height: 72rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
215
pages/my/setup/repairpassword.vue
Normal file
215
pages/my/setup/repairpassword.vue
Normal file
@@ -0,0 +1,215 @@
|
||||
<template>
|
||||
<view class="Box" :style="[theme]">
|
||||
<view class="box_one">安全密码用于支付，退款，确保资金安全</view>
|
||||
<view class="box_item flex-between">
|
||||
<text class="top_box_one_text">中国大陆+86</text>
|
||||
<input type="number" v-model="form.mobile" placeholder="请输入手机号" maxlength="11" disabled="disabled" />
|
||||
</view>
|
||||
<view class="box_item flex-between">
|
||||
<text class="top_box_one_text">密码</text>
|
||||
<input type="number" v-model="form.password" placeholder="密码必须是6位" maxlength="6" :password="!passwords" />
|
||||
</view>
|
||||
<view class="box_item flex-between">
|
||||
<text class="top_box_one_text">确认密码</text>
|
||||
<input type="number" v-model="form.payPassword" placeholder="确认密码必须是6位" maxlength="6"
|
||||
:password="!payPasswords" />
|
||||
</view>
|
||||
<view class="box_item flex-between" style="position:relative;">
|
||||
<text class="top_box_one_text">验证码</text>
|
||||
<input type="number" v-model="form.checkCode" placeholder="请输入验证码" style="padding-right: 140rpx;" />
|
||||
<view class="top_box_one_texts">
|
||||
<view v-if="showText == true" class="yzm" @click="CodeRegister">{{ Recapture }}</view>
|
||||
<view v-else style="color: #ccc; background-color: #f9f9f9; border-radius:16px; padding: 10rpx;">
|
||||
{{ second }}s重新发送
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex-colum">
|
||||
<view class="Box_bottom" @click="userInfosavePayPassword">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
mobile: uni.cache.get('loginuser').userinfo.mobile,
|
||||
password: '',
|
||||
payPassword: '',
|
||||
checkCode: ''
|
||||
},
|
||||
passwords: false,
|
||||
payPasswords: false,
|
||||
// 注册定时器 初始值
|
||||
second: 60,
|
||||
showText: true,
|
||||
Recapture: '发送验证码'
|
||||
};
|
||||
},
|
||||
onLoad() {},
|
||||
computed: {
|
||||
theme() {
|
||||
return this.$store.getters.theme
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
async CodeRegister() {
|
||||
//发起验证码
|
||||
const res = await this.api.smssend({
|
||||
mobile: this.form.mobile,
|
||||
event: 'setpassword'
|
||||
});
|
||||
if (res) {
|
||||
uni.showToast({
|
||||
title: '验证码获取成功',
|
||||
icon: 'none'
|
||||
});
|
||||
// 定时器
|
||||
this.showText = false;
|
||||
this.Recapture = '重新获取';
|
||||
var interval = setInterval(() => {
|
||||
let times = --this.second;
|
||||
this.second = times < 10 ? '0' + times : times; //小于10秒补 0
|
||||
}, 1000);
|
||||
setTimeout(() => {
|
||||
clearInterval(interval);
|
||||
this.second = 60;
|
||||
this.showText = true;
|
||||
}, 60000);
|
||||
}
|
||||
},
|
||||
async userInfosavePayPassword() {
|
||||
console.log(this.form.payPassword, this.form.password)
|
||||
if (this.form.mobile.length != 11) {
|
||||
uni.showToast({
|
||||
title: '手机号必须是11位',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.password == null || this.form.password == '') {
|
||||
uni.showToast({
|
||||
title: '请输入密码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.payPassword == null || this.form.payPassword == '') {
|
||||
uni.showToast({
|
||||
title: '请输入确认密码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.password.length != 6 || this.form.payPassword.length != 6) {
|
||||
uni.showToast({
|
||||
title: '密码必须是6位',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.payPassword != this.form.password) {
|
||||
uni.showToast({
|
||||
title: '密码和确认密码不一致',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.checkCode == null || this.form.checkCode == '') {
|
||||
uni.showToast({
|
||||
title: '请输入验证码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
let res = await this.api.uservippassword({
|
||||
password: this.form.password,
|
||||
c_password: this.form.payPassword,
|
||||
code: this.form.checkCode
|
||||
})
|
||||
if (res == 1) {
|
||||
uni.showToast({
|
||||
title: '修改成功',
|
||||
icon: 'none'
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
}, 2000);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.Box {
|
||||
padding: 0 28rpx;
|
||||
|
||||
.box_one {
|
||||
margin-top: 26rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.box_item {
|
||||
padding: 36rpx 0 0 0;
|
||||
|
||||
.top_box_one_text {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
input {
|
||||
width: 75%;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.repeat {
|
||||
position: absolute;
|
||||
bottom: 26rpx;
|
||||
right: 0;
|
||||
width: 25rpx;
|
||||
height: 17rpx;
|
||||
}
|
||||
|
||||
.top_box_one_texts {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #5082fd;
|
||||
}
|
||||
}
|
||||
|
||||
.flex-colum {
|
||||
width: 100%;
|
||||
margin-top: 156rpx;
|
||||
|
||||
.Box_bottom {
|
||||
width: 558rpx;
|
||||
height: 72rpx;
|
||||
background:var(--bg-color-button);
|
||||
border-radius: 50rpx;
|
||||
font-size: 36rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
line-height: 72rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user