czg_team/cashier_weapp
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

会员支付密码修改

Browse Source
This commit is contained in:
GaoHao
2024-08-03 09:19:37 +08:00
parent 8dd53c530a
commit e1e501e150
6 changed files with 781 additions and 503 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
components/cwx-keyboard/cwx-keyboard.vue
View File

@@ -1,5 +1,5 @@
<template>
<view class='keyboard' @click.stop='_handleKeyPress'>
<view class='keyboard' :style="{position: pos}" @click.stop='_handleKeyPress'>
<view class='key-row'>
<view class='key-cell cell_b' data-num='1'>1</view>
<view class='key-cell cell_b' data-num='2'>2</view>
@@ -46,7 +46,11 @@
},
btnColor: {
default: 'green',
}
},
pos: {
default: 'fixed',
type: String
},
},
data() {
return {

224
components/payPasswordtwo - 副本.vue Normal file
View File

@@ -0,0 +1,224 @@
<template>
<!-- ref:唯一ref passwrdType：密码样式pay keyInfo：密码输入返回事件 -->
<u-popup :show="payPasswordShow" :round="20" mode="bottom" @close="payPasswordShow = false" height="500" :safeAreaInsetBottom="false">
<view class="pay-info-wrap">
<view class="info-wrap flex-between">
<view class="close" @click="showShopInfo = false">
<u-icon name="close" color="#999999" size="28"></u-icon>
</view>
<text class="title">请输入支付密码</text>
<view></view>
</view>
<view class="info-content">
<view style="margin-bottom: 128rpx;">
<view class="pay-title">
<text style="margin-top: 4rpx;">￥ </text>
<text>123</text>
</view>
<view class="pay-password" @click="onPayUp">
<view class="list">
<text v-show="passwordArr.length >= 1">●</text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 2">●</text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 3">●</text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 4">●</text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 5">●</text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 6">●</text>
</view>
</view>
<!-- <view class="hint" @click="gopaypassword">
<text>忘记支付密码？</text>
</view> -->
</view>
<!-- ref:唯一ref passwrdType：密码样式pay keyInfo：密码输入返回事件 -->
<cc-defineKeyboard ref="CodeKeyboard" passwrdType="pay" @KeyInfo="KeyInfo"></cc-defineKeyboard>
</view>
</view>
</u-popup>
</template>
<script>
export default {
props: {
listinfo: {
type: Object,
default () {
return {
}
}
},
},
components: {
},
data() {
return {
// AffirmStatus: 1,
payPasswordShow: true,
passwordArr: [],
oldPasswordArr: [],
newPasswordArr: [],
afPasswordArr: [],
};
},
onLoad() {
},
methods: {
// 忘记支付密码
gopaypassword() {
uni.pro.navigateTo('/pages/user/repairpassword')
},
/**
* 唤起键盘
*/
onPayUp() {
this.$refs.CodeKeyboard.show();
},
/**
* 支付键盘回调
* @param {Object} val
*/
KeyInfo(val) {
if (val.index >= 6) {
return;
}
// 判断是否输入的是删除键
if (val.keyCode === 8) {
// 删除最后一位
this.passwordArr.splice(val.index + 1, 1)
}
// 判断是否输入的是.
else if (val.keyCode == 190) {
// 输入.无效
} else {
this.passwordArr.push(val.key);
}
// uni.showModal({
// title: '温馨提示',
// content: '输入密码是 = ' + JSON.stringify(this.passwordArr)
// })
// 判断是否等于6
if (this.passwordArr.length === 6) {
// this.AffirmStatus = this.AffirmStatus + 1;
let str = ''
this.passwordArr.forEach(res => {
str += res
})
this.$emit('accountPayevent', str)
this.passwordArr = [];
}
// 判断到哪一步了
// if (this.AffirmStatus === 1) {
// this.oldPasswordArr = this.passwordArr;
// } else if (this.AffirmStatus === 2) {
// this.newPasswordArr = this.passwordArr;
// } else if (this.AffirmStatus === 3) {
// this.afPasswordArr = this.passwordArr;
// } else if (this.AffirmStatus === 4) {
// console.log(this.oldPasswordArr.join(''));
// console.log(this.newPasswordArr.join(''));
// console.log(this.afPasswordArr.join(''));
// uni.showToast({
// title: '修改成功',
// icon: 'none'
// })
// setTimeout(() => {
// uni.navigateBack();
// }, 2000)
// }
this.$forceUpdate();
}
}
}
</script>
<style lang="scss">
.page-total{
position: inherit;
}
/deep/ .page-total{
position: inherit;
}
.pay-info-wrap{
.info-wrap{
padding: 64rpx 30rpx 0 30rpx;
box-sizing: border-box;
.title{
align-self: center;
font-size: 32rpx;
color: #333;
font-weight: bold;
}
}
.info-content{
.pay-title {
display: flex;
align-items: flex-end;
justify-content: center;
font-weight: bold;
width: 100%;
font-size: 48rpx;
color: #333;
margin-top: 48rpx;
text {
font-size: 60rpx;
color: #333;
}
}
.pay-password {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 64rpx;
.list {
width: 88rpx;
height: 88rpx;
display: flex;
align-items: center;
justify-content: center;
border: 2rpx solid #999;
border-radius: 8rpx;
text {
font-size: 32rpx;
}
}
}
.hint {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100rpx;
text {
font-size: 28rpx;
color: #ccc;
}
}
}
}
</style>

397
components/payPasswordtwo.vue
View File

@@ -1,224 +1,227 @@
<template>
<!-- ref:唯一ref passwrdType：密码样式pay keyInfo：密码输入返回事件 -->
<u-popup :show="payPasswordShow" :round="20" mode="bottom" @close="payPasswordShow = false" height="500" :safeAreaInsetBottom="false">
<view class="pay-info-wrap">
<view class="info-wrap flex-between">
<view class="close" @click="showShopInfo = false">
<u-icon name="close" color="#999999" size="28"></u-icon>
</view>
<text class="title">请输入支付密码</text>
<view></view>
<view class="content">
<view style="margin-bottom: 128rpx;">
<view class="contenttext flex-center">
{{form.password.length == 6?'请再次确认支付密码':"请设置新密码，用于支付验证"}}
</view>
<view class="info-content">
<view style="margin-bottom: 128rpx;">
<view class="pay-title">
<text style="margin-top: 4rpx;">￥ </text>
<text>123</text>
</view>
<view class="pay-password" @click="onPayUp">
<view class="list">
<text v-show="passwordArr.length >= 1">●</text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 2">●</text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 3">●</text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 4">●</text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 5">●</text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 6">●</text>
</view>
</view>
<!-- <view class="hint" @click="gopaypassword">
<text>忘记支付密码？</text>
</view> -->
<view class="contentbox flex-between">
<view class="contentboxitem flex-colum">
{{consumeFee.slice(0,1)}}
</view>
<view class="contentboxitem flex-colum">
{{consumeFee.slice(1,2)}}
</view>
<view class="contentboxitem flex-colum">
{{consumeFee.slice(2,3)}}
</view>
<view class="contentboxitem flex-colum">
{{consumeFee.slice(3,4)}}
</view>
<view class="contentboxitem flex-colum">
{{consumeFee.slice(4,5)}}
</view>
<view class="contentboxitem flex-colum">
{{consumeFee.slice(5,6)}}
</view>
<!-- ref:唯一ref passwrdType：密码样式pay keyInfo：密码输入返回事件 -->
<cc-defineKeyboard ref="CodeKeyboard" passwrdType="pay" @KeyInfo="KeyInfo"></cc-defineKeyboard>
</view>
</view>
</u-popup>
<!-- <view class="" v-else>
</view> -->
<cwx-keyboard ref="keyboard" :pos="'inherit'" @confirmEvent="confirmEvent"
:money.sync="consumeFee"></cwx-keyboard>
</view>
</template>
<script>
import cwxKeyboard from '@/components/cwx-keyboard/cwx-keyboard';
export default {
props: {
listinfo: {
type: Object,
default () {
return {
}
}
},
},
components: {
cwxKeyboard
},
data() {
return {
// AffirmStatus: 1,
payPasswordShow: true,
passwordArr: [],
oldPasswordArr: [],
newPasswordArr: [],
afPasswordArr: [],
isPwd: uni.cache.get('userInfo').isPwd,
form: {
mobile: uni.cache.get('userInfo').telephone,
password: '', //密码
payPassword: '', //二次密码
checkCode: ''
},
passwords: false,
payPasswords: false,
// 注册定时器 初始值
second: 60,
showText: true,
Recapture: '发送验证码',
consumeFee: '', //第一遍
consumeFees: '', //第二遍
money: ''
};
},
onLoad() {
console.log(uni.cache.get('userInfo').isPwd)
if (uni.cache.get('userInfo').isPwd != 0) {
uni.setNavigationBarTitle({
title: '忘记支付密码', // 标题文本，必须是字符串
});
}
},
methods: {
// 忘记支付密码
gopaypassword() {
uni.pro.navigateTo('/pages/user/repairpassword')
},
/**
* 唤起键盘
*/
onPayUp() {
this.$refs.CodeKeyboard.show();
},
/**
* 支付键盘回调
* @param {Object} val
*/
KeyInfo(val) {
if (val.index >= 6) {
return;
}
// 判断是否输入的是删除键
if (val.keyCode === 8) {
// 删除最后一位
this.passwordArr.splice(val.index + 1, 1)
}
// 判断是否输入的是.
else if (val.keyCode == 190) {
// 输入.无效
watch: {
consumeFee(newVal, oldVal) {
if (this.form.password.length == 6) {
this.form.payPassword = newVal
if (this.form.payPassword.length == 6) {
this.userInfosavePayPassword()
}
} else {
this.passwordArr.push(val.key);
}
// uni.showModal({
// title: '温馨提示',
// content: '输入密码是 = ' + JSON.stringify(this.passwordArr)
// })
// 判断是否等于6
if (this.passwordArr.length === 6) {
// this.AffirmStatus = this.AffirmStatus + 1;
let str = ''
this.passwordArr.forEach(res => {
str += res
})
this.$emit('accountPayevent', str)
this.passwordArr = [];
}
// 判断到哪一步了
// if (this.AffirmStatus === 1) {
// this.oldPasswordArr = this.passwordArr;
// } else if (this.AffirmStatus === 2) {
// this.newPasswordArr = this.passwordArr;
// } else if (this.AffirmStatus === 3) {
// this.afPasswordArr = this.passwordArr;
// } else if (this.AffirmStatus === 4) {
// console.log(this.oldPasswordArr.join(''));
// console.log(this.newPasswordArr.join(''));
// console.log(this.afPasswordArr.join(''));
// uni.showToast({
// title: '修改成功',
// icon: 'none'
// })
// setTimeout(() => {
// uni.navigateBack();
// }, 2000)
// }
this.$forceUpdate();
}
}
}
</script>
<style lang="scss">
.page-total{
position: inherit;
}
/deep/ .page-total{
position: inherit;
}
.pay-info-wrap{
.info-wrap{
padding: 64rpx 30rpx 0 30rpx;
box-sizing: border-box;
.title{
align-self: center;
font-size: 32rpx;
color: #333;
font-weight: bold;
}
}
.info-content{
.pay-title {
display: flex;
align-items: flex-end;
justify-content: center;
font-weight: bold;
width: 100%;
font-size: 48rpx;
color: #333;
margin-top: 48rpx;
text {
font-size: 60rpx;
color: #333;
}
}
.pay-password {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 64rpx;
.list {
width: 88rpx;
height: 88rpx;
display: flex;
align-items: center;
justify-content: center;
border: 2rpx solid #999;
border-radius: 8rpx;
text {
font-size: 32rpx;
this.form.password = newVal
if (this.form.password.length == 6) {
this.$refs.keyboard._handleClearKey() //清空
}
}
}
},
methods: {
confirmEvent(e) {
console.log(e)
},
async CodeRegister() {
const res = await this.api.phoneValidateCode({
// post 手机验证码
phone: this.form.mobile
});
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 loginwxuserInfo() {
let res = await this.api.loginwxuserInfo({
userId: uni.cache.get('userInfo').id
})
if (res.code == 0) {
uni.cache.set('userInfo', res.data);
}
},
async userInfosavePayPassword() {
if (this.form.mobile.length != 11 && this.isPwd == 0) {
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) {
this.$refs.keyboard._handleClearKey() //清空
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.loginresetPwd({
pwd: this.form.password,
code: this.form.checkCode
})
.hint {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100rpx;
text {
font-size: 28rpx;
color: #ccc;
if (res.code == 0) {
if (uni.cache.get('userInfo').isPwd != 0) {
uni.showToast({
title: '修改成功',
icon: 'none'
});
} else {
uni.showToast({
title: '设置成功',
icon: 'none'
});
}
// 获取用户信息
this.loginwxuserInfo()
setTimeout(() => {
uni.navigateBack();
}, 1000);
} else {
this.$refs.keyboard._handleClearKey() //清空
this.form.payPassword = ''
this.form.password = ''
}
}
}
};
</script>
<style lang="scss">
/keep/ .keyboard {
position: inherit;
}
.content {
height: 100%;
background: #FFFFFF;
.contenttext {
padding: 48rpx 0;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 40rpx;
color: #333333;
}
.contentbox {
margin-top: 48rpx;
padding: 0 56rpx;
.contentboxitem {
width: 88rpx;
height: 88rpx;
background: #FFFFFF;
border-radius: 8rpx 8rpx 8rpx 8rpx;
border: 2rpx solid #999999;
}
}
}
</style>

24
pages/order/confirm_order.vue
View File

@@ -124,8 +124,24 @@
<view class="paymentBtnText" @tap="$u.debounce(orderdetail, 500)" v-else> {{ paymentBtnText }} </view>
</view>
<u-popup :show="ispws" :round="20" mode="bottom" @close="ispws = false" height="500" :safeAreaInsetBottom="false">
<view class="pay-info-wrap">
<view class="info-wrap flex-between">
<view class="close" @click="showShopInfo = false">
<u-icon name="close" color="#999999" size="28"></u-icon>
</view>
<text class="title">请输入支付密码</text>
<view></view>
</view>
<view class="info-content">
<payPasswordtwo ref="payPwd" :listinfo="listinfo" @accountPayevent="accountPayevent" v-if="ispws"></payPasswordtwo>
</view>
</view>
</u-popup>
<!-- 支付密码 -->
<payPasswordtwo ref="payPwd" :listinfo="listinfo" @accountPayevent="accountPayevent" v-if="ispws"></payPasswordtwo>
<!-- <payPasswordtwo ref="payPwd" :listinfo="listinfo" @accountPayevent="accountPayevent" v-if="ispws"></payPasswordtwo> -->
</view>
</template>
@@ -176,6 +192,7 @@
remark: "", // 备注
radiovalue: 1, // 支付方式
ispws: false, // 输入支付密码
payPasswordShow: false,
amountVIP: null, // 会员信息
listinfoid: null,
paymentBtnText: "会员卡支付",
@@ -392,9 +409,10 @@
})
} else {
uni.hideLoading()
// this.payPasswordShow = false;
this.ispws = true
this.$nextTick(() => {
this.$refs.payPwd.onPayUp();
// this.$refs.payPwd.onPayUp();
})
}
}
@@ -460,7 +478,7 @@
* @param {Object} pwd
*/
async accountPayevent(pwd) {
this.ispws = false
this.ispws = false;
console.log(pwd)
let res = await this.api.accountPay({
orderId: this.listinfoid,

375
pages/order_food/order_food.vue
View File

@@ -4,19 +4,16 @@
<view v-if="fixedtrue"
style="height: 100vh; width: 100%; position: fixed; z-index: 999; top: 0; left: 0; background-color: #fff; display: flex; justify-content: center; align-items: center;">
<image style="width: 140rpx; height: 140rpx;" src="@/static/1.gif" mode="aspectFill"></image>
<text style="margin-left:10rpx;font-size: 40rpx;color: #7d7d76;">加载中</text>
<text style="margin-left10rpx;font-size: 40rpx;color: #7d7d76;">加载中</text>
</view>
<!-- 顶部面板 -->
<view class="top--panel">
<navseat :opacity='opacity' :titleshow='true' :heightshow='opacity' @Topdistance='Topdistance'></navseat>
<navseat :opacity='opacity' :titleshow='true' :heightshow='opacity'></navseat>
<!-- #ifdef MP-WEIXIN -->
<view v-show="isNavShow" :style="{'height':HeighT.customBar+HeighT.heightBar+'px;background-color: #fff;position: fixed;top: 0;left: 0;width: 100%;z-index: 999'}"></view>
<!-- #endif -->
<!-- 顶部面板，可添加所需要放在页面顶部的内容代码。比如banner图 -->
<!-- https://czg-qr-order.oss-cn-beijing.aliyuncs.com/orderfood/shuangyu1.png -->
<image class="panelimgbackground"
:src="shopInfo.storeInfo.coverImg"
mode="aspectFill">
<image class="panelimgbackground" :src="shopInfo.storeInfo.coverImg" mode="aspectFill">
</image>
<view class="panelone">
{{ shopInfo.storeInfo.shopName }}
@@ -37,9 +34,10 @@
本店招牌菜
</view>
<view class="panelfive">
<scroll-view :scroll-x="panelfiveShow" :scroll-into-view="leftIntoView" :scroll-with-animation="false">
<scroll-view :scroll-x="true" :scroll-into-view="leftIntoView" :scroll-with-animation="false">
<view class="panelfive_list">
<view class="panelfiveitem" @click="clickspecifications(item,index,index,'热销')" v-for="(item,index) in shopProductList.hots" :key="index">
<view class="panelfiveitem" @click="clickspecifications(item,index,index,'热销')"
v-for="(item,index) in shopProductList.hots" :key="index">
<image class="panelfiveitemimage" :src="item.coverImg" mode="aspectFill"></image>
<view class="panelfiveitemone">
{{ item.name }}
@@ -70,14 +68,16 @@
<view class="sku-wrap flex-center" v-if="item.productSkuResult != null"
@click.stop="clickspecifications(item,index,index1)">
<text class="t">选规格</text>
<text class="dot num" v-if="item.cartNumber != '0'">{{item.cartNumber<99?item.cartNumber:'99+'}}</text>
<text class="dot num"
v-if="item.cartNumber != '0'">{{item.cartNumber<99?item.cartNumber:'99+'}}</text>
</view>
<view class="Controls" v-else>
<view v-if="item.cartNumber != '0'" @click.stop="cartadd(item,'-',item.productSkuResult == null ? '单规格':'',$event)">
<u-icon name="minus-circle-fill" color="#E9AB7A" size="50"></u-icon>
<view v-if="item.cartNumber != '0'"
@click.stop="cartadd(item,'-',item.productSkuResult == null ? '单规格':'',$event)">
<u-icon name="minus-circle-fill" color="#E9AB7A" size="50"></u-icon>
</view>
<text class="num"> {{ item.cartNumber }} </text>
<view @click.stop="cartadd(item,'+',item.productSkuResult == null ? '单规格':'')">
<view @click.stop="cartadd(item,'+',item.productSkuResult == null ? '单规格':'')">
<u-icon name="plus-circle-fill" color="#E9AB7A" size="50"></u-icon>
</view>
</view>
@@ -92,44 +92,54 @@
<view class="scroll-panel" id="scroll-panel">
<view class="list-box">
<view class="left">
<scroll-view :scroll-y="!isFixed" :style="{ 'height':scrollHeight + 'px' }"
<scroll-view :scroll-y="!isFixed" :style="{ 'height':scrollHeight -100 + 'px' }"
:scroll-into-view="leftIntoView" :scroll-with-animation="false">
<view class="item" v-for="(item,index) in shopProductList.productInfo" :key="index"
:class="{ 'active':index==leftIndex }" :id="'left-'+index" :data-index="index"
@tap="leftTap($event,index)">{{item.name}}</view>
@tap="leftTap">{{item.name}}</view>
</scroll-view>
</view>
<view class="main">
<scroll-view :scroll-y="!isFixed" :scroll-top="scrollHeight" :style="{ 'height':scrollHeight + 'px' }" @scroll="mainScroll"
:scroll-into-view="scrollInto" :scroll-with-animation="true">
<view class="item main-item" v-for="(item,index) in shopProductList.productInfo" :key="index" :id="'item-'+index">
<scroll-view :scroll-y="!isFixed" :scroll-top="scrollHeight"
:style="{ 'height':scrollHeight + 'px' }" @scroll="mainScroll" :scroll-into-view="scrollInto"
:scroll-with-animation="false">
<view class="item main-item" v-for="(item,index) in shopProductList.productInfo" :key="index"
:id="'item-'+index">
<view class="title">
<view>{{item.name}}</view>
</view>
<view class="goods" @click="clickspecifications(item1,index,index1)" v-for="(item1,index1) in item.products" :key="index1">
<image class="goodsImg" v-if="item1.coverImg!=null" :lazy-load="true" :src="`${item1.coverImg}?x-oss-process=image/resize,m_lfit,w_90,h_90`"></image>
<image class="goodsImg" src="@/static/1.gif" mode="" v-else :lazy-load="true" ></image>
<view v-if="item.name=='热销'" class="topSort" :class="'c'+(index1+1)">TOP{{index1+1}}</view>
<view class="goods" @click="clickspecifications(item1,index,index1)"
v-for="(item1,index1) in item.products" :key="index1">
<image class="goodsImg" v-if="item1.coverImg!=null" :lazy-load="true"
:src="`${item1.coverImg}?x-oss-process=image/resize,m_lfit,w_90,h_90`"></image>
<image class="goodsImg" src="@/static/1.gif" mode="" v-else :lazy-load="true"></image>
<view v-if="item.name=='热销'" class="topSort" :class="'c'+(index1+1)">TOP{{index1+1}}
</view>
<view class="goods_right">
<view class="name">{{ item1.name }}</view>
<view class="lookBack" v-if="item.name=='热销'">本店回头客第{{index1+1}}名</view>
<view class="describe"> {{item1.shortTitle?item1.shortTitle:''}} </view>
<view class="monthlySale">月售{{item1.stockNumber}}</view>
<view class="money">￥<text class="money_num">{{ item1.lowPrice }}</text>/份<text class="suit">「{{item1.suit}}份起点」</text></view>
<view class="money">￥<text class="money_num">{{ item1.lowPrice }}</text>/份<text
class="suit">「{{item1.suit}}份起点」</text></view>
<view class="flex-end" v-if="item1.productSkuResult != null">
<view class="sku-wrap flex-center" @click.stop="clickspecifications(item1,index,index1)">
<view class="sku-wrap flex-center"
@click.stop="clickspecifications(item1,index,index1)">
<text class="t">选规格</text>
<text class="dot num" v-if="item1.cartNumber != '0'">{{item1.cartNumber<99?item1.cartNumber:'99+'}}</text>
<text class="dot num"
v-if="item1.cartNumber != '0'">{{item1.cartNumber<99?item1.cartNumber:'99+'}}</text>
</view>
</view>
<view class="Controls" v-else>
<view v-if="item1.cartNumber != '0'" @click.stop="cartadd(item1,'-',item1.productSkuResult == null ? '单规格':'',$event)">
<u-icon name="minus-circle-fill" color="#E9AB7A" size="50"></u-icon>
<view v-if="item1.cartNumber != '0'"
@click.stop="cartadd(item1,'-',item1.productSkuResult == null ? '单规格':'',$event)">
<u-icon name="minus-circle-fill" color="#E9AB7A" size="50"></u-icon>
</view>
<text class="num"> {{ item1.cartNumber }} </text>
<view @click.stop="cartadd(item1,'+',item1.productSkuResult == null ? '单规格':'')">
<view
@click.stop="cartadd(item1,'+',item1.productSkuResult == null ? '单规格':'')">
<u-icon name="plus-circle-fill" color="#E9AB7A" size="50"></u-icon>
</view>
@@ -142,20 +152,14 @@
</view>
</view>
</view>
<!-- 底部面板 底部面板，可添加所需要放在页面底部的内容代码。比如购物车栏目 -->
<!-- <view class="bottom-panel">
<view style="background-color: #ffaa00;text-align: center;font-size: 28rpx;padding: 10px 0;color: #fff;">
<view>这里底部内容占位区域，不需要则删除</view>
<view>可添加需放在页面底部的内容，比如购物车栏目</view>
</view>
</view> -->
<!-- 购物车悬浮条 -->
<view class="cart-wrap" v-if="cartListsdatashow">
<view class="cart-content">
<view class="left">
<view class="iconBox">
<image class="icon" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/shopDetails/shopIcon.png"
<image class="icon"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/shopDetails/shopIcon.png"
mode="aspectFill" @click="showCart = !showCart">
</image>
<text class="u-badge"> {{cartLists_count<99?cartLists_count:'99+'}} </text>
@@ -165,13 +169,14 @@
<text class="num">{{cartLists.amount||'0.00'}}</text>
</view>
<view class="btn" @tap="$u.debounce(orderdetail, 500)">
<text class="t">去结算</text>
<text class="t">结算</text>
</view>
</view>
</view>
<!-- 购物车 -->
<u-popup :show="showCart" :round="20" :safeAreaInsetBottom="false" :zIndex="98" :overlayStyle="{ zIndex: 98 }" @close="showCart = false">
<u-popup :show="showCart" :round="20" :safeAreaInsetBottom="false" :zIndex="98" :overlayStyle="{ zIndex: 98 }"
@close="showCart = false">
<view class="cart-list-wrap">
<view class="cart-header flex-between">
<view class="num">已点 {{cartLists_count}} 份</view>
@@ -197,7 +202,7 @@
</view>
<view class="operation-wrap">
<view class="btn" v-if="item.number" @click="cartListadd(item,index,'-')">
<u-icon name="minus-circle-fill" color="#E9AB7A" size="50"></u-icon>
<u-icon name="minus-circle-fill" color="#E9AB7A" size="50"></u-icon>
</view>
<text class="num" v-if="item.number">{{ item.number }}</text>
<view class="btn" @click="cartListadd(item,index,'+')">
@@ -214,7 +219,7 @@
<!-- 店铺详情 -->
<u-popup :show="showShopInfo" :round="20" mode="bottom" @close="showShopInfo = false" height="500" >
<u-popup :show="showShopInfo" :round="20" mode="bottom" @close="showShopInfo = false" height="500">
<view class="shop-info-wrap">
<view class="info-wrap flex-between">
<view></view>
@@ -227,7 +232,8 @@
<view class="row" style="margin-bottom: 20rpx;">
<view class="col">
<text class="l">营业时间：</text>
<text class="t">{{ shopInfo.storeInfo.businessStartDay +'至'+ shopInfo.storeInfo.businessEndDay +' '+ shopInfo.storeInfo.businessTime }}</text>
<text
class="t">{{ shopInfo.storeInfo.businessStartDay +'至'+ shopInfo.storeInfo.businessEndDay +' '+ shopInfo.storeInfo.businessTime }}</text>
</view>
<view class="col">
<text class="l">商家地址：</text>
@@ -249,17 +255,17 @@
</view>
</u-popup>
<!-- 规格 -->
<u-popup :show="showShopsku" :round="20" mode="bottom" @close="showShopsku = false"
:safeAreaInsetBottom='false'>
<view class="shop_sku" :style="{ 'max-height':scrollHeight + 'px' }">
<view class="shop_sku" :style="{ 'max-height':scrollHeight + 'px' }">
<view class="positionabsolute">
<u-icon name="close-circle" @click="showShopsku = false" color="#000" size="50"></u-icon>
</view>
<image class="shop_skucimage" :src="specifications.coverImg" mode="aspectFill"></image>
<view class="shop_sku_name"> {{specifications.name}} </view>
<view class="shop_sku_returned" v-if="specifications.typeName&&specifications.typeName=='热销'"> 本店回头客第{{specifications.indexb+1}}名 </view>
<view class="shop_sku_returned" v-if="specifications.typeName&&specifications.typeName=='热销'">
本店回头客第{{specifications.indexb+1}}名 </view>
<view class="shop_sku_description"> {{specifications.shortTitle?specifications.shortTitle:''}} </view>
<view class="shop_sku_box" v-for="(item,index) in specifications.tagSnap" :key="index"
@@ -288,7 +294,7 @@
<view class="btn"
@click="shopAdd(specifications,specifications.indexa,specifications.indexb,'-',specifications.tagSnap == null ? '单规格':'')">
<u-icon name="minus-circle-fill" color="#E9AB7A" size="40"></u-icon>
<u-icon name="minus-circle-fill" color="#E9AB7A" size="40"></u-icon>
</view>
<text class="num">{{amountcartNumber}}</text>
<view class="btn"
@@ -300,7 +306,9 @@
<view class="shop_skuselect flex-start" v-if="specifications.tagSnap">
<view class="shop_skuselectname">{{skuidname.toString()}}</view>
</view>
<view class="addShopping" :class="amountcartNumber>0?'active':''" @click="addShopping(specifications,specifications.indexa,specifications.indexb,'+',specifications.tagSnap == null ? '单规格':'')">添加到购物车</view>
<view class="addShopping" :class="amountcartNumber>0?'active':''"
@click="addShopping(specifications,specifications.indexa,specifications.indexb,'+',specifications.tagSnap == null ? '单规格':'')">
添加到购物车</view>
</view>
</view>
</u-popup>
@@ -316,6 +324,7 @@
},
data() {
return {
fixedtrue: true,
userInfo: uni.cache.get('userInfo'), //个人信息
opacity: false, //是否显示
scrollHeight: 1000,
@@ -327,40 +336,34 @@
leftIndex: 0,
scrollInto: '',
isFixed: true,
isNavShow: false,
heightnav: '' ,//点击获取的距离
showShopInfo: false, //店铺信息弹窗是否显示
showShopsku: false, //多规格弹窗是否显示
skuId: null, // 多规格ID
showShopInfo: false, //店铺信息弹窗是否显示
showShopsku: false, //多规格弹窗是否显示
skuId: null, // 多规格ID
cartLists: {}, //购物车
cartLists_count: 0,
shopInfo: {}, //店铺信息
panelfiveShow: false,
shopProductList: {
}, //商品信息
shopInfo: {}, //店铺信息
shopProductList: {}, //商品信息
specifications: {
}, // 规格信息
}, // 规格信息
socketTicket: null,
amountcartNumber: 0,
skuNumber: 0,
salePrice: '', //钱数
cartListsdatashow: false ,//是否显示购物车
cartListsdatashow: false, //是否显示购物车
showCart: false,
}
},
onPageScroll(e) {
try {
if (e.scrollTop <= 44) { //搜索导航栏显示影藏
this.isNavShow = false
this.opacity = false
} else {
this.isNavShow = true
this.opacity = true
}
} catch (e) {
//TODO handle the exception
}
console.log(e.scrollTop,this.scrollTopSize)
if (e.scrollTop >= this.scrollTopSize) { //控制大图层
this.isFixed = false;
} else {
@@ -370,10 +373,10 @@
computed: {
/* 计算左侧滚动位置定位 */
leftIntoView() {
return `left-${this.leftIndex > 20 ? (this.leftIndex-20):0}`;
return `left-${this.leftIndex? this.leftIndex:0}`;
},
HeighT() { //手机类型的尺寸
return this.$store.getters.is_BarHeight
HeighT() { //手机类型的尺寸 导航栏高度
return this.$store.getters.is_BarHeight.heightBar + this.$store.getters.is_BarHeight.customBar
},
},
onReady() {
@@ -383,10 +386,7 @@
this.scrollHeight = data.windowHeight
}
})
this.panelfiveShow = true;
}, 100);
/* 在非H5平台，nextTick回调后有概率获取到错误的元素高度，则添加200ms的延迟来减少BUG的产生 */
},
onLoad(e) {
if (e.q) {
@@ -456,7 +456,7 @@
/**
* 通过桌码获取店铺信息
*/
async productqueryShop () {
async productqueryShop() {
let res = await this.api.productqueryShop({
code: uni.cache.get('tableCode'),
lng: uni.cache.get('getLocationstorage').lng,
@@ -464,9 +464,9 @@
})
if (res.code == 0) {
uni.cache.set('shopUser', res.data.storeInfo.id)
this.handlemessage() //监听websocket返回
this.shopInfo = res.data;
this.productqueryProduct() //list 数据
this.handlemessage() //监听websocket返回
} else {
setTimeout(() => {
uni.pro.switchTab('index/index')
@@ -485,7 +485,7 @@
})
if (res.code == 0) {
this.shopProductList = res.data;
if ( this.cartLists && this.cartLists.data && this.cartLists.data.length >= 0 ) {
if (this.cartLists && this.cartLists.data && this.cartLists.data.length >= 0) {
this.setNumber()
}
setTimeout(() => {
@@ -506,7 +506,7 @@
if (b == '单规格') { //没有规格为空
this.skuidname = []
}
let cartNumber = a == '+' ? item.cartNumber+1 : item.cartNumber-1;
let cartNumber = a == '+' ? item.cartNumber + 1 : item.cartNumber - 1;
this.hodgepodge(item, 1, a, cartNumber) //获取skuid /1添加购物车
},
@@ -518,7 +518,7 @@
* @param {Object} a
* @param {Object} b
*/
shopAdd (item, index, index1, a, b) {
shopAdd(item, index, index1, a, b) {
if ( a == "+" ){
if ( this.amountcartNumber <= 0) {
this.amountcartNumber = this.amountcartNumber + item.suit;
@@ -541,9 +541,8 @@
/**
* 添加购物车
*/
addShopping ( item, index, index1, a, b ) {
console.log(item)
if ( this.amountcartNumber <= 0 ) {
addShopping(item, index, index1, a, b) {
if (this.amountcartNumber <= 0) {
return;
}
let num = 0;
@@ -574,7 +573,7 @@
try {
let params = {
"skuId": item.skuId,
"num": c == '+' ? item.number + 1 : item.number -1, //数量
"num": c == '+' ? item.number + 1 : item.number - 1, //数量
"type": c == '+' ? 1 : 0,
"productId": item.productId, //商品id
"shopId": uni.cache.get('shopUser'),
@@ -591,9 +590,9 @@
/**
* 添加到购物车
*/
async addCart ( data ) {
async addCart(data) {
let res = await this.api.cartAdd(data)
if ( res.code == 0) {
if (res.code == 0) {
this.showShopsku = false;
this.$set(this, 'amountcartNumber', 0)
}
@@ -613,7 +612,7 @@
/**
* 商品数量\购物车数量处理
*/
setNumber () {
setNumber() {
// 处理购物车相同id的情况下 数量相加
var summedArray = this.cartLists.data.reduce((acc, current) => {
const existing = acc.find(item => item.productId === current.productId);
@@ -646,12 +645,10 @@
}
})
})
this.cartListsdatashow = this.cartLists.data.length == 0 ? false : true;
console.log(this.cartLists)
if ( this.cartLists.data.length > 0 ){
this.cartListsdatashow = this.cartLists.data.length == 0 ? false : true
if (this.cartLists.data.length > 0) {
this.cartLists_count = 0;
this.cartLists.data.forEach((v,e)=>{
console.log(v)
this.cartLists.data.forEach((v, e) => {
this.cartLists_count += v.number;
})
}
@@ -662,8 +659,7 @@
* @param {Object} index
* @param {Object} index1
*/
clickspecifications(item1, index, index1,type) {
console.log(item1)
clickspecifications(item1, index, index1, type) {
this.skuidname = []
this.specifications = item1
this.specifications.indexa = index
@@ -718,7 +714,6 @@
async hodgepodge(item, a, c, num) { //此接口去获取商品id ！！！赋值库存 数量 价格等
try {
let res = await this.api.productqueryProductSku({
code: uni.cache.get('tableCode'),
shopId: uni.cache.get('shopUser'),
productId: item.id, //商品id
spec_tag: this.skuidname.join(",")
@@ -786,7 +781,6 @@
* @param {Object} msg
*/
getMessage(msg) { //wss 回显数据
console.log(msg.type)
if (msg == 1) { // 网络在连接
this.fixedtrue = true
return false
@@ -824,7 +818,7 @@
this.cartLists = msg
try {
//购物车为空的情况
if ( msg.data.length == 0) {
if (msg.data.length == 0) {
this.showCart = false;
}
this.setNumber()
@@ -846,30 +840,22 @@
}
},
// 导航栏高度 去计算列表页的高度
Topdistance(e) {
this.heightnav = e ////导航栏高度
},
/* 获取元素顶部信息 */
getElementTop() {
new Promise((resolve, reject) => {
let view = uni.createSelectorQuery().selectAll('.main-item');
view.boundingClientRect(data => {
view.boundingClientRect(async data => {
resolve(data);
}).exec();
this.$u.getRect('.scroll-panel').then(res => {
console.log(res)
this.scrollTopSize = res.top - this.heightnav; //元素距离顶部的距离
this.scrollHeight = this.scrollHeight - this.heightnav
this.scrollTopSize = res.top; //元素距离顶部的距离
})
}).then((res) => {
let topArr = res.map((item) => {
return item.top - this.scrollTopSize; /* 减去滚动容器距离顶部的距离 */
return item.top; /* 减去滚动容器距离顶部的距离 加导航栏高度*/
});
this.scrollHeight = this.scrollHeight - this.HeighT
this.topArr = topArr;
/* 获取最后一项的高度，设置填充高度。判断和填充时做了 +-20 的操作，是为了滚动时更好的定位 */
let last = res[res.length - 1].height;
if (last - 20 < this.scrollHeight) {
@@ -879,28 +865,43 @@
},
/* 主区域滚动监听 */
mainScroll(e) {
// 节流方法
clearTimeout(this.mainThrottle);
this.mainThrottle = setTimeout(() => {
scrollFn();
}, 10);
let scrollFn = () => {
let top = e.detail.scrollTop;
let index = 0;
/* 查找当前滚动距离 */
for (let i = (this.topArr.length - 1); i >= 0; i--) {
/* 在部分安卓设备上，因手机逻辑分辨率与rpx单位计算不是整数，滚动距离与有误差，增加2px来完善该问题 */
if ((top + 2) >= this.topArr[i] - this.scrollTopSize) {
index = i;
break;
}
}
this.leftIndex = (index < 0 ? 0 : index);
}
},
/* 左侧导航点击 */
leftTap(e,index) {
leftTap(e) {
try {
this.leftIndex = (index < 0 ? 0 : index);
if (this.isFixed) {
uni.pageScrollTo({
scrollTop: this.scrollTopSize, //滑动需要的距离 nav+列表距离的高度
scrollTop: this.scrollTopSize + this.HeighT, //滑动需要的距离 nav+列表距离的高度
duration: 100
});
this.isFixed = false
}
} catch (e) {
//TODO handle the exception
}
setTimeout(() => {
let index = e.currentTarget.dataset.index;
this.scrollInto = `item-${index}`;
},)
}, 300)
}
}
}
@@ -920,9 +921,11 @@
justify-content: flex-start;
align-items: flex-start;
align-content: flex-start;
.navbarcontent .active{
.navbarcontent .active {
background-color: #fff;
}
&>view {
width: 100%;
}
@@ -1140,39 +1143,42 @@
}
.bottom-panel {
padding-bottom: 0;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
.shop-info-wrap{
.shop-info-wrap {
padding: 0 30rpx 50rpx;
box-sizing: border-box;
.info-wrap{
.info-wrap {
padding: 30rpx 0;
box-sizing: border-box;
.shopName{
.shopName {
align-self: center;
font-size: 32rpx;
color: #333;
font-weight: bold;
}
}
.info-wrap-title{
.info-wrap-title {
font-size: 32rpx;
font-weight: bold;
color: #333;
}
.row{
.col{
.row {
.col {
margin-bottom: 10rpx;
}
.l,.t{
.l,
.t {
font-size: 24rpx;
color: #999;
}
}
}
.shop_sku {
width: 100%;
position: relative;
@@ -1181,6 +1187,7 @@
overflow-y: auto;
padding-bottom: 320rpx;
box-sizing: border-box;
.positionabsolute {
position: absolute;
top: 30rpx;
@@ -1189,7 +1196,7 @@
.shop_skucimage {
width: 100%;
height: 500rpx!important;
height: 500rpx !important;
border-radius: 20rpx 20rpx 0 0;
}
@@ -1200,12 +1207,14 @@
font-size: 32upx;
margin-bottom: 16rpx;
}
.shop_sku_returned {
padding: 0 $paddingSize;
font-weight: 400;
font-size: 24rpx;
color: #FF534B;
}
.shop_sku_description {
padding: 0 $paddingSize;
font-weight: 400;
@@ -1274,10 +1283,11 @@
box-sizing: border-box;
padding: 30rpx $paddingSize;
background-color: #fff;
box-shadow: 0rpx -6rpx 14rpx 2rpx rgba(0,0,0,0.1);
box-shadow: 0rpx -6rpx 14rpx 2rpx rgba(0, 0, 0, 0.1);
position: fixed;
left: 0;
bottom: 0;
.price {
display: flex;
align-items: flex-end;
@@ -1310,7 +1320,8 @@
}
.addShopping{
.addShopping {
width: 100%;
height: 96rpx;
line-height: 96rpx;
@@ -1322,7 +1333,8 @@
color: #FFFFFF;
margin-top: 36rpx;
}
.addShopping.active{
.addShopping.active {
background: #E8AD7B;
}
}
@@ -1342,36 +1354,40 @@
align-items: center;
height: 128rpx;
background: #FFFFFF;
box-shadow: 0rpx 0rpx 20rpx 2rpx rgba(0,0,0,0.15);
box-shadow: 0rpx 0rpx 20rpx 2rpx rgba(0, 0, 0, 0.15);
border-radius: 58rpx;
padding: 0 36rpx;
box-sizing: border-box;
.left {
flex: 1;
display: flex;
align-items: center;
position: relative;
.iconBox{
.iconBox {
position: relative;
}
.icon {
width: 76rpx;
height: 88rpx;
margin-left: 22rpx;
}
.u-badge{
.u-badge {
position: absolute;
top: -30rpx;
right: -30rpx;
background-color: #FF4B33;
color: #fff;
border-radius: 58rpx;
padding: 5rpx 14rpx;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
font-size: 20rpx;
top: -30rpx;
right: -30rpx;
background-color: #FF4B33;
color: #fff;
border-radius: 58rpx;
padding: 5rpx 14rpx;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
font-size: 20rpx;
}
.i,
@@ -1395,16 +1411,18 @@
.btn {
width: 160rpx;
height: 64rpx;
background: #E7AE7B;
background: #FEFAF7;
border-radius: 36rpx 36rpx 36rpx 36rpx;
border: 2rpx solid #E8AD7B;
display: flex;
align-items: center;
justify-content: center;
.t{
justify-content: flex-end;
.t {
font-weight: bold;
font-size: 28rpx;
color: #FFFFFF;
color: #E8AD7B;
margin-right: 26rpx;
}
}
}
@@ -1419,11 +1437,13 @@
justify-content: space-between;
padding: 20upx $paddingSize;
border-radius: 20upx 20upx 0 0;
.num{
.num {
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
.clear {
display: flex;
align-items: center;
@@ -1444,6 +1464,7 @@
.list-wrap {
padding: $paddingSize 0 0 $paddingSize;
}
.shop-item {
display: flex;
padding-bottom: $paddingSize;
@@ -1495,19 +1516,19 @@
display: flex;
align-items: flex-end;
.i,.num{
.i,
.num {
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.i {
position: relative;
bottom: 4upx;
}
.num {
}
.num {}
}
.sku-wrap {
@@ -1586,6 +1607,7 @@
box-sizing: border-box;
font-size: 32rpx;
// padding-bottom: 200rpx;
.item {
padding: 0 30rpx;
height: 92rpx;
@@ -1594,9 +1616,7 @@
font-weight: 400;
font-size: 24rpx;
color: #333333;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
&+.item {
margin-top: 1px;
@@ -1629,6 +1649,7 @@
height: 100%;
width: 0;
}
&::after {
content: '';
display: block;
@@ -1685,6 +1706,7 @@
justify-content: flex-start;
align-content: center;
position: relative;
&+.goods {
margin-top: 16rpx;
}
@@ -1695,13 +1717,15 @@
margin-right: 18rpx;
margin-left: 2px;
}
.goodsImg{
.goodsImg {
width: 200rpx;
height: 200rpx;
border-radius: 18rpx;
flex-shrink: 0;
}
.topSort{
.topSort {
width: 92rpx;
height: 38rpx;
text-align: center;
@@ -1715,17 +1739,20 @@
border-radius: 20rpx 0rpx 20rpx 0rpx;
}
.topSort.c1{
.topSort.c1 {
background: #FC5C2E;
}
.topSort.c2{
.topSort.c2 {
background: #EF994E;
}
.topSort.c3{
.topSort.c3 {
background: #F4B951;
}
.goods_right{
.goods_right {
width: 100%;
display: flex;
flex-direction: column;
@@ -1733,27 +1760,24 @@
padding-top: 5rpx;
padding-right: 20rpx;
box-sizing: border-box;
.name{
.name {
font-size: 28rpx;
color: #333;
font-weight: bold;
margin-bottom: 8rpx;
}
.describe,.monthlySale,.lookBack {
.describe,
.monthlySale,
.lookBack {
font-weight: 400;
font-size: 20rpx;
color: #999999;
margin-bottom: 8rpx;
}
.describe,.name{
width: 270rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.lookBack{
.lookBack {
color: #FF534B;
}
@@ -1761,19 +1785,21 @@
font-weight: bold;
font-size: 24rpx;
color: #333;
.money_num{
.money_num {
font-size: 28rpx;
color: #333;
font-weight: bold;
}
}
.suit{
font-weight: 400;
font-size: 24rpx;
color: #666666;
.suit {
font-weight: 400;
font-size: 24rpx;
color: #666666;
}
.sku-wrap{
.sku-wrap {
width: 138rpx;
height: 54rpx;
background: #E3AD7F;
@@ -1783,10 +1809,12 @@
// right: 20rpx;
align-items: center;
position: relative;
.t{
.t {
font-size: 28rpx;
color: #fff;
}
.dot {
position: absolute;
top: -15rpx;
@@ -1803,14 +1831,15 @@
}
}
.Controls{
.Controls {
display: flex;
align-items: center;
justify-content: flex-end;
// position: absolute;
// bottom: 10rpx;
// right: 20rpx;
.num{
.num {
margin: auto 8rpx;
}
}

0
pages/user/repairpassword - 副本.vue → pages/user/repairpasswordtwo.vue
View File