add
This commit is contained in:
parent
02faeccc96
commit
de66593e4a
|
@ -0,0 +1,249 @@
|
||||||
|
<template>
|
||||||
|
<up-popup ref="popup" type="bottom" :mask-background-color="isPay?'rgba(0,0,0,.8)':'transparent'" safeArea
|
||||||
|
backgroundColor="transparent" :animation="true" @maskClick="maskClick">
|
||||||
|
<view class="popup-wrap" :style="{'border-radius':isPay?'': 0}">
|
||||||
|
<view class="paybox" v-if="isPay">
|
||||||
|
<view class="paybox-title">
|
||||||
|
<view class="paybox-title-left"></view>
|
||||||
|
<view class="paybox-title-middle">{{title}}</view>
|
||||||
|
<view class="paybox-titler-right" @click="handleClose">
|
||||||
|
<up-icon name="close" size="18" color="#666" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="paybox-input">
|
||||||
|
<u-code-input v-model="value" mode="box" dot readonly></u-code-input>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="keyboard">
|
||||||
|
<view class="keyboard-left" :style="{width:isPay?'100%':''}">
|
||||||
|
<block v-for="(item,indx) in keys" :key="indx">
|
||||||
|
<view class="keyboard-left-item active del" v-if="item=='del'" @click="handleClick(item)">
|
||||||
|
<image style="width: 48rpx;height: 48rpx;" src="@/static/del.webp" />
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="keyboard-left-item word active" :style="{width:isPay?'0%':'',border:isPay?'0':''}"
|
||||||
|
v-else-if="item == '.'" @click="handleClick(item)">
|
||||||
|
{{isPay?'':item}}
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="keyboard-left-item word active" :style="{width:(isPay && item == '0')?'66.66%':''}"
|
||||||
|
v-else @click="handleClick(item)">
|
||||||
|
{{item}}
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
<view class="keyboard-right" :style="{width:isPay?'0%':''}">
|
||||||
|
<view class="keyboard-right-clear word active" @click="handleClear">清空</view>
|
||||||
|
<view class="keyboard-right-pay word active-pay" @click="handlePay">{{txt}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</up-popup>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "popups",
|
||||||
|
props: {
|
||||||
|
txt: {
|
||||||
|
type: String,
|
||||||
|
default: '付款'
|
||||||
|
},
|
||||||
|
isPay: { //区分支付密码还是输入数字
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
type: String,
|
||||||
|
default: '请输入支付密码'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
keys: [1, 2, 3, 4, 5, 6, 7, 8, 9, 0, '.', 'del'],
|
||||||
|
value: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
watch: {
|
||||||
|
value(newVal, oldVal) {
|
||||||
|
// 输入密码走此处
|
||||||
|
if (newVal.length == 6 && this.isPay) {
|
||||||
|
this.handlePay();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
// 键盘点击
|
||||||
|
handleClick(item) {
|
||||||
|
if (this.value.length >= 10) return;
|
||||||
|
if (item == ".") {
|
||||||
|
if (!this.value) {
|
||||||
|
this.value = '0.';
|
||||||
|
} else {
|
||||||
|
if (this.value.indexOf('.') > -1) return;
|
||||||
|
this.value = this.value + item;
|
||||||
|
}
|
||||||
|
} else if (item == 'del') {
|
||||||
|
if (this.value == "0.")
|
||||||
|
this.value = this.value.substring(0, 0);
|
||||||
|
else {
|
||||||
|
this.value = this.value.substring(0, this.value.length - 1);
|
||||||
|
}
|
||||||
|
} else if (item == 0) {
|
||||||
|
if (this.isPay) {
|
||||||
|
this.value = this.value + item;
|
||||||
|
} else {
|
||||||
|
if (this.value) {
|
||||||
|
if (this.value.lastIndexOf('.') != -1 && this.value.length - this.value.lastIndexOf('.') == 3)
|
||||||
|
return;
|
||||||
|
this.value = this.value + item;
|
||||||
|
} else {
|
||||||
|
this.value = this.value + item;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (this.value.lastIndexOf('.') != -1 && this.value.length - this.value.lastIndexOf('.') == 3) return;
|
||||||
|
this.value = this.value + item;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.$emit('change', this.value);
|
||||||
|
},
|
||||||
|
|
||||||
|
// 清空
|
||||||
|
handleClear() {
|
||||||
|
this.value = '';
|
||||||
|
this.$emit('clear');
|
||||||
|
},
|
||||||
|
|
||||||
|
// 付款
|
||||||
|
handlePay() {
|
||||||
|
// 如果最后一位是. 去除
|
||||||
|
if (this.value && this.value.endsWith('.')) {
|
||||||
|
this.value = this.value.replace('.', '');
|
||||||
|
}
|
||||||
|
|
||||||
|
this.$emit('confirm', this.value);
|
||||||
|
this.handleClose();
|
||||||
|
},
|
||||||
|
|
||||||
|
// 开启
|
||||||
|
handleOpen(type) {
|
||||||
|
if (!type) this.value = "";
|
||||||
|
this.$refs.popup.open();
|
||||||
|
},
|
||||||
|
|
||||||
|
// 关闭
|
||||||
|
handleClose() {
|
||||||
|
this.$refs.popup.close();
|
||||||
|
},
|
||||||
|
|
||||||
|
maskClick() {
|
||||||
|
// 如果最后一位是. 去除
|
||||||
|
if (this.value && this.value.endsWith('.')) {
|
||||||
|
this.value = this.value.replace('.', '');
|
||||||
|
}
|
||||||
|
this.$emit('change', this.value);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.popup-wrap {
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 30rpx 30rpx 0 0;
|
||||||
|
|
||||||
|
.paybox {
|
||||||
|
.paybox-title {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 40rpx;
|
||||||
|
|
||||||
|
.paybox-title-left {}
|
||||||
|
|
||||||
|
.paybox-title-middle {
|
||||||
|
font-size: 30rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.paybox-titler-right {}
|
||||||
|
}
|
||||||
|
|
||||||
|
.paybox-input {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-bottom: 40rpx;
|
||||||
|
|
||||||
|
:deep(.u-code-input__item) {
|
||||||
|
background-color: #E6E6E6;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
border: 0 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.keyboard {
|
||||||
|
display: flex;
|
||||||
|
padding-bottom: 20rpx;
|
||||||
|
border-top: 2rpx solid #E6E6E6;
|
||||||
|
|
||||||
|
.keyboard-left {
|
||||||
|
width: 75%;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
|
||||||
|
.keyboard-left-item {
|
||||||
|
width: 33.3%;
|
||||||
|
height: 120rpx;
|
||||||
|
line-height: 102rpx;
|
||||||
|
border-bottom: 2rpx solid #E6E6E6;
|
||||||
|
border-right: 2rpx solid #E6E6E6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.del {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.keyboard-right {
|
||||||
|
width: 25%;
|
||||||
|
|
||||||
|
.keyboard-right-clear {
|
||||||
|
width: 100%;
|
||||||
|
height: 120rpx;
|
||||||
|
line-height: 120rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.keyboard-right-pay {
|
||||||
|
width: 100%;
|
||||||
|
height: 360rpx;
|
||||||
|
line-height: 360rpx;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #40AE36;
|
||||||
|
color: #fff !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.word {
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 34rpx;
|
||||||
|
color: #000000;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active:active {
|
||||||
|
background-color: rgba(232, 232, 232, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.active-pay:active {
|
||||||
|
opacity: .9;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -161,6 +161,13 @@
|
||||||
"navigationBarTitleText": "确认订单",
|
"navigationBarTitleText": "确认订单",
|
||||||
"enablePullDownRefresh": false
|
"enablePullDownRefresh": false
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "setPayPassword/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "设置密码",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
|
|
@ -109,8 +109,15 @@
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view style="width: 200rpx;">
|
<view style="width: 200rpx;">
|
||||||
<up-button color="#20b128" shape="circle" :disabled="!checkAll" @click="settleAccounts">去结算<text
|
<up-button color="#20b128" shape="circle" :disabled="!checkAll || c_price0<500 "
|
||||||
v-if="checkAll">({{checkAll}})</text></up-button>
|
@click="settleAccounts">
|
||||||
|
<view class="" v-if='c_price0>=500'>
|
||||||
|
去结算<text v-if="checkAll">({{checkAll}})</text>
|
||||||
|
</view>
|
||||||
|
<view class="" v-else>
|
||||||
|
¥500起订
|
||||||
|
</view>
|
||||||
|
</up-button>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view v-else class="btn-boxs">
|
<view v-else class="btn-boxs">
|
||||||
|
|
|
@ -144,12 +144,15 @@
|
||||||
<text>{{item.spec}}</text>
|
<text>{{item.spec}}</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
<view style="display: flex;" v-if='userStore?.userInfo?.user_ship==1'>
|
||||||
|
<view class="price" style="margin-right: 10rpx;">¥{{item.vip_price}}</view>
|
||||||
|
<text class='price'>会员价</text>
|
||||||
|
</view>
|
||||||
<view class="price-btn">
|
<view class="price-btn">
|
||||||
<view class="price">¥{{item.price}}</view>
|
<view class="price" style="font-size: 24rpx;">¥{{item.price}}</view>
|
||||||
<view class="btn">
|
<view class="btn">
|
||||||
<u--icon name="plus-circle-fill" size="20" color="#20b128"></u--icon>
|
<u--icon name="plus-circle-fill" size="20" color="#20b128"></u--icon>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
@ -169,7 +172,8 @@
|
||||||
</view> -->
|
</view> -->
|
||||||
</view>
|
</view>
|
||||||
<view class="btn">
|
<view class="btn">
|
||||||
<up-button color="#20b128" :disabled="cartInfo.count==0" @click="settleAccounts">结算</up-button>
|
<up-button color="#20b128" :disabled="cartInfo.total_price<500" @click="settleAccounts">
|
||||||
|
{{cartInfo.total_price<500?"¥500起订":"结算" }} </up-button>
|
||||||
</view>
|
</view>
|
||||||
<view class="cart" @click="navTo('/pages/cart/cart')">
|
<view class="cart" @click="navTo('/pages/cart/cart')">
|
||||||
<image src="@/static/icon/cart.png"></image>
|
<image src="@/static/icon/cart.png"></image>
|
||||||
|
@ -220,7 +224,7 @@
|
||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
const STORE_INFO = reactive({
|
const STORE_INFO = reactive({
|
||||||
id: 23,
|
id: 23,
|
||||||
store_name: "农(特)产品直营店"
|
store_name: "新"
|
||||||
})
|
})
|
||||||
|
|
||||||
const getStoreInfoFn = () => {
|
const getStoreInfoFn = () => {
|
||||||
|
|
|
@ -107,8 +107,8 @@
|
||||||
|
|
||||||
<view class="card">
|
<view class="card">
|
||||||
<up-cell-group>
|
<up-cell-group>
|
||||||
<!-- <up-cell title="我的余额" :isLink="true" url="/pageQuota/Balance/index"></up-cell> -->
|
|
||||||
<up-cell title="我的地址" :isLink="true" url="/pagesOrder/addressList/addressList"></up-cell>
|
<up-cell title="我的地址" :isLink="true" url="/pagesOrder/addressList/addressList"></up-cell>
|
||||||
|
<up-cell title="支付密码" :isLink="true" url="/pagesOrder/setPayPassword/index"></up-cell>
|
||||||
</up-cell-group>
|
</up-cell-group>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,12 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
支付密码
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import pwdKeyBord from '@/components/pwdKeyBord.vue'
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
</style>
|
Binary file not shown.
After Width: | Height: | Size: 1.4 KiB |
Loading…
Reference in New Issue