完成花呗首页UI及逻辑
This commit is contained in:
tangxinyue
parent
7c3e22324f
commit
c594174f14
|
|
@ -2,27 +2,31 @@
|
|||
<view style="width: 100%;" :style="{ height: `${data.statusBarHeight + 44}px` }"></view>
|
||||
<view class="nav-bar-container" :style="{ backgroundColor: bgColor }">
|
||||
<view class="status-placeholder" :style="{ height: `${data.statusBarHeight}px` }"></view>
|
||||
<view style="width: 100%;height: 44px;" @click="openPopup">
|
||||
<slot>
|
||||
<uni-nav-bar backgroundColor="#00000000" class="nav-bar" :border="false" :title="title" v-bind="$attrs"
|
||||
v-on="$attrs">
|
||||
<template v-slot:left>
|
||||
<view class="nav-bar-left">
|
||||
<slot name="left">
|
||||
<view class="left-icon" @click="onBack">
|
||||
<image class="nav-icon-back" src="/static/image/nav-bar/back-black.png" mode=""></image>
|
||||
<view class="left-icon" @click.stop="onBack">
|
||||
<image class="nav-icon-back" src="/static/image/nav-bar/back-black.png" mode="">
|
||||
</image>
|
||||
</view>
|
||||
</slot>
|
||||
</view>
|
||||
</template>
|
||||
<view class="nav-bar-title w100 h100 flex-1" @click="openPopup">
|
||||
<view class="nav-bar-title w100 h100 flex-1" @click="openPopup" :style="{ color: textColor }">
|
||||
<slot name="center">
|
||||
{{ title }}
|
||||
</slot>
|
||||
</view>
|
||||
<template v-slot:right>
|
||||
<view class="nav-bar-right" @click="onRightClick">
|
||||
<view class="nav-bar-right" @click.stop="onRightClick">
|
||||
<slot name="right">
|
||||
<view v-if="isRightIcon" class="right-icon">
|
||||
<image class="nav-icon-more" src="/static/image/nav-bar/more-black.png" mode=""></image>
|
||||
<image class="nav-icon-more" src="/static/image/nav-bar/more-black.png" mode="">
|
||||
</image>
|
||||
</view>
|
||||
<view v-if="isRightButton" class="right-button">
|
||||
{{ rightButtonText }}
|
||||
|
|
@ -31,6 +35,10 @@
|
|||
</view>
|
||||
</template>
|
||||
</uni-nav-bar>
|
||||
</slot>
|
||||
</view>
|
||||
|
||||
|
||||
<popup ref="topPopup">
|
||||
<view class="button-group w100 flex-between flex-wrap">
|
||||
<view class="button-box" v-for="button in buttonGroup" @click="buttonClick(button)">
|
||||
|
|
@ -59,6 +67,10 @@ const props = defineProps({
|
|||
type: String,
|
||||
default: '#fff'
|
||||
},
|
||||
textColor: {
|
||||
type: String,
|
||||
default: '#000'
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: ''
|
||||
|
|
|
|||
12
pages.json
12
pages.json
|
|
@ -4,7 +4,7 @@
|
|||
{
|
||||
"path": "pages/index/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "uni-app",
|
||||
"navigationBarTitleText": "支付宝模拟器首页",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
|
|
@ -53,6 +53,16 @@
|
|||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pages/ant-credit-pay",
|
||||
"pages": [{
|
||||
"path": "index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "花呗首页",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}]
|
||||
},
|
||||
{
|
||||
"root": "pages/common",
|
||||
"pages": [{
|
||||
|
|
|
|||
|
|
@ -0,0 +1,525 @@
|
|||
<template>
|
||||
<view class="page-container">
|
||||
<view class="main-container">
|
||||
<NavBar title="花呗|信用购" :bgColor="data.navBar.bgColor" :buttonGroup="buttonGroup"
|
||||
@button-click="clickTitlePopupButton">
|
||||
<view class="nav-bar flex-between w100" :class="{ 'ios-nav-bar': $system == 'iOS' }">
|
||||
<view class="flex-align-center flex-1">
|
||||
<view class="left">
|
||||
<image class=" back-icon" src="/static/image/nav-bar/back-white.png" mode="">
|
||||
</image>
|
||||
</view>
|
||||
<view class="title ">
|
||||
花呗|信用购
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="right">
|
||||
<image class="icon" src="/static/image/ant-credit-pay/service.png"></image>
|
||||
<image class="icon" src="/static/image/ant-credit-pay/setting.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</NavBar>
|
||||
<view class="current-month">{{ huabeiInfo.mouth }}月应还(元)</view>
|
||||
<view class="money-box flex-align-center">
|
||||
<text class="money alipay-font">{{ numberUtil.formatMoneyWithThousand(huabeiInfo.money) }}</text>
|
||||
<uni-icons type="right" size="16" color="#B9D6FF"></uni-icons>
|
||||
</view>
|
||||
<view v-if="huabeiInfo.styleType == 1 || !huabeiInfo.styleType" class="style-1 button-group">
|
||||
<view class="button-item second-button" :class="{ 'ios-button': $system == 'iOS' }">立即还款</view>
|
||||
<view v-if="!huabeiInfo.isInstallment" class="button-item primary-button"
|
||||
:class="{ 'ios-button': $system == 'iOS' }">
|
||||
分期还款
|
||||
<view v-if="huabeiInfo.installmentBadgeText" class="badge">{{ huabeiInfo.installmentBadgeText }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="huabeiInfo.styleType == 2" class="style-2 bubble-container">
|
||||
<view class="bubble-box">
|
||||
<view class="arrow"></view>
|
||||
<text class="text">{{ huabeiInfo.descText }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="huabeiInfo.styleType == 3" class="style-3 bubble-container">
|
||||
<view class="bubble-box">
|
||||
<view class="arrow"></view>
|
||||
<text class="text flex-align-center">{{ huabeiInfo.descText }}
|
||||
<uni-icons type="right" size="16" color="#B9D6FF"></uni-icons>
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="total-info-box flex-align-center">
|
||||
<view class="info-item">
|
||||
<view class="label">总计账单</view>
|
||||
<view class="value">还款日每月{{ huabeiInfo.dueDate }}日</view>
|
||||
</view>
|
||||
<view class="info-item">
|
||||
<view class="label">总计额度</view>
|
||||
<view class="value">{{
|
||||
numberUtil.formatMoneyWithThousand(Number(huabeiInfo.totalAmount) - Number(huabeiInfo.money)) }}可用
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="image-box flex-1">
|
||||
<image style="width:92rpx; height: 92rpx;margin-top: 16rpx;"
|
||||
src="/static/image/common/upload-screenshot.png"></image>
|
||||
<text style="font-size: 36rpx;color: #1777FF;">长按替换真实截图</text>
|
||||
</view>
|
||||
<!-- 编辑弹窗 -->
|
||||
<uni-popup ref="popup" type="center" :mask-click="false">
|
||||
<view class="popup-content">
|
||||
<view class="popup-title">编辑花呗数据</view>
|
||||
<view class="form-item">
|
||||
<text class="label">还款月份</text>
|
||||
<picker :range="monthRange" :value="editHuabeiInfo.mouth - 1" @change="onMonthChange"
|
||||
style="flex:1">
|
||||
<view class="input">{{ editHuabeiInfo.mouth ? editHuabeiInfo.mouth + '月' : '请选择月份' }}</view>
|
||||
</picker>
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<text class="label">本月应还</text>
|
||||
<input class="input" type="digit" v-model="editHuabeiInfo.money" placeholder="请输入金额" />
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<text class="label">还款日</text>
|
||||
<input class="input" type="number" v-model="editHuabeiInfo.dueDate" placeholder="请输入日期" />
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<text class="label">总计额度</text>
|
||||
<input class="input" type="digit" v-model="editHuabeiInfo.totalAmount" placeholder="请输入总计额度" />
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<text class="label">描述文本</text>
|
||||
<input class="input" type="text" v-model="editHuabeiInfo.descText" placeholder="请输入描述文本" />
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<text class="label">分期气泡</text>
|
||||
<input class="input" type="text" v-model="editHuabeiInfo.installmentBadgeText"
|
||||
placeholder="请输入分期还款气泡文案" />
|
||||
</view>
|
||||
<view class="form-item flex-between">
|
||||
<text class="label">是否分期</text>
|
||||
<switch :checked="editHuabeiInfo.isInstallment" style="transform: scale(0.8);"
|
||||
@change="e => editHuabeiInfo.isInstallment = e.detail.value" />
|
||||
</view>
|
||||
<view class="popup-btns">
|
||||
<view class="btn cancel" @click="closeDialog">取消</view>
|
||||
<view class="btn confirm" @click="confirmDialog">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</uni-popup>
|
||||
|
||||
<!-- 样式选择弹窗 -->
|
||||
<uni-popup ref="stylePopup" type="center">
|
||||
<view class="popup-content">
|
||||
<view class="popup-title">选择展示样式</view>
|
||||
<view class="style-list">
|
||||
<view class="style-item" v-for="(item, index) in styleList" :key="index"
|
||||
@click="confirmStyleDialog(item.value)">
|
||||
<text>{{ item.label }}</text>
|
||||
<uni-icons v-if="huabeiInfo.styleType == item.value" type="checkmarkempty" size="20"
|
||||
color="#1777FF"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-btns">
|
||||
<view class="btn cancel" @click="closeStyleDialog">取消</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import NavBar from '@/components/nav-bar/nav-bar'
|
||||
import { numberUtil } from '@/utils/common.js'
|
||||
import { ref, toRefs } from 'vue';
|
||||
import { onLoad } from '@dcloudio/uni-app';
|
||||
|
||||
const buttonGroup = [{
|
||||
name: "编辑花呗数据",
|
||||
click: () => {
|
||||
openDialog()
|
||||
}
|
||||
}, {
|
||||
name: "切换展示样式",
|
||||
click: () => {
|
||||
openStyleDialog()
|
||||
}
|
||||
}]
|
||||
|
||||
const data = ref({
|
||||
navBar: {
|
||||
bgColor: "#1777FF",
|
||||
textColor: "#fff"
|
||||
},
|
||||
huabeiInfo: {
|
||||
mouth: 1,
|
||||
money: 100,
|
||||
dueDate: 15,
|
||||
totalAmount: 200000,
|
||||
descText: "当前账单进度已超出预期，花超了",
|
||||
isInstallment: false,
|
||||
styleType: 1,
|
||||
installmentBadgeText: '4折起'
|
||||
},
|
||||
huabeiInfoStorageKey: 'huabei_info_storage'
|
||||
})
|
||||
|
||||
let { huabeiInfo } = toRefs(data.value)
|
||||
// 编辑表单数据
|
||||
const editHuabeiInfo = ref({})
|
||||
|
||||
const popup = ref(null)
|
||||
const stylePopup = ref(null)
|
||||
|
||||
const styleList = [
|
||||
{ label: '样式 1 (默认)', value: 1 },
|
||||
{ label: '样式 2 (纯气泡)', value: 2 },
|
||||
{ label: '样式 3 (带箭头气泡)', value: 3 }
|
||||
]
|
||||
|
||||
const monthRange = Array.from({ length: 12 }, (_, i) => i + 1)
|
||||
const onMonthChange = (e) => {
|
||||
editHuabeiInfo.value.mouth = monthRange[e.detail.value]
|
||||
}
|
||||
|
||||
onLoad((option) => {
|
||||
console.log(option)
|
||||
// 读取缓存
|
||||
const savedInfo = uni.getStorageSync(data.value.huabeiInfoStorageKey)
|
||||
if (savedInfo) {
|
||||
// 合并默认值，防止旧数据缺少新字段
|
||||
data.value.huabeiInfo = { ...data.value.huabeiInfo, ...savedInfo }
|
||||
}
|
||||
})
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = () => {
|
||||
// 深拷贝当前数据到编辑表单
|
||||
editHuabeiInfo.value = JSON.parse(JSON.stringify(data.value.huabeiInfo))
|
||||
popup.value.open()
|
||||
}
|
||||
|
||||
// 关闭弹窗
|
||||
const closeDialog = () => {
|
||||
popup.value.close()
|
||||
}
|
||||
|
||||
// 确认修改
|
||||
const confirmDialog = () => {
|
||||
data.value.huabeiInfo = JSON.parse(JSON.stringify(editHuabeiInfo.value))
|
||||
// 保存到缓存
|
||||
uni.setStorageSync(data.value.huabeiInfoStorageKey, data.value.huabeiInfo)
|
||||
popup.value.close()
|
||||
uni.showToast({
|
||||
title: '保存成功',
|
||||
icon: 'success'
|
||||
})
|
||||
}
|
||||
|
||||
// 打开样式选择弹窗
|
||||
const openStyleDialog = () => {
|
||||
stylePopup.value.open()
|
||||
}
|
||||
|
||||
// 关闭样式选择弹窗
|
||||
const closeStyleDialog = () => {
|
||||
stylePopup.value.close()
|
||||
}
|
||||
|
||||
// 确认样式选择
|
||||
const confirmStyleDialog = (type) => {
|
||||
data.value.huabeiInfo.styleType = type
|
||||
// 保存到缓存
|
||||
uni.setStorageSync(data.value.huabeiInfoStorageKey, data.value.huabeiInfo)
|
||||
stylePopup.value.close()
|
||||
}
|
||||
|
||||
// 点击标题弹出按钮
|
||||
const clickTitlePopupButton = (button) => {
|
||||
button.click()
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import "/common/main.css";
|
||||
</style>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.page-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #ffffff;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
|
||||
.nav-bar {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 20rpx;
|
||||
|
||||
.title {
|
||||
color: #ffffff;
|
||||
font-size: 17px;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.right {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.icon {
|
||||
margin-left: 18rpx;
|
||||
margin-right: 10rpx;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.ios-nav-bar {
|
||||
.left {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.title {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.right {
|
||||
width: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
.main-container {
|
||||
background-color: #1777FF;
|
||||
padding-bottom: 32rpx;
|
||||
|
||||
.current-month {
|
||||
margin-top: 12rpx;
|
||||
color: #B9D6FF;
|
||||
font-size: 24rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.money-box {
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
|
||||
.money {
|
||||
font-size: 64rpx;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
|
||||
.button-group {
|
||||
margin-top: 18rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
justify-content: center;
|
||||
|
||||
.button-item {
|
||||
height: 64rpx;
|
||||
line-height: 64rpx;
|
||||
border-radius: 8rpx;
|
||||
color: #ffffff;
|
||||
font-size: 30rpx;
|
||||
padding: 0 24rpx;
|
||||
}
|
||||
|
||||
.second-button {
|
||||
border: 2rpx solid #66B2FD;
|
||||
}
|
||||
|
||||
.primary-button {
|
||||
background-color: #66B2FD;
|
||||
margin: 0 22rpx;
|
||||
position: relative;
|
||||
|
||||
.badge {
|
||||
position: absolute;
|
||||
top: -16rpx;
|
||||
right: -10rpx;
|
||||
background-color: #F34624;
|
||||
color: #fff;
|
||||
font-size: 20rpx;
|
||||
padding: 0 10rpx;
|
||||
height: 32rpx;
|
||||
line-height: 32rpx;
|
||||
border-radius: 16rpx 16rpx 16rpx 0;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.ios-button {
|
||||
border-radius: 33rpx !important;
|
||||
}
|
||||
}
|
||||
|
||||
.style-1 {
|
||||
margin-top: 18rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.bubble-container {
|
||||
margin-top: 10rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
.bubble-box {
|
||||
position: relative;
|
||||
border: 1px solid #75bcff;
|
||||
border-radius: 30rpx;
|
||||
padding: 12rpx 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.text {
|
||||
color: #ffffff;
|
||||
font-size: 26rpx;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.arrow {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%) rotate(45deg);
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background-color: #1777FF;
|
||||
border-left: 1px solid #75bcff;
|
||||
border-top: 1px solid #75bcff;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.total-info-box {
|
||||
margin-top: 48rpx;
|
||||
|
||||
.info-item {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
|
||||
.label {
|
||||
color: #ffffff;
|
||||
font-size: 30rpx;
|
||||
line-height: 42rpx;
|
||||
}
|
||||
|
||||
.value {
|
||||
color: #ffffff;
|
||||
font-size: 26rpx;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.image-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
.back-icon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.popup-content {
|
||||
background-color: #fff;
|
||||
width: 600rpx;
|
||||
border-radius: 16rpx;
|
||||
padding: 30rpx;
|
||||
|
||||
.popup-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 24rpx;
|
||||
|
||||
.label {
|
||||
width: 140rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.input {
|
||||
flex: 1;
|
||||
height: 72rpx;
|
||||
line-height: 72rpx;
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 8rpx;
|
||||
padding: 0 20rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.flex-between {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.popup-btns {
|
||||
display: flex;
|
||||
margin-top: 40rpx;
|
||||
|
||||
.btn {
|
||||
flex: 1;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
text-align: center;
|
||||
border-radius: 12rpx;
|
||||
font-size: 30rpx;
|
||||
|
||||
&.cancel {
|
||||
background-color: #f5f5f5;
|
||||
color: #666;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
&.confirm {
|
||||
background-color: #1777FF;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.style-list {
|
||||
.style-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 30rpx 0;
|
||||
border-bottom: 1px solid #f5f5f5;
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -590,12 +590,15 @@ onLoad(async () => {
|
|||
item['isStatus'] = true
|
||||
}
|
||||
item['expire_times'] = item.expire_time
|
||||
item.expire_time = item.expire_time.replace('-', '.').replace('-', '.').substring(0, 10)
|
||||
item.expire_time = item.expire_time.replace('-', '.').replace('-', '.').substring(
|
||||
0, 10)
|
||||
})
|
||||
data.myActivity = [
|
||||
...activity.data.items.filter(item => (item.threshold == '' || zsItem.price >= (Number(item
|
||||
...activity.data.items.filter(item => (item.threshold == '' || zsItem.price >= (Number(
|
||||
item
|
||||
.threshold) / 100)) && item.isStatus),
|
||||
...activity.data.items.filter(item => (zsItem.price < (Number(item.threshold) / 100) && item
|
||||
...activity.data.items.filter(item => (zsItem.price < (Number(item.threshold) / 100) &&
|
||||
item
|
||||
.threshold != '') || !item.isStatus)
|
||||
]
|
||||
data.myActivity = deduplicateKeepLast(data.myActivity)
|
||||
|
|
@ -805,10 +808,12 @@ function setPrice(status) {
|
|||
origin_price = Number(data.goods.origin_price)
|
||||
coupon = origin_price - price
|
||||
} else {
|
||||
price = data.goods.price - (data.activeCoupon.coupon_type_name != '折扣券' ? (Number(data.activeCoupon.coupon_value) /
|
||||
price = data.goods.price - (data.activeCoupon.coupon_type_name != '折扣券' ? (Number(data.activeCoupon
|
||||
.coupon_value) /
|
||||
100) : ((1 - Number(data.activeCoupon.coupon_value)) * data.goods.price))
|
||||
coupon = (Number(data.goods.origin_price) - Number(data.goods.price)) + (Number(data.goods.price) - (data.goods
|
||||
.price - (data.activeCoupon.coupon_type_name != '折扣券' ? (Number(data.activeCoupon.coupon_value) / 100) : ((
|
||||
.price - (data.activeCoupon.coupon_type_name != '折扣券' ? (Number(data.activeCoupon.coupon_value) /
|
||||
100) : ((
|
||||
1 - Number(data.activeCoupon.coupon_value)) * data.goods.price))))
|
||||
}
|
||||
data.coupon = numberUtil.toFiexd(coupon, 0)
|
||||
|
|
@ -889,14 +894,17 @@ async function getActivity() {
|
|||
item.expire_time = item.expire_time.replace('-', '.').replace('-', '.').substring(0, 10)
|
||||
})
|
||||
data.myActivity = [
|
||||
...activity.data.items.filter(item => (item.threshold == '' || data.goods.price >= (Number(item.threshold) /
|
||||
...activity.data.items.filter(item => (item.threshold == '' || data.goods.price >= (Number(item
|
||||
.threshold) /
|
||||
100) && item.isStatus)),
|
||||
...activity.data.items.filter(item => (data.goods.price < (Number(item.threshold) / 100) && item.threshold !=
|
||||
...activity.data.items.filter(item => (data.goods.price < (Number(item.threshold) / 100) && item
|
||||
.threshold !=
|
||||
'') || !item.isStatus)
|
||||
]
|
||||
data.myActivity = deduplicateKeepLast(data.myActivity)
|
||||
}
|
||||
}
|
||||
|
||||
function deduplicateKeepLast(arr, idKey = 'id') {
|
||||
const map = new Map();
|
||||
|
||||
|
|
@ -986,8 +994,10 @@ async function onSelect(items, index) {
|
|||
let defaultCoupon = data.myActivity.filter(item => item.activity_id == data.goods.default_activity)
|
||||
if (defaultCoupon.length > 0) {
|
||||
defaultCoupon.forEach(item => {
|
||||
if ((data.goods.price >= (Number(item.threshold) / 100) || item.threshold == '') && item.isStatus) {
|
||||
item['price2'] = data.goods.price - (item.coupon_type_name != '折扣券' ? (Number(item.coupon_value) /
|
||||
if ((data.goods.price >= (Number(item.threshold) / 100) || item.threshold == '') && item
|
||||
.isStatus) {
|
||||
item['price2'] = data.goods.price - (item.coupon_type_name != '折扣券' ? (Number(item
|
||||
.coupon_value) /
|
||||
100) : ((1 - Number(item.coupon_value)) * data.goods.price))
|
||||
} else {
|
||||
item['price2'] = 10000000
|
||||
|
|
@ -1009,8 +1019,10 @@ async function onSelect(items, index) {
|
|||
if (id == 0 && data.goods.default_activity != '') {
|
||||
try {
|
||||
data.myActivity.forEach(item => {
|
||||
if ((data.goods.price >= (Number(item.threshold) / 100) || item.threshold == '') && item.isStatus) {
|
||||
item['price2'] = data.goods.price - (item.coupon_type_name != '折扣券' ? (Number(item.coupon_value) /
|
||||
if ((data.goods.price >= (Number(item.threshold) / 100) || item.threshold == '') &&
|
||||
item.isStatus) {
|
||||
item['price2'] = data.goods.price - (item.coupon_type_name != '折扣券' ? (Number(item
|
||||
.coupon_value) /
|
||||
100) : ((1 - Number(item.coupon_value)) * data.goods.price))
|
||||
} else {
|
||||
item['price2'] = 10000000
|
||||
|
|
@ -1043,7 +1055,8 @@ async function onSelect(items, index) {
|
|||
if (list.length != 0) {
|
||||
let listData = list.map(cell => {
|
||||
return {
|
||||
image: cell == 'weixin' ? '/static/image/recharge/wxpay.png' : '/static/image/recharge/alipay.png',
|
||||
image: cell == 'weixin' ? '/static/image/recharge/wxpay.png' :
|
||||
'/static/image/recharge/alipay.png',
|
||||
name: cell == 'weixin' ? '微信支付' : '支付宝支付',
|
||||
type: cell == 'weixin' ? 'wxpay' : 'alipay'
|
||||
}
|
||||
|
|
@ -1187,7 +1200,7 @@ async function activateVip(type = '') {
|
|||
coupon: data.active_id ? data.active_id : '',
|
||||
pay_type: paymentMethod.value == "wxpay" ? 'weixin' : "alipay",
|
||||
"pay_source": paymentMethod.value == "alipay" && proxy.$system == 'iOS' ? "h5" : "app",
|
||||
source: "uniapp",
|
||||
source: "uni_alipay",
|
||||
})
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -147,7 +147,7 @@ const menuList = [{
|
|||
icon: "huabei",
|
||||
name: "花呗",
|
||||
isHot: false,
|
||||
path: ""
|
||||
path: "/pages/ant-credit-pay/index"
|
||||
},
|
||||
|
||||
]
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 908 B |
Binary file not shown.
|
After Width: | Height: | Size: 990 B |
|
|
@ -40,24 +40,8 @@ export const store = reactive({
|
|||
});
|
||||
|
||||
|
||||
|
||||
|
||||
// 定义操作方法
|
||||
export const useStore = () => {
|
||||
// 用户相关操作
|
||||
const setUserInfo = (userInfo) => {
|
||||
store.userInfo = userInfo;
|
||||
};
|
||||
|
||||
const clearUserInfo = () => {
|
||||
store.userInfo = null;
|
||||
};
|
||||
|
||||
// 设置相关操作
|
||||
const updateSettings = (settings) => {
|
||||
store.settings = { ...store.settings, ...settings };
|
||||
};
|
||||
|
||||
// 账单相关操作
|
||||
const addBill = (bill) => {
|
||||
store.billList.unshift(bill);
|
||||
|
|
@ -114,23 +98,11 @@ export const useStore = () => {
|
|||
{ deep: true }
|
||||
);
|
||||
|
||||
// 获取系统信息（从缓存读取）
|
||||
const getSystemInfo = () => {
|
||||
const cachedInfo = uni.getStorageSync('systemInfo')
|
||||
if (cachedInfo) {
|
||||
store.systemInfo = cachedInfo
|
||||
}
|
||||
};
|
||||
|
||||
return {
|
||||
store,
|
||||
setUserInfo,
|
||||
clearUserInfo,
|
||||
updateSettings,
|
||||
addBill,
|
||||
updateBill,
|
||||
deleteBill,
|
||||
getBillList,
|
||||
getSystemInfo
|
||||
getBillList
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -140,6 +140,22 @@ export const numberUtil = {
|
|||
return number.toFixed(decimals);
|
||||
},
|
||||
|
||||
/**
|
||||
* 格式化金额，添加千分位并保留两位小数
|
||||
* @param {number|string} val - 金额
|
||||
* @returns {string} 格式化后的金额字符串
|
||||
*/
|
||||
formatMoneyWithThousand(val) {
|
||||
let num = Number(val);
|
||||
if (isNaN(num)) {
|
||||
return '0.00';
|
||||
}
|
||||
let str = num.toFixed(2);
|
||||
let parts = str.split('.');
|
||||
parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',');
|
||||
return parts.join('.');
|
||||
},
|
||||
|
||||
/**
|
||||
* 随机数生成
|
||||
* @param {number} min - 最小值
|
||||
|
|
|
|||
Loading…
Reference in New Issue