liaofei
/
mall-app-t
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(提现)

This commit is contained in:
unknown 2024-05-30 01:20:31 +08:00
parent 4f1a9a3440
commit 69aa02da78
9 changed files with 981 additions and 1068 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
pages.json
View File

@ -101,6 +101,20 @@
}
}
]
},
{
"root": "pages/user",
"pages": [
{
"path": "wallet/money",
"style": {
"navigationBarTitleText": "余额"
},
"meta": {
"auth": false
}
}
]
}
],
"tabBar": {

287
pages/index/login.vue
View File

@ -1,60 +1,39 @@
<template>
<pb-layout :leftIcon="''" navbar="inner" :bgStyle="{ backgroundColor: '#fff' }">
<view class="login-module ss-p-x-30">
<view class="login-title ss-font-56 ss-m-b-72">
{{ title }}
</view>
<uni-forms ref="smsLoginRef" v-model="state.model" :rules="state.rules" validateTrigger="bind">
<uni-forms-item name="mobile">
<uni-easyinput
:styles="state.inputStyle"
trim="all"
placeholder="请输入手机号"
v-model="state.model.mobile"
:inputBorder="false"
type="number"
/>
</uni-forms-item>
<uni-forms-item name="code">
<uni-easyinput
:styles="state.inputStyle"
trim="all"
placeholder="验证码"
v-model="state.model.code"
:inputBorder="false"
type="number"
maxlength="4"
>
<template #right>
<button
:disabled="state.isMobileEnd"
:class="{ 'code-btn-end': state.isMobileEnd }"
class="ss-reset-button code-btn code-btn-start"
@tap="getSmsCode('smsLogin', state.model.mobile)"
>
{{ getSmsTimer('smsLogin') }}
</button>
</template>
</uni-easyinput>
</uni-forms-item>
</uni-forms>
<button class="ss-reset-button login-btn-start" @tap="smsLoginSubmit">登录</button>
<view class="agreement-box ss-flex ss-row-center" :class="{ shake: state.isShaking }">
<label class="radio ss-flex" @tap="onChange">
<radio
:checked="state.agreeStatus"
color="var(--ui-BG-Main)"
style="transform: scale(0.8)"
@tap.stop="onChange"
/>
<view class="agreement-text ss-flex ss-m-l-8">
我已阅读并遵守
<view class="tcp-text" @tap.stop="onProtocol('商家入驻协议')"> 《商家入驻协议》 </view>
</view>
</label>
</view>
</view>
</pb-layout>
<pb-layout :leftIcon="''" navbar="inner" :bgStyle="{ backgroundColor: '#fff' }">
<view class="login-module ss-p-x-30">
<view class="login-title ss-font-56 ss-m-b-72">
{{ title }}
</view>
<uni-forms ref="smsLoginRef" v-model="state.model" :rules="state.rules" validateTrigger="bind">
<uni-forms-item name="mobile">
<uni-easyinput :styles="state.inputStyle" trim="all" placeholder="请输入手机号" v-model="state.model.mobile"
:inputBorder="false" type="number" />
</uni-forms-item>
<uni-forms-item name="code">
<uni-easyinput :styles="state.inputStyle" trim="all" placeholder="验证码" v-model="state.model.code"
:inputBorder="false" type="number" maxlength="4">
<template #right>
<button :disabled="state.isMobileEnd" :class="{ 'code-btn-end': state.isMobileEnd }"
class="ss-reset-button code-btn code-btn-start" @tap="getSmsCode('smsLogin', state.model.mobile)">
{{ getSmsTimer('smsLogin') }}
</button>
</template>
</uni-easyinput>
</uni-forms-item>
</uni-forms>
<button class="ss-reset-button login-btn-start" @tap="smsLoginSubmit">登录</button>
<view class="agreement-box ss-flex ss-row-center" :class="{ shake: state.isShaking }">
<label class="radio ss-flex" @tap="onChange">
<radio :checked="state.agreeStatus" color="var(--ui-BG-Main)" style="transform: scale(0.8)"
@tap.stop="onChange" />
<view class="agreement-text ss-flex ss-m-l-8">
我已阅读并遵守
<view class="tcp-text" @tap.stop="onProtocol('商家入驻协议')"> 《商家入驻协议》 </view>
</view>
</label>
</view>
</view>
</pb-layout>
</template>
<script setup>
@ -68,127 +47,131 @@ const title = ref('欢迎登录')
const smsLoginRef = ref(null)
const state = ref({
isMobileEnd: false,
agreeStatus: false,
isShaking: false,
model: {
mobile: '15036370128',
code: '9999',
},
rules: {
mobile,
code,
},
inputStyle: {
backgroundColor: '#ECECEC',
},
isMobileEnd: false,
agreeStatus: false,
isShaking: false,
model: {
mobile: '15036370128',
code: '9999',
},
rules: {
mobile,
code,
},
inputStyle: {
backgroundColor: '#ECECEC',
},
})
function onChange() {
state.value.agreeStatus = !state.value.agreeStatus
state.value.agreeStatus = !state.value.agreeStatus
}
function onProtocol() {
peach.$router.go('/pages/public/richtext?title=商家入驻协议')
}
async function smsLoginSubmit() {
const validate = await smsLoginRef.value.validate().catch((err) => {
console.log('err', err)
})
if (!validate) return
if (!state.value.agreeStatus) {
state.value.isShaking = true
setTimeout(() => {
state.value.isShaking = false
}, 1000)
peach.$helper.toast('请勾选同意')
return
}
const validate = await smsLoginRef.value.validate().catch((err) => {
console.log('err', err)
})
if (!validate) return
if (!state.value.agreeStatus) {
state.value.isShaking = true
setTimeout(() => {
state.value.isShaking = false
}, 1000)
peach.$helper.toast('请勾选同意')
return
}
const { code } = await AuthUtil.smsLogin(state.value.model)
const { code } = await AuthUtil.smsLogin(state.value.model)
}
</script>
<style lang="scss">
.login-module {
.uni-easyinput {
::v-deep .uni-easyinput__content {
border-radius: 41rpx;
padding: 0 10rpx;
}
.is-focused {
::v-deep .content-clear-icon {
.uniui-clear {
color: red !important;
}
}
}
.uni-easyinput {
::v-deep .uni-easyinput__content {
border-radius: 41rpx;
padding: 0 10rpx;
}
.is-focused {
::v-deep .content-clear-icon {
.uniui-clear {
color: red !important;
}
}
}
}
}
</style>
<style lang="scss" scoped>
.login-module {
margin-top: 50%;
overflow: hidden;
margin-top: 50%;
overflow: hidden;
.login-title {
color: '#1818d';
font-weight: 600;
.login-title {
color: '#1818d';
font-weight: 600;
}
.login-btn-start {
height: 82rpx;
line-height: normal;
background: linear-gradient(90deg, var(--ui-BG-Main), var(--ui-BG-Main-gradient));
border-radius: 28rpx;
font-size: 26rpx;
font-weight: 500;
color: #fff;
}
.code-btn-start {
width: 160rpx;
height: 56rpx;
line-height: normal;
border-radius: 28rpx;
font-size: 26rpx;
font-weight: 400;
color: var(--ui-BG-Main);
opacity: 1;
}
.agreement-box {
margin: -10px auto 10px;
position: absolute;
bottom: 30rpx;
width: 100%;
.protocol-check {
transform: scale(0.7);
}
.login-btn-start {
height: 82rpx;
line-height: normal;
background: linear-gradient(90deg, var(--ui-BG-Main), var(--ui-BG-Main-gradient));
border-radius: 28rpx;
font-size: 26rpx;
font-weight: 500;
color: #fff;
}
.agreement-text {
font-size: 26rpx;
font-weight: 500;
color: #999999;
.code-btn-start {
width: 160rpx;
height: 56rpx;
line-height: normal;
border-radius: 28rpx;
font-size: 26rpx;
font-weight: 400;
.tcp-text {
color: var(--ui-BG-Main);
opacity: 1;
}
}
}
.shake {
animation: shake 0.05s linear 4 alternate;
}
@keyframes shake {
from {
transform: translateX(-5rpx);
}
.agreement-box {
margin: -10px auto 10px;
position: absolute;
bottom: 30rpx;
width: 100%;
.protocol-check {
transform: scale(0.7);
}
.agreement-text {
font-size: 26rpx;
font-weight: 500;
color: #999999;
.tcp-text {
color: var(--ui-BG-Main);
}
}
}
.shake {
animation: shake 0.05s linear 4 alternate;
}
@keyframes shake {
from {
transform: translateX(-5rpx);
}
to {
transform: translateX(5rpx);
}
to {
transform: translateX(5rpx);
}
}
}
</style>

492
pages/user/wallet/money.vue
View File

@ -1,71 +1,48 @@
<!-- 我的钱包 -->
<template>
<pb-layout navbar="inner" class="wallet-wrap" title="钱包" :bgStyle="bgStyle">
<!-- 钱包卡片 -->
<view class="header-box ss-flex ss-row-center ss-col-center">
<view class="card-box ui-BG-Main ui-Shadow-Main">
<view class="card-head ss-flex ss-col-center">
<view class="card-title ss-m-r-10">钱包余额（元）</view>
<view
@tap="state.showMoney = !state.showMoney"
class="ss-eye-icon"
:class="state.showMoney ? 'cicon-eye' : 'cicon-eye-off'"
/>
</view>
<view class="ss-flex ss-row-between ss-col-center ss-m-t-64">
<view class="money-num">{{ state.showMoney ? fen2yuan(userWallet.balance) : '*****' }}</view>
<button class="ss-reset-button topup-btn" @tap="peach.$router.go('/pages/pay/recharge')">
充值
</button>
</view>
</view>
</view>
<pb-layout navbar="inner" class="wallet-wrap" color="#fff" title="余额" :bgStyle="bgStyle">
<view class="header-box ss-row-center ss-col-center">
<view class="card-box ui-BG-Main ui-Shadow-Main ss-flex ss-row-between ss-col-center">
<view class="ss-flex ss-flex-col ss-row-between ss-col-top ss-gap-40">
<view class="card-head ss-flex ss-col-center">
<view class="card-title ss-m-r-10">账户余额（元）</view>
<view @tap="state.showMoney = !state.showMoney" class="ss-eye-icon"
:class="state.showMoney ? 'cicon-eye' : 'cicon-eye-off'" />
</view>
<su-sticky>
<!-- 统计 -->
<view class="filter-box ss-p-x-30 ss-flex ss-col-center ss-row-between">
<uni-datetime-picker v-model="state.data" type="daterange" @change="onChangeTime" :end="state.today">
<button class="ss-reset-button date-btn">
<text>{{ dateFilterText }}</text>
<text class="cicon-drop-down ss-seldate-icon"></text>
</button>
</uni-datetime-picker>
<view class="total-box">
<view class="ss-m-b-10">总收入￥{{ fen2yuan(state.summary.totalIncome) }}</view>
<view>总支出￥{{ fen2yuan(state.summary.totalExpense) }}</view>
</view>
</view>
<su-tabs :list="tabMaps" @change="onChange" :scrollable="false" :current="state.currentTab"></su-tabs>
</su-sticky>
<s-empty v-if="state.pagination.total === 0" text="暂无数据" icon="/static/data-empty.png" />
<!-- 钱包记录 -->
<view v-if="state.pagination.total > 0">
<view class="wallet-list ss-flex border-bottom" v-for="item in state.pagination.list" :key="item.id">
<view class="list-content">
<view class="title-box ss-flex ss-row-between ss-m-b-20">
<text class="title ss-line-1">
{{ item.title }}
</text>
<view class="money">
<text v-if="item.price >= 0" class="add">+{{ fen2yuan(item.price) }}</text>
<text v-else class="minus">{{ fen2yuan(item.price) }}</text>
</view>
</view>
<text class="time">
{{ peach.$helper.timeFormat(state.createTime, 'yyyy-mm-dd hh:MM:ss') }}
</text>
</view>
</view>
<view class="money-num">{{ state.showMoney ? fen2yuan(userWallet.balance) : '*****' }}</view>
</view>
<uni-load-more
v-if="state.pagination.total > 0"
:status="state.loadStatus"
:content-text="{
contentdown: '上拉加载更多',
}"
/>
</pb-layout>
<button class="ss-reset-button topup-btn" @tap="peach.$router.go('/pages/pay/recharge')">
提现
</button>
</view>
</view>
<p-empty v-if="state.pagination.total === 0" :marginTop="40" text="暂无数据" icon="/static/data-empty.png" />
<!-- 钱包记录 -->
<view v-if="state.pagination.total > 0">
<view class="wallet-list ss-flex border-bottom" v-for="item in state.pagination.list" :key="item.id">
<view class="list-content">
<view class="title-box ss-flex ss-row-between ss-m-b-20">
<text class="title ss-line-1">
{{ item.title }}
</text>
<view class="money">
<text v-if="item.price >= 0" class="add">+{{ fen2yuan(item.price) }}</text>
<text v-else class="minus">{{ fen2yuan(item.price) }}</text>
</view>
</view>
<text class="time">
{{ peach.$helper.timeFormat(state.createTime, 'yyyy-mm-dd hh:MM:ss') }}
</text>
</view>
</view>
</view>
<uni-load-more v-if="state.pagination.total > 0" :status="state.loadStatus" :content-text="{
contentdown: '上拉加载更多',
}" />
</pb-layout>
</template>
<script setup>
@ -76,295 +53,210 @@ import dayjs from 'dayjs'
import _ from 'lodash'
import PayWalletApi from '@/peach/api/pay/wallet'
import { fen2yuan } from '@/peach/hooks/useGoods'
import { resetPagination } from '@/peach/util'
import { resetPagination } from '@/peach/utils'
const bgStyle = {
backgroundImage: '/static/bg-page.png',
imageType: 'local',
backgroundColor: '#fff',
description: '',
backgroundImage: '/static/bg-page.png',
imageType: 'local',
backgroundColor: '#fff',
description: '',
}
const headerBg = peach.$url.css('/static/img/shop/user/wallet_card_bg.png')
// const headerBg = peach.$url.css('/static/img/shop/user/wallet_card_bg.png')
// 数据
const state = reactive({
showMoney: false,
date: [], // 筛选的时间段
currentTab: 0,
pagination: {
list: [],
total: 0,
pageNo: 1,
pageSize: 8,
},
summary: {
totalIncome: 0,
totalExpense: 0,
},
loadStatus: '',
today: '',
showMoney: false,
pagination: {
list: [],
total: 0,
pageNo: 1,
pageSize: 8,
},
loadStatus: '',
})
const tabMaps = [
{
name: '全部',
value: '',
},
{
name: '收入',
value: '1',
},
{
name: '支出',
value: '2',
},
]
const userWallet = computed(() => peach.$store('user').userWallet)
// 格式化时间段
const dateFilterText = computed(() => {
if (state.date[0] === state.date[1]) {
return state.date[0]
} else {
return state.date.join('~')
}
})
// 获得钱包记录分页
async function getLogList() {
state.loadStatus = 'loading'
const { data, code } = await PayWalletApi.getWalletTransactionPage({
pageNo: state.pagination.pageNo,
pageSize: state.pagination.pageSize,
type: tabMaps[state.currentTab].value,
'createTime[0]': state.date[0] + ' 00:00:00',
'createTime[1]': state.date[1] + ' 23:59:59',
})
if (code !== 0) {
return
}
state.pagination.list = _.concat(state.pagination.list, data.list)
state.pagination.total = data.total
state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore'
state.loadStatus = 'loading'
// const { data, code } = await PayWalletApi.getWalletTransactionPage({
// pageNo: state.pagination.pageNo,
// pageSize: state.pagination.pageSize,
// })
// state.pagination.list = _.concat(state.pagination.list, data.list)
// state.pagination.total = data.total
// state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore'
}
// 获得钱包统计
async function getSummary() {
const { data, code } = await PayWalletApi.getWalletTransactionSummary({
createTime: [state.date[0] + ' 00:00:00', state.date[1] + ' 23:59:59'],
})
if (code !== 0) {
return
}
state.summary = data
}
onLoad(() => {
state.today = dayjs().format('YYYY-MM-DD')
state.date = [state.today, state.today]
getLogList()
getSummary()
// 刷新钱包的缓存
peach.$store('user').getWallet()
getLogList()
// 刷新钱包的缓存
// peach.$store('user').getWallet()
})
// 处理 tab 切换
function onChange(e) {
state.currentTab = e.index
// 重新加载列表
resetPagination(state.pagination)
getLogList()
getSummary()
}
// 处理时间筛选
function onChangeTime(e) {
state.date[0] = e[0]
state.date[1] = e[e.length - 1]
// 重新加载列表
resetPagination(state.pagination)
getLogList()
getSummary()
}
onReachBottom(() => {
if (state.loadStatus === 'noMore') {
return
}
state.pagination.pageNo++
getLogList()
if (state.loadStatus === 'noMore') {
return
}
state.pagination.pageNo++
getLogList()
})
</script>
<style lang="scss" scoped>
// 钱包
.header-box {
background-color: $white;
padding: 30rpx;
.card-box {
width: 100%;
min-height: 250rpx;
padding: 0 40rpx;
background-size: 100% 100%;
border-radius: 30rpx;
overflow: hidden;
position: relative;
z-index: 1;
box-sizing: border-box;
.card-box {
width: 100%;
min-height: 300rpx;
padding: 40rpx;
background-size: 100% 100%;
border-radius: 30rpx;
overflow: hidden;
position: relative;
z-index: 1;
box-sizing: border-box;
&::after {
content: '';
display: block;
width: 100%;
height: 100%;
z-index: 2;
position: absolute;
top: 0;
left: 0;
background: v-bind(headerBg) no-repeat;
pointer-events: none;
}
.card-head {
color: $white;
font-size: 30rpx;
}
.ss-eye-icon {
font-size: 40rpx;
color: $white;
}
.money-num {
font-size: 70rpx;
line-height: 70rpx;
font-weight: 500;
color: $white;
font-family: OPPOSANS;
}
.reduce-num {
font-size: 26rpx;
font-weight: 400;
color: $white;
}
.topup-btn {
width: 120rpx;
height: 60rpx;
line-height: 60rpx;
border-radius: 30px;
font-size: 26rpx;
font-weight: 500;
background-color: $white;
color: var(--ui-BG-Main);
}
.card-head {
color: $white;
font-size: 30rpx;
}
.ss-eye-icon {
font-size: 40rpx;
color: $white;
}
.money-num {
font-size: 70rpx;
line-height: 70rpx;
font-weight: 500;
color: $white;
font-family: OPPOSANS;
}
.reduce-num {
font-size: 26rpx;
font-weight: 400;
color: $white;
}
.topup-btn {
width: 150rpx;
height: 60rpx;
line-height: 60rpx;
border-radius: 30px;
font-size: 26rpx;
font-weight: 500;
background-color: $white;
color: var(--ui-BG-Main);
}
}
}
// 筛选
.filter-box {
height: 114rpx;
background-color: $bg-page;
height: 114rpx;
background-color: $bg-page;
.total-box {
font-size: 24rpx;
font-weight: 500;
color: $dark-9;
.total-box {
font-size: 24rpx;
font-weight: 500;
color: $dark-9;
}
.date-btn {
background-color: $white;
line-height: 54rpx;
border-radius: 27rpx;
padding: 0 20rpx;
font-size: 24rpx;
font-weight: 500;
color: $dark-6;
.ss-seldate-icon {
font-size: 50rpx;
color: $dark-9;
}
.date-btn {
background-color: $white;
line-height: 54rpx;
border-radius: 27rpx;
padding: 0 20rpx;
font-size: 24rpx;
font-weight: 500;
color: $dark-6;
.ss-seldate-icon {
font-size: 50rpx;
color: $dark-9;
}
}
}
.tabs-box {
background: $white;
border-bottom: 2rpx solid #eeeeee;
}
}
// tab
.wallet-tab-card {
.tab-item {
height: 80rpx;
position: relative;
.tab-item {
height: 80rpx;
position: relative;
.tab-title {
font-size: 30rpx;
}
.cur-tab-title {
font-weight: $font-weight-bold;
}
.tab-line {
width: 60rpx;
height: 6rpx;
border-radius: 6rpx;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 2rpx;
background-color: var(--ui-BG-Main);
}
.tab-title {
font-size: 30rpx;
}
.cur-tab-title {
font-weight: $font-weight-bold;
}
.tab-line {
width: 60rpx;
height: 6rpx;
border-radius: 6rpx;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 2rpx;
background-color: var(--ui-BG-Main);
}
}
}
// 钱包记录
.wallet-list {
padding: 30rpx;
background-color: #ffff;
padding: 30rpx;
background-color: #ffff;
.head-img {
width: 70rpx;
height: 70rpx;
border-radius: 50%;
background: $gray-c;
.head-img {
width: 70rpx;
height: 70rpx;
border-radius: 50%;
background: $gray-c;
}
.list-content {
justify-content: space-between;
align-items: flex-start;
flex: 1;
.title {
font-size: 28rpx;
color: $dark-3;
width: 400rpx;
}
.list-content {
justify-content: space-between;
align-items: flex-start;
flex: 1;
.time {
color: $gray-c;
font-size: 22rpx;
}
}
.title {
font-size: 28rpx;
color: $dark-3;
width: 400rpx;
}
.money {
font-size: 28rpx;
font-weight: bold;
font-family: OPPOSANS;
.time {
color: $gray-c;
font-size: 22rpx;
}
.add {
color: var(--ui-BG-Main);
}
.money {
font-size: 28rpx;
font-weight: bold;
font-family: OPPOSANS;
.add {
color: var(--ui-BG-Main);
}
.minus {
color: $dark-3;
}
.minus {
color: $dark-3;
}
}
}
</style>

7
peach/api/pay/wallet.js Normal file
View File

@ -0,0 +1,7 @@
import request from "@/peach/request";
const PayWalletApi = {
getWalletTransactionPage: () => {},
};
export default PayWalletApi;

130
peach/components/p-empty/p-empty.vue
View File

@ -1,87 +1,99 @@
<template>
<view class="ss-flex-col ss-col-center ss-row-center empty-box" :style="[{ paddingTop: paddingTop + 'rpx' }]">
<view class=""><image class="empty-icon" :src="icon" mode="widthFix"></image></view>
<view class="empty-text ss-m-t-28 ss-m-b-40">
<text v-if="text !== ''">{{ text }}</text>
</view>
<button class="ss-reset-button empty-btn" v-if="showAction" @tap="clickAction">
{{ actionText }}
</button>
<view class="ss-flex-col ss-col-center ss-row-center empty-box"
:style="[{ paddingTop: paddingTop + 'rpx', backgroundColor: bgColor, marginTop: marginTop + 'rpx' }]">
<view class="">
<image class="empty-icon" :src="icon" mode="widthFix"></image>
</view>
<view class="empty-text ss-m-t-28 ss-m-b-40">
<text v-if="text !== ''">{{ text }}</text>
</view>
<button class="ss-reset-button empty-btn" v-if="showAction" @tap="clickAction">
{{ actionText }}
</button>
</view>
</template>
<script setup>
import peach from '@/peach'
const props = defineProps({
// 图标
icon: {
type: String,
default: '',
},
// 描述
text: {
type: String,
default: '',
},
// 是否显示button
showAction: {
type: Boolean,
default: false,
},
// button 文字
actionText: {
type: String,
default: '',
},
// 链接
actionUrl: {
type: String,
default: '',
},
// 间距
paddingTop: {
type: String,
default: '260',
},
//主题色
buttonColor: {
type: String,
default: 'var(--ui-BG-Main)',
},
// 图标
icon: {
type: String,
default: '',
},
// 描述
text: {
type: String,
default: '',
},
// 是否显示button
showAction: {
type: Boolean,
default: false,
},
// button 文字
actionText: {
type: String,
default: '',
},
// 链接
actionUrl: {
type: String,
default: '',
},
// 间距
paddingTop: {
type: String,
default: '260',
},
//主题色
buttonColor: {
type: String,
default: 'var(--ui-BG-Main)',
},
bgColor: {
type: String,
default: '#ffffff',
},
marginTop: {
type: Number,
default: 0
}
})
const emits = defineEmits(['clickAction'])
function clickAction() {
if (props.actionUrl !== '') {
peach.$router.go(props.actionUrl)
}
emits('clickAction')
if (props.actionUrl !== '') {
peach.$router.go(props.actionUrl)
}
emits('clickAction')
}
</script>
<style lang="scss" scoped>
.empty-box {
width: 100%;
width: 100%;
}
.empty-icon {
width: 240rpx;
width: 240rpx;
}
.empty-text {
font-size: 26rpx;
font-weight: 500;
color: #999999;
font-size: 26rpx;
font-weight: 500;
color: #999999;
}
.empty-btn {
width: 320rpx;
height: 70rpx;
border: 2rpx solid v-bind('buttonColor');
border-radius: 35rpx;
font-weight: 500;
color: v-bind('buttonColor');
font-size: 28rpx;
width: 320rpx;
height: 70rpx;
border: 2rpx solid v-bind('buttonColor');
border-radius: 35rpx;
font-weight: 500;
color: v-bind('buttonColor');
font-size: 28rpx;
}
</style>

221
peach/store/user.js
View File

@ -1,124 +1,125 @@
import { ref } from 'vue'
import { defineStore } from 'pinia'
import $share from '@/peach/platform/share'
import $router from '@/peach/router'
import UserUtil from '@/peach/api/member/user'
import { isEmpty, cloneDeep, clone } from 'lodash'
import { ref } from "vue";
import { defineStore } from "pinia";
import $share from "@/peach/platform/share";
import $router from "@/peach/router";
import UserUtil from "@/peach/api/member/user";
import { isEmpty, cloneDeep, clone } from "lodash";
// 默认用户信息
const defaultUserInfo = {
avatar: '', // 头像
nickname: '', // 昵称
mobile: '', // 手机号
point: 0, // 积分
particulars: null,
}
avatar: "", // 头像
nickname: "", // 昵称
mobile: "", // 手机号
point: 0, // 积分
particulars: null,
};
// 默认钱包信息
const defaultWallet = {
balance: 0, // 余额
totalExpense: 0, // 总消费
totalRecharge: 0, // 总充值
}
balance: 0, // 余额
totalExpense: 0, // 总消费
totalRecharge: 0, // 总充值
};
// 默认订单信息
const defaultNumData = {
unusedCouponCount: 0,
orderCount: {
allCount: 0,
unpaidCount: 0,
undeliveredCount: 0,
deliveredCount: 0,
uncommentedCount: 0,
afterSaleCount: 0,
},
}
unusedCouponCount: 0,
orderCount: {
allCount: 0,
unpaidCount: 0,
undeliveredCount: 0,
deliveredCount: 0,
uncommentedCount: 0,
afterSaleCount: 0,
},
};
const useUserStore = defineStore(
'user',
() => {
const userInfo = ref(cloneDeep(defaultUserInfo))
const userWallet = ref(clone(defaultWallet))
const userNumData = ref(cloneDeep(defaultNumData))
const isLogin = ref(!!uni.getStorageSync('token'))
const lastUpdateTime = ref(0)
const lastRoutePage = ref(null)
"user",
() => {
const userInfo = ref(cloneDeep(defaultUserInfo));
const userWallet = ref(clone(defaultWallet));
const userNumData = ref(cloneDeep(defaultNumData));
const isLogin = ref(!!uni.getStorageSync("token"));
const lastUpdateTime = ref(0);
const lastRoutePage = ref(null);
async function getUserInfo() {
let res = await UserUtil.getUserInfo()
userInfo.value = res.data
}
async function getWallet() {
let res = await UserUtil.getWalletInfo()
userWallet.value = res.data
}
function getNumData() {}
function setToken(token, refreshToken) {
if (token === '') {
isLogin.value = false
uni.removeStorageSync('token')
uni.removeStorageSync('refresh-token')
} else {
isLogin.value = true
uni.setStorageSync('token', token)
uni.setStorageSync('refresh-token', refreshToken)
// 成功后处理
loginAfter()
}
return isLogin.value
}
function resetUserData() {
setToken('')
userInfo.value = cloneDeep(defaultUserInfo)
userWallet.value = clone(defaultWallet)
userNumData.value = cloneDeep(defaultNumData)
}
async function updateUserData() {
const nowTime = new Date().getTime()
if (lastUpdateTime.value + 5000 > nowTime) {
return
}
lastUpdateTime.value = nowTime
await Promise.all([getUserInfo(), getWallet(), getNumData()])
return userInfo.value
}
async function loginAfter() {
await updateUserData()
$share.getShareInfo()
$router.go('/pages/index/index')
}
function logOut() {
resetUserData()
return !isLogin.value
}
return {
userInfo,
userWallet,
isLogin,
setToken,
logOut,
loginAfter,
lastRoutePage,
}
},
{
persist: {
enabled: true,
strategies: [
{
key: 'user-store',
},
],
},
async function getUserInfo() {
let res = await UserUtil.getUserInfo();
userInfo.value = res.data;
}
)
export default useUserStore
async function getWallet() {
let res = await UserUtil.getWalletInfo();
userWallet.value = res.data;
}
function getNumData() {}
function setToken(token, refreshToken) {
if (token === "") {
isLogin.value = false;
uni.removeStorageSync("token");
uni.removeStorageSync("refresh-token");
} else {
isLogin.value = true;
uni.setStorageSync("token", token);
uni.setStorageSync("refresh-token", refreshToken);
// 成功后处理
loginAfter();
}
return isLogin.value;
}
function resetUserData() {
setToken("");
userInfo.value = cloneDeep(defaultUserInfo);
userWallet.value = clone(defaultWallet);
userNumData.value = cloneDeep(defaultNumData);
}
async function updateUserData() {
const nowTime = new Date().getTime();
if (lastUpdateTime.value + 5000 > nowTime) {
return;
}
lastUpdateTime.value = nowTime;
await Promise.all([getUserInfo(), getWallet(), getNumData()]);
return userInfo.value;
}
async function loginAfter() {
await updateUserData();
$share.getShareInfo();
$router.go("/pages/index/index");
}
function logOut() {
resetUserData();
return !isLogin.value;
}
return {
userInfo,
userWallet,
isLogin,
lastRoutePage,
setToken,
logOut,
loginAfter,
getWallet,
};
},
{
persist: {
enabled: true,
strategies: [
{
key: "user-store",
},
],
},
}
);
export default useUserStore;

599
peach/ui/pb-inner-navbar/pb-inner-navbar.vue
View File

@ -1,43 +1,30 @@
<template>
<pb-fixed
:noFixed="props.noFixed"
:alway="props.alway"
:bgStyles="props.bgStyles"
:val="0"
:index="props.zIndex"
noNav
:bg="props.bg"
:ui="props.ui"
:opacity="props.opacity"
:placeholder="props.placeholder"
>
<pb-status-bar />
<pb-fixed :noFixed="props.noFixed" :alway="props.alway" :bgStyles="props.bgStyles" :val="0" :index="props.zIndex"
noNav :bg="props.bg" :ui="props.ui" :opacity="props.opacity" :placeholder="props.placeholder">
<pb-status-bar />
<view class="ui-navbar-box">
<view
class="ui-bar ss-p-x-20"
:class="state.isDark ? 'text-white' : 'text-black'"
:style="[{ height: sys_navBar - sys_statusBar + 'px' }]"
>
<view v-if="leftIcon" class="icon-box ss-flex">
<view class="icon-button icon-button-left ss-flex ss-row-center" @tap="onClickLeft">
<text class="sicon-back" v-if="hasHistory" />
<text class="sicon-home" v-else />
</view>
<view class="line"></view>
<view class="icon-button icon-button-right ss-flex ss-row-center" @tap="onClickRight">
<text class="sicon-more" />
</view>
</view>
<slot name="center">
<view class="center navbar-title">{{ title }}</view>
</slot>
<!-- #ifdef MP -->
<view :style="[state.capsuleStyle]"></view>
<!-- #endif -->
</view>
<view class="ui-navbar-box">
<view class="ui-bar ss-p-x-20" :class="state.isDark ? 'text-white' : 'text-black'"
:style="[{ height: sys_navBar - sys_statusBar + 'px' }]">
<view v-if="leftIcon" class="icon-box ss-flex">
<view class="icon-button icon-button-left ss-flex ss-row-center" @tap="onClickLeft">
<text class="sicon-back" v-if="hasHistory" />
<text class="sicon-home" v-else />
</view>
<view class="line"></view>
<view class="icon-button icon-button-right ss-flex ss-row-center" @tap="onClickRight">
<text class="sicon-more" />
</view>
</view>
</pb-fixed>
<slot name="center">
<view :style="{ color: themeColor }" class="center navbar-title">{{ title }}</view>
</slot>
<!-- #ifdef MP -->
<view :style="[state.capsuleStyle]"></view>
<!-- #endif -->
</view>
</view>
</pb-fixed>
</template>
<script setup>
@ -67,302 +54,328 @@ import { showMenuTools, closeMenuTools } from '@/peach/hooks/useModal'
// 本地数据
const state = reactive({
statusCur: '',
capsuleStyle: {},
capsuleBack: {},
isDark: true,
statusCur: '',
capsuleStyle: {},
capsuleBack: {},
isDark: true,
})
const sys_statusBar = peach.$platform.device.statusBarHeight
const sys_navBar = peach.$platform.navbar
const sys_navBar = peach.$platform.navBar
const props = defineProps({
zIndex: {
type: Number,
default: 100,
},
dark: {
type: Boolean,
default: false,
},
color: {
type: String,
default: '',
},
zIndex: {
type: Number,
default: 100,
},
leftIcon: {
type: String,
default: '',
},
leftIcon: {
type: String,
default: '',
},
title: {
//返回文本
type: String,
default: '',
},
bg: {
type: String,
default: 'bg-white',
},
// 常驻
alway: {
type: Boolean,
default: true,
},
opacity: {
//是否开启滑动渐变
type: Boolean,
default: true,
},
noFixed: {
//是否浮动
type: Boolean,
default: true,
},
ui: {
type: String,
default: '',
},
capsule: {
//是否开启胶囊返回
type: Boolean,
default: false,
},
stopBack: {
type: Boolean,
default: false,
},
placeholder: {
type: [Boolean],
default: false,
},
bgStyles: {
type: Object,
default() {},
},
title: {
//返回文本
type: String,
default: '',
},
bg: {
type: String,
default: 'bg-white',
},
// 常驻
alway: {
type: Boolean,
default: true,
},
opacity: {
//是否开启滑动渐变
type: Boolean,
default: true,
},
noFixed: {
//是否浮动
type: Boolean,
default: true,
},
ui: {
type: String,
default: '',
},
capsule: {
//是否开启胶囊返回
type: Boolean,
default: false,
},
stopBack: {
type: Boolean,
default: false,
},
placeholder: {
type: [Boolean],
default: false,
},
bgStyles: {
type: Object,
default() { },
},
})
const emits = defineEmits(['navback', 'clickLeft'])
const hasHistory = peach.$router.hasHistory()
const themeColor = computed(() => {
if (props.dark) {
return props.color ? props.color : '#fff'
}
return props.color || '#333'
})
onBeforeMount(() => {
init()
init()
})
onPageScroll((e) => {
let top = e.scrollTop
state.isDark = top < peach.$platform.navbar
let top = e.scrollTop
state.isDark = top < peach.$platform.navbar
})
function onClickLeft() {
if (hasHistory) {
peach.$router.back()
} else {
peach.$router.go('/pages/index/index')
}
emits('clickLeft')
if (hasHistory) {
peach.$router.back()
} else {
peach.$router.go('/pages/index/index')
}
emits('clickLeft')
}
function onClickRight() {
showMenuTools()
showMenuTools()
}
// 初始化
const init = () => {
// #ifdef MP-ALIPAY
my.hideAllFavoriteMenu()
// #endif
state.capsuleStyle = {
width: peach.$platform.capsule.width + 'px',
height: peach.$platform.capsule.height + 'px',
}
// #ifdef MP-ALIPAY
my.hideAllFavoriteMenu()
// #endif
state.capsuleStyle = {
width: peach.$platform.capsule.width + 'px',
height: peach.$platform.capsule.height + 'px',
}
state.capsuleBack = state.capsuleStyle
state.capsuleBack = state.capsuleStyle
}
</script>
<style lang="scss" scoped>
.icon-box {
box-shadow: 0px 0px 4rpx rgba(51, 51, 51, 0.08), 0px 4rpx 6rpx 2rpx rgba(102, 102, 102, 0.12);
border-radius: 30rpx;
width: 134rpx;
box-shadow: 0px 0px 4rpx rgba(51, 51, 51, 0.08), 0px 4rpx 6rpx 2rpx rgba(102, 102, 102, 0.12);
border-radius: 30rpx;
width: 134rpx;
height: 56rpx;
margin-left: 8rpx;
border: 1px solid rgba(#fff, 0.4);
.line {
width: 2rpx;
height: 24rpx;
background: #e5e5e7;
}
.sicon-back {
font-size: 32rpx;
}
.sicon-home {
font-size: 32rpx;
}
.sicon-more {
font-size: 32rpx;
}
.icon-button {
width: 67rpx;
height: 56rpx;
margin-left: 8rpx;
border: 1px solid rgba(#fff, 0.4);
.line {
width: 2rpx;
height: 24rpx;
background: #e5e5e7;
&-left:hover {
background: rgba(0, 0, 0, 0.16);
border-radius: 30rpx 0px 0px 30rpx;
}
.sicon-back {
font-size: 32rpx;
}
.sicon-home {
font-size: 32rpx;
}
.sicon-more {
font-size: 32rpx;
}
.icon-button {
width: 67rpx;
height: 56rpx;
&-left:hover {
background: rgba(0, 0, 0, 0.16);
border-radius: 30rpx 0px 0px 30rpx;
}
&-right:hover {
background: rgba(0, 0, 0, 0.16);
border-radius: 0px 30rpx 30rpx 0px;
}
&-right:hover {
background: rgba(0, 0, 0, 0.16);
border-radius: 0px 30rpx 30rpx 0px;
}
}
}
.navbar-title {
font-size: 36rpx;
font-size: 36rpx;
}
.tools-icon {
font-size: 40rpx;
font-size: 40rpx;
}
.ui-navbar-box {
background-color: transparent;
background-color: transparent;
width: 100%;
.ui-bar {
position: relative;
z-index: 2;
white-space: nowrap;
display: flex;
position: relative;
align-items: center;
justify-content: space-between;
.left {
@include flex-bar;
.back {
@include flex-bar;
.back-icon {
@include flex-center;
width: 56rpx;
height: 56rpx;
margin: 0 10rpx;
font-size: 46rpx !important;
&.opacityIcon {
position: relative;
border-radius: 50%;
background-color: rgba(127, 127, 127, 0.5);
&::after {
content: '';
display: block;
position: absolute;
height: 200%;
width: 200%;
left: 0;
top: 0;
border-radius: inherit;
transform: scale(0.5);
transform-origin: 0 0;
opacity: 0.1;
border: 1px solid currentColor;
pointer-events: none;
}
&::before {
transform: scale(0.9);
}
}
}
/* #ifdef MP-ALIPAY */
._icon-back {
opacity: 0;
}
/* #endif */
}
.capsule {
@include flex-bar;
border-radius: 100px;
position: relative;
&.dark {
background-color: rgba(255, 255, 255, 0.5);
}
&.light {
background-color: rgba(0, 0, 0, 0.15);
}
&::after {
content: '';
display: block;
position: absolute;
height: 60%;
width: 1px;
left: 50%;
top: 20%;
background-color: currentColor;
opacity: 0.1;
pointer-events: none;
}
&::before {
content: '';
display: block;
position: absolute;
height: 200%;
width: 200%;
left: 0;
top: 0;
border-radius: inherit;
transform: scale(0.5);
transform-origin: 0 0;
opacity: 0.1;
border: 1px solid currentColor;
pointer-events: none;
}
.capsule-back,
.capsule-home {
@include flex-center;
flex: 1;
}
&.isFristPage {
.capsule-back,
&::after {
display: none;
}
}
}
}
.right {
@include flex-bar;
.right-content {
@include flex;
flex-direction: row-reverse;
}
}
.center {
@include flex-center;
text-overflow: ellipsis;
// text-align: center;
position: absolute;
left: 50%;
transform: translateX(-50%);
.image {
display: block;
height: 36px;
max-width: calc(100vw - 200px);
}
}
}
.ui-bar-bg {
position: absolute;
width: 100%;
.ui-bar {
position: relative;
z-index: 2;
white-space: nowrap;
display: flex;
position: relative;
align-items: center;
justify-content: space-between;
.left {
@include flex-bar;
.back {
@include flex-bar;
.back-icon {
@include flex-center;
width: 56rpx;
height: 56rpx;
margin: 0 10rpx;
font-size: 46rpx !important;
&.opacityIcon {
position: relative;
border-radius: 50%;
background-color: rgba(127, 127, 127, 0.5);
&::after {
content: '';
display: block;
position: absolute;
height: 200%;
width: 200%;
left: 0;
top: 0;
border-radius: inherit;
transform: scale(0.5);
transform-origin: 0 0;
opacity: 0.1;
border: 1px solid currentColor;
pointer-events: none;
}
&::before {
transform: scale(0.9);
}
}
}
/* #ifdef MP-ALIPAY */
._icon-back {
opacity: 0;
}
/* #endif */
}
.capsule {
@include flex-bar;
border-radius: 100px;
position: relative;
&.dark {
background-color: rgba(255, 255, 255, 0.5);
}
&.light {
background-color: rgba(0, 0, 0, 0.15);
}
&::after {
content: '';
display: block;
position: absolute;
height: 60%;
width: 1px;
left: 50%;
top: 20%;
background-color: currentColor;
opacity: 0.1;
pointer-events: none;
}
&::before {
content: '';
display: block;
position: absolute;
height: 200%;
width: 200%;
left: 0;
top: 0;
border-radius: inherit;
transform: scale(0.5);
transform-origin: 0 0;
opacity: 0.1;
border: 1px solid currentColor;
pointer-events: none;
}
.capsule-back,
.capsule-home {
@include flex-center;
flex: 1;
}
&.isFristPage {
.capsule-back,
&::after {
display: none;
}
}
}
}
.right {
@include flex-bar;
.right-content {
@include flex;
flex-direction: row-reverse;
}
}
.center {
@include flex-center;
text-overflow: ellipsis;
// text-align: center;
position: absolute;
left: 50%;
transform: translateX(-50%);
.image {
display: block;
height: 36px;
max-width: calc(100vw - 200px);
}
}
}
.ui-bar-bg {
position: absolute;
width: 100%;
height: 100%;
top: 0;
z-index: 1;
pointer-events: none;
}
height: 100%;
top: 0;
z-index: 1;
pointer-events: none;
}
}
</style>

299
peach/ui/pb-layout/pb-layout.vue
View File

@ -1,40 +1,31 @@
<template>
<view class="page-app" :class="['theme-' + sys.mode, 'main-' + sys.theme, 'font-' + sys.fontSize]">
<view class="page-main" :style="[bgMain]">
<!-- 顶部导航栏-情况1：默认通用顶部导航栏 -->
<pb-navbar
v-if="navbar === 'normal'"
:title="title"
:leftIcon="leftIcon"
statusBar
:color="color"
:tools="tools"
:opacityBgUi="opacityBgUi"
@search="(e) => emits('search', e)"
:defaultSearch="defaultSearch"
/>
<view class="page-body" :style="[bgBody]">
<!-- 顶部导航栏-情况2：沉浸式头部 -->
<pb-inner-navbar v-if="navbar === 'inner'" :title="title" :leftIcon="leftIcon" />
<view v-if="navbar === 'inner'" :style="[{ paddingTop: peach.$platform.navbar + 'px' }]"></view>
<view class="page-app" :class="['theme-' + sys.mode, 'main-' + sys.theme, 'font-' + sys.fontSize]">
<view class="page-main" :style="[bgMain]">
<!-- 顶部导航栏-情况1：默认通用顶部导航栏 -->
<pb-navbar v-if="navbar === 'normal'" :title="title" :leftIcon="leftIcon" statusBar :color="color" :tools="tools"
:opacityBgUi="opacityBgUi" @search="(e) => emits('search', e)" :defaultSearch="defaultSearch" />
<view class="page-body" :style="[bgBody]">
<!-- 顶部导航栏-情况2：沉浸式头部 -->
<pb-inner-navbar v-if="navbar === 'inner'" :color="color" :title="title" :leftIcon="leftIcon" />
<view v-if="navbar === 'inner'" :style="[{ paddingTop: peach.$platform.navBar + 'px' }]"></view>
<!-- 页面内容插槽 -->
<slot />
<!-- 页面内容插槽 -->
<slot />
<!-- 底部导航 -->
<pb-tabbar v-if="tabbar !== ''" :path="tabbar" />
</view>
</view>
<view class="page-modal">
<!-- 全局授权弹窗 -->
<!-- <p-auth-modal /> -->
<!-- 全局分享弹窗 -->
<!-- <p-share-modal :shareInfo="shareInfo" /> -->
<!-- 全局快捷入口 -->
<!-- <p-menu-tools /> -->
</view>
<!-- 底部导航 -->
<pb-tabbar v-if="tabbar !== ''" :path="tabbar" />
</view>
</view>
<view class="page-modal">
<!-- 全局授权弹窗 -->
<!-- <p-auth-modal /> -->
<!-- 全局分享弹窗 -->
<!-- <p-share-modal :shareInfo="shareInfo" /> -->
<!-- 全局快捷入口 -->
<!-- <p-menu-tools /> -->
</view>
</view>
</template>
<script setup>
@ -59,62 +50,62 @@ import { onShareAppMessage } from '@dcloudio/uni-app'
// #endif
const props = defineProps({
title: {
type: String,
default: '',
},
leftIcon: {
type: String,
default: '',
},
navbar: {
type: String,
default: 'normal',
},
opacityBgUi: {
type: String,
default: 'bg-white',
},
color: {
type: String,
default: '',
},
tools: {
type: String,
default: 'title',
},
bgStyle: {
type: Object,
default: () => ({
src: '',
color: 'var(--ui-BG-1)',
}),
},
tabbar: {
type: [String, Boolean],
default: '',
},
onShareAppMessage: {
type: [Boolean, Object],
default: true,
},
leftWidth: {
type: [Number, String],
default: 100,
},
rightWidth: {
type: [Number, String],
default: 100,
},
defaultSearch: {
type: String,
default: '',
},
//展示返回按钮
showLeftButton: {
type: Boolean,
default: false,
},
title: {
type: String,
default: '',
},
leftIcon: {
type: String,
default: '',
},
navbar: {
type: String,
default: 'normal',
},
opacityBgUi: {
type: String,
default: 'bg-white',
},
color: {
type: String,
default: '',
},
tools: {
type: String,
default: 'title',
},
bgStyle: {
type: Object,
default: () => ({
src: '',
color: 'var(--ui-BG-1)',
}),
},
tabbar: {
type: [String, Boolean],
default: '',
},
onShareAppMessage: {
type: [Boolean, Object],
default: true,
},
leftWidth: {
type: [Number, String],
default: 100,
},
rightWidth: {
type: [Number, String],
default: 100,
},
defaultSearch: {
type: String,
default: '',
},
//展示返回按钮
showLeftButton: {
type: Boolean,
default: false,
},
})
const emits = defineEmits(['search'])
@ -126,102 +117,102 @@ const sys = computed(() => sysStore)
// 导航栏模式(因为有自定义导航栏 需要计算)
const navbarMode = computed(() => {
if (props.navbar === 'normal') {
return 'normal'
}
return 'inner'
if (props.navbar === 'normal') {
return 'normal'
}
return 'inner'
})
// 背景1
const bgMain = computed(() => {
if (navbarMode.value === 'inner') {
return {
background: `${props.bgStyle.backgroundColor} url(${peach.$url.static(
props.bgStyle.backgroundImage,
props.bgStyle.imageType
)}) no-repeat top center / 100% auto`,
}
if (navbarMode.value === 'inner') {
return {
background: `${props.bgStyle.backgroundColor} url(${peach.$url.static(
props.bgStyle.backgroundImage,
props.bgStyle.imageType
)}) no-repeat top center / 100% auto`,
}
return {}
}
return {}
})
// 背景2
const bgBody = computed(() => {
if (navbarMode.value === 'normal') {
return {
background: `${props.bgStyle.backgroundColor} url(${peach.$url.static(
props.bgStyle.backgroundImage,
props.bgStyle.imageType
)}) no-repeat top center / 100% auto`,
}
if (navbarMode.value === 'normal') {
return {
background: `${props.bgStyle.backgroundColor} url(${peach.$url.static(
props.bgStyle.backgroundImage,
props.bgStyle.imageType
)}) no-repeat top center / 100% auto`,
}
return {}
}
return {}
})
// 分享信息
const shareInfo = computed(() => {
if (props.onShareAppMessage === true) {
return peach.$platform.share.getShareInfo()
} else {
if (!isEmpty(props.onShareAppMessage)) {
// peach.$platform.share.updateShareInfo(props.onShareAppMessage)
return props.onShareAppMessage
}
if (props.onShareAppMessage === true) {
return peach.$platform.share.getShareInfo()
} else {
if (!isEmpty(props.onShareAppMessage)) {
// peach.$platform.share.updateShareInfo(props.onShareAppMessage)
return props.onShareAppMessage
}
return {}
}
return {}
})
// #ifdef MP-WEIXIN
// 微信小程序分享
onShareAppMessage(() => {
return {
title: shareInfo.value.title,
path: shareInfo.value.path,
imageUrl: shareInfo.value.image,
}
return {
title: shareInfo.value.title,
path: shareInfo.value.path,
imageUrl: shareInfo.value.image,
}
})
// #endif
onShow(() => {
if (!isEmpty(shareInfo.value)) {
// peach.$platform.share.updateShareInfo(shareInfo.value)
}
if (!isEmpty(shareInfo.value)) {
// peach.$platform.share.updateShareInfo(shareInfo.value)
}
})
</script>
<style lang="scss" scoped>
.page-app {
position: relative;
color: var(--ui-TC);
background-color: var(--ui-BG-1) !important;
z-index: 2;
display: flex;
position: relative;
color: var(--ui-TC);
background-color: var(--ui-BG-1) !important;
z-index: 2;
display: flex;
width: 100%;
height: 100vh;
.page-main {
position: absolute;
z-index: 1;
width: 100%;
height: 100vh;
min-height: 100%;
display: flex;
flex-direction: column;
.page-main {
position: absolute;
z-index: 1;
width: 100%;
min-height: 100%;
display: flex;
flex-direction: column;
.page-body {
width: 100%;
position: relative;
z-index: 1;
flex: 1;
}
.page-img {
width: 100vw;
height: 100vh;
position: absolute;
top: 0;
left: 0;
z-index: 0;
}
.page-body {
width: 100%;
position: relative;
z-index: 1;
flex: 1;
}
.page-img {
width: 100vw;
height: 100vh;
position: absolute;
top: 0;
left: 0;
z-index: 0;
}
}
}
</style>

BIN
static/data-empty.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.9 KiB