github/niucloud-admin
1
0
Fork 0
mirror of https://gitee.com/niucloud-team/niucloud-admin.git synced 2026-03-13 15:21:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

up

Browse Source
This commit is contained in:
全栈小学生 2024-09-28 09:41:06 +08:00
parent 560569ecf2
commit 5151fedba4
116 changed files with 6339 additions and 2812 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

154
uni-app/src/App.vue
View File

@ -1,14 +1,14 @@
<script setup lang="ts">
import { onLaunch, onShow, onHide } from '@dcloudio/uni-app'
import { launchInterceptor } from '@/utils/interceptor'
import { getToken, isWeixinBrowser, currRoute } from '@/utils/common'
import { getToken, isWeixinBrowser, currRoute, deepClone } from '@/utils/common'
import useMemberStore from '@/stores/member'
import useConfigStore from '@/stores/config'
import useSystemStore from '@/stores/system'
import { useLogin } from '@/hooks/useLogin'
import { useShare } from '@/hooks/useShare'
onLaunch(async(data) => {
onLaunch((data: any) => {
// 添加初始化拦截器
launchInterceptor()
@ -50,11 +50,11 @@
// #ifdef MP
const updateManager = uni.getUpdateManager();
updateManager.onCheckForUpdate(function(res) {
updateManager.onCheckForUpdate(function (res) {
// 请求完新版本信息的回调
});
updateManager.onUpdateReady(function(res) {
updateManager.onUpdateReady(function (res) {
uni.showModal({
title: '更新提示',
content: '新版本已经准备好，是否重启应用？',
@ -67,88 +67,106 @@
});
});
updateManager.onUpdateFailed(function(res) {
updateManager.onUpdateFailed(function (res) {
// 新的版本下载失败
});
// #endif
const configStore = useConfigStore()
await configStore.getTabbarConfig()
await configStore.getLoginConfig()
// 获取初始化数据信息
useSystemStore().getInitFn(async() => {
useSystemStore().getMapFn()
useSystemStore().getSiteInfoFn()
useMemberStore().getMemberLevel()
try {
// 隐藏tabbar
uni.hideTabBar()
} catch (e) {
const configStore = useConfigStore()
}
try {
uni.hideTabBar() // 隐藏tabbar
} catch (e) {
// 判断在登录注册页面账号锁定后不进行请求三方登录注册
let url = currRoute()
if ((url == 'app/pages/auth/login' || url == 'app/pages/auth/register') && (configStore.login.is_username || configStore.login.is_mobile || configStore.login.is_bind_mobile)) {
return false
}
}
// 判断是否已登录
if (getToken()) {
const memberStore = useMemberStore()
await memberStore.setToken(getToken())
let loginConfig = uni.getStorageSync('login_config')
if (!loginConfig) {
loginConfig = deepClone(configStore.login)
}
setTimeout(() => {
if (!uni.getStorageSync('openid')) {
const memberInfo = useMemberStore().info
const login = useLogin()
// #ifdef MP-WEIXIN
if (memberInfo && memberInfo.weapp_openid) {
uni.setStorageSync('openid', memberInfo.weapp_openid)
} else {
login.getAuthCode('', true)
}
// #endif
// #ifdef H5
if (isWeixinBrowser()) {
if (memberInfo && memberInfo.wx_openid) {
uni.setStorageSync('openid', memberInfo.wx_openid)
} else {
data.query.code ? login.updateOpenid(data.query.code) : login.getAuthCode('snsapi_userinfo')
}
}
// #endif
}
// 开启强制绑定手机号
if (uni.getStorageSync('isbindmobile')) {
uni.removeStorageSync('isbindmobile');
}
if (configStore.login.is_bind_mobile && !memberStore.info.mobile) {
// 强制绑定手机号
uni.setStorageSync('isbindmobile', true)
}
}, 1000)
}
if (!getToken()) {
// todo 退出后不进行自动登录
// #ifdef MP
if(uni.getStorageSync('autoLoginLock')){
// 判断在登录注册页面账号锁定后不进行请求三方登录注册
let url: any = currRoute()
if ((['app/pages/auth/index', 'app/pages/auth/login', 'app/pages/auth/register', 'app/pages/auth/resetpwd'].indexOf(url) != -1) &&
(loginConfig.is_username || loginConfig.is_mobile || loginConfig.is_bind_mobile)) {
return false
}
// #endif
// 判断是否开启第三方自动注册登录
if (configStore.login.is_auth_register) {
const login = useLogin()
// 第三方平台自动登录
// 判断是否已登录
if (getToken()) {
const memberStore: any = useMemberStore()
await memberStore.setToken(getToken(), () => {
if (!uni.getStorageSync('openid')) {
const memberInfo = useMemberStore().info
const login = useLogin()
// #ifdef MP-WEIXIN
if (memberInfo.mobile) uni.setStorageSync('wap_member_mobile', memberInfo.mobile) // 存储会员手机号，防止重复请求微信获取手机号接口
if (memberInfo && memberInfo.weapp_openid) {
uni.setStorageSync('openid', memberInfo.weapp_openid)
} else {
login.getAuthCode({ updateFlag: true }) // 更新oppenid
}
// #endif
// #ifdef H5
if (isWeixinBrowser()) {
if (memberInfo && memberInfo.wx_openid) {
uni.setStorageSync('openid', memberInfo.wx_openid)
} else {
data.query.code ? login.updateOpenid(data.query.code) : login.getAuthCode({ scopes: 'snsapi_userinfo' })
}
}
// #endif
}
// 开启强制绑定手机号
if (uni.getStorageSync('isbindmobile')) {
uni.removeStorageSync('isbindmobile');
}
if (loginConfig.is_bind_mobile && !memberStore.info.mobile) {
// 强制绑定手机号
uni.setStorageSync('isbindmobile', true)
}
})
}
if (!getToken()) {
// #ifdef MP
login.getAuthCode()
// 小程序 会员退出后不会自动登录
if (uni.getStorageSync('autoLoginLock')) return;
// #endif
const login = useLogin()
// #ifdef MP
// 判断是否开启第三方自动注册登录
if (loginConfig.is_auth_register) {
// 第三方平台自动登录
login.getAuthCode()
}
// #endif
// #ifdef H5
if (isWeixinBrowser()) {
data.query.code ? login.authLogin(data.query.code) : login.getAuthCode('snsapi_userinfo')
if (uni.getStorageSync('autoLoginLock') && !uni.getStorageSync('wechat_login_back')) return;
if (loginConfig.is_auth_register || uni.getStorageSync('wechat_login_back')) {
uni.removeStorageSync('wechat_login_back') // 删除微信公众号手动授权登录回调标识
data.query.code ? login.authLogin({ code: data.query.code }) : login.getAuthCode({ scopes: 'snsapi_userinfo' })
}
}
// #endif
}
}
});
})
onShow(() => {

2
uni-app/src/app/api/auth.ts
View File

@ -111,7 +111,7 @@ export function bind(data : AnyObject) {
}
/**
* 记录会员访问日志
* 记录会员访问日志【目前只更新最后访问时间】
*/
export function memberLog(data : AnyObject) {
return request.post('member/log', data, { showErrorMessage: false })

7
uni-app/src/app/api/diy.ts
View File

@ -7,13 +7,6 @@ export function getDiyInfo(params: Record<string, any>) {
return request.get('diy/diy', params)
}
/**
* 获取底部导航信息
*/
export function getTabbarInfo(params: Record<string, any>) {
return request.get('diy/tabbar', params)
}
/**
* 获取底部导航列表
*/

33
uni-app/src/app/api/system.ts
View File

@ -4,56 +4,56 @@ import request from '@/utils/request'
* 获取验证码
*/
export function getCaptcha() {
return request.get('captcha', {}, {showErrorMessage: true})
return request.get('captcha', {}, { showErrorMessage: true })
}
/**
* 获取微信公众号授权码
*/
export function getWechatAuthCode(data: AnyObject) {
return request.get('wechat/codeurl', data, {showErrorMessage: false })
return request.get('wechat/codeurl', data, { showErrorMessage: false })
}
/**
* 同步微信信息
*/
export function wechatSync(data: AnyObject) {
return request.post('wechat/sync', data, {showErrorMessage: false})
return request.post('wechat/sync', data, { showErrorMessage: false })
}
/**
* 获取协议信息
*/
export function getAgreementInfo(key: string) {
return request.get(`agreement/${key}`)
return request.get(`agreement/${ key }`)
}
/**
* 重置密码
*/
export function resetPassword(data: AnyObject) {
return request.post(`password/reset`, data, {showErrorMessage: true})
return request.post(`password/reset`, data, { showErrorMessage: true })
}
/**
* 发送短信验证码
*/
export function sendSms(data: AnyObject) {
return request.post(`send/mobile/${data.type}`, data, {showErrorMessage: true})
return request.post(`send/mobile/${ data.type }`, data, { showErrorMessage: true })
}
/**
* 获取微信jssdk config
*/
export function getWechatSkdConfig(data: AnyObject) {
return request.get('wechat/jssdkconfig', data, {showErrorMessage: false})
return request.get('wechat/jssdkconfig', data, { showErrorMessage: false })
}
/**
* 上传图片
*/
export function uploadImage(data: AnyObject) {
return request.upload('file/image', data, {showErrorMessage: true})
return request.upload('file/image', data, { showErrorMessage: true })
}
/**
@ -81,7 +81,7 @@ export function getSiteInfo() {
* 获取微信小程序订阅消息模板id
*/
export function getWeappTemplateId(keys: string) {
return request.get('weapp/subscribemsg', {keys})
return request.get('weapp/subscribemsg', { keys })
}
/**
@ -89,7 +89,7 @@ export function getWeappTemplateId(keys: string) {
* @param pid
*/
export function getAreaListByPid(pid: number = 0) {
return request.get(`area/list_by_pid/${pid}`)
return request.get(`area/list_by_pid/${ pid }`)
}
/**
@ -97,7 +97,7 @@ export function getAreaListByPid(pid: number = 0) {
* @param level
*/
export function getAreatree(level: number = 1) {
return request.get(`area/tree/${level}`)
return request.get(`area/tree/${ level }`)
}
/**
@ -105,7 +105,7 @@ export function getAreatree(level: number = 1) {
* @param code
*/
export function getAreaByCode(code: number | string) {
return request.get(`area/code/${code}`)
return request.get(`area/code/${ code }`)
}
/**
@ -113,7 +113,7 @@ export function getAreaByCode(code: number | string) {
* @param params
*/
export function getAddressByLatlng(params: Record<string, any>) {
return request.get(`area/address_by_latlng`, params, {showErrorMessage: true})
return request.get(`area/address_by_latlng`, params, { showErrorMessage: true })
}
/**
@ -138,3 +138,10 @@ export function getMap() {
export function getMsgJumpPath(params: Record<string, any>) {
return request.get('weapp/getMsgJumpPath', params)
}
/**
* 获取初始化数据信息
*/
export function getInitInfo() {
return request.get('init')
}

66
uni-app/src/app/components/diy/active-cube/index.vue
View File

@ -1,27 +1,28 @@
<template>
<view :style="warpCss">
<view :style="maskLayer"></view>
<view class="diy-active-cube relative">
<view class="active-cube-wrap p-[20rpx]">
<view class="active-cube-wrap p-[20rpx] pb-[24rpx]">
<view class="flex items-center" v-if="diyComponent.titleStyle.value == 'style-1'">
<view class="mr-[20rpx] font-bold text-[32rpx]" :style="{color: diyComponent.titleColor }" @click="diyStore.toRedirect(diyComponent.textLink)">{{ diyComponent.text }}</view>
<view v-if="diyComponent.subTitle.text" @click="diyStore.toRedirect(diyComponent.subTitle.link)" class="text-center text-[24rpx] rounded-[40rpx] rounded-tl-none py-[10rpx] px-[20rpx]" :style="{'color': diyComponent.subTitle.textColor, background: 'linear-gradient(90deg, '+ diyComponent.subTitle.startColor + ', '+ diyComponent.subTitle.endColor + ')'}">{{ diyComponent.subTitle.text }}</view>
<view class="mr-[10rpx] font-500 text-[30rpx]" :style="{color: diyComponent.titleColor }" @click="diyStore.toRedirect(diyComponent.textLink)">{{ diyComponent.text }}</view>
<view v-if="diyComponent.subTitle.text" @click="diyStore.toRedirect(diyComponent.subTitle.link)" class="text-center text-[22rpx] rounded-[40rpx] rounded-tl-[10rpx] py-[6rpx] px-[14rpx]" :style="{'color': diyComponent.subTitle.textColor, background: 'linear-gradient(90deg, '+ diyComponent.subTitle.startColor + ', '+ diyComponent.subTitle.endColor + ')'}">{{ diyComponent.subTitle.text }}</view>
</view>
<view class="flex items-center" v-if="diyComponent.titleStyle.value == 'style-2'">
<view class="mr-[20rpx] font-bold text-[32rpx]" :style="{color: diyComponent.titleColor }" @click="diyStore.toRedirect(diyComponent.textLink)">{{ diyComponent.text }}</view>
<view v-if="diyComponent.subTitle.text" @click="diyStore.toRedirect(diyComponent.subTitle.link)" class="text-center text-[24rpx] rounded-[10rpx] py-[10rpx] px-[20rpx]" :style="{'color': diyComponent.subTitle.textColor, background: 'linear-gradient(90deg, '+ diyComponent.subTitle.startColor + ', '+ diyComponent.subTitle.endColor + ')'}">{{ diyComponent.subTitle.text }}</view>
<view class="mr-[10rpx] font-500 text-[30rpx]" :style="{color: diyComponent.titleColor }" @click="diyStore.toRedirect(diyComponent.textLink)">{{ diyComponent.text }}</view>
<view v-if="diyComponent.subTitle.text" @click="diyStore.toRedirect(diyComponent.subTitle.link)" class="text-center text-[22rpx] rounded-[6rpx] py-[6rpx] px-[14rpx]" :style="{'color': diyComponent.subTitle.textColor, background: 'linear-gradient(90deg, '+ diyComponent.subTitle.startColor + ', '+ diyComponent.subTitle.endColor + ')'}">{{ diyComponent.subTitle.text }}</view>
</view>
<view class="flex items-center" v-if="diyComponent.titleStyle.value == 'style-3'">
<view class="mr-[20rpx] font-bold text-[32rpx]" @click="diyStore.toRedirect(diyComponent.textLink)" :style="{color: diyComponent.titleColor }">{{ diyComponent.text }}</view>
<view class="relative h-[44rpx]" @click="diyStore.toRedirect(diyComponent.subTitle.link)">
<view v-if="diyComponent.subTitle.text" class="text-center text-[24rpx] py-[10rpx] pl-[16rpx] pr-[36rpx]" :style="{'color': diyComponent.subTitle.textColor, background: 'linear-gradient(90deg, '+ diyComponent.subTitle.startColor + ', '+ diyComponent.subTitle.endColor + ')'}">{{ diyComponent.subTitle.text }}</view>
<image class="absolute left-0 top-0 bottom-0 !w-[16rpx] !h-[44rpx]" :src="img('static/resource/images/diy/active_cube/block_style2_1.png')" mode="scaleToFill"/>
<image class="absolute right-0 top-0 bottom-0 !w-[28rpx] !h-[44rpx]" :src="img('static/resource/images/diy/active_cube/block_style2_2.png')" mode="scaleToFill"/>
<view class="mr-[10rpx] font-500 text-[30rpx]" @click="diyStore.toRedirect(diyComponent.textLink)" :style="{color: diyComponent.titleColor }">{{ diyComponent.text }}</view>
<view class="relative h-[36rpx]" @click="diyStore.toRedirect(diyComponent.subTitle.link)">
<view v-if="diyComponent.subTitle.text" class="flex items-center text-[22rpx] leading-0 min-w-[60rpx] h-[34rpx] pl-[10rpx] pr-[34rpx]" :style="{'color': diyComponent.subTitle.textColor, 'background-image':'url('+img('static/resource/images/diy/active_cube/bg_2.png')+')','background-size': '100% 100%','background-repeat': 'no-repeat'}">{{ diyComponent.subTitle.text }}</view>
<!-- <image class="absolute left-0 top-0 bottom-0 !w-[16rpx] !h-[36rpx]" :src="img('static/resource/images/diy/active_cube/block_style2_1.png')" mode="scaleToFill"/>
<image class="absolute right-0 top-0 bottom-0 !w-[28rpx] !h-[36rpx]" :src="img('static/resource/images/diy/active_cube/block_style2_2.png')" mode="scaleToFill"/> -->
</view>
</view>
<view class="flex items-center justify-between" v-if="diyComponent.titleStyle.value == 'style-4'">
<view class="font-bold text-[32rpx]" @click="diyStore.toRedirect(diyComponent.textLink)" :style="{color: diyComponent.titleColor }">{{ diyComponent.text }}</view>
<view v-if="diyComponent.subTitle.text" @click="diyStore.toRedirect(diyComponent.subTitle.link)" class="text-[24rpx] rounded-[40rpx] py-[10rpx] pl-[16rpx] pr-[12rpx] flex items-center" :style="{'color': diyComponent.subTitle.textColor, background: 'linear-gradient(90deg, '+ diyComponent.subTitle.startColor + ', '+ diyComponent.subTitle.endColor + ')'}">
<view class="font-500 text-[30rpx]" @click="diyStore.toRedirect(diyComponent.textLink)" :style="{color: diyComponent.titleColor }">{{ diyComponent.text }}</view>
<view v-if="diyComponent.subTitle.text" @click="diyStore.toRedirect(diyComponent.subTitle.link)" class="text-[22rpx] rounded-[40rpx] pl-[16rpx] pr-[8rpx] h-[42rpx] flex-center" :style="{'color': diyComponent.subTitle.textColor, background: 'linear-gradient(90deg, '+ diyComponent.subTitle.startColor + ', '+ diyComponent.subTitle.endColor + ')'}">
<text>{{ diyComponent.subTitle.text }}</text>
<text class="nc-iconfont nc-icon-youV6xx !text-[26rpx]"></text>
</view>
@ -29,11 +30,11 @@
<view class="bd flex flex-wrap justify-between">
<template v-for="item in diyComponent.list" :key="item.id">
<view v-if="diyComponent.blockStyle.value == 'style-1'" @click="diyStore.toRedirect(item.link)" class="item flex justify-between p-[20rpx] bg-white mt-[20rpx] rounded-[16rpx]" :style="{ backgroundColor : diyComponent.elementBgColor }">
<view v-if="diyComponent.blockStyle.value == 'style-1'" @click="diyStore.toRedirect(item.link)" class="item flex justify-between px-[20rpx] py-[30rpx] bg-white mt-[20rpx] rounded-[var(--rounded-mid)]" :style="{ backgroundColor : diyComponent.elementBgColor }">
<view class="flex-1 flex items-baseline flex-col">
<view class="text--[28rpx] pb-[20rpx]" :style="{ fontWeight : diyComponent.blockStyle.fontWeight }">{{ item.title.text }}</view>
<view class="text--[24rpx] text-gray-500 pb-[20rpx]">{{ item.subTitle.text }}</view>
<view class="link relative text-[24rpx] leading-[40rpx] flex items-center text-white rounded-r-[20rpx] h-[40rpx] pl-[26rpx] pr-[10rpx]" :style="btnCss(item.moreTitle)" v-if="item.moreTitle.text">
<view class="text-[28rpx] pb-[10rpx] text-[#333]" :style="{ fontWeight : diyComponent.blockStyle.fontWeight }">{{ item.title.text }}</view>
<view class="text-[22rpx] text-[#999] pb-[30rpx]">{{ item.subTitle.text }}</view>
<view class="link relative text-[22rpx] leading-[40rpx] flex items-center text-white rounded-r-[20rpx] h-[40rpx] pl-[26rpx] pr-[10rpx]" :style="btnCss(item.moreTitle)" v-if="item.moreTitle.text">
<text class="mr-[8rpx]">{{ item.moreTitle.text }}</text>
<text class="iconfont iconjiantou-you-cuxiantiao-fill !text-[20rpx] text-[#fff]"></text>
<image class="absolute left-0 top-0 bottom-0 !w-[28rpx]" :src="img('static/resource/images/diy/active_cube/block_style1_1.png')" mode="scaleToFill"/>
@ -46,11 +47,11 @@
<u-icon name="photo" color="#999" size="50"></u-icon>
</view>
</view>
<view v-if="diyComponent.blockStyle.value == 'style-2'" @click="diyStore.toRedirect(item.link)" class="item flex justify-between p-[20rpx] bg-white mt-[20rpx] rounded-[16rpx]" :style="{ backgroundColor : diyComponent.elementBgColor }">
<view v-if="diyComponent.blockStyle.value == 'style-2'" @click="diyStore.toRedirect(item.link)" class="item flex justify-between p-[20rpx] bg-white mt-[20rpx] rounded-[var(--rounded-mid)]" :style="{ backgroundColor : diyComponent.elementBgColor }">
<view class="flex-1 flex items-baseline flex-col">
<view class="text--[28rpx] pb-[20rpx]" :style="{ fontWeight : diyComponent.blockStyle.fontWeight }">{{ item.title.text }}</view>
<view class="text--[24rpx] text-gray-500 pb-[20rpx]">{{ item.subTitle.text }}</view>
<view class="link relative text-[24rpx] leading-[40rpx] flex items-center text-white rounded-[20rpx] h-[40rpx] pl-[20rpx] pr-[10rpx]" :style="btnCss(item.moreTitle)" v-if="item.moreTitle.text">
<view class="text-[26rpx] pb-[20rpx]" :style="{ fontWeight : diyComponent.blockStyle.fontWeight }">{{ item.title.text }}</view>
<view class="text-[22rpx] text-gray-500 pb-[20rpx]">{{ item.subTitle.text }}</view>
<view class="link relative text-[22rpx] leading-[40rpx] flex items-center text-white rounded-[20rpx] h-[40rpx] pl-[20rpx] pr-[10rpx]" :style="btnCss(item.moreTitle)" v-if="item.moreTitle.text">
<text class="mr-[8rpx]">{{ item.moreTitle.text }}</text>
<text class="iconfont iconjiantou-you-cuxiantiao-fill !text-[20rpx] text-[#fff]"></text>
</view>
@ -64,10 +65,10 @@
</view>
</template>
</view>
<scroll-view scroll-x="true" class="whitespace-nowrap" :id="'warpStyle3-'+diyComponent.id" v-if="diyComponent.blockStyle.value == 'style-3'">
<scroll-view :scroll-x="true" class="whitespace-nowrap" :id="'warpStyle3-'+diyComponent.id" v-if="diyComponent.blockStyle.value == 'style-3'">
<view v-for="(item,index) in diyComponent.list" :key="item.id" class="inline-flex">
<view :id="'item'+index+diyComponent.id" @click="diyStore.toRedirect(item.link)" class="flex flex-col items-center justify-between p-[10rpx] bg-white mt-[20rpx] w-[157rpx] h-[200rpx] rounded-[10rpx] box-border" :style="itemStyle3" :class="{'!mr-[0rpx]': index+1 === diyComponent.list.length}">
<view class="w-[141rpx] h-[141rpx]" v-if="item.imageUrl">
<view :id="'item'+index+diyComponent.id" @click="diyStore.toRedirect(item.link)" class="flex flex-col items-center justify-between p-[10rpx] bg-white mt-[20rpx] w-[157rpx] h-[200rpx] rounded-[var(--rounded-mid)] box-border" :style="itemStyle3" :class="{'!mr-[0rpx]': index+1 === diyComponent.list.length}">
<view class="w-[141rpx] h-[141rpx] rounded-[var(--rounded-small)] overflow-hidden" v-if="item.imageUrl">
<image class="w-[141rpx] h-[141rpx]" :src="img(item.imageUrl)" mode="aspectFit" />
</view>
<view class="w-[141rpx] h-[141rpx] relative flex-shrink-0" v-else>
@ -75,15 +76,15 @@
<u-icon name="photo" color="#999" size="50"></u-icon>
</view>
</view>
<view class="my-[10rpx] text-[26rpx]" :style="{ color : item.title.textColor,fontWeight : diyComponent.blockStyle.fontWeight }">{{ item.title.text }}</view>
<view class="mt-[10rpx] mb-[2rpx] text-[26rpx]" :style="{ color : item.title.textColor,fontWeight : diyComponent.blockStyle.fontWeight }">{{ item.title.text }}</view>
</view>
</view>
</scroll-view>
<scroll-view scroll-x="true" class="whitespace-nowrap" :id="'warpStyle4-'+diyComponent.id" v-if="diyComponent.blockStyle.value == 'style-4'">
<view v-for="(item,index) in diyComponent.list" :key="item.id" class="inline-flex">
<view :id="'item'+index+diyComponent.id" @click="diyStore.toRedirect(item.link)" class="flex flex-col items-center justify-between p-[4rpx] bg-[#F93D02] mt-[20rpx] rounded-[20rpx] box-border" :class="{'!mr-[0rpx]': index+1 === diyComponent.list.length}" :style="'background :linear-gradient('+ item.listFrame.startColor +','+ item.listFrame.endColor + ');'+itemStyle4">
<view class="w-[149rpx] h-[149rpx] box-border px-[18rpx] pt-[16rpx] pb-[6rpx] bg-[#fff] flex flex-col items-center rounded-[16rpx]">
<view :id="'item'+index+diyComponent.id" @click="diyStore.toRedirect(item.link)" class="flex flex-col items-center justify-between p-[4rpx] bg-[#F93D02] mt-[20rpx] rounded-[var(--rounded-mid)] box-border" :class="{'!mr-[0rpx]': index+1 === diyComponent.list.length}" :style="'background :linear-gradient('+ item.listFrame.startColor +','+ item.listFrame.endColor + ');'+itemStyle4">
<view class="w-[149rpx] h-[149rpx] box-border px-[18rpx] pt-[16rpx] pb-[6rpx] bg-[#fff] flex flex-col items-center rounded-[var(--rounded-small)]">
<view class="w-[112rpx] h-[102rpx]" v-if="item.imageUrl">
<image class="w-[112rpx] h-[102rpx]" :src="img(item.imageUrl)" mode="aspectFit" />
</view>
@ -92,9 +93,9 @@
<u-icon name="photo" color="#999" size="50"></u-icon>
</view>
</view>
<view class="relative -mt-[10rpx] text-[22rpx] bg-[#F3DAC5] text-[#ED6E00] rounded-[16rpx] px-[12rpx] leading-[36rpx]" :style="{ color : item.subTitle.textColor, background : 'linear-gradient(to right,'+ item.subTitle.startColor +','+ item.subTitle.endColor + ')' }">{{ item.subTitle.text }}</view>
<view class="relative -mt-[10rpx] text-[20rpx] bg-[#F3DAC5] text-[#ED6E00] rounded-[16rpx] px-[12rpx] h-[34rpx] flex-center" :style="{ color : item.subTitle.textColor, background : 'linear-gradient(to right,'+ item.subTitle.startColor +','+ item.subTitle.endColor + ')' }">{{ item.subTitle.text }}</view>
</view>
<view class="mt-[10rpx] mb-[6rpx] text-[28rpx] text-[#fff]" :style="{ fontWeight : diyComponent.blockStyle.fontWeight }">{{ item.title.text }}</view>
<view class="mt-[12rpx] mb-[12rpx] text-[26rpx] text-[#fff]" :style="{ fontWeight : (diyComponent.blockStyle.fontWeight == 'bold' ? diyComponent.blockStyle.fontWeight : '500') }">{{ item.title.text }}</view>
</view>
</view>
</scroll-view>
@ -162,29 +163,28 @@
//商品样式三
const itemStyle3 = ref('');
const setItemStyle3 = ()=>{
// #ifdef MP-WEIXIN
// #ifdef MP-WEIXIN
uni.createSelectorQuery().in(instance).select('#warpStyle3-'+diyComponent.value.id).boundingClientRect((res:any) => {
uni.createSelectorQuery().in(instance).select('#item0'+diyComponent.value.id).boundingClientRect((data:any) => {
itemStyle3.value = `margin-right:${(res.width - data.width*4)/3}px;`
}).exec()
}).exec()
// #endif
// #ifdef H5
// #ifdef H5
itemStyle3.value= 'margin-right:14rpx;'
// #endif
};
//商品样式四
const itemStyle4 = ref('');
const setItemStyle4 = ()=>{
// #ifdef MP-WEIXIN
// #ifdef MP-WEIXIN
uni.createSelectorQuery().in(instance).select('#warpStyle4-'+diyComponent.value.id).boundingClientRect((res:any) => {
uni.createSelectorQuery().in(instance).select('#item0'+diyComponent.value.id).boundingClientRect((data:any) => {
itemStyle4.value = `margin-right:${(res.width - data.width*4)/3}px;`
}).exec()
}).exec()
// #endif
// #ifdef H5
// #ifdef H5
itemStyle4.value= 'margin-right:14rpx;'
// #endif
};

78
uni-app/src/app/components/diy/carousel-search/index.vue
View File

@ -11,9 +11,9 @@
<view class="img-wrap" v-if="diyComponent.search.logo">
<image :src="img(diyComponent.search.logo)" mode="aspectFit"/>
</view>
<view class="search-content" @click="diyStore.toRedirect(diyComponent.search.link)">
<view class="search-content" @click.stop="diyStore.toRedirect(diyComponent.search.link)">
<text class="input-content text-[#fff] text-[24rpx] leading-[68rpx]">{{isShowSearchPlaceholder ? diyComponent.search.text : ''}}</text>
<text class="nc-iconfont nc-icon-sousuo-duanV6xx1"></text>
<text class="nc-iconfont nc-icon-sousuo-duanV6xx1 text-[28rpx] text-[#fff]"></text>
<swiper class="swiper-wrap" :interval="diyComponent.search.hotWord.interval * 1000" autoplay="true" vertical="true" circular="true" v-if="!isShowSearchPlaceholder">
<swiper-item class="swiper-item" v-for="(item) in diyComponent.search.hotWord.list" :key="item.id">
@ -35,7 +35,7 @@
<view class="line" :style="{'background-color': getTabColor(index == currTabIndex)}" v-if="index == currTabIndex"></view>
</view>
</scroll-view>
<view v-if="diyComponent.tab.list.length" class="absolute tab-btn nc-iconfont nc-icon-yingyongliebiaoV6xx" @click="tabAllPopup = true"></view>
<view v-if="diyComponent.tab.list.length" class="absolute tab-btn iconfont icona-yingyongliebiaoV6xx-32" @click="tabAllPopup = true"></view>
</view>
<view class="bg-img" v-if="fixedStyleBg">
@ -46,7 +46,7 @@
<!-- 解决fixed定位后导航栏塌陷的问题 -->
<template v-if="diyStore.mode != 'decorate'">
<view v-if="diyComponent.positionWay == 'fixed' && props.scrollBool != -1" class="u-navbar-placeholder" :style="{ width: '100%', paddingTop: moduleHeight }"></view>
<view v-if="diyComponent.positionWay == 'fixed' && props.scrollBool != undefined && props.scrollBool != -1" class="u-navbar-placeholder" :style="{ width: '100%', paddingTop: moduleHeight }"></view>
</template>
<!-- 轮播图 -->
@ -57,7 +57,7 @@
'swiper-right': diyComponent.swiper.indicatorAlign == 'right',
'ns-indicator-dots': diyComponent.swiper.indicatorStyle == 'style-2'
}"
:previous-margin="swiperStyle2 ? 0 : '36rpx'" :next-margin="swiperStyle2 ? 0 : '36rpx'"
:previous-margin="swiperStyle2 ? 0 : '26rpx'" :next-margin="swiperStyle2 ? 0 : '26rpx'"
:interval="diyComponent.swiper.interval * 1000" :indicator-dots="isShowDots"
:indicator-color="diyComponent.swiper.indicatorColor" :indicator-active-color="diyComponent.swiper.indicatorActiveColor">
<swiper-item class="swiper-item" v-for="(item,index) in diyComponent.swiper.list" :key="item.id" :style="swiperWarpCss">
@ -119,7 +119,6 @@
const instance = getCurrentInstance();
const props = defineProps(['component', 'index', 'pullDownRefreshCount', 'global', 'scrollBool']);
const diyStore = useDiyStore();
const diyComponent = computed(() => {
if (diyStore.mode == 'decorate') {
return diyStore.value[props.index];
@ -149,7 +148,6 @@
)
const moduleHeight:any = ref('')
const setModuleLocation = ()=> {
nextTick(() => {
setTimeout(()=>{
@ -158,7 +156,7 @@
moduleHeight.value = (data.height || 0) + 'px';
}).exec();
})
})
})
}
const fixedStyleBg = ref(false);
@ -172,7 +170,7 @@
// #endif
if(diyComponent.value.positionWay == 'fixed') {
if (props.scrollBool != -1) {
if (props.scrollBool != undefined && props.scrollBool != -1) {
style += 'position: fixed;z-index: 10;left: 0;right: 0;';
}
@ -185,12 +183,12 @@
fixedStyleBg.value = false;
if (props.scrollBool == 1) {
let str = diyComponent.value.fixedBgColor;
let str = diyComponent.value.fixedBgColor || "";
let arr = str.split(',');
let num = diyComponent.value.fixedBgColor ? parseInt(arr[arr.length-1]) : 0;
if(!diyComponent.value.fixedBgColor || num == 0 ){
let num = diyComponent.value.fixedBgColor ? parseInt(arr[arr.length - 1]) : 0;
if (!diyComponent.value.fixedBgColor || num == 0) {
fixedStyleBg.value = true;
}else{
} else {
fixedStyleBg.value = false;
style += 'background-color:' + diyComponent.value.fixedBgColor + ';';
}
@ -245,8 +243,7 @@
// 轮播样式二
const swiperStyle2 = computed(()=>{
var style = false;
style = diyComponent.value.swiper.swiperStyle == 'style-2' ? true : false;
var style = diyComponent.value.swiper.swiperStyle == 'style-2' ? true : false;
return style;
})
@ -292,9 +289,16 @@
}
const tabAllPopup = ref(false);
let menuButtonInfo:any = {};
let menuButtonInfo: any = {};
const navbarInnerStyle = ref('')
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
menuButtonInfo = uni.getMenuButtonBoundingClientRect();
// 导航栏内部盒子的样式
// 导航栏宽度，如果在小程序下，导航栏宽度为胶囊的左边到屏幕左边的距离
// 如果是各家小程序，导航栏内部的宽度需要减少右边胶囊的宽度
navbarInnerStyle.value += 'padding-top:' + menuButtonInfo.top + 'px;';
// #endif
onMounted(() => {
refresh();
// 装修模式下刷新
@ -312,14 +316,13 @@
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
if(diyComponent.value.positionWay == 'fixed') {
menuButtonInfo = uni.getMenuButtonBoundingClientRect();
// 导航栏内部盒子的样式
// 导航栏宽度，如果在小程序下，导航栏宽度为胶囊的左边到屏幕左边的距离
// 如果是各家小程序，导航栏内部的宽度需要减少右边胶囊的宽度
if(props.global.topStatusBar.isShow == false) {
navbarInnerStyle.value = ''
let rightButtonWidth = menuButtonInfo.width ? menuButtonInfo.width * 2 + 'rpx' : '70rpx';
navbarInnerStyle.value += 'padding-right:calc(' + rightButtonWidth + ' + 30rpx);';
navbarInnerStyle.value += 'padding-top:' + menuButtonInfo.top + 'px;';
}else if(props.global.topStatusBar){
navbarInnerStyle.value = ''
}
}
@ -328,7 +331,8 @@
});
const refresh = ()=> {
setModuleLocation();
setModuleLocation();
changeData({ source : 'home' },-1)
diyComponent.value.swiper.list.forEach((item : any) => {
if (item.imageUrl == '') {
@ -367,7 +371,7 @@
diyPageData.global.bottomTabBarSwitch = false; // 子页面不需要展示底部导航
diyPageData.value = sources.value;
diyPageData.value.forEach((item, index) => {
diyPageData.value.forEach((item: any, index) => {
item.pageStyle = '';
if(item.pageStartBgColor) {
if (item.pageStartBgColor && item.pageEndBgColor) item.pageStyle += `background:linear-gradient(${item.pageGradientAngle},${item.pageStartBgColor},${item.pageEndBgColor});`;
@ -465,7 +469,7 @@
justify-content: center;
width: 140rpx;
height: 60rpx;
margin-right: 20rpx;
margin-right: 30rpx;
image{
width: 100%;
height:100%;
@ -483,8 +487,8 @@
.input-content, .uni-input {
box-sizing: border-box;
display: block;
height: 64rpx;
line-height: 68rpx;
height: 60rpx;
line-height: 64rpx;
width: 100%;
padding-right: 20rpx;
color: #fff;
@ -523,27 +527,27 @@
width: auto;
position: relative;
padding: 0 20rpx;
height:54rpx;
.name {
font-size: 28rpx;
color: #333;
line-height: 38rpx;
margin-bottom: 10rpx;
margin-bottom: 15rpx;
}
&.active {
position: relative;
.name {
font-size: 32rpx;
font-size: 28rpx;
line-height: 38rpx;
font-weight: bold;
font-weight: 700;
}
.line{
position: absolute;
bottom: 0;
bottom: 0rpx;
width: 34rpx;
height: 4rpx;
border-radius: 29%;
border-radius: 2rpx;
left: 50%;
transform: translateX(-50%);
}
@ -559,11 +563,11 @@
&::after{
content: "";
position: absolute;
top: 6rpx;
bottom: -2rpx;
top: 2rpx;
bottom: -4rpx;
left: -14rpx;
width: 4rpx;
background: linear-gradient( 180deg, #FFFFFF 16%, rgba(255,255,255,0) 92%);
width: 2rpx;
background: linear-gradient( 180deg, #FFFFFF 16%, rgba(255,255,255,0) 86%);
}
/* #endif */
/* #ifdef MP-WEIXIN */
@ -588,7 +592,7 @@
background-color: var(--primary-color-light);
}
.swiper-animation{
transform: scale(0.94, 0.94);
transform: scale(0.96, 0.96);
transition-duration: 0.3s;
transition-timing-function: ease;
}

2
uni-app/src/app/components/diy/float-btn/index.vue
View File

@ -80,7 +80,7 @@
//样式二
const styleTwoRepeat = ref(true)
const styleTwoRepeatTime = ref(null)
const styleTwoRepeatTime: any = ref(null)
const styleTwoWarpCss = computed(() => {
var style = '';
if(diyComponent.value.componentStartBgColor) {

6
uni-app/src/app/components/diy/graphic-nav/index.vue
View File

@ -62,7 +62,7 @@
<text v-if="diyComponent.mode != 'img'"
class="graphic-text w-full text-center truncate leading-normal"
:class="{ 'pt-1.5' : diyComponent.mode != 'text' }"
:class="{ 'pt-[16rpx]' : diyComponent.mode != 'text' }"
:style="{ fontSize: diyComponent.font.size * 2 + 'rpx', fontWeight: diyComponent.font.weight, color: diyComponent.font.color }">
{{ item.title }}
</text>
@ -98,7 +98,7 @@
</view>
<text v-if="diyComponent.mode != 'img'"
class="graphic-text w-full text-center truncate leading-normal"
:class="{ 'pt-1.5' : diyComponent.mode != 'text' }"
:class="{ 'pt-[16rpx]' : diyComponent.mode != 'text' }"
:style="{ fontSize: diyComponent.font.size * 2 + 'rpx', fontWeight: diyComponent.font.weight, color: diyComponent.font.color }">
{{ item.title }}
</text>
@ -138,7 +138,7 @@
</view>
<text v-if="diyComponent.mode != 'img'"
class="graphic-text w-full text-center truncate leading-normal"
:class="{ 'pt-1.5' : diyComponent.mode != 'text' }"
:class="{ 'pt-[16rpx]' : diyComponent.mode != 'text' }"
:style="{ fontSize: diyComponent.font.size * 2 + 'rpx', fontWeight: diyComponent.font.weight, color: diyComponent.font.color }">
{{ item.title }}
</text>

75
uni-app/src/app/components/diy/member-info/index.vue
View File

@ -7,7 +7,7 @@
<!-- #endif -->
<view v-if="info" class="flex ml-[32rpx] mr-[52rpx] items-center relative">
<!-- 唤起获取微信 -->
<u-avatar :src="img(info.headimg)" size="55" leftIcon="none" :default-url="img('static/resource/images/default_headimg.png')" @click="clickAvatar"></u-avatar>
<u-avatar :src="img(info.headimg)" size="55" leftIcon="none" :default-url="img('static/resource/images/default_headimg.png')" @click="clickAvatar" />
<view class="ml-[22rpx]">
<view class="text-[#222222] flex pr-[50rpx] flex-wrap items-center">
<view class="text-[#222222] truncate max-w-[320rpx] font-bold text-lg mr-[16rpx]" :style="{ color : diyComponent.textColor }">{{ info.nickname }}</view>
@ -20,15 +20,15 @@
</view>
</view>
</view>
<view v-else class="flex ml-[32rpx] mr-[52rpx] items-center relative" @click="toLogin">
<u-avatar src="" size="55" :default-url="img('static/resource/images/default_headimg.png')" />
<view class="ml-[22rpx]">
<view v-else class="flex ml-[32rpx] mr-[52rpx] items-center relative">
<u-avatar :src="img('static/resource/images/default_headimg.png')" size="55" @click="toLogin" />
<view class="ml-[22rpx]" @click="toLogin">
<view class="text-[#222222] font-bold text-lg" :style="{ color : diyComponent.textColor }">
{{ t('login') }}/{{ t('register') }}
</view>
</view>
<view class="set-icon flex items-center absolute right-0 top-2">
<view @click="redirect({ url: '/app/pages/setting/index' })">
<view class="set-icon flex items-center absolute right-0 top-2" @click="redirect({ url: '/app/pages/setting/index' })">
<view>
<text class="nc-iconfont nc-icon-shezhiV6xx-1 text-[40rpx] ml-[10rpx]" :style="{ color : diyComponent.textColor }"></text>
</view>
</view>
@ -59,10 +59,6 @@
<information-filling ref="infoFill"></information-filling>
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<!-- 小程序隐私协议 -->
<wx-privacy-popup ref="wxPrivacyPopupRef"></wx-privacy-popup>
<!-- #endif -->
</view>
</template>
@ -70,7 +66,7 @@
import { computed, ref, watch } from 'vue'
import useMemberStore from '@/stores/member'
import { useLogin } from '@/hooks/useLogin'
import { img, isWeixinBrowser, redirect, urlDeconstruction, moneyFormat } from '@/utils/common'
import {img, isWeixinBrowser, redirect, urlDeconstruction, moneyFormat, getToken} from '@/utils/common'
import { t } from '@/locale'
import { wechatSync } from '@/app/api/system'
import useDiyStore from '@/app/stores/diy'
@ -118,7 +114,7 @@
// #ifdef H5
const { query } = urlDeconstruction(location.href)
if (query.code && isWeixinBrowser()) {
if (query.code && isWeixinBrowser() && getToken()) {
wechatSync({ code: query.code }).then(res => {
memberStore.getMemberInfo()
})
@ -151,24 +147,43 @@
})
const toLogin = () => {
if(configStore.login.is_username || configStore.login.is_mobile || configStore.login.is_bind_mobile){
useLogin().setLoginBack({ url: '/app/pages/member/index' })
}else if(configStore.login.is_auth_register){ // 判断是否开启第三方自动注册登录
// 第三方平台自动登录
// #ifdef MP
useLogin().getAuthCode()
// #endif
// #ifdef H5
if (isWeixinBrowser()) {
useLogin().getAuthCode('snsapi_userinfo')
}
// #endif
}else{
uni.showToast({ title: '商家未开启注册方式', icon: 'none' })
let normalLogin = !configStore.login.is_username && !configStore.login.is_mobile && !configStore.login.is_bind_mobile; // 未开启普通登录
let authRegisterLogin = !configStore.login.is_auth_register; // 自动注册登录
// #ifdef H5
if (isWeixinBrowser()) {
// 微信浏览器
if (normalLogin && authRegisterLogin) {
uni.showToast({ title: '商家未开启登录注册', icon: 'none' })
} else if (configStore.login.is_username || configStore.login.is_mobile || configStore.login.is_bind_mobile) {
useLogin().setLoginBack({ url: '/app/pages/member/index' })
} else if (normalLogin && configStore.login.is_auth_register) {
// 判断是否开启第三方自动注册登录
useLogin().getAuthCode({ scopes: 'snsapi_userinfo' })
}
} else {
// 普通浏览器
if (normalLogin) {
uni.showToast({ title: '商家未开启登录注册', icon: 'none' })
} else if (configStore.login.is_username || configStore.login.is_mobile || configStore.login.is_bind_mobile) {
useLogin().setLoginBack({ url: '/app/pages/member/index' })
}
}
// #endif
// #ifdef MP
if (normalLogin && authRegisterLogin) {
uni.showToast({ title: '商家未开启登录注册', icon: 'none' })
} else if (configStore.login.is_username || configStore.login.is_mobile || configStore.login.is_bind_mobile) {
useLogin().setLoginBack({ url: '/app/pages/member/index' })
} else if (normalLogin && configStore.login.is_auth_register) {
// 判断是否开启第三方自动注册登录
useLogin().getAuthCode()
}
// #endif
}
const infoFill = ref(false)
const infoFill: any = ref(false)
const clickAvatar = () => {
// #ifdef MP-WEIXIN
infoFill.value.show = true
@ -176,18 +191,18 @@
// #ifdef H5
if (isWeixinBrowser()) {
useLogin().getAuthCode('snsapi_userinfo')
useLogin().getAuthCode({ scopes : 'snsapi_userinfo' })
} else {
redirect({ url: '/app/pages/member/personal' })
}
// #endif
}
let menuButtonInfo = {};
let menuButtonInfo: any = {};
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
menuButtonInfo = uni.getMenuButtonBoundingClientRect();
// #endif
// 导航栏内部盒子的样式
const navbarInnerStyle = computed(() => {
let style = '';

54
uni-app/src/app/components/diy/member-level/index.vue
View File

@ -1,61 +1,60 @@
<template>
<view :style="warpCss" class="overflow-hidden" v-if="info&&list && list.length">
<view v-if="diyComponent.style == 'style-1'" class="rounded-t-[16rpx] flex items-center justify-between style-bg-1 py-[20rpx] px-[30rpx]">
<view class="flex items-end">
<view v-if="diyComponent.style == 'style-1'" class="flex items-center justify-between style-bg-1 py-[22rpx] px-[30rpx]">
<view class="flex items-center">
<image :src="img('static/resource/images/diy/member/VIP_02.png')" mode="aspectFit" class="w-[50rpx] h-[36rpx]" />
<text class="text-[28rpx] text-[#FFDAA8] ml-[10rpx] font-bold max-w-[440rpx] truncate">{{info.member_level_name}}</text>
<text class="text-[30rpx] text-[#FFDAA8] ml-[10rpx] font-500 max-w-[440rpx] truncate">{{info.member_level_name}}</text>
</view>
<view class="flex items-center justify-center rounded-[30rpx] box-border style-btn w-[120rpx] h-[50rpx]" @click="toLink('/app/pages/member/level')">
<view class="flex items-center justify-center rounded-[30rpx] box-border style-btn w-[140rpx] h-[56rpx]" @click="toLink('/app/pages/member/level')">
<text class="text-[24rpx] text-[#333]">{{ info.member_level ? (upgradeGrowth > 0 ? '去升级' : '去查看') : '去解锁' }}</text>
<text class="iconfont iconxiayibu1 ml-[2rpx] !text-[20rpx] text-[#333]"></text>
<text class="iconfont iconxiayibu1 ml-[4rpx] -mb-[2rpx] !text-[14rpx] text-[#333]"></text>
</view>
</view>
<view v-if="diyComponent.style == 'style-2'" class="rounded-[16rpx] flex items-center justify-between style-bg-2 p-[30rpx]">
<view v-if="diyComponent.style == 'style-2'" class="flex items-center justify-between style-bg-2 p-[30rpx]">
<view class="flex flex-col">
<view class="flex items-center">
<image :src="img('static/resource/images/diy/member/VIP_01.png')" mode="aspectFit" class="w-[74rpx] h-[30rpx]" />
<text class="text-[32rpx] text-[#FFE3B1] leading-[normal] ml-[14rpx] font-bold max-w-[420rpx] truncate">{{info.member_level_name}}</text>
<text class="text-[32rpx] text-[#FFE3B1] leading-[normal] ml-[14rpx] font-500 max-w-[420rpx] truncate">{{info.member_level_name}}</text>
</view>
<text class="text-[#fff] text-[24rpx] mt-[10rpx] leading-[32rpx]" v-if="benefits_arr && benefits_arr.length">{{info.member_level_name}}购物享{{benefits_arr[0].title}}</text>
<text class="text-[#FFE3B1] opacity-80 text-[24rpx] mt-[10rpx] leading-[32rpx]" v-if="benefits_arr && benefits_arr.length">{{info.member_level_name}}购物享{{benefits_arr[0].title}}</text>
</view>
<view class="flex items-center justify-center rounded-[30rpx] box-border style-btn w-[120rpx] h-[50rpx]" @click="toLink('/app/pages/member/level')">
<view class="flex items-center justify-center rounded-[30rpx] box-border style-btn w-[140rpx] h-[56rpx]" @click="toLink('/app/pages/member/level')">
<text class="text-[24rpx] text-[#333]">{{ info.member_level ? (upgradeGrowth > 0 ? '去升级' : '去查看') : '去解锁' }}</text>
<text class="iconfont iconxiayibu1 ml-[2rpx] !text-[20rpx] text-[#333]"></text>
<text class="iconfont iconxiayibu1 ml-[4rpx] -mb-[2rpx] !text-[14rpx] text-[#333]"></text>
</view>
</view>
<view v-if="diyComponent.style == 'style-3'" class="rounded-[16rpx] style-bg-3 p-[30rpx]">
<view class="flex items-center justify-between style-border-3 mb-[22rpx] pb-[22rpx]">
<view v-if="diyComponent.style == 'style-3'" class="rounded-[var(--rounded-big)] style-bg-3 py-[var(--pad-top-m)] px-[var(--pad-sidebar-m)]">
<view class="flex items-center justify-between style-border-3 mb-[30rpx] pb-[40rpx]">
<view class="flex flex-col flex-1">
<view class="flex items-center justify-between">
<view class="flex items-center">
<view class="flex justify-end leading-[30rpx] box-border text-[#fff] pr-[10rpx] text-[26rpx] w-[120rpx] h-[30rpx] bg-contain bg-no-repeat" :style="{'backgroundImage': 'url('+img('static/resource/images/diy/member/VIP.png')+')'}">
<view class="flex font-500 leading-[30rpx] box-border text-[#fff] pl-[50rpx] text-[24rpx] w-[120rpx] h-[30rpx] bg-contain bg-no-repeat" :style="{'backgroundImage': 'url('+img('static/resource/images/diy/member/VIP.png')+')'}">
VIP.{{currIndex}}
</view>
<text class="text-[#733F02] ml-[8rpx] text-[30rpx] font-bold max-w-[380rpx] truncate">{{info.member_level_name}}</text>
<text class="text-[#733F02] ml-[8rpx] text-[30rpx] font-500 max-w-[380rpx] truncate">{{info.member_level_name}}</text>
</view>
<view class="flex items-center" @click="toLink('/app/pages/member/level')">
<view class="flex items-center">
<image :src="img('static/resource/images/diy/member/rule.png')" mode="aspectFit" class="w-[20rpx] h-[20rpx]" />
<text class="text-[18rpx] text-[#733F02] ml-[6rpx] leading-[24rpx]">规则</text>
<view class="inline-block">
<text class="nc-iconfont nc-icon-a-bangzhuV6xx-36 !text-[22rpx] text-[#733F02]"></text>
<text class="text-[22rpx] text-[#733F02] ml-[6rpx] leading-[24rpx]">规则</text>
</view>
<view class="ml-[6rpx] text-[#733F02] !text-[26rpx] nc-iconfont nc-icon-youV6xx"></view>
<view class="ml-[2rpx] -mb-[4rpx] text-[#733F02] !text-[24rpx] nc-iconfont nc-icon-youV6xx"></view>
</view>
</view>
<text class="text-[28rpx] text-[#794200] mt-[16rpx]">购物或邀请好友可以提升等级</text>
<text class="text-[24rpx] text-[#794200] mt-[10rpx]">购物或邀请好友可以提升等级</text>
</view>
</view>
<view class="flex items-center justify-between">
<view class="flex flex-col flex-1">
<view class="flex flex-col flex-1 mt-[2rpx]">
<view class="overflow-hidden rounded-[20rpx]">
<progress :percent="progress()" activeColor="#fff" backgroundColor="rgba(255,5,5,.1)" stroke-width="6" />
<progress :percent="progress()" activeColor="#fff" backgroundColor="rgba(255,5,5,0.1)" stroke-width="4" />
</view>
<text class="text-[24rpx] leading-[1.4] text-[#794200] mt-[16rpx]" v-if="upgradeGrowth > 0">还差{{upgradeGrowth}}成长值即可升级为{{ list[afterCurrIndex].level_name }}</text>
<text class="text-[24rpx] text-[#794200] mt-[16rpx]" v-else>恭喜您升级为最高等级</text>
<text class="text-[22rpx] ml-[2rpx] leading-[1.4] text-[#794200] mt-[16rpx]" v-if="upgradeGrowth > 0">还差{{upgradeGrowth}}成长值即可升级为{{ list[afterCurrIndex].level_name }}</text>
<text class="text-[22rpx] ml-[2rpx] text-[#794200] mt-[16rpx]" v-else>恭喜您升级为最高等级</text>
</view>
<view class="flex items-center rounded-[30rpx] bg-[rgb(245,230,185)] p-[16rpx] ml-[40rpx]" @click="toLink('/app/pages/member/level')">
<text class="text-[28rpx] text-[#733F02]">{{info.member_level ? (upgradeGrowth > 0 ? '做任务' : '点击查看') : '去解锁'}}</text>
<image :src="img('static/resource/images/diy/member/vector.png')" mode="aspectFit" class="ml-[8rpx] w-[12rpx] h-[18rpx]" />
<view class="flex items-center rounded-[30rpx] bg-[rgb(245,230,185)] px-[24rpx] text-[22rpx] text-[#733F02] h-[56rpx] ml-[40rpx] leading-normal" @click="toLink('/app/pages/member/level')">
{{info.member_level ? (upgradeGrowth > 0 ? '做任务' : '点击查看') : '去解锁'}}
</view>
</view>
</view>
@ -67,7 +66,6 @@
import { img, redirect } from '@/utils/common'
import useMemberStore from '@/stores/member'
import { t } from '@/locale'
import { getMemberLevel } from '@/app/api/member';
import useDiyStore from '@/app/stores/diy'
const props = defineProps(['component', 'index', 'pullDownRefreshCount']);
@ -203,7 +201,7 @@
border-bottom-right-radius: 320rpx 16rpx;
}
.style-bg-3{
background: linear-gradient(to right, #FFE6C2, #E39F42);
background: linear-gradient(to right, #F9D9AC, #E9B46D);
}
.style-border-3{
position: relative;

10
uni-app/src/app/components/diy/notice/index.vue
View File

@ -38,14 +38,14 @@
</view>
<u-popup :show="noticeShow" @close="noticeShow = false" mode="center" :round="5" :safeAreaInsetBottom="false">
<u-popup :show="noticeShow" @close="noticeShow = false" mode="center" round="var(--rounded-big)" :safeAreaInsetBottom="false">
<view @touchmove.prevent.stop>
<view class="py-[25rpx] text-sm leading-none border-0 border-solid border-b-[2rpx] border-[#eee] flex items-center justify-between">
<text class="ml-[30rpx]">公告</text>
<view class="pt-[30rpx] pb-[24rpx] text-sm leading-none border-0 border-solid border-b-[2rpx] border-[#eee] flex items-center justify-between">
<text class="ml-[30rpx] text-[#333] text-[30rpx] font-500">公告</text>
<text class="mr-[20rpx] nc-iconfont nc-icon-guanbiV6xx text-[35rpx]" @click="noticeShow = false"></text>
</view>
<scroll-view scroll-y="true" class="px-6 py-3 w-[480rpx] h-[500rpx] text-sm">{{ noticeContent }}</scroll-view>
<button @click="noticeShow = false" class="!mx-[30rpx] !mb-[40rpx] !w-auto !h-[70rpx] text-[24rpx] leading-[70rpx] rounded-full text-white !bg-[#ff4500] !text-[#fff]">我知道了</button>
<scroll-view scroll-y="true" class="px-[30rpx] py-[30rpx] w-[580rpx] box-border h-[480rpx] text-[26rpx] text-[#333]">{{ noticeContent }}</scroll-view>
<button @click="noticeShow = false" class="!mx-[80rpx] !mb-[60rpx] !w-auto !h-[70rpx] text-[26rpx] leading-[70rpx] rounded-full text-white !bg-[#ff4500] !text-[#fff]">我知道了</button>
</view>
</u-popup>

24
uni-app/src/app/components/diy/rubik-cube/index.vue
View File

@ -135,7 +135,7 @@
return style;
});
const countBorderRadius = (type, index) => {
const countBorderRadius = (type: any, index: any) => {
var obj = '';
if (diyComponent.value.elementAngle == 'right') {
return obj;
@ -180,7 +180,7 @@
]
};
defaultData[type][index].forEach((item, index) => {
defaultData[type][index].forEach((item: any, index: any) => {
obj += 'border-top-left-radius:' + diyComponent.value.topElementRounded * 2 + 'rpx;';
obj += 'border-top-right-radius:' + diyComponent.value.topElementRounded * 2 + 'rpx;';
obj += 'border-bottom-left-radius:' + diyComponent.value.bottomElementRounded * 2 + 'rpx;';
@ -256,7 +256,7 @@
}
};
diyComponent.value.list.forEach((item, index) => {
diyComponent.value.list.forEach((item: any, index: any) => {
item.pageItemStyle = countBorderRadius(diyComponent.value.mode, index);
});
@ -285,7 +285,7 @@
success: res => {
let maxHeight = 0;
diyComponent.value.list.forEach((item, index) => {
diyComponent.value.list.forEach((item: any, index: any) => {
var ratio = item.imgHeight / item.imgWidth;
let width = res.windowWidth - upx2px(diyComponent.value.margin.both * 2); // 减去左右间距
@ -298,7 +298,7 @@
if (maxHeight == 0 || maxHeight < item.imgHeight) maxHeight = item.imgHeight;
})
diyComponent.value.list.forEach((item, index) => {
diyComponent.value.list.forEach((item: any, index: any) => {
item.widthStyle = params.width;
item.imgHeight = maxHeight;
});
@ -314,7 +314,7 @@
success: res => {
let maxHeightFirst = 0;
let maxHeightTwo = 0;
diyComponent.value.list.forEach((item, index) => {
diyComponent.value.list.forEach((item: any, index: any) => {
var ratio = item.imgHeight / item.imgWidth;
item.imgWidth = res.windowWidth;
item.imgWidth -= upx2px(diyComponent.value.margin.both * 4);
@ -335,7 +335,7 @@
}
}
});
diyComponent.value.list.forEach((item, index) => {
diyComponent.value.list.forEach((item: any, index: any) => {
item.imgWidth = 'calc((100% - ' + upx2px(diyComponent.value.imageGap * 2) + 'px) / 2)';
item.widthStyle = item.imgWidth;
if (index <= 1) {
@ -357,7 +357,7 @@
if (diyComponent.value.list[1].imgWidth === diyComponent.value.list[2].imgWidth) divide = 'right';
uni.getSystemInfo({
success: res => {
diyComponent.value.list.forEach((item, index) => {
diyComponent.value.list.forEach((item: any, index: any) => {
if (index == 0) {
var ratio = item.imgHeight / item.imgWidth; // 获取左图的尺寸比例
item.imgWidth = res.windowWidth - upx2px(diyComponent.value.margin.both * 4) - upx2px(diyComponent.value.imageGap * 2);
@ -381,7 +381,7 @@
var maxHeight = 0;
uni.getSystemInfo({
success: res => {
diyComponent.value.list.forEach((item, index) => {
diyComponent.value.list.forEach((item: any, index: any) => {
var ratio = item.imgHeight / item.imgWidth; // 获取左图的尺寸比例
if (index == 0) {
@ -397,7 +397,7 @@
if (index > 0 && (maxHeight == 0 || maxHeight < item.imgHeight)) maxHeight = item.imgHeight;
});
diyComponent.value.list.forEach((item, index) => {
diyComponent.value.list.forEach((item: any, index: any) => {
item.imgWidth += 'px';
item.widthStyle = item.imgWidth;
if (index > 0) item.imgHeight = maxHeight;
@ -412,7 +412,7 @@
const calcRowOneLeftOfOneTopOfTwoBottom = () => {
uni.getSystemInfo({
success: res => {
diyComponent.value.list.forEach((item, index) => {
diyComponent.value.list.forEach((item: any, index: any) => {
// 左图
if (index == 0) {
var ratio = item.imgHeight / item.imgWidth; // 获取左图的尺寸比例
@ -428,7 +428,7 @@
}
});
diyComponent.value.list.forEach((item, index) => {
diyComponent.value.list.forEach((item: any, index: any) => {
item.imgWidth += 'px';
});
}

17
uni-app/src/app/components/diy/text/index.vue
View File

@ -2,12 +2,12 @@
<view :style="warpCss">
<view :style="maskLayer"></view>
<view class="diy-text relative">
<view v-if="diyComponent.style == 'style-1'" class=" px-[20rpx]">
<view v-if="diyComponent.style == 'style-1'" class="px-[var(--pad-sidebar-m)]">
<view @click="diyStore.toRedirect(diyComponent.link)">
<view :style="{
<view class="leading-[1]" :style="{
fontSize: diyComponent.fontSize * 2 + 'rpx',
color: diyComponent.textColor,
fontWeight: diyComponent.fontWeight,
fontWeight: (diyComponent.fontWeight == 'normal' ? 500 : diyComponent.fontWeight),
textAlign : diyComponent.textAlign
}">
{{ diyComponent.text }}
@ -16,19 +16,20 @@
</view>
<view v-if="diyComponent.style == 'style-2'" class=" px-[20rpx] flex items-center">
<view @click="diyStore.toRedirect(diyComponent.link)">
<view class="max-w-[200rpx] truncate" :style="{
<view class="max-w-[200rpx] truncate leading-[1]" :style="{
fontSize: diyComponent.fontSize * 2 + 'rpx',
color: diyComponent.textColor,
fontWeight: diyComponent.fontWeight
fontWeight: (diyComponent.fontWeight == 'normal' ? 500 : diyComponent.fontWeight)
}">
{{ diyComponent.text }}
</view>
</view>
<text class="ml-[16rpx] max-w-[300rpx] truncate" :style="{ color: diyComponent.subTitle.color, fontSize: diyComponent.subTitle.fontSize * 2 + 'rpx', }">{{ diyComponent.subTitle.text }}</text>
<text v-if="diyComponent.subTitle.text" :style="{background: diyComponent.subTitle.color}" class="mx-[10rpx] w-[2rpx] h-[24rpx] opacity-70"></text>
<text class="max-w-[300rpx] truncate" :style="{ color: diyComponent.subTitle.color, fontSize: diyComponent.subTitle.fontSize * 2 + 'rpx', }">{{ diyComponent.subTitle.text }}</text>
<view class="ml-auto text-right " v-if="diyComponent.more.isShow" :style="{ color: diyComponent.more.color }">
<view @click="diyStore.toRedirect(diyComponent.more.link)" class="flex items-center">
<text class="max-w-[200rpx] truncate text-[24rpx]">{{ diyComponent.more.text }}</text>
<text class="nc-iconfont nc-icon-youV6xx text-[26rpx]" :style="{ color: diyComponent.more.color }"></text>
<text class="max-w-[200rpx] truncate text-[26rpx]">{{ diyComponent.more.text }}</text>
<text class="nc-iconfont nc-icon-youV6xx text-[24rpx]" :style="{ color: diyComponent.more.color }"></text>
</view>
</view>
</view>

14
uni-app/src/app/locale/zh-Hans/pages.auth.bind.json
View File

@ -1,11 +1,7 @@
{
"bindMobile": "绑定手机号",
"bind": "绑定",
"binding": "绑定中",
"agreeTips": "请阅读并同意",
"pleaceAgree": "请勾选已阅读并同意",
"mobilePlaceholder": "请输入手机号",
"codePlaceholder": "请输入验证码",
"weixinUserAuth": "一键绑定",
"mobileQuickLogin": "手机号快捷登录"
"bind": "绑定",
"bindMobileTip": "输入手机号动态码绑定",
"binding": "绑定中",
"weixinUserAuth": "一键绑定",
"mobileQuickLogin": "手机号快捷登录"
}

8
uni-app/src/app/locale/zh-Hans/pages.auth.index.json Normal file
View File

@ -0,0 +1,8 @@
{
"quickLoginOrLogout": "快捷登录/注册",
"login": "登录",
"otherLogin": "其他方式登录",
"accountLogin": "账号密码登录",
"mobileLogin": "手机号登录",
"otherMobileLogin": "其他手机号登录"
}

11
uni-app/src/app/locale/zh-Hans/pages.auth.login.json
View File

@ -5,11 +5,14 @@
"resetpwd": "忘记密码",
"noAccount": "还没有账号",
"toRegister": "去注册",
"and": "和",
"agreeTips": "登录代表您同意",
"isAgreeTips": "请先阅读并同意协议",
"usernameLogin": "密码登录",
"mobileLogin": "验证码登录",
"mobilePlaceholder": "请输入手机号",
"oneClicklogin":"一键登录"
"oneClicklogin":"快捷登录",
"accountLogin":"账号密码登录",
"accountLoginTip":"输入账号密码登录",
"accountLoginError":"商家未开启账号密码登录",
"mobileLogin":"手机号登录",
"mobileLoginTip":"输入手机号验证码登录",
"mobileLoginError":"商家未开启手机号登录"
}

3
uni-app/src/app/locale/zh-Hans/pages.auth.register.json
View File

@ -1,5 +1,7 @@
{
"registering": "注册中",
"usernameRegisterTip":"输入账号密码注册",
"mobileRegisterTip":"输入手机号验证码注册",
"usernamePlaceholder": "请输入账号",
"passwordPlaceholder": "请输入密码",
"confirmPasswordPlaceholder": "请再次确认密码",
@ -7,7 +9,6 @@
"resetpwd": "忘记密码",
"haveAccount": "已有账号",
"toLogin": "去登录",
"and": "和",
"registerAgreeTips": "注册代表您同意",
"isAgreeTips": "请先阅读并同意协议",
"usernameRegister": "账号注册",

9
uni-app/src/app/locale/zh-Hans/pages.auth.resetpwd.json
View File

@ -1,6 +1,7 @@
{
"findPassword": "找回密码",
"passwordPlaceholder": "请输入密码",
"confirmPasswordPlaceholder": "请再次确认密码",
"confirmPasswordError": "两次输入的密码不一致"
"findPassword": "找回密码",
"findPasswordTip": "输入手机号找回密码",
"passwordPlaceholder": "请输入密码",
"confirmPasswordPlaceholder": "请再次确认密码",
"confirmPasswordError": "两次输入的密码不一致"
}

6
uni-app/src/app/locale/zh-Hans/pages.member.account_edit.json
View File

@ -1,8 +1,14 @@
{
"addAccountTitle":"添加会员账户",
"editAccountTitle":"编辑会员账户",
"addBankCard": "添加银行卡",
"addBankCardTips": "请添加持卡人本人的银行卡",
"editBankCard": "编辑银行卡",
"editBankCardTips": "请编辑持卡人本人的银行卡",
"addAlipayAccount": "添加支付宝账号",
"addAlipayAccountTips": "请添加已实名的支付宝账号",
"editAlipayAccount": "编辑支付宝账号",
"editAlipayAccountTips": "请编辑已实名的支付宝账号",
"bankRealname": "持卡人姓名",
"bankRealnamePlaceholder": "请输入持卡人姓名",
"bankName": "银行名称",

7
uni-app/src/app/locale/zh-Hans/pages.member.cash_out.json
View File

@ -1,11 +1,12 @@
{
"applyTime": "申请时间",
"toBeReviewed": "官方正在审核，请耐心等待",
"toBeTransfer": "官方正在转账，请耐心等待",
"toBeReviewed": "官方正在审核，请耐心等待...",
"toBeTransfer": "官方正在转账，请耐心等待...",
"transfer": "官方已转账，请及时查收",
"cancelApply": "申请已取消",
"balanceDetail": "余额记录",
"commissionDetail": "佣金记录",
"emptyTip": "暂无提现记录",
"commissemptyTip": "暂无佣金记录"
"commissemptyTip": "暂无佣金记录",
"rechargeType":"充值方式："
}

4
uni-app/src/app/locale/zh-Hans/pages.member.personal.json
View File

@ -4,9 +4,9 @@
"mobile": "手机号",
"birthday": "生日",
"unknown": "未知",
"headimg": "头像",
"updateHeadimg": "更换头像",
"updateNickname": "修改昵称",
"man": "男",
"woman": "女",
"bindMobile": "绑定手机"
"woman": "女"
}

46
uni-app/src/app/pages/auth/agreement.vue
View File

@ -1,31 +1,45 @@
<template>
<view :style="themeColor()">
<view v-if="agreement && agreement.content" class="p-[30rpx]">
<view :style="themeColor()" >
<view v-if="agreement && agreement.content" class="py-[var(--top-m)] px-[var(--sidebar-m)]">
<u-parse :content="agreement.content" :tagStyle="{img: 'vertical-align: top;'}"></u-parse>
</view>
<view v-else class="h-[100vh] w-full flex items-center justify-center">
<u-empty :icon="img('static/resource/images/empty.png')" text="暂无协议" />
</view>
<view v-else-if="!loading" class="min-h-[100vh] bg-[var(--page-bg-color)] overflow-hidden">
<view class="empty-page">
<image class="img" :src="img('static/resource/images/empty.png')" model="aspectFit" />
<view class="desc">暂无协议</view>
</view>
</view>
</view>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { getAgreementInfo } from '@/app/api/system'
import { img} from '@/utils/common'
import { img, goback } from '@/utils/common'
const agreement = ref(null)
onLoad((option)=> {
getAgreementInfo(option.key).then((res: AnyObject) => {
agreement.value = res.data
uni.setNavigationBarTitle({
title: res.data.title
const loading = ref(true)
onLoad((option: any)=> {
if(option.key){
getAgreementInfo(option.key).then((res: any) => {
agreement.value = res.data
loading.value = false
uni.setNavigationBarTitle({
title: res.data.agreement_key_name
})
}).catch(()=>{
loading.value = false
})
})
}else{
let parameter = {
url: '/app/pages/index/index',
title: '协议类型不存在',
mode: 'reLaunch'
};
goback(parameter)
}
})
</script>
<style lang="scss">
</style>
<style lang="scss"></style>

198
uni-app/src/app/pages/auth/bind.vue
View File

@ -1,70 +1,72 @@
<template>
<view class="w-screen h-screen flex flex-col" :style="themeColor()">
<view class="flex-1">
<!-- #ifdef H5 -->
<view class="h-[100rpx]"></view>
<!-- #endif -->
<view class="px-[60rpx] pt-[100rpx] mb-[100rpx]">
<view class="font-bold text-lg">{{ t('bindMobile') }}</view>
</view>
<view class="px-[60rpx]">
<u-form labelPosition="left" :model="formData" errorType='toast' :rules="rules" ref="formRef">
<u-form-item label="" prop="mobile" :border-bottom="true">
<u-input v-model="formData.mobile" border="none" clearable :placeholder="t('mobilePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2]"/>
</u-form-item>
<view class="mt-[40rpx]">
<u-form-item label="" prop="mobile_code" :border-bottom="true">
<u-input v-model="formData.mobile_code" border="none" clearable :placeholder="t('codePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2]">
<template #suffix>
<sms-code :mobile="formData.mobile" type="bind_mobile" v-model="formData.mobile_key"></sms-code>
</template>
</u-input>
</u-form-item>
</view>
<view class="flex items-start mt-[30rpx]" v-if="!info && config.agreement_show">
<u-checkbox-group>
<u-checkbox activeColor="var(--primary-color)" :checked="isAgree" shape="shape" size="14" @change="agreeChange" :customStyle="{'marginTop': '4rpx'}" />
</u-checkbox-group>
<view class="text-xs text-gray-400 flex flex-wrap">
{{ t('agreeTips') }}
<view @click="redirect({ url: '/app/pages/auth/agreement?key=service' })">
<text class="text-primary">《{{ t('userAgreement') }}》</text>
</view>
<view @click="redirect({ url: '/app/pages/auth/agreement?key=privacy' })">
<text class="text-primary">《{{ t('privacyAgreement') }}》</text>
</view>
</view>
</view>
<view class="mt-[60rpx]">
<button hover-class="none" class="bg-[var(--primary-color)] text-[#fff] h-[80rpx] leading-[80rpx] rounded-[100rpx] text-[28rpx]" :loading="loading" :loadingText="t('binding')" @click="handleBind">{{t('bind')}}</button>
</view>
<!-- #ifdef MP-WEIXIN -->
<view class="mt-[30rpx]">
<u-button type="primary" :plain="true" :text="t('weixinUserAuth')" @click="agreeTips" v-if="!info && config.agreement_show && !isAgree"></u-button>
<u-button type="primary" :plain="true" :text="t('mobileQuickLogin')" open-type="getPhoneNumber" @getphonenumber="mobileAuth" @click="checkWxPrivacy" v-else></u-button>
</view>
<!-- #endif -->
</u-form>
</view>
</view>
<!-- #ifdef MP-WEIXIN -->
<!-- 小程序隐私协议 -->
<wx-privacy-popup ref="wxPrivacyPopupRef"></wx-privacy-popup>
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<view :style="{'height':headerHeight}">
<top-tabbar :data="param" :scrollBool="topTabarObj.getScrollBool()" class="top-header"/>
</view>
<!-- #endif -->
<view class="mx-[60rpx]">
<view class="pt-[140rpx] text-[50rpx] text-[#333]">{{t('bindMobile')}}</view>
<view class="text-[26rpx] leading-[39rpx] text-[var(--text-color-light6)] mt-[16rpx] mb-[80rpx]">{{t('bindMobileTip')}}</view>
<u-form labelPosition="left" :model="formData" errorType='toast' :rules="rules" ref="formRef">
<view class="h-[90rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6]">
<u-form-item label="" prop="mobile" :border-bottom="false">
<u-input v-model="formData.mobile" type="number" maxlength="11" border="none" :placeholder="t('mobilePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]"/>
</u-form-item>
</view>
<view class="h-[90rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6] mt-[40rpx]">
<u-form-item label="" prop="mobile_code" :border-bottom="false">
<u-input v-model="formData.mobile_code" type="number" maxlength="4" border="none" :placeholder="t('codePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)]">
<template #suffix>
<sms-code :mobile="formData.mobile" type="bind_mobile" v-model="formData.mobile_key"></sms-code>
</template>
</u-input>
</u-form-item>
</view>
</u-form>
<view class="mt-[100rpx]">
<view v-if="config.agreement_show" class="flex items-center mb-[20rpx] py-[10rpx]" @click.stop="agreeChange">
<u-checkbox-group @change="agreeChange">
<u-checkbox activeColor="var(--primary-color)" :checked="isAgree" shape="circle" size="24rpx" :customStyle="{ 'marginTop': '4rpx' }" />
</u-checkbox-group>
<view class="text-[24rpx] text-[var(--text-color-light6)] flex items-center flex-wrap">
<text>{{ t('agreeTips') }}</text>
<text @click.stop="redirect({ url: '/app/pages/auth/agreement?key=privacy' })" class="text-primary">《{{t('privacyAgreement')}}》</text>
<text>{{ t('and') }}</text>
<text @click.stop="redirect({ url: '/app/pages/auth/agreement?key=service' })" class="text-primary">《{{t('userAgreement')}}》</text>
</view>
</view>
<button class="w-full h-[80rpx] !bg-[var(--primary-color)] text-[26rpx] rounded-[40rpx] leading-[80rpx] font-500 !text-[#fff]" @click="handleBind">{{t('bind')}}</button>
</view>
</view>
</view>
</template>
<script setup lang="ts">
import { ref, reactive, computed, onMounted } from 'vue'
import { ref, reactive, computed, nextTick } from 'vue'
import { t } from '@/locale'
import { bind } from '@/app/api/auth'
import { bindMobile } from '@/app/api/member'
import useMemberStore from '@/stores/member'
import useConfigStore from '@/stores/config'
import { useLogin } from '@/hooks/useLogin'
import { redirect } from '@/utils/common'
import { redirect,pxToRpx } from '@/utils/common'
import { onLoad } from '@dcloudio/uni-app'
import { topTabar } from '@/utils/topTabbar'
let menuButtonInfo: any = {};
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
menuButtonInfo = uni.getMenuButtonBoundingClientRect();
// #endif
/********* 自定义头部 - start ***********/
const topTabarObj = topTabar()
let param = topTabarObj.setTopTabbarParam({title:'',topStatusBar:{bgColor: '#fff',textColor: '#333'}})
/********* 自定义头部 - end ***********/
const headerHeight = computed(()=>{
return Object.keys(menuButtonInfo).length ? pxToRpx(Number(menuButtonInfo.height)) + pxToRpx(menuButtonInfo.top) + pxToRpx(8)+'rpx':'auto'
})
const memberStore = useMemberStore()
const info = computed(() => memberStore.info)
@ -75,23 +77,31 @@
const loading = ref(false)
const isAgree = ref(false)
const formData = reactive({
const formData: any = reactive({
mobile: '',
mobile_code: '',
mobile_key: ''
})
const real_name_input = ref(true);
onMounted(() => {
const wxPrivacyPopupRef:any = ref(null)
onLoad(() => {
// 防止浏览器自动填充
setTimeout(()=>{
real_name_input.value = false;
},800)
});
// #ifdef MP
nextTick(()=>{
if(wxPrivacyPopupRef.value) wxPrivacyPopupRef.value.proactive();
})
// #endif
uni.getStorageSync('openid') && (Object.assign(formData, { openid: uni.getStorageSync('openid') }))
uni.getStorageSync('pid') && (Object.assign(formData, { pid: uni.getStorageSync('pid') }))
uni.getStorageSync('unionid') && (Object.assign(formData, { unionid: uni.getStorageSync('unionid') }))
uni.getStorageSync('openid') && (Object.assign(formData, { openid: uni.getStorageSync('openid') }))
uni.getStorageSync('pid') && (Object.assign(formData, { pid: uni.getStorageSync('pid') }))
uni.getStorageSync('unionid') && (Object.assign(formData, { unionid: uni.getStorageSync('unionid') }))
});
const rules = {
'mobile': [
@ -102,7 +112,7 @@
trigger: ['blur', 'change'],
},
{
validator(rule, value, callback) {
validator(rule: any, value: any, callback: any) {
let mobile = /^1[3-9]\d{9}$/;
if (!mobile.test(value)){
callback(new Error('请输入正确的手机号'))
@ -127,10 +137,10 @@
}
const agreeTips = () => {
uni.showToast({ title: `${t('pleaceAgree')}《${t('userAgreement')}》《${t('privacyAgreement')}》`, icon: 'none' })
uni.showToast({ title: t('isAgreeTips'), icon: 'none' })
}
const formRef = ref(null)
const formRef: any = ref(null)
const handleBind = () => {
formRef.value.validate().then(() => {
@ -139,7 +149,7 @@
const request = info.value ? bindMobile : bind
request(formData).then((res) => {
request(formData).then((res: any) => {
if (info.value) {
memberStore.getMemberInfo()
redirect({ url: '/app/pages/member/personal', mode: 'redirectTo' })
@ -152,61 +162,17 @@
})
})
}
const wxPrivacyPopupRef:any = ref(null)
// 检测是否同意隐私协议
const checkWxPrivacy = ()=>{
wxPrivacyPopupRef.value.proactive();
}
const mobileAuth = (e) => {
if (!isAgree.value && !info.value && config.value.agreement_show) {
uni.showToast({
title: `${ t('pleaceAgree') }《${ t('userAgreement') }》《${ t('privacyAgreement') }》`,
icon: 'none'
})
return
}
if (e.detail.errMsg == 'getPhoneNumber:ok') {
uni.showLoading({ title: '' })
const request = info.value ? bindMobile : bind
request({
openid: formData.openid,
mobile_code: e.detail.code
}).then((res) => {
uni.hideLoading()
if (info.value) {
memberStore.getMemberInfo()
redirect({ url: '/app/pages/member/personal', mode: 'redirectTo' })
} else {
memberStore.setToken(res.data.token)
useLogin().handleLoginBack()
}
}).catch((res) => {
setTimeout(() => {
uni.hideLoading()
}, 2000);
})
}
if (e.detail.errno == 104) {
let msg = '用户未授权隐私权限';
uni.showToast({ title: msg, icon: 'none' })
}
if (e.detail.errMsg == "getPhoneNumber:fail user deny") {
let msg = '用户拒绝获取手机号码';
uni.showToast({ title: msg, icon: 'none' })
}
}
</script>
<style lang="scss">
.u-input{
<style lang="scss" scoped>
:deep(.u-input){
background-color: transparent !important;
}
:deep(.u-form-item){
flex:1;
.u-line{
display:none;
}
}
</style>

285
uni-app/src/app/pages/auth/index.vue Normal file
View File

@ -0,0 +1,285 @@
<template>
<view class="w-screen h-screen" :style="themeColor()">
<view class="w-screen h-screen" :style="warpStyle">
<!-- #ifdef MP-WEIXIN -->
<view :style="{'height':headerHeight}">
<top-tabbar :data="param" :scrollBool="topTabarObj.getScrollBool()" class="top-header"/>
</view>
<!-- #endif -->
<view class="mx-[var(--sidebar-m)] px-[var(--pad-sidebar-m)]">
<view class="pt-[154rpx] flex justify-center">
<view v-if="systemStore.site?.front_end_logo" class="h-[90rpx] w-[300rpx]">
<image class="h-[90rpx] w-[300rpx]" :src="img(systemStore.site?.front_end_logo)" mode="aspectFit"/>
</view>
<view v-else-if="systemStore.site?.front_end_icon" class="h-[250rpx] w-[250rpx]">
<image class="h-[250rpx] w-[250rpx]" :src="img(systemStore.site?.front_end_icon)" mode="aspectFit"/>
</view>
<view v-else class="h-[90rpx] w-[300rpx]"></view>
</view>
<view class="text-[var(--text-color-light6)]] text-[28rpx] text-center leading-[34rpx] min-h-[34rpx] mt-[40rpx]">{{ loginConfig.desc }}</view>
<view class="mt-[181rpx]">
<!-- #ifdef H5 -->
<!-- 微信公众号快捷登录 -->
<view v-if="isWeixinBrowser() && loginConfig.is_auth_register" class="w-full flex items-center justify-center mb-[40rpx]">
<button class="w-[630rpx] h-[88rpx] !mx-[0] !bg-[var(--primary-color)] text-[26rpx] rounded-[44rpx] leading-[88rpx] font-500 !text-[#fff]" @click="oneClickLogin()">{{t('quickLoginOrLogout')}}</button>
</view>
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<!-- 微信小程序快捷登录 -->
<!-- 优先显示第三方登录/注册 -->
<view class="w-full flex items-center justify-center mb-[40rpx]" v-if="loginConfig.is_auth_register">
<!-- 开启强制绑定手机号或者手机号登录的情况 -->
<button v-if="!wapMemberMobile && loginConfig.is_bind_mobile"
class="w-[630rpx] h-[88rpx] !bg-[var(--primary-color)] !mx-[0] text-[26rpx] rounded-[44rpx] leading-[88rpx] font-500 !text-[#fff]"
:open-type="openType" @getphonenumber="mobileAuth" @click="checkWxPrivacy">{{t('quickLoginOrLogout')}}</button>
<!-- 授权登录/注册 -->
<button v-else class="w-[630rpx] h-[88rpx] !mx-[0] !bg-[var(--primary-color)] text-[26rpx] rounded-[44rpx] leading-[88rpx] font-500 !text-[#fff]" @click="oneClickLogin()">{{t('quickLoginOrLogout')}}</button>
</view>
<!-- 未开启第三方登录/注册，但是开启了手机号登录，则一键手机号登录/注册 -->
<view class="w-full flex items-center justify-center mb-[40rpx]" v-else-if="!loginConfig.is_auth_register && loginConfig.is_mobile">
<button v-if="!wapMemberMobile" class="w-[630rpx] h-[88rpx] !bg-[var(--primary-color)] !mx-[0] text-[26rpx] rounded-[44rpx] leading-[88rpx] font-500 !text-[#fff]" :open-type="openType" @getphonenumber="mobileAuth" @click="checkWxPrivacy">{{t('quickLoginOrLogout')}}</button>
<button v-else class="w-[630rpx] h-[88rpx] !bg-[var(--primary-color)] !mx-[0] text-[26rpx] rounded-[44rpx] leading-[88rpx] font-500 !text-[#fff]" @click="oneClickLogin()">{{t('quickLoginOrLogout')}}</button>
</view>
<!-- 小程序隐私协议 -->
<wx-privacy-popup ref="wxPrivacyPopupRef"></wx-privacy-popup>
<!-- #endif -->
<!-- 手机号登录 -->
<view v-if="loginConfig.is_mobile" class="mb-[40rpx] w-full flex items-center justify-center">
<!-- #ifdef H5 -->
<button class="w-[630rpx] h-[88rpx] !mx-[0] !bg-[#fff] border-[var(--primary-color)] border-solid border-[2rpx] text-[26rpx] rounded-[44rpx] leading-[84rpx] !text-[var(--primary-color)]" @click="redirect({ url: '/app/pages/auth/login',param:{type:'mobile'}})">{{ t('mobileLogin') }}</button>
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<button v-if="authRegisterLogin && loginConfig.is_mobile" class="w-[630rpx] h-[88rpx] !mx-[0] !bg-[#fff] border-[var(--primary-color)] border-solid border-[2rpx] text-[26rpx] rounded-[44rpx] leading-[84rpx] !text-[var(--primary-color)]" @click="redirect({ url: '/app/pages/auth/login',param:{type:'mobile'}})">{{ t('otherMobileLogin') }}</button>
<button v-else class="w-[630rpx] h-[88rpx] !mx-[0] !bg-[#fff] border-[var(--primary-color)] border-solid border-[2rpx] text-[26rpx] rounded-[44rpx] leading-[84rpx] !text-[var(--primary-color)]" @click="redirect({ url: '/app/pages/auth/login',param:{type:'mobile'}})">{{ t('mobileLogin') }}</button>
<!-- #endif -->
</view>
<view v-else-if="!loginConfig.is_mobile && loginConfig.is_username" class="w-full flex items-center justify-center">
<button class="w-[630rpx] h-[88rpx] !mx-[0] !bg-[#fff] !border-[var(--primary-color)] border-solid border-[2rpx] text-[26rpx] rounded-[44rpx] leading-[84rpx] !text-[var(--primary-color)]" @click="redirect({ url: '/app/pages/auth/login',param:{type:'username'}})">{{t('accountLogin')}}</button>
</view>
<view v-if="loginConfig.agreement_show" class="w-full flex items-center justify-center mt-[28rpx]">
<view class="flex items-center justify-center mt-[28rpx] py-[10rpx]" @click.stop="agreeChange">
<u-checkbox-group @change="agreeChange">
<u-checkbox activeColor="var(--primary-color)" :checked="isAgree" shape="circle" size="24rpx" :customStyle="{ 'marginTop': '4rpx' }" />
</u-checkbox-group>
<view class="text-[24rpx] text-[var(--text-color-light6)] flex items-center flex-wrap">
<text>{{ t('agreeTips') }}</text>
<text @click.stop="redirect({ url: '/app/pages/auth/agreement?key=privacy' })" class="text-primary">《{{t('privacyAgreement')}}》</text>
<text>{{ t('and') }}</text>
<text @click.stop="redirect({ url: '/app/pages/auth/agreement?key=service' })" class="text-primary">《{{t('userAgreement')}}》</text>
</view>
</view>
</view>
<view class="footer w-full" v-if="loginConfig.is_mobile && loginConfig.is_username">
<view class="text-[26rpx] leading-[36rpx] text-[333] text-center mb-[30rpx] font-400">{{t('otherLogin')}}</view>
<view class="flex justify-center">
<view class="h-[80rpx] w-[80rpx] text-center leading-[78rpx] border-[2rpx] text-primary rounded-[50%] border-solid border-[#ddd] nc-iconfont nc-icon-a-wodeV6xx-36 text-[46rpx] overflow-hidden" @click="redirect({ url: '/app/pages/auth/login',param:{type:'username'}})"></view>
</view>
<view class="text-[24rpx] leading-[36rpx] text-[var(--text-color-light9)] text-center font-400 mt-[30rpx]">{{t('accountLogin')}}</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script setup lang="ts">
import { ref, computed,nextTick } from 'vue'
import { img,isWeixinBrowser,getToken,redirect,pxToRpx } from '@/utils/common'
import { t } from '@/locale'
import { useLogin } from '@/hooks/useLogin'
import useConfigStore from '@/stores/config'
import useMemberStore from '@/stores/member'
import { onLoad,onShow } from '@dcloudio/uni-app'
import { topTabar } from '@/utils/topTabbar'
import useSystemStore from '@/stores/system'
let menuButtonInfo: any = {};
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
menuButtonInfo = uni.getMenuButtonBoundingClientRect();
// #endif
/********* 自定义头部 - start ***********/
const topTabarObj = topTabar()
let param = topTabarObj.setTopTabbarParam({title:''})
/********* 自定义头部 - end ***********/
const headerHeight = computed(()=>{
return Object.keys(menuButtonInfo).length ? pxToRpx(Number(menuButtonInfo.height)) + pxToRpx(menuButtonInfo.top) + pxToRpx(8)+'rpx':'auto'
})
const wapMemberMobile = ref('');
const isAgree = ref(false)
const configStore = useConfigStore()
const loginConfig = computed(() => {
return configStore.login
})
const login = useLogin()
const memberStore = useMemberStore()
const memberInfo: any = computed(()=>{
return useMemberStore().info;
})
const systemStore =useSystemStore()
const openType: any = computed(()=>{
if (!isAgree.value && configStore.login.agreement_show) return '';
return 'getPhoneNumber';
})
const wxPrivacyPopupRef:any = ref(null)
const authRegisterLogin: any = computed(()=> {
return !configStore.login.is_auth_register;
});
const loginLoading = ref(false)
onLoad(async ()=> {
await systemStore.getSiteInfoFn()
await configStore.getLoginConfig()
let normalLogin = !configStore.login.is_username && !configStore.login.is_mobile && !configStore.login.is_bind_mobile; // 未开启普通登录
// #ifdef H5
if (isWeixinBrowser()) {
// 微信浏览器
if (!getToken() && normalLogin && authRegisterLogin.value) {
uni.showToast({ title: '商家未开启登录注册', icon: 'none' })
setTimeout(() => {
redirect({ url: '/app/pages/index/index', mode: 'reLaunch' })
}, 100)
}
} else {
// 普通浏览器
if (!getToken() && normalLogin) {
uni.showToast({ title: '商家未开启登录注册', icon: 'none' })
setTimeout(() => {
redirect({ url: '/app/pages/index/index', mode: 'reLaunch' })
}, 100)
}
}
// #endif
// #ifdef MP
if (!getToken() && normalLogin && authRegisterLogin.value) {
uni.showToast({ title: '商家未开启登录注册', icon: 'none' })
setTimeout(() => {
redirect({ url: '/app/pages/index/index', mode: 'reLaunch' })
}, 100)
return;
}
wapMemberMobile.value = uni.getStorageSync('wap_member_mobile');
nextTick(() => {
if (wxPrivacyPopupRef.value) wxPrivacyPopupRef.value.proactive();
})
// #endif
})
onShow(()=> {
loginLoading.value = false;
})
const warpStyle = computed(()=>{
var style = '';
if(configStore.login.bg_url){
style += 'background-image:url(' + img(configStore.login.bg_url) + ');';
style += 'background-size: 100%;';
style += 'background-position: top;';
style += 'background-repeat: no-repeat;';
}
return style
})
// 检测是否同意小程序隐私协议和登录政策协议
const checkWxPrivacy = ()=> {
if (!isAgree.value && configStore.login.agreement_show) {
uni.showToast({ title: t('isAgreeTips'), icon: 'none' })
return true;
}
return false;
}
// 一键登录
const oneClickLogin = (callback:any = null)=> {
if (checkWxPrivacy()) return;
if (loginLoading.value) return
loginLoading.value = true
if (!callback) {
callback = () => {
loginLoading.value = false
}
}
// #ifdef H5
wechatLogin();
// #endif
// 第三方平台自动登录
// #ifdef MP
weappLogin(callback)
// #endif
}
// 微信公众登录
const wechatLogin = ()=> {
if (isWeixinBrowser()) {
login.getAuthCode({ scopes : 'snsapi_userinfo' })
loginLoading.value = false
}
}
// 微信小程序登录
const weappLogin = (successCallback: any)=> {
login.getAuthCode({ backFlag: true, successCallback })
}
const agreeChange = () => {
isAgree.value = !isAgree.value
}
const mobileAuth = (e: any) => {
if (e.detail.errMsg == 'getPhoneNumber:ok') {
oneClickLogin((data: any) => {
if (!data.mobile) {
memberStore.bindMobile(e);
} else {
uni.setStorageSync('wap_member_mobile', memberInfo.value.mobile) // 存储会员手机号，防止重复请求微信获取手机号接口
}
loginLoading.value = false
});
}
if (e.detail.errno == 104) {
let msg = '用户未授权隐私权限';
uni.showToast({ title: msg, icon: 'none' })
}
if (e.detail.errMsg == "getPhoneNumber:fail user deny") {
let msg = '用户拒绝获取手机号码';
uni.showToast({ title: msg, icon: 'none' })
}
}
</script>
<style lang="scss" scoped>
.footer{
margin-top:200rpx;
padding-bottom:calc(151rpx + constant(safe-area-inset-bottom));
padding-bottom:calc(151rpx + env(safe-area-inset-bottom));
}
:deep(.u-checkbox){
margin:0 !important;
}
</style>

519
uni-app/src/app/pages/auth/login.vue
View File

@ -1,102 +1,171 @@
<template>
<view class="w-screen h-screen flex flex-col" :style="themeColor()">
<view class="flex-1">
<!-- #ifdef H5 -->
<view class="h-[100rpx]"></view>
<!-- #endif -->
<view class="px-[60rpx] pt-[100rpx] mb-[100rpx]">
<view class="font-bold text-xl">{{ t('login') }}</view>
</view>
<view class="px-[60rpx] text-sm flex mb-[50rpx] font-bold leading-none" v-if="loginType.length > 1">
<block v-for="(item, index) in loginType">
<view :class="{'text-gray-300' : item.type != type}" @click="type = item.type">{{ item.title }}</view>
<view class="mx-[30rpx] border-solid border-0 border-r-[2px] border-gray-300" v-show="index == 0"></view>
</block>
</view>
<view class="px-[60rpx]">
<u-form labelPosition="left" :model="formData" errorType='toast' :rules="rules" ref="formRef">
<view v-show="type == 'username'">
<u-form-item label="" prop="username" :border-bottom="true">
<u-input v-model="formData.username" border="none" clearable :placeholder="t('usernamePlaceholder')" autocomplete="off" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2] text-[26rpx]"/>
</u-form-item>
<view class="mt-[40rpx]">
<u-form-item label="" prop="password" :border-bottom="true">
<u-input v-model="formData.password" border="none" type="password" clearable :placeholder="t('passwordPlaceholder')" autocomplete="new-password" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2] text-[26rpx]"/>
</u-form-item>
</view>
</view>
<view v-show="type == 'mobile'">
<u-form-item label="" prop="mobile" :border-bottom="true">
<u-input v-model="formData.mobile" border="none" clearable :placeholder="t('mobilePlaceholder')" autocomplete="off" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2]"/>
</u-form-item>
<view class="mt-[40rpx]">
<u-form-item label="" prop="mobile_code" :border-bottom="true">
<u-input v-model="formData.mobile_code" border="none" clearable class="!bg-transparent" fontSize="26rpx" :disabled="real_name_input" :placeholder="t('codePlaceholder')" placeholderClass="!text-[#8288A2]">
<template #suffix>
<sms-code :mobile="formData.mobile" type="login" v-model="formData.mobile_key"></sms-code>
</template>
</u-input>
</u-form-item>
</view>
</view>
<view class="flex text-xs justify-between mt-[20rpx] text-[#8288A2]">
<view @click="redirect({ url: '/app/pages/auth/register' })">{{ t('noAccount') }}
<text class="text-primary">{{ t('toRegister') }}</text>
</view>
<view @click="redirect({ url: '/app/pages/auth/resetpwd' })">{{ t('resetpwd') }}</view>
</view>
<view class="mt-[80rpx]">
<button hover-class="none" class="bg-[var(--primary-color)] text-[#fff] h-[80rpx] leading-[80rpx] rounded-[100rpx] text-[28rpx]" :loading="loading" :loadingText="t('logining')" @click="handleLogin">{{t('login')}}</button>
</view>
<!-- #ifdef MP-WEIXIN -->
<view class="mt-[20rpx]" v-if="configStore.login.is_auth_register">
<button hover-class="none" class="text-[var(--primary-color)] bg-[#fff] h-[80rpx] leading-[80rpx] rounded-[100rpx] text-[28rpx]" :loading="loginLoading" :loadingText="t('logining')" @click="oneClickLogin">{{t('oneClicklogin')}}</button>
</view>
<view class="mt-[20rpx]" v-else-if="type == 'mobile'">
<u-button :customStyle="{border:'none',color:'var(--primary-color)',fontSize:'26rpx',height:'40rpx', lineHeight:'40rpx'}" :text="t('mobileQuickLogin')" open-type="getPhoneNumber" @getphonenumber="mobileAuth" @click="checkWxPrivacy"></u-button>
</view>
<!-- #endif -->
</u-form>
</view>
</view>
<view class="text-xs py-[50rpx] flex justify-center w-full" v-if="configStore.login.agreement_show">
<text class="iconfont text-[var(--primary-color)] text-[34rpx] mr-[12rpx]" :class="isAgree ? 'iconxuanze1' : 'nc-iconfont nc-icon-yuanquanV6xx'" @click="isAgree = !isAgree"></text>
{{ t('agreeTips') }}
<view @click="redirect({ url: '/app/pages/auth/agreement?key=service' })">
<text class="text-primary">{{ t('userAgreement') }}</text>
</view>
{{ t('and') }}
<view @click="redirect({ url: '/app/pages/auth/agreement?key=privacy' })">
<text class="text-primary">{{ t('privacyAgreement') }}</text>
</view>
</view>
<!-- #ifdef MP-WEIXIN -->
<!-- 小程序隐私协议 -->
<wx-privacy-popup ref="wxPrivacyPopupRef"></wx-privacy-popup>
<!-- #endif -->
</view>
<view class="w-screen h-screen flex flex-col" :style="themeColor()" v-if="type">
<!-- #ifdef MP-WEIXIN -->
<view :style="{'height':headerHeight}">
<top-tabbar :data="param" :scrollBool="topTabarObj.getScrollBool()" class="top-header"/>
</view>
<!-- #endif -->
<view class="mx-[60rpx]">
<view class="pt-[140rpx] text-[44rpx] font-500 text-[#333]">{{ type == 'username' ? t('accountLogin') : t('mobileLogin') }}</view>
<view class="text-[26rpx] leading-[39rpx] text-[var(--text-color-light6)] mt-[16rpx] mb-[80rpx]">{{ type == 'username' ? t('accountLoginTip') : t('mobileLoginTip') }}</view>
<u-form labelPosition="left" :model="formData" errorType='toast' :rules="rules" ref="formRef">
<template v-if="type == 'username'">
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6]">
<u-form-item label="" prop="username" :border-bottom="false">
<u-input v-model="formData.username" border="none" maxlength="40" :placeholder="t('usernamePlaceholder')" autocomplete="off" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]"/>
</u-form-item>
</view>
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6] mt-[40rpx]">
<u-form-item label="" prop="password" :border-bottom="false">
<u-input v-model="formData.password" border="none" type="password" maxlength="40" :placeholder="t('passwordPlaceholder')" autocomplete="new-password" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]"/>
</u-form-item>
</view>
</template>
<template v-if="type == 'mobile'">
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6]">
<u-form-item label="" prop="mobile" :border-bottom="false">
<u-input v-model="formData.mobile" type="number" maxlength="11" border="none" :placeholder="t('mobilePlaceholder')" autocomplete="off" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]"/>
</u-form-item>
</view>
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6] mt-[40rpx] text-[26rpx]">
<u-form-item label="" prop="mobile_code" :border-bottom="false">
<u-input v-model="formData.mobile_code" type="number" maxlength="4" border="none" class="!bg-transparent" fontSize="26rpx" :disabled="real_name_input" :placeholder="t('codePlaceholder')" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]">
<template #suffix>
<sms-code v-if="configStore.login.agreement_show" :mobile="formData.mobile" type="login" v-model="formData.mobile_key" :isAgree="isAgree"></sms-code>
<sms-code v-else :mobile="formData.mobile" type="login" v-model="formData.mobile_key"></sms-code>
</template>
</u-input>
</u-form-item>
</view>
</template>
</u-form>
<view v-if="type == 'username'" class="text-right text-[24rpx] text-[var(--text-color-light9)] leading-[34rpx] mt-[20rpx]" @click="redirect({ url: '/app/pages/auth/resetpwd' })">{{t('resetpwd')}}</view>
<view :class="{'mt-[160rpx]':type != 'username','mt-[106rpx]':type == 'username'}">
<view v-if="configStore.login.agreement_show" class="flex items-center mb-[20rpx] py-[10rpx]" @click.stop="agreeChange">
<u-checkbox-group @change="agreeChange">
<u-checkbox activeColor="var(--primary-color)" :checked="isAgree" shape="circle" size="24rpx" :customStyle="{ 'marginTop': '4rpx' }"/>
</u-checkbox-group>
<view class="text-[24rpx] text-[var(--text-color-light6)] flex items-center flex-wrap">
<text>{{ t('agreeTips') }}</text>
<text @click.stop="redirect({ url: '/app/pages/auth/agreement?key=privacy' })" class="text-primary">《{{t('privacyAgreement')}}》</text>
<text>{{ t('and') }}</text>
<text @click.stop="redirect({ url: '/app/pages/auth/agreement?key=service' })" class="text-primary">《{{t('userAgreement')}}》</text>
</view>
</view>
<button class="w-full h-[80rpx] !bg-[var(--primary-color)] text-[26rpx] rounded-[40rpx] leading-[80rpx] font-500 !text-[#fff] !mx-[0]" :loadingText="t('logining')" @click="handleLogin">{{t('login')}}</button>
<view class="flex items-center justify-between mt-[30rpx]">
<view class="text-[26rpx] text-[var(--text-color-light6)] leading-[34rpx]" @click="setType" v-if="(type == 'username' && configStore.login.is_mobile) || (type == 'mobile' && configStore.login.is_username )">
{{ type == 'username' ? t('mobileLogin') : t('accountLogin') }}
</view>
<view class="text-[26rpx] text-[#333] leading-[34rpx]" @click="redirect({ url: '/app/pages/auth/register',param:{type} })">
<text>{{ t('noAccount') }},</text>
<text class="text-primary">{{ t('toRegister') }}</text>
</view>
</view>
</view>
</view>
<view class="footer w-full" v-if="isShowQuickLogin">
<view class="text-[26rpx] leading-[36rpx] text-[#333] text-center mb-[30rpx] font-400">{{t('oneClicklogin')}}</view>
<view class="flex justify-center">
<button class="h-[80rpx] w-[80rpx] text-[46rpx] !text-[#1AAB37] text-center !p-0 !bg-transparent leading-[79rpx] border-[2rpx] rounded-[50%] border-solid border-[#ddd] nc-iconfont nc-icon-weixinV6mm overflow-hidden" @click="toLink"></button>
</view>
</view>
</view>
</template>
<script setup lang="ts">
import { ref, reactive, computed, onMounted } from 'vue'
import { usernameLogin, mobileLogin,bind } from '@/app/api/auth'
import useMemberStore from '@/stores/member'
import useConfigStore from '@/stores/config'
import { useLogin } from '@/hooks/useLogin'
import { t } from '@/locale'
import { redirect,getToken } from '@/utils/common'
import { onLoad,onShow } from '@dcloudio/uni-app';
const formData = reactive({
username: '',
password: '',
mobile: '',
mobile_code: '',
mobile_key: ''
})
import { ref, reactive, computed, onMounted } from 'vue'
import { usernameLogin, mobileLogin } from '@/app/api/auth'
import useMemberStore from '@/stores/member'
import useConfigStore from '@/stores/config'
import { useLogin } from '@/hooks/useLogin'
import { t } from '@/locale'
import { redirect,getToken,pxToRpx,isWeixinBrowser } from '@/utils/common'
import { onLoad } from '@dcloudio/uni-app';
import { topTabar } from '@/utils/topTabbar'
let menuButtonInfo: any = {};
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
menuButtonInfo = uni.getMenuButtonBoundingClientRect();
// #endif
/********* 自定义头部 - start ***********/
const topTabarObj = topTabar()
const param = topTabarObj.setTopTabbarParam({title:'',topStatusBar:{bgColor: '#fff',textColor: '#333'}})
/********* 自定义头部 - end ***********/
const headerHeight = computed(()=>{
return Object.keys(menuButtonInfo).length ? pxToRpx(Number(menuButtonInfo.height)) + pxToRpx(menuButtonInfo.top) + pxToRpx(8)+'rpx':'auto'
})
const real_name_input = ref(true);
const memberStore = useMemberStore()
const configStore = useConfigStore()
const type = ref('')
const isAgree = ref(false)
const isShowQuickLogin = ref(false) // 是否显示快捷登录
onLoad(async (option: any)=> {
await configStore.getLoginConfig()
if (!getToken() && !configStore.login.is_username && !configStore.login.is_mobile) {
uni.showToast({ title: '商家未开启普通账号登录', icon: 'none' })
setTimeout(() => {
redirect({ url: '/app/pages/index/index', mode: 'reLaunch' })
}, 100)
}
if (option.type) {
if (option.type == 'mobile') {
if (configStore.login.is_mobile) {
type.value = option.type
}
} else if (option.type == 'username' && configStore.login.is_username) {
type.value = option.type
}
} else {
if (configStore.login.is_username) {
type.value = 'username'
} else if (configStore.login.is_mobile) {
type.value = 'mobile'
}
}
// 如果只开启了账号密码登录，那么就不需要跳转到登录中间页了
// #ifdef MP-WEIXIN
if (configStore.login.is_username && !configStore.login.is_mobile && !configStore.login.is_auth_register) {
isShowQuickLogin.value = false;
} else {
isShowQuickLogin.value = true;
}
// #endif
// #ifdef H5
if (isWeixinBrowser()) {
// 微信浏览器
if (configStore.login.is_username && !configStore.login.is_mobile && !configStore.login.is_auth_register) {
isShowQuickLogin.value = false;
} else {
isShowQuickLogin.value = true;
}
} else {
// 普通浏览器
if (configStore.login.is_username && !configStore.login.is_mobile) {
isShowQuickLogin.value = false;
} else {
isShowQuickLogin.value = true;
}
}
// #endif
})
const formData = reactive({
username: '',
password: '',
mobile: '',
mobile_code: '',
mobile_key: ''
})
onMounted(() => {
// 防止浏览器自动填充
setTimeout(()=>{
@ -104,165 +173,115 @@
},800)
});
const memberStore = useMemberStore()
const configStore = useConfigStore()
const agreeChange = () => {
isAgree.value = !isAgree.value
}
onLoad(async()=>{
await configStore.getLoginConfig()
uni.getStorageSync('openid') && (Object.assign(formData, { openid: uni.getStorageSync('openid') }))
uni.getStorageSync('unionid') && (Object.assign(formData, { unionid: uni.getStorageSync('unionid') }))
uni.getStorageSync('pid') && (Object.assign(formData, { pid: uni.getStorageSync('pid') }))
if(!getToken() && !configStore.login.is_username && !configStore.login.is_mobile && !configStore.login.is_bind_mobile){
uni.showToast({ title: '商家未开启普通账号登录注册', icon: 'none' })
setTimeout(() => {
redirect({ url: '/app/pages/index/index', mode: 'reLaunch' })
}, 100)
}
})
const setType = ()=> {
type.value = type.value == 'username' ? 'mobile' : 'username'
}
const loading = ref(false)
const loading = ref(false)
const rules = computed(() => {
return {
'username': {
type: 'string',
required: type.value == 'username',
message: t('usernamePlaceholder'),
trigger: ['blur', 'change'],
},
'password': {
type: 'string',
required: type.value == 'username',
message: t('passwordPlaceholder'),
trigger: ['blur', 'change']
},
'mobile': [
{
type: 'string',
required: type.value == 'mobile',
message: t('mobilePlaceholder'),
trigger: ['blur', 'change'],
},
{
validator(rule: any, value: any) {
if (type.value != 'mobile') return true
else return uni.$u.test.mobile(value)
},
message: t('mobileError'),
trigger: ['change', 'blur'],
}
],
'mobile_code': {
type: 'string',
required: type.value == 'mobile',
message: t('codePlaceholder'),
trigger: ['blur', 'change']
}
}
})
const formRef: any = ref(null)
const handleLogin = () => {
formRef.value.validate().then(() => {
if (configStore.login.agreement_show && !isAgree.value) {
uni.showToast({ title: t('isAgreeTips'), icon: 'none' });
return false;
}
if (loading.value) return
loading.value = true
const login = type.value == 'username' ? usernameLogin : mobileLogin
login(formData).then((res: any) => {
memberStore.setToken(res.data.token)
if(configStore.login.is_bind_mobile && !res.data.mobile){
uni.setStorageSync('isbindmobile', true)
}
useLogin().handleLoginBack()
}).catch(() => {
loading.value = false
})
})
}
const type = ref('')
const toLink = ()=> {
const pages = getCurrentPages(); // 获取页面栈
if (pages.length > 1) {
const currentPage = pages[pages.length - 2].route;
if (currentPage == 'app/pages/auth/index') {
// 返回上一页
uni.navigateBack({
delta: 1 // 默认值是1，表示返回的页面层数
});
}else{
redirect({ url: '/app/pages/auth/index',mode:'redirectTo' })
}
}else{
redirect({ url: '/app/pages/auth/index',mode:'redirectTo' })
}
const loginType = computed(() => {
const value = []
if(configStore.login.is_username){
value.push({ type: 'username', title: t('usernameLogin') })
}
if(configStore.login.is_bind_mobile || configStore.login.is_mobile){
value.push({ type: 'mobile', title: t('mobileLogin') })
}
type.value = value[0] ? value[0].type : ''
return value
})
const rules = computed(() => {
return {
'username': {
type: 'string',
required: type.value == 'username',
message: t('usernamePlaceholder'),
trigger: ['blur', 'change'],
},
'password': {
type: 'string',
required: type.value == 'username',
message: t('passwordPlaceholder'),
trigger: ['blur', 'change']
},
'mobile': [
{
type: 'string',
required: type.value == 'mobile',
message: t('mobilePlaceholder'),
trigger: ['blur', 'change'],
},
{
validator(rule, value) {
if (type.value != 'mobile') return true
else return uni.$u.test.mobile(value)
},
message: t('mobileError'),
trigger: ['change', 'blur'],
}
],
'mobile_code': {
type: 'string',
required: type.value == 'mobile',
message: t('codePlaceholder'),
trigger: ['blur', 'change']
}
}
})
const isAgree = ref(false)
const formRef = ref(null)
const handleLogin = () => {
formRef.value.validate().then(() => {
if (configStore.login.agreement_show && !isAgree.value) {
uni.showToast({ title: t('isAgreeTips'), icon: 'none' });
return false;
}
if (loading.value) return
loading.value = true
const login = type.value == 'username' ? usernameLogin : mobileLogin
login(formData).then((res) => {
memberStore.setToken(res.data.token)
if(configStore.login.is_bind_mobile && !res.data.mobile){
uni.setStorageSync('isbindmobile', true)
}
useLogin().handleLoginBack()
}).catch(() => {
loading.value = false
})
})
}
// todo 一键登录
const loginLoading = ref(false)
const oneClickLogin = () =>{
// 第三方平台自动登录
if (loginLoading.value) return
loginLoading.value =true
const login = useLogin()
login.getAuthCode('',false,true)
}
const wxPrivacyPopupRef:any = ref(null)
// 检测是否同意隐私协议
const checkWxPrivacy = ()=>{
wxPrivacyPopupRef.value.proactive();
}
const mobileAuth = (e) => {
if (!isAgree.value && configStore.login.agreement_show) {
uni.showToast({
title: `${ t('pleaceAgree') }《${ t('userAgreement') }》《${ t('privacyAgreement') }》`,
icon: 'none'
})
return
}
const login = useLogin()
login.getAuthCode('',false,true,(data) => {
if (e.detail.errMsg == 'getPhoneNumber:ok') {
uni.showLoading({ title: '' })
bind({
openid:data.openid,
unionid:data.unionid,
mobile_code: e.detail.code
}).then((res) => {
uni.hideLoading()
memberStore.setToken(res.data.token)
useLogin().handleLoginBack()
}).catch((res) => {
setTimeout(() => {
uni.hideLoading()
}, 2000);
})
}
if (e.detail.errno == 104) {
let msg = '用户未授权隐私权限';
uni.showToast({ title: msg, icon: 'none' })
}
if (e.detail.errMsg == "getPhoneNumber:fail user deny") {
let msg = '用户拒绝获取手机号码';
uni.showToast({ title: msg, icon: 'none' })
}
})
}
}
</script>
<style lang="scss">
.u-input{
<style lang="scss" scoped>
:deep(.u-input){
background-color: transparent !important;
}
</style>
:deep(.u-checkbox){
margin: 0 !important;
}
:deep(.u-form-item){
flex:1;
.u-line{
display:none;
}
}
.footer{
margin-top:200rpx;
padding-bottom:calc(151rpx + constant(safe-area-inset-bottom));
padding-bottom:calc(151rpx + env(safe-area-inset-bottom));
}
</style>

253
uni-app/src/app/pages/auth/register.vue
View File

@ -1,84 +1,82 @@
<template>
<view class="w-screen h-screen flex flex-col" :style="themeColor()" >
<view class="flex-1">
<!-- #ifdef H5 -->
<view class="h-[100rpx]"></view>
<!-- #endif -->
<view class="px-[60rpx] pt-[100rpx] mb-[100rpx]">
<view class="font-bold text-xl">{{ t('register') }}</view>
</view>
<view class="px-[60rpx] text-sm flex mb-[50rpx] font-bold leading-none" v-if="registerType.length > 1">
<block v-for="(item, index) in registerType">
<view :class="{'text-gray-300' : item.type != type}" @click="type = item.type">{{ item.title }}</view>
<view class="mx-[30rpx] border-solid border-0 border-r-[2px] border-gray-300" v-show="index == 0"></view>
</block>
</view>
<view class="px-[60rpx]">
<u-form labelPosition="left" :model="formData" errorType='toast' :rules="rules" ref="formRef">
<view v-show="type == 'username'">
<view class="mt-[30rpx]">
<u-form-item label="" prop="username" :border-bottom="true">
<u-input v-model="formData.username" border="none" clearable :placeholder="t('usernamePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2]"/>
</u-form-item>
</view>
<view class="mt-[30rpx]">
<u-form-item label="" prop="password" :border-bottom="true">
<u-input v-model="formData.password" border="none" type="password" clearable :placeholder="t('passwordPlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2]"/>
</u-form-item>
</view>
<view class="mt-[30rpx]">
<u-form-item label="" prop="confirm_password" :border-bottom="true">
<u-input v-model="formData.confirm_password" border="none" type="password" clearable :placeholder="t('confirmPasswordPlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2]"/>
</u-form-item>
</view>
</view>
<view v-show="type == 'mobile' || configStore.login.is_bind_mobile">
<view class="mt-[30rpx]">
<u-form-item label="" prop="mobile" :border-bottom="true">
<u-input v-model="formData.mobile" border="none" clearable :placeholder="t('mobilePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2]"/>
</u-form-item>
</view>
<view class="mt-[30rpx]">
<u-form-item label="" prop="mobile_code" :border-bottom="true">
<u-input v-model="formData.mobile_code" border="none" clearable :placeholder="t('codePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2]">
<template #suffix>
<sms-code v-show="type" :mobile="formData.mobile" type="register" v-model="formData.mobile_key"></sms-code>
</template>
</u-input>
</u-form-item>
</view>
</view>
<view v-show="type == 'username'">
<view class="mt-[30rpx]">
<u-form-item label="" prop="captcha_code" :border-bottom="true">
<u-input v-model="formData.captcha_code" border="none" clearable :placeholder="t('captchaPlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2]">
<template #suffix>
<image :src="captcha.image.value" class="h-[48rpx] w-[60rpx] ml-[20rpx]" mode="heightFix" @click="captcha.refresh()"></image>
</template>
</u-input>
</u-form-item>
</view>
</view>
<view class="flex text-xs justify-between mt-[20rpx] text-[#8288A2]">
<view @click="redirect({ url: '/app/pages/auth/login' })">{{ t('haveAccount') }}，<text class="text-primary">{{ t('toLogin') }}</text></view>
</view>
<view class="mt-[80rpx]">
<button hover-class="none" class="bg-[var(--primary-color)] text-[#fff] h-[80rpx] leading-[80rpx] rounded-[100rpx] text-[28rpx]" :loading="loading" :loadingText="t('registering')" @click="handleRegister">{{t('register')}}</button>
</view>
</u-form>
</view>
</view>
<view class="text-xs py-[50rpx] flex justify-center w-full" v-if="configStore.login.agreement_show">
<text class="iconfont text-[var(--primary-color)] text-[34rpx] mr-[12rpx]" :class="isAgree ? 'iconxuanze1' : 'nc-iconfont nc-icon-yuanquanV6xx'" @click="isAgree = !isAgree"></text>
{{ t('registerAgreeTips') }}
<view @click="redirect({ url: '/app/pages/auth/agreement?key=service' })">
<text class="text-primary">{{ t('userAgreement') }}</text>
</view>
{{ t('and') }}
<view @click="redirect({ url: '/app/pages/auth/agreement?key=privacy' })">
<text class="text-primary">{{ t('privacyAgreement') }}</text>
</view>
</view>
<view class="w-screen h-screen flex flex-col" :style="themeColor()" v-if="type">
<!-- #ifdef MP-WEIXIN -->
<view :style="{'height':headerHeight}">
<top-tabbar :data="param" :scrollBool="topTabarObj.getScrollBool()" class="top-header"/>
</view>
<!-- #endif -->
<view class="mx-[60rpx]">
<view class="pt-[140rpx] text-[44rpx] font-500 text-[#333]">{{ type == 'username' ? t('usernameRegister') : t('mobileRegister') }}</view>
<view class="text-[26rpx] leading-[39rpx] text-[var(--text-color-light6)] mt-[16rpx] mb-[80rpx]">{{ type == 'username' ? t('usernameRegisterTip') : t('mobileRegisterTip') }}</view>
<u-form labelPosition="left" :model="formData" errorType='toast' :rules="rules" ref="formRef">
<template v-if="type == 'username'">
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6]">
<u-form-item label="" prop="username" :border-bottom="false">
<u-input v-model="formData.username" border="none" maxlength="40" :placeholder="t('usernamePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]"/>
</u-form-item>
</view>
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6] mt-[40rpx]">
<u-form-item label="" prop="password" :border-bottom="false">
<u-input v-model="formData.password" border="none" type="password" maxlength="40" :placeholder="t('passwordPlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]"/>
</u-form-item>
</view>
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6] mt-[40rpx]">
<u-form-item label="" prop="confirm_password" :border-bottom="false">
<u-input v-model="formData.confirm_password" border="none" type="password" maxlength="40" :placeholder="t('confirmPasswordPlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]"/>
</u-form-item>
</view>
</template>
<template v-if="type == 'mobile' || configStore.login.is_bind_mobile">
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6] mt-[40rpx]">
<u-form-item label="" prop="mobile" :border-bottom="false">
<u-input v-model="formData.mobile" border="none" maxlength="11" :placeholder="t('mobilePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]"/>
</u-form-item>
</view>
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6] mt-[40rpx]">
<u-form-item label="" prop="mobile_code" :border-bottom="false">
<u-input v-model="formData.mobile_code" border="none" maxlength="4" :placeholder="t('codePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]">
<template #suffix>
<sms-code v-if="configStore.login.agreement_show" :mobile="formData.mobile" type="login" v-model="formData.mobile_key" :isAgree="isAgree"></sms-code>
<sms-code v-else :mobile="formData.mobile" type="login" v-model="formData.mobile_key"></sms-code>
</template>
</u-input>
</u-form-item>
</view>
</template>
<template v-if="type == 'username'">
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6] mt-[40rpx]">
<u-form-item label="" prop="captcha_code" :border-bottom="false">
<u-input v-model="formData.captcha_code" border="none" :placeholder="t('captchaPlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]">
<template #suffix>
<image :src="captcha.image.value" class="h-[48rpx] w-[60rpx] ml-[20rpx]" mode="heightFix" @click="captcha.refresh()"></image>
</template>
</u-input>
</u-form-item>
</view>
</template>
</u-form>
<view class="mt-[160rpx]">
<view v-if="configStore.login.agreement_show" class="flex items-center mb-[20rpx] py-[10rpx]" @click.stop="agreeChange">
<u-checkbox-group @change="agreeChange">
<u-checkbox activeColor="var(--primary-color)" :checked="isAgree" shape="circle" size="24rpx" :customStyle="{ 'marginTop': '4rpx' }" />
</u-checkbox-group>
<view class="text-[24rpx] text-[var(--text-color-light6)] flex items-center flex-wrap">
<text>{{ t('agreeTips') }}</text>
<text @click.stop="redirect({ url: '/app/pages/auth/agreement?key=privacy' })" class="text-primary">《{{t('privacyAgreement')}}》</text>
<text>{{ t('and') }}</text>
<text @click.stop="redirect({ url: '/app/pages/auth/agreement?key=service' })" class="text-primary">《{{t('userAgreement')}}》</text>
</view>
</view>
<button class="w-full h-[80rpx] !bg-[var(--primary-color)] text-[26rpx] rounded-[40rpx] leading-[80rpx] font-500 !text-[#fff]" @click="handleRegister">{{t('register')}}</button>
<view class="flex items-center justify-between mt-[30rpx]">
<view class="text-[26rpx] text-[var(--text-color-light6)] leading-[34rpx]" v-if="registerType.length > 1" @click="type = type == 'username' ? 'mobile' : 'username' ">{{ type == 'username' ? t('mobileRegister') : t('usernameRegister') }}</view>
<view class="text-[26rpx] text-[#333] leading-[34rpx]" @click="toLink">
<text>{{ t('haveAccount') }},</text>
<text class="text-primary">{{ t('toLogin') }}</text>
</view>
</view>
</view>
</view>
</view>
</template>
@ -90,9 +88,22 @@
import { useLogin } from '@/hooks/useLogin'
import { useCaptcha } from '@/hooks/useCaptcha'
import { t } from '@/locale'
import { redirect, getToken } from '@/utils/common'
import { redirect, getToken,pxToRpx } from '@/utils/common'
import { onLoad } from '@dcloudio/uni-app';
import { topTabar } from '@/utils/topTabbar'
let menuButtonInfo: any = {};
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
menuButtonInfo = uni.getMenuButtonBoundingClientRect();
// #endif
/********* 自定义头部 - start ***********/
const topTabarObj = topTabar()
let param = topTabarObj.setTopTabbarParam({title:'',topStatusBar:{bgColor: '#fff',textColor: '#333'}})
/********* 自定义头部 - end ***********/
const headerHeight = computed(()=>{
return Object.keys(menuButtonInfo).length ? pxToRpx(Number(menuButtonInfo.height)) + pxToRpx(menuButtonInfo.top) + pxToRpx(8)+'rpx':'auto'
})
const formData = reactive({
username: '',
password: '',
@ -114,20 +125,25 @@
const memberStore = useMemberStore()
const configStore = useConfigStore()
const loginType=ref('')
onLoad(async() =>{
await configStore.getLoginConfig()
if (!uni.getStorageSync('autoLoginLock')) {
uni.getStorageSync('openid') && (Object.assign(formData, {openid: uni.getStorageSync('openid')}))
uni.getStorageSync('pid') && (Object.assign(formData, {pid: uni.getStorageSync('pid')}))
}
uni.getStorageSync('unionid') && (Object.assign(formData, { unionid: uni.getStorageSync('unionid') }))
if(!getToken() && !configStore.login.is_username && !configStore.login.is_mobile && !configStore.login.is_bind_mobile){
uni.showToast({ title: '商家未开启普通账号登录注册', icon: 'none' })
setTimeout(() => {
redirect({ url: '/app/pages/index/index', mode: 'reLaunch' })
}, 100)
}
onLoad(async (option: any) => {
await configStore.getLoginConfig()
if (!getToken() && !configStore.login.is_username && !configStore.login.is_mobile && !configStore.login.is_bind_mobile) {
uni.showToast({ title: '商家未开启普通账号注册', icon: 'none' })
setTimeout(() => {
redirect({ url: '/app/pages/index/index', mode: 'reLaunch' })
}, 100)
}
uni.getStorageSync('openid') && (Object.assign(formData, { openid: uni.getStorageSync('openid') }))
uni.getStorageSync('pid') && (Object.assign(formData, { pid: uni.getStorageSync('pid') }))
if (configStore.login.is_username) {
type.value = 'username'
} else if ((configStore.login.is_mobile || configStore.login.is_bind_mobile)) {
type.value = 'mobile'
}
loginType.value = option.type
})
const captcha = useCaptcha(formData)
@ -136,12 +152,13 @@
const loading = ref(false)
const type = ref('')
const agreeChange = () => {
isAgree.value = !isAgree.value
}
const registerType = computed(()=> {
const value = []
configStore.login.is_username && (value.push({ type: 'username', title: t('usernameRegister') }))
configStore.login.is_mobile && !configStore.login.is_bind_mobile && (value.push({ type: 'mobile', title: t('mobileRegister') }))
type.value = value[0] ? value[0].type : ''
return value
})
@ -167,7 +184,7 @@
trigger: ['blur', 'change']
},
{
validator(rule, value){
validator(rule: any, value: any){
return value == formData.password
},
message: t('confirmPasswordError'),
@ -182,7 +199,7 @@
trigger: ['blur', 'change'],
},
{
validator(rule, value){
validator(rule: any, value: any){
if (type.value != 'mobile' && !configStore.login.is_bind_mobile) return true
else return uni.$u.test.mobile(value)
},
@ -207,7 +224,7 @@
const isAgree = ref(false)
const formRef = ref(null)
const formRef: any = ref(null)
const handleRegister = () => {
formRef.value.validate().then(() => {
@ -220,7 +237,7 @@
const register = type.value == 'username' ? usernameRegister : mobileRegister
register(formData).then((res: responseResult) => {
register(formData).then((res: any) => {
memberStore.setToken(res.data.token)
useLogin().handleLoginBack()
}).catch(() => {
@ -229,10 +246,40 @@
})
})
}
const toLink = ()=> {
const pages = getCurrentPages(); // 获取页面栈
if (pages.length > 1) {
const currentPage = pages[pages.length - 2].route;
if (currentPage == 'app/pages/auth/login') {
// 返回上一页
uni.navigateBack({
delta: 1 // 默认值是1，表示返回的页面层数
});
}else{
redirect({ url: '/app/pages/auth/login',mode:'redirectTo' })
}
}else{
redirect({ url: '/app/pages/auth/login',mode:'redirectTo' })
}
}
</script>
<style lang="scss">
.u-input{
<style lang="scss" scoped>
:deep(.u-input){
background-color: transparent !important;
}
:deep(.u-form-item){
flex:1;
.u-line{
display:none;
}
.u-input__content__subfix-icon{
display: flex;
align-items: center;
}
}
:deep(.u-checkbox){
margin: 0 !important;
}
</style>

116
uni-app/src/app/pages/auth/resetpwd.vue
View File

@ -1,54 +1,65 @@
<template>
<view class="w-screen h-screen flex flex-col" :style="themeColor()">
<view class="flex-1">
<!-- #ifdef H5 -->
<view class="h-[100rpx]"></view>
<!-- #endif -->
<view class="px-[60rpx] pt-[100rpx] mb-[100rpx]">
<view class="font-bold text-xl">{{ t('findPassword') }}</view>
</view>
<view class="px-[60rpx]">
<u-form labelPosition="left" :model="formData" errorType='toast' :rules="rules" ref="formRef">
<view class="mt-[30rpx]">
<u-form-item label="" prop="mobile" :border-bottom="true">
<u-input v-model="formData.mobile" border="none" clearable :placeholder="t('mobilePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2]"/>
</u-form-item>
</view>
<view class="mt-[30rpx]">
<u-form-item label="" prop="code" :border-bottom="true">
<u-input v-model="formData.mobile_code" border="none" clearable :placeholder="t('codePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2]">
<template #suffix>
<sms-code :mobile="formData.mobile" type="find_pass" v-model="formData.mobile_key"></sms-code>
</template>
</u-input>
</u-form-item>
</view>
<view class="mt-[30rpx]">
<u-form-item label="" prop="password" :border-bottom="true">
<u-input v-model="formData.password" border="none" type="password" clearable :placeholder="t('passwordPlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2]"/>
</u-form-item>
</view>
<view class="mt-[30rpx]">
<u-form-item label="" prop="confirm_password" :border-bottom="true">
<u-input v-model="formData.confirm_password" border="none" type="password" clearable :placeholder="t('confirmPasswordPlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[#8288A2]"/>
</u-form-item>
</view>
<view class="mt-[80rpx]">
<button hover-class="none" class="bg-[var(--primary-color)] text-[#fff] h-[80rpx] leading-[80rpx] rounded-[100rpx] text-[28rpx]" :loading="loading" :loadingText="t('confirm')" @click="handleConfirm">{{t('confirm')}}</button>
</view>
</u-form>
</view>
</view>
<!-- #ifdef MP-WEIXIN -->
<view :style="{'height':headerHeight}">
<top-tabbar :data="param" :scrollBool="topTabarObj.getScrollBool()" class="top-header"/>
</view>
<!-- #endif -->
<view class="mx-[60rpx]">
<view class="pt-[140rpx] text-[44rpx] font-500 text-[#333]">{{t('findPassword')}}</view>
<view class="text-[26rpx] leading-[39rpx] text-[var(--text-color-light6)] mt-[16rpx] mb-[80rpx]">{{t('findPasswordTip')}}</view>
<u-form labelPosition="left" :model="formData" errorType='toast' :rules="rules" ref="formRef">
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6]">
<u-form-item label="" prop="mobile" :border-bottom="false">
<u-input v-model="formData.mobile" type="number" maxlength="11" border="none" :placeholder="t('mobilePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]"/>
</u-form-item>
</view>
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6] mt-[40rpx]">
<u-form-item label="" prop="code" :border-bottom="false">
<u-input v-model="formData.mobile_code" type="number" maxlength="4" border="none" :placeholder="t('codePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]">
<template #suffix>
<sms-code :mobile="formData.mobile" type="find_pass" v-model="formData.mobile_key"></sms-code>
</template>
</u-input>
</u-form-item>
</view>
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6] mt-[40rpx]">
<u-form-item label="" prop="password" :border-bottom="false">
<u-input v-model="formData.password" border="none" type="password" maxlength="40" :placeholder="t('passwordPlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]"/>
</u-form-item>
</view>
<view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6] mt-[40rpx]">
<u-form-item label="" prop="confirm_password" :border-bottom="false">
<u-input v-model="formData.confirm_password" border="none" type="password" maxlength="40" :placeholder="t('confirmPasswordPlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]"/>
</u-form-item>
</view>
</u-form>
<view class="mt-[160rpx]">
<button class="w-full h-[80rpx] !bg-[var(--primary-color)] text-[26rpx] rounded-[40rpx] leading-[80rpx] font-500 !text-[#fff]" @click="handleConfirm">{{t('confirm')}}</button>
</view>
</view>
</view>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import { ref, reactive,computed, onMounted } from 'vue'
import { t } from '@/locale'
import { resetPassword } from '@/app/api/system'
import { redirect } from '@/utils/common'
import { redirect,pxToRpx } from '@/utils/common'
import { topTabar } from '@/utils/topTabbar'
let menuButtonInfo: any = {};
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
menuButtonInfo = uni.getMenuButtonBoundingClientRect();
// #endif
/********* 自定义头部 - start ***********/
const topTabarObj = topTabar()
let param = topTabarObj.setTopTabbarParam({title:'',topStatusBar:{bgColor: '#fff',textColor: '#333'}})
/********* 自定义头部 - end ***********/
const headerHeight = computed(()=>{
return Object.keys(menuButtonInfo).length ? pxToRpx(Number(menuButtonInfo.height)) + pxToRpx(menuButtonInfo.top) + pxToRpx(8)+'rpx':'auto'
})
const formData = reactive({
mobile: '',
mobile_code: '',
@ -66,7 +77,7 @@
});
const loading = ref(false)
const formRef = ref(null)
const formRef: any = ref(null)
const rules = {
'password': {
@ -83,7 +94,7 @@
trigger: ['blur', 'change']
},
{
validator(rule, value) {
validator(rule: any, value: any) {
return value == formData.password
},
message: t('confirmPasswordError'),
@ -98,7 +109,7 @@
trigger: ['blur', 'change'],
},
{
validator(rule, value) {
validator(rule: any, value: any) {
return uni.$u.test.mobile(value)
},
message: t('mobileError'),
@ -118,7 +129,7 @@
if (loading.value) return
loading.value = true
resetPassword(formData).then((res : responseResult) => {
resetPassword(formData).then((res : any) => {
redirect({ url: '/app/pages/auth/login', mode: 'redirectTo' })
}).catch(() => {
loading.value = false
@ -127,8 +138,17 @@
}
</script>
<style lang="scss">
.u-input{
<style lang="scss" scoped>
:deep(.u-input){
background-color: transparent !important;
}
:deep(.u-checkbox){
margin: 0 !important;
}
:deep(.u-form-item){
flex:1;
.u-line{
display:none;
}
}
</style>

21
uni-app/src/app/pages/index/close.vue
View File

@ -1,12 +1,27 @@
<template>
<view class="w-screen h-screen flex flex-col items-center justify-center" :style="themeColor()">
<u-empty :icon="img('static/resource/images/site/close.png')" :text="t('siteClose')"></u-empty>
<view class="min-h-[100vh] bg-[var(--page-bg-color)] overflow-hidden" :style="themeColor()">
<view class="empty-page">
<image class="img" :src="img('static/resource/images/site/close.png')" model="aspectFit" />
<view class="desc">{{t('siteClose')}}</view>
</view>
</view>
</template>
<script setup lang="ts">
import { img } from '@/utils/common'
import { watch } from 'vue'
import { img,redirect } from '@/utils/common'
import { t } from '@/locale'
import useSystemStore from '@/stores/system'
const systemStore = useSystemStore()
watch(
() => systemStore.site,
(newValue, oldValue) => {
if(newValue && newValue.status == 1){
redirect({ url: '/app/pages/index/index', mode: 'reLaunch' })
}
})
</script>
<style lang="scss" scoped></style>

14
uni-app/src/app/pages/index/diy.vue
View File

@ -1,7 +1,7 @@
<template>
<view :style="themeColor()">
<u-loading-page :loading="diy.getLoading()" loadingText="" bg-color="#f7f7f7" />
<loading-page :loading="diy.getLoading()"></loading-page>
<view v-show="!diy.getLoading()">
@ -30,7 +30,7 @@
</template>
<script setup lang="ts">
import {ref} from 'vue';
import {ref,nextTick} from 'vue';
import {useDiy} from '@/hooks/useDiy'
import {useShare} from '@/hooks/useShare'
import diyGroup from '@/addon/components/diy/group/index.vue'
@ -42,6 +42,8 @@
const diyGroupRef = ref(null)
const wxPrivacyPopupRef:any = ref(null)
// 监听页面加载
diy.onLoad();
@ -50,7 +52,15 @@
let share = data.share ? JSON.parse(data.share) : null;
setShare(share);
diyGroupRef.value?.refresh();
// #ifdef MP
nextTick(()=>{
if(wxPrivacyPopupRef.value) wxPrivacyPopupRef.value.proactive();
})
// #endif
});
// 监听页面隐藏
diy.onHide();
// 监听页面卸载
diy.onUnload();

14
uni-app/src/app/pages/index/index.vue
View File

@ -1,7 +1,7 @@
<template>
<view :style="themeColor()">
<u-loading-page :loading="diy.getLoading()" loadingText="" bg-color="#f7f7f7" />
<loading-page :loading="diy.getLoading()"></loading-page>
<view v-show="!diy.getLoading()">
@ -30,7 +30,7 @@
</template>
<script setup lang="ts">
import {ref} from 'vue';
import {ref,nextTick} from 'vue';
import {useDiy} from '@/hooks/useDiy'
import {redirect} from '@/utils/common';
import diyGroup from '@/addon/components/diy/group/index.vue'
@ -42,6 +42,8 @@
const diyGroupRef = ref(null)
const wxPrivacyPopupRef:any = ref(null)
// 监听页面加载
diy.onLoad();
@ -56,7 +58,15 @@
redirect({url: data.page, mode: 'reLaunch'})
}
diyGroupRef.value?.refresh();
// #ifdef MP
nextTick(()=>{
if(wxPrivacyPopupRef.value) wxPrivacyPopupRef.value.proactive();
})
// #endif
});
// 监听页面隐藏
diy.onHide();
// 监听页面卸载
diy.onUnload();

23
uni-app/src/app/pages/index/nosite.vue
View File

@ -1,12 +1,27 @@
<template>
<view class="w-screen h-screen flex flex-col items-center justify-center" :style="themeColor()">
<u-empty :icon="img('static/resource/images/site/close.png')" :text="t('noSite')"></u-empty>
</view>
<view class="min-h-[100vh] bg-[var(--page-bg-color)] overflow-hidden" :style="themeColor()">
<view class="empty-page">
<image class="img" :src="img('static/resource/images/site/close.png')" model="aspectFit" />
<view class="desc">{{t('noSite')}}</view>
</view>
</view>
</template>
<script setup lang="ts">
import { img } from '@/utils/common'
import { watch } from 'vue'
import { img, redirect } from '@/utils/common'
import { t } from '@/locale'
import useSystemStore from '@/stores/system'
const systemStore = useSystemStore()
watch(
() => systemStore.site,
(newValue, oldValue) => {
if (newValue && newValue.status == 1) {
redirect({ url: '/app/pages/index/index', mode: 'reLaunch' })
}
})
</script>
<style lang="scss" scoped></style>

61
uni-app/src/app/pages/member/account.vue
View File

@ -1,30 +1,30 @@
<template>
<view class="w-screen h-screen bg-page" :style="themeColor()">
<view class="w-screen h-screen bg-[var(--page-bg-color)]" :style="themeColor()">
<mescroll-body ref="mescrollRef" @init="mescrollInit" :down="{ use: false }" @up="getCashoutAccountListFn">
<view class="h-[10rpx]"></view>
<u-swipe-action-item :options="accountOptions" @click="swipeClick(index)" v-for="(item, index) in accountList" :key="index" class="sidebar-marign my-[20rpx]">
<view class="p-[30rpx] bg-white rounded flex justify-between" >
<view class="flex">
<view class="w-[100rpx] h-[100rpx] flex items-center justify-center mr-[10rpx]" @click="handleClick(item)">
<image
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAAXNSR0IArs4c6QAACnVJREFUeF7tWXtQVNcZ/91FQQZZdhcXfKCCqFXQuKBV0YSHqWJ9AbU+qkZQG+uEyu66i0maB5jEaSetBdvG1vrCRhM1bQS1SUw6gn0kJhkDpqLNQ10jLApEHmrCuuyeznfWRZZd3L03/MOw38zOPfee8517vt/5fY9zV0AfF6GP2w8/AH4G9HEE/C7QxwngD4J+F/C7QB9HwO8CfZwA/iwgyQWuQznBBmGxAKGdwd4u41e0070Ndhtd7z2zUT+DYKN7GWzt14PDAtZOXfIjgLULYNaziuGfQ0A73QPMxtt2wdGG0H6vzwaB2kI7omyjoMZkMFgRav8MTGZFP+Eu7PZ23gaz8nGMWRHArGABVtht7QiQfY08Q2VXxosGwAzlVkDQAggR6z7bx87EjrEzcKtfkFhVIBjAcAYMZeJ1uYbwDWR4BnmG4s4TiALAjPBfAuwpKSvYFTsVBRPnSFF16ExigFKq8R2vvQmdMVwSAGYoVwHCq1IsqA4bjIXJOWgL6CdFHYhljt3vCWEsDfr8CudUPjOgFqpDArBMyhp2x07F899l96fbgQFS3uxBp/l2AAoL7aIBMEN1GUCMlGXkTsnE0agJUlSBgQCmdKxX2hz3tf4NnfER0S5QA4VGBplbBPV1NTNm58IUovR1uOu4IQC+10MACMJWaA3PigbADOV6QNgpxYKL8gg8Omu9FFWHzlg7MFS6uoumTJaOvE3vSgBAtRvAOinLeH2kBoaEBVJUHTqT7UCodHUXzf7BocjNvS0agFqoPhWAiQMy56HfpAmwXb2Gb0te5/MEps5EYMpMWMrehrXqv24r3ayZhwPRiZIsSNVEISV9mItuVUMDyi5/KX4+AR9Ba5zWVdFrFriOsBg7AigAYlBlBfprJuLb/YfQnJPL5wqvOMYBaExI9QjA7LSfgtKgFCktWIQMTSzONTZAERSEkaFyPs2a995ByYVqcVMK7DfQ5ueLBsAM5QpAOEiKQ9jXXL8p6zG0lb7F2/SMtbTiusI9QZiD5ZiSniduoZ1GN732BBTBQYjZtwum1lZUrVyNSYPU2PLhByg88764ee1sETblH5cAgIpKRy1RPbz8GNe/oRwFe3MLZwOxoq3sbTRlruJ9MkUY7yM5NiwOh9bkISU+CvvLL8BU39rtohUhjvKYrjROE6NG5W9X4eqtVkTv3cUZULliNaLlciS89iqqGurFAWBlkcjPd1Py6gJ1UL3PgKQQ3QbIi7bCeu48GjUp/OXOZ636Z/g99dtMXyEgegQH4bllzyJi41pER8iR87uT3Kh9G9P5ffMdC9Kee4MbfPSpRR3G03Plqh3QLUxE0doUvvOll75AZuwYbvz+i9WoqLmGouQ0mFpb0GyxICYsDJnHy3B0QQYHjNhB7e1VnziYwnAOeqPGE2IPBOAmlGFtEIj3AYqSVxCcvdzF/5WlBzAg44fc/wkM6r+95WUMLNjM3/WDec9gd8mT3GAy6srOdWj5xgLdngpu9PYTlRyIgmXTeTtzWixGquUQsopQYkhH9sNx3CACodnShtJLX/J2+eKlHAiS7PHxvE0xgZ6frq0BY4yDojn4Fw4QGH4PvdGjLz4QgBoo58sgnKAXOYPdne070ar7Bad6ZNNlnhHqozUdAbJOCOdxof1qDZKKTuHj4tU4XV2DklMXsG/jHGw5fIZT3NlOnRDFXSTmZ3tQ/uISKAcGQbFyB67sWYdolTvdSxdmIGPUaO4GmbGjUTAtCfp/VqC48iyY1tCxyS6BUmDLoM0/IpoBZihfAgTOb+duE7UtpW/x9EdUp4B4t+I/HAxyDwKHYsWVwyfwQn1gh6E0B+10yalqaGIiEBMph0Z/gPu5IIC3iSEEFrkLZ4vFAsWf/uCy7oofL0PKsChknSjjbtA5JjgBIBak/vXwfT1mjYH+aZMEAFRUNc0mRTI2tPBJbjiJteo87hT/kRtPwVBevJW3qRYgd3jzZCU+mzQFtMOFhz5A1ZUGlD69iO922UeX+DOif8VLS1D64SUOTPG6VM4UU30LCh9PQtXNeuhOl7usOycuHsXJaWi+a+FpsTNIzizhGiSFi9AZ4rqLmA90ATNUzQDCxIVbx+iVST9BeWSsFFWAEkKSuPqfmHBlzeM8HuS8+06n9wo7oTNsEA3ADaiSbIDIZHv/NXHzDGgOpM84EkTNgHhx53+K+mlRwxG9b5cj8DmFCWugN5SIBqAOKiMDfi1h+ahSDMG81O6PDuTflBmKj3+Cc6ZGnh61CxK4K1AmcAr5OUX+pg0/548o7WnUES5LIrpTcVQyZ67nAokFxEGvvygaADNUbwLIkgJAd5+/KOdTpKcASDGBhHyegiOlx+LjlRipDkXO3Hgog4N4AKRIT7vrzP/7Zs/l+Z0kZ3w8qhod8xA4rtTnjy9DZ3ygH3YbA8xQ1QBwPYn4iMb6qYtxYuh4t9G061QIVZy/1tF3ztTAawK6UlAk4ZXjPV8uTkmDVpPIix+qBokBlPYyRrna1XLXwoshF2HYD70x50HL9giAGeHjANYtbbzh8P30jagNdo+dBEBJXrpLaUysIPoTIwgAhTwImhFqpP3tCDeaAhulSdpd2n2HoaWIlofxe2cf+b2H8jgXOuMO0QDUQrVOAOgbgGgxhagwY/YTHvVyZsVzY8nnnf5P91T8EP0zpsZi/6fVyJgWy098ZGTlisc4EFQBUgokZjhPhalRw3nAI8OJFW4ACJgCrfGsaADqoNrLgDWirQdwZMRD0CU6avuu4qzvie4U8JwVYeeS2NTUihabhZexuoTJKEpO5UYTGFQAUdAjV6C4QFdnGUzGu0R/oBY6Y5Q3G7pxAdX/6EucN2VP/fma+TgYneBRlYoiCoL6vac5A4gRVBJn/eoYrw4pGAovb+N1ABlHtT35PFV1hdNn8DYdjQkYnSaRF0NNbW0cFA/yBnTGpd5scAPgOgZG2BF4w5tid/2pj27A56GDPHYXLk/iRtLOUzVI/p+d5ijSiBWTotW8Tf5PhQ35eFchV6A+chFyAToMdfOBxAidcZs3O9wAMCM8C2CUAkVLc/9gxM2/fyDpOgEZTP5PQiBQ0HPeUxDUJKqBkYz7fGdxRn9KdeQKTr93PvdAf8BuT8amzf/yZoQHAFSE2iZvip763xs8FtnTvbKu+6nHMGCYuArQ82RCA4beisLSwrve7HADoBaqMwLg9vHQ20TUvzV+Fl4ZM8OXoZ7H9NQXYIa/Q2/06VO0CwAM6FcHlVWqBRmPZOPj8OHS1GUAksUdgLp9kSA8D63hRV8W4gLANShSAyBzPX/6Msu9MUMzXf50EaFJHwMZoOkJ+vPXzoXOeNKXBXRlQGCd4wgs6Ri3Kmk5TkWO9uW97mOIAQ/bAbp+N9kGndHo6xSegqDkf4G2jUsG/STLODsg7S8EQIAZEP4MrWGLmPd7LIS+AIIGQJEkZqLOYwseSudfYL8KCav/R+QYs6h51BiMMAxGsKwRKjsdyHyTTv/5+6bgGOX1s7iYyXrjWD8AvXHXenLNfgb0JJq9cS4/A3rjrvXkmv0M6Ek0e+Ncfgb0xl3ryTX7GdCTaPbGufo8A/4PpckqfWjPHTQAAAAASUVORK5CYII="
mode="widthFix" class="w-[80rpx]" v-if="item.account_type == 'bank'"></image>
<text class="iconfont iconzhifubaoxuanzhong text-[#188dfb] text-[80rpx]" v-else></text>
</view>
<view @click="handleClick(item)">
<view>{{ item.account_type == 'bank' ? item.bank_name : t('alipayAccountNo') }}</view>
<view v-if="item.account_type == 'bank'" class="text-sm text-gray-subtitle mt-[10rpx]">{{ t('endNumber') }} {{ item.account_no.substring(item.account_no.length - 4) }}{{ t('bankCard') }}</view>
<view v-else class="text-sm text-gray-subtitle mt-[10rpx]">{{ item.account_no }}</view>
<!-- 多嵌套一层是为了微信小程序兼容 -->
<view class="sidebar-margin my-[var(--top-m)] rounded-[var(--rounded-big)] overflow-hidden" v-for="(item, index) in accountList" :key="index">
<u-swipe-action-item :options="accountOptions" @click="swipeClick(index)">
<view class="card-template flex justify-between" >
<view class="flex items-center">
<view class="w-[80rpx] h-[80rpx] flex items-center justify-center" @click="handleClick(item)">
<image class="w-[80rpx] h-[52rpx] align-middle" :src="img('static/resource/images/member/apply_withdrawal/bank-icon.png')" mode="widthFix" v-if="item.account_type == 'bank'" />
<image class="h-[78rpx] w-[78rpx] align-middle" v-else :src="img('static/resource/images/member/apply_withdrawal/alipay-icon.png')" mode="widthFix" />
</view>
<view class="flex flex-col ml-[20rpx]" @click="handleClick(item)">
<view class="text-[#333] text-[28rpx]">{{ item.account_type == 'bank' ? item.bank_name : t('alipayAccountNo') }}</view>
<view v-if="item.account_type == 'bank'" class="text-[var(--text-color-light9)] text-[24rpx] mt-[12rpx]">{{ t('endNumber') }} {{ item.account_no.substring(item.account_no.length - 4) }}{{ t('bankCard') }}</view>
<view v-else class="text-[var(--text-color-light9)] text-[24rpx] mt-[12rpx]">{{ item.account_no }}</view>
</view>
</view>
<text class="flex items-center nc-iconfont nc-icon-xiugaiV6xx flex-shrink-0 text-[28rpx] p-[20rpx] pr-0" @click="editAccount(item)"></text>
</view>
<text class="flex items-center nc-iconfont nc-icon-xiugaiV6xx shrink-0 text-[32rpx] p-[20rpx] pr-0" @click="editAccount(item)"></text>
</view>
</u-swipe-action-item>
<view class="p-[30rpx] bg-white sidebar-marign my-[20rpx] rounded flex" @click="redirect({ url: '/app/pages/member/account_edit', param: { type: accountType, mode } })">
<u-icon name="plus" color="#333" size="16"></u-icon>
<text class="text-sm ml-[10rpx] flex-1">{{ accountType == 'bank' ? t('addBankCard') : t('addAlipayAccount') }}</text>
<u-icon name="arrow-right" color="#333" size="14"></u-icon>
</u-swipe-action-item>
</view>
<view class="card-template sidebar-margin my-[var(--top-m)] flex items-center" @click="redirect({ url: '/app/pages/member/account_edit', param: { type: accountType, mode } })">
<text class="nc-iconfont nc-icon-jiahaoV6xx text-[30rpx]"></text>
<text class="text-[28rpx] ml-[10rpx] flex-1">{{ accountType == 'bank' ? t('addBankCard') : t('addAlipayAccount') }}</text>
<text class="nc-iconfont nc-icon-youV6xx text-[24rpx] text-[var(--text-color-light6)]"></text>
</view>
</mescroll-body>
</view>
@ -32,7 +32,7 @@
<script setup lang="ts">
import { ref } from 'vue'
import { redirect } from '@/utils/common'
import { redirect,img } from '@/utils/common'
import { getCashoutAccountList, deleteCashoutAccount } from '@/app/api/member'
import MescrollBody from '@/components/mescroll/mescroll-body/mescroll-body.vue'
import useMescroll from '@/components/mescroll/hooks/useMescroll.js'
@ -51,7 +51,7 @@
data.mode && (mode.value = data.mode)
})
const getCashoutAccountListFn = (mescroll : mescrollStructure) => {
const getCashoutAccountListFn = (mescroll : any) => {
loading.value = false;
let data : object = {
page: mescroll.num,
@ -59,7 +59,7 @@
account_type: accountType.value
};
getCashoutAccountList(data).then((res) => {
getCashoutAccountList(data).then((res: any) => {
const newArr = (res.data.data as Array<Object>);
//设置列表数据
if (mescroll.num == 1) {
@ -101,4 +101,11 @@
}
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
:deep(.u-swipe-action-item__right__button__wrapper){
padding:0 10rpx !important;
}
:deep(.u-swipe-action-item__right__button__wrapper__text){
font-size:24rpx !important;
}
</style>

79
uni-app/src/app/pages/member/account_edit.vue
View File

@ -1,26 +1,24 @@
<template>
<view :style="themeColor()">
<scroll-view scroll-y="true" class="w-screen h-screen bg-page">
<view class="h-[20rpx]"></view>
<view class="p-[30rpx] bg-white sidebar-marign rounded">
<view class="w-screen h-screen bg-[var(--page-bg-color)] overflow-hidden" :style="themeColor()">
<scroll-view scroll-y="true" >
<view class="sidebar-margin card-template top-mar account pb-[20rpx]">
<block v-if="formData.account_type == 'bank'">
<view class="text-center text-base font-bold mt-[50rpx]">{{ t('addBankCard') }}</view>
<view class="text-center text-sm mt-[10rpx]">{{ t('addBankCardTips') }}</view>
<view class="mt-[50rpx]">
<u-form labelPosition="left" :model="formData" :label-style="{'font-size':'28rpx'}" labelWidth="200rpx" errorType='toast' :rules="rules" ref="formRef">
<view class="mt-[10rpx]">
<u-form-item :label="t('bankRealname')" prop="realname" :border-bottom="true">
<view class="text-center text-[32rpx] font-500 mt-[10rpx] text-[#333] leading-[42rpx]">{{ formData.account_id ? t('editBankCard') : t('addBankCard') }}</view>
<view class="text-center text-[24rpx] mt-[16rpx] text-[var(--text-color-light9)]">{{ formData.account_id ? t('editBankCardTips') : t('addBankCardTips') }}</view>
<view class="mt-[70rpx] px-[10rpx]">
<u-form labelPosition="left" :model="formData" errorType='toast' :rules="rules" ref="formRef">
<view>
<u-form-item :label="t('bankRealname')" prop="realname" labelWidth="200rpx">
<u-input v-model.trim="formData.realname" fontSize="28rpx" maxlength="30" border="none" clearable :placeholder="t('bankRealnamePlaceholder')"/>
</u-form-item>
</view>
<view class="mt-[10rpx]">
<u-form-item :label="t('bankName')" prop="bank_name" :border-bottom="true">
<view class="mt-[16rpx]">
<u-form-item :label="t('bankName')" prop="bank_name" labelWidth="200rpx">
<u-input v-model.trim="formData.bank_name" fontSize="28rpx" maxlength="30" border="none" clearable :placeholder="t('bankNamePlaceholder')"/>
</u-form-item>
</view>
<view class="mt-[10rpx]">
<u-form-item :label="t('bankAccountNo')" prop="account_no" :border-bottom="true">
<view class="mt-[16rpx]">
<u-form-item :label="t('bankAccountNo')" prop="account_no" labelWidth="200rpx">
<u-input v-model.trim="formData.account_no" fontSize="28rpx" maxlength="30" border="none" clearable :placeholder="t('bankAccountNoPlaceholder')"/>
</u-form-item>
</view>
@ -29,29 +27,29 @@
</block>
<block v-if="formData.account_type == 'alipay'">
<view class="text-center text-base font-bold mt-[50rpx]">{{ t('addAlipayAccount') }}</view>
<view class="text-center text-sm mt-[10rpx]">{{ t('addAlipayAccountTips') }}</view>
<view class="text-center text-[32rpx] font-500 mt-[20rpx] text-[#333] leading-[42rpx]">{{ formData.account_id ? t('editAlipayAccount') : t('addAlipayAccount') }}</view>
<view class="text-center text-[28rpx] mt-[16rpx] text-[var(--text-color-light9)] leading-[36rpx]">{{ formData.account_id ? t('editAlipayAccountTips') : t('addAlipayAccountTips') }}</view>
<view class="mt-[50rpx]">
<u-form labelPosition="left" :model="formData" labelWidth="200rpx" errorType='toast' :rules="rules" ref="formRef">
<view class="mt-[10rpx]">
<u-form-item :label="t('alipayRealname')" prop="realname" :border-bottom="true">
<u-input v-model.trim="formData.realname" maxlength="30" border="none" clearable :placeholder="t('alipayRealnamePlaceholder')"/>
<view class="mt-[70rpx] px-[10rpx]">
<u-form labelPosition="left" :model="formData" labelWidth="200rpx" errorType='toast' :rules="rules" ref="formRef">
<view>
<u-form-item :label="t('alipayRealname')" prop="realname">
<u-input v-model.trim="formData.realname" maxlength="30" border="none" fontSize="28rpx" clearable :placeholder="t('alipayRealnamePlaceholder')"/>
</u-form-item>
</view>
<view class="mt-[10rpx]">
<u-form-item :label="t('alipayAccountNo')" prop="account_no" :border-bottom="true">
<u-input v-model.trim="formData.account_no" border="none" maxlength="30" clearable :placeholder="t('alipayAccountNoPlaceholder')"/>
<view class="mt-[16rpx]">
<u-form-item :label="t('alipayAccountNo')" prop="account_no">
<u-input v-model.trim="formData.account_no" border="none" maxlength="30" fontSize="28rpx" clearable :placeholder="t('alipayAccountNoPlaceholder')"/>
</u-form-item>
</view>
</u-form>
</view>
</block>
<view class="mt-[100rpx]">
<button :loading="loading" class="bg-[var(--primary-color)] text-[#fff] h-[80rpx] leading-[80rpx] rounded-[100rpx] text-[28rpx]" @click="handleSave">{{t('save')}}</button>
</view>
</view>
<view class="common-tab-bar-placeholder"></view>
<view class="common-tab-bar fixed left-[var(--sidebar-m)] right-[var(--sidebar-m)] bottom-[0]">
<button :loading="loading" class="primary-btn-bg text-[#fff] h-[80rpx] leading-[80rpx] rounded-[100rpx] text-[26rpx] font-500" @click="handleSave">{{t('save')}}</button>
</view>
</scroll-view>
<u-modal :show="deleteConfirm" :content="t('deleteConfirm')" :confirmText="t('confirm')" :cancelText="t('cancel')" :showCancelButton="true" @confirm="handleDelete" @cancel="deleteConfirm = false" confirmColor="var(--primary-color)"></u-modal>
@ -66,7 +64,7 @@
import { redirect } from '@/utils/common'
const loading = ref(false)
const formRef = ref(null)
const formRef: any = ref(null)
const mode = ref('get')
const deleteConfirm = ref(false)
const formData = reactive<AnyObject>({
@ -104,7 +102,16 @@
data.type && (formData.account_type = data.type)
data.mode && (mode.value = data.mode)
if (data.id) {
formData.account_id = data.id
formData.account_id = data.id||''
if(formData.account_id){
uni.setNavigationBarTitle({
title:t('editAccountTitle')
})
}else{
uni.setNavigationBarTitle({
title: t('addAccountTitle')
})
}
getCashoutAccountInfo({ account_id: data.id }).then((res : any) => {
if (res.data) {
@ -139,4 +146,12 @@
}
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
:deep(.account .u-form-item .u-form-item__body){
padding: 20rpx 0;
}
.account :deep(.u-form-item__body__left__content__label){
font-size: 28rpx !important;
color:#333;
}
</style>

121
uni-app/src/app/pages/member/address.vue
View File

@ -1,40 +1,44 @@
<template>
<view v-if="!loading" :style="themeColor()">
<view class="address bg-[var(--page-bg-color)] min-h-[100vh]" v-if="!loading" :style="themeColor()">
<scroll-view scroll-y="true">
<u-swipe-action>
<view class="py-[30rpx] sidebar-marign">
<u-swipe-action-item :options="addressOptions" @click="swipeClick(key)" v-for="(item, key) in addressList">
<view class="border-0 !border-b !border-[#f5f5f5] border-solid pb-[30rpx] flex items-center">
<view class="flex-1 line-feed" @click="selectAddress(item)">
<view class="font-bold my-[10rpx] text-sm line-feed">{{ item.full_address }}</view>
<view class="text-sm flex items-center">
<view>{{ item.name }}</view>
<text class="text-[26rpx] text-gray-subtitle">{{ mobileHide(item.mobile) }}</text>
<view class="bg-primary text-white text-xs px-[10rpx] leading-none flex items-center h-[32rpx] ml-[10rpx] rounded min-w-[50rpx]" v-if="item.is_default == 1">{{ t('default') }}</view>
</view>
<view class="sidebar-margin pt-[var(--top-m)]" v-if="addressList.length">
<view class="mb-[var(--top-m)] rounded-[var(--rounded-big)] overflow-hidden" v-for="(item, index) in addressList">
<view class="flex flex-col card-template">
<view class="flex-1 line-feed mr-[20rpx]" @click="selectAddress(item)">
<view class="flex items-center">
<view class="text-[#333] text-[30rpx] leading-[34rpx] font-500">{{ item.name }}</view>
<text class="text-[#333] text-[30rpx] ml-[10rpx]">{{ mobileHide(item.mobile) }}</text>
</view>
<view class="mt-[16rpx] text-[26rpx] line-feed text-[var(--text-color-light9)] leading-[1.4]">{{ item.full_address }}</view>
</view>
<view class="flex justify-between pt-[26rpx]">
<view class="flex items-center text-[28rpx] leading-none" @click.stop="setDefault(index)">
<text class="iconfont !text-[28rpx] mr-[10rpx]" :class="{ 'iconduigou text-primary': item.is_default, 'iconcheckbox_nol': !item.is_default }"></text>
设为默认
</view>
<view class="flex">
<view class="text-[28rpx]" @click.stop="editAddressFn(item.id)"><text class="nc-iconfont nc-icon-xiugaiV6xx shrink-0 text-[28rpx] mr-[4rpx]"></text>编辑</view>
<view @click.stop="deleteAddressFn(index)" class="ml-[40rpx] text-[28rpx]"><text class="nc-iconfont nc-icon-shanchu-yuangaizhiV6xx shrink-0 text-[28rpx] mr-[4rpx]"></text>删除</view>
</view>
<text class="nc-iconfont nc-icon-xiugaiV6xx shrink-0 text-[32rpx] p-[20rpx] pr-0" @click="editAddress(item.id)"></text>
</view>
</u-swipe-action-item>
<view v-if="!addressList.length" class="pt-[20vh]">
<mescroll-empty :option="{tip : '暂无收货地址'}"></mescroll-empty>
</view>
</view>
</u-swipe-action>
<u-tabbar :fixed="true" :safeAreaInsetBottom="true" :border="false" zIndex="99">
<view class="p-[24rpx] pt-0 w-full">
<button hover-class="none" class="bg-[var(--primary-color)] text-[#fff] h-[80rpx] leading-[80rpx] rounded-[100rpx] text-[28rpx]" @click="addAddress">{{t('createAddress')}}</button>
</view>
</u-tabbar>
</view>
<mescroll-empty v-if="!addressList.length" :option="{tip : '暂无收货地址'}"></mescroll-empty>
<view class="w-full footer">
<view class="py-[var(--top-m)] px-[var(--sidebar-m)] footer w-full fixed bottom-0 left-0 right-0 box-border">
<button hover-class="none" class="primary-btn-bg text-[#fff] h-[80rpx] leading-[80rpx] rounded-[100rpx] text-[26rpx] font-500" @click="addAddress">{{t('createAddress')}}</button>
</view>
</view>
</scroll-view>
</view>
</template>
<script setup lang="ts">
import { ref, reactive, computed, watch } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { ref } from 'vue'
import { onLoad,onShow } from '@dcloudio/uni-app'
import { redirect, img, mobileHide } from '@/utils/common'
import { getAddressList, deleteAddress } from '@/app/api/member'
import { getAddressList, deleteAddress, editAddress } from '@/app/api/member'
import { t } from '@/locale'
import MescrollEmpty from '@/components/mescroll/mescroll-empty/mescroll-empty.vue';
@ -53,19 +57,25 @@
if(uni.getStorageSync('selectAddressCallback')){uni.removeStorage({ key: 'selectAddressCallback' })}
})
getAddressList({}).then(({ data }) => {
const address = [], locationAddress = []
data.forEach(item => {
item.type == 'address' ? address.push(item) : locationAddress.push(item)
const getAddressListFn = () => {
getAddressList({}).then(({ data }) => {
const address: any = [], locationAddress: any = []
data.forEach((item: any) => {
item.type == 'address' ? address.push(item) : locationAddress.push(item)
})
if(!source.value){ //地址管理使用
addressList.value = data;
}else{ // 区分同城配送地址和快递地址
addressList.value = current.value == 0 ? address : locationAddress;
}
loading.value = false
}).catch(() => {
loading.value = false
})
if(!source.value){ //地址管理使用
addressList.value = data;
}else{ // 区分同城配送地址和快递地址
addressList.value = current.value == 0 ? address : locationAddress;
}
loading.value = false
}).catch(() => {
loading.value = false
}
onShow(()=>{
getAddressListFn()
})
const addAddress = ()=> {
@ -73,7 +83,7 @@
redirect({ url, param: { source : source.value } })
}
const editAddress = (id: number)=> {
const editAddressFn = (id: number)=> {
const url = `/app/pages/member/address_edit`
redirect({ url, param: { id, source : source.value} })
}
@ -87,7 +97,7 @@
}
])
const selectAddress = (data: object) => {
const selectAddress = (data: any) => {
const selectAddress = uni.getStorageSync('selectAddressCallback')
if (selectAddress) {
selectAddress.address_id = data.id
@ -102,15 +112,27 @@
}
}
const swipeClick = (index: any) => {
const list = current.value ? locationAddressList : addressList
const data = list.value[index]
const deleteAddressFn = (index: any) => {
const data: any = addressList.value[index]
deleteAddress(data.id).then(() => {
list.value.splice(index, 1)
addressList.value.splice(index, 1)
}).catch()
}
const setDefault = (index: any) => {
const data: any = addressList.value[index]
if (data.is_default) return
data.is_default = 1;
editAddress(data).then(() => {
addressList.value.forEach((item, itemIndex) => {
item.is_default && (item.is_default = 0)
itemIndex == index && (item.is_default = 1)
})
}).catch()
}
</script>
<style lang="scss" scoped>
@ -122,4 +144,15 @@
word-wrap:break-word;
word-break: break-all;
}
:deep(.u-swipe-action-item__right__button__wrapper__text.u-line-1){
font-size: 24rpx !important;
}
:deep(.u-swipe-action-item__right__button__wrapper){
padding:0 10rpx !important;
}
.footer{
height: calc(80rpx + var(--top-m) + var(--top-m) + constant(safe-area-inset-bottom)) !important;
height: calc(80rpx + var(--top-m) + var(--top-m) + env(safe-area-inset-bottom)) !important;
}
</style>

198
uni-app/src/app/pages/member/address_edit.vue
View File

@ -1,50 +1,55 @@
<template>
<view class="sidebar-marign pt-[10rpx]" :style="themeColor()">
<u-form labelPosition="left" :model="formData" :label-style="{'font-size':'28rpx'}" labelWidth="200rpx" errorType='toast' :rules="rules" ref="formRef">
<view class="">
<u-form-item :label="t('name')" prop="name" :border-bottom="true">
<u-input fontSize="28rpx" v-model.trim="formData.name" border="none" clearable maxlength="25" :placeholder="t('namePlaceholder')"/>
</u-form-item>
</view>
<view class="mt-[10rpx]">
<u-form-item :label="t('mobile')" prop="mobile" :border-bottom="true">
<u-input fontSize="28rpx" v-model.trim="formData.mobile" border="none" clearable :placeholder="t('mobilePlaceholder')"/>
</u-form-item>
</view>
<view class="mt-[10rpx]">
<u-form-item :label="t('selectArea')" prop="area" :border-bottom="true" >
<view class="flex w-full items-center" v-if="addressType == 'address' && isSelectMap != 1" @click="selectArea">
<view v-if="!formData.area" class="text-gray-placeholder text-[28rpx] flex-1">{{ t('selectAreaPlaceholder') }}</view>
<view v-else class="text-[28rpx] flex-1">{{ formData.area }}</view>
<view @click.stop="chooseLocation" class="flex items-center">
<text class="nc-iconfont nc-icon-dizhiguanliV6xx mr-[4rpx] text-[32rpx] text-[#e93323]"></text>
<text class="text-[24rpx] whitespace-nowrap">定位</text>
<view class="bg-[var(--page-bg-color)] min-h-[100vh] overflow-hidden address-edit" :style="themeColor()">
<u-form labelPosition="left" :model="formData" errorType='toast' :rules="rules" ref="formRef">
<view class="sidebar-margin card-template mt-[var(--top-m)] py-[20rpx]">
<view class="">
<u-form-item :label="t('name')" prop="name" labelWidth="200rpx">
<u-input fontSize="28rpx" v-model.trim="formData.name" border="none" clearable maxlength="25" placeholderStyle="color: #888" :placeholder="t('namePlaceholder')"/>
</u-form-item>
</view>
<view class="mt-[16rpx]">
<u-form-item :label="t('mobile')" prop="mobile" labelWidth="200rpx">
<u-input fontSize="28rpx" v-model.trim="formData.mobile" maxlength="11" border="none" clearable :placeholder="t('mobilePlaceholder')" placeholderStyle="color: #888"/>
</u-form-item>
</view>
<view class="mt-[16rpx]">
<u-form-item :label="t('selectArea')" prop="area" labelWidth="200rpx">
<view class="flex w-full items-center h-[52rpx]" v-if="addressType == 'address' && isSelectMap != 1" @click="selectArea">
<view v-if="!formData.area" class="text-[#888] text-[28rpx] flex-1">{{ t('selectAreaPlaceholder') }}</view>
<view v-else class="text-[28rpx] flex-1 leading-[1.4]">{{ formData.area }}</view>
<view @click.stop="chooseLocation" class="flex items-center">
<text class="nc-iconfont nc-icon-dizhiguanliV6xx mr-[4rpx] text-[32rpx] text-[#e93323]"></text>
<text class="text-[24rpx] whitespace-nowrap text-[#e93323]">定位</text>
</view>
</view>
</view>
<view v-else class="flex justify-between items-center flex-1" @click="chooseLocation">
<view class="text-[28rpx] text-[#303133]" v-if="formData.area || formData.address_name">{{formData.area || formData.address_name}}</view>
<view class="text-[#c3c4d5] text-[28rpx]" v-else>{{t('selectAddressPlaceholder')}}</view>
<view class="flex items-center">
<text class="nc-iconfont nc-icon-dizhiguanliV6xx text-[32rpx] mr-[4rpx] text-[#e93323]"></text>
<text class="text-[24rpx] whitespace-nowrap">定位</text>
<view v-else class="flex justify-between items-center flex-1 h-[52rpx]" @click="chooseLocation">
<view class="text-[28rpx] text-[#303133] leading-[1.4]" v-if="formData.area || formData.address_name">{{formData.area || formData.address_name}}</view>
<view class="text-[#888] text-[28rpx]" v-else>{{t('selectAddressPlaceholder')}}</view>
<view class="flex items-center">
<text class="nc-iconfont nc-icon-dizhiguanliV6xx text-[32rpx] mr-[4rpx] text-[#e93323]"></text>
<text class="text-[24rpx] whitespace-nowrap text-[#e93323]">定位</text>
</view>
</view>
</view>
</u-form-item>
</view>
<view class="mt-[10rpx]">
<u-form-item :label="t('address')" prop="address" :border-bottom="true">
<u-input fontSize="28rpx" v-model.trim="formData.address" border="none" clearable maxlength="120" :placeholder="t('addressPlaceholder')"/>
</u-form-item>
</view>
<view class="mt-[10rpx]">
<u-form-item :label="t('defaultAddress')" prop="name" :border-bottom="true">
<u-switch v-model="formData.is_default" size="20" :activeValue="1" :inactiveValue="0" activeColor="var(--primary-color)"/>
</u-form-item>
</view>
<view class="mt-[40rpx]">
<button hover-class="none" class="!bg-[var(--primary-color)] !text-[#fff] h-[80rpx] leading-[80rpx] rounded-[100rpx] text-[28rpx]" :class="{'opacity-50': btnDisabled}" @click="save" :disabled="btnDisabled" :loading="operateLoading">{{t('save')}}</button>
</view>
</u-form>
</u-form-item>
</view>
<view class="mt-[16rpx]">
<u-form-item :label="t('address')" prop="address" labelWidth="200rpx">
<u-input fontSize="28rpx" v-model="formData.address" border="none" clearable maxlength="120" :placeholder="t('addressPlaceholder')" placeholderStyle="color: #888"/>
</u-form-item>
</view>
</view>
<view class="sidebar-margin card-template mt-[var(--top-m)] py-[10rpx]">
<u-form-item :label="t('defaultAddress')" prop="name" :border-bottom="false" labelWidth="200rpx">
<u-switch v-model="formData.is_default" size="20" :activeValue="1" :inactiveValue="0" activeColor="var(--primary-color)" inactiveColor="var(--temp-bg)"/>
</u-form-item>
</view>
</u-form>
<view class="w-full footer">
<view class="py-[var(--top-m)] px-[var(--sidebar-m)] footer w-full fixed bottom-0 left-0 right-0 box-border">
<button hover-class="none" class="primary-btn-bg !text-[#fff] h-[80rpx] leading-[80rpx] rounded-[100rpx] text-[26rpx] font-500"
@click="save" :disabled="btnDisabled" :loading="operateLoading" :class="{'opacity-50': btnDisabled}">{{t('save')}}</button>
</view>
</view>
<area-select ref="areaRef" @complete="areaSelectComplete" :area-id="formData.district_id"/>
<!-- #ifdef MP-WEIXIN -->
<!-- 小程序隐私协议 -->
@ -55,7 +60,7 @@
</template>
<script setup lang="ts">
import { ref, computed } from 'vue'
import { ref, computed,nextTick } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { redirect } from '@/utils/common'
import { t } from '@/locale'
@ -63,7 +68,7 @@
import manifestJson from '@/manifest.json'
import { getAddressByLatlng } from '@/app/api/system'
const formData = ref({
const formData: any = ref({
id: 0,
name: '',
mobile: '',
@ -79,39 +84,46 @@
area: ''
})
const areaRef = ref()
const formRef = ref(null)
const formRef: any = ref(null)
const source = ref('')
const btnDisabled = ref(false)
const isSelectAddress = ref(false)
const addressType = ref('address');
const isSelectMap = ref(2) // 值为1，该地址需要有经纬度，反之不需要
const wxPrivacyPopupRef:any = ref(null)
onLoad((data: any) => {
isSelectMap.value = data.isSelectMap || '';
const selectAddress = uni.getStorageSync('selectAddressCallback')
if (data.id) {
getAddressInfo(data.id).then(res => {
res.data && Object.assign(formData.value, res.data)
// 兼容待支付页面编辑地址
if(selectAddress){
addressType.value = selectAddress.delivery == 'express' ? 'address' : 'locationAddress';
}
})
}else if (data.name) {
if (uni.getStorageSync('addressInfo')) {
Object.assign(formData.value, uni.getStorageSync('addressInfo'))
}
formData.value.address = data.name;
getAddress(data.latng);
var tempArr = getQueryVariable('latng').split(',');
formData.value.lat = tempArr[0];
formData.value.lng = tempArr[1];
}
source.value = data.source || ''
if(selectAddress){
addressType.value = selectAddress.delivery == 'express' ? 'address' : 'locationAddress';
}
isSelectMap.value = data.isSelectMap || '';
const selectAddress = uni.getStorageSync('selectAddressCallback')
if (data.id) {
getAddressInfo(data.id).then((res: any) => {
res.data && Object.assign(formData.value, res.data)
// 兼容待支付页面编辑地址
if (selectAddress) {
addressType.value = selectAddress.delivery == 'express' ? 'address' : 'locationAddress';
}
})
} else if (data.name) {
if (uni.getStorageSync('addressInfo')) {
Object.assign(formData.value, uni.getStorageSync('addressInfo'))
}
formData.value.address = data.name;
getAddress(data.latng);
var tempArr = getQueryVariable('latng').split(',');
formData.value.lat = tempArr[0];
formData.value.lng = tempArr[1];
}
source.value = data.source || ''
if (selectAddress) {
addressType.value = selectAddress.delivery == 'express' ? 'address' : 'locationAddress';
}
// #ifdef MP
nextTick(() => {
if (wxPrivacyPopupRef.value) wxPrivacyPopupRef.value.proactive();
})
// #endif
})
const rules = computed(() => {
@ -130,7 +142,7 @@
trigger: ['blur', 'change'],
},
{
validator(rule, value, callback) {
validator(rule: any, value: any, callback: any) {
let mobile = /^1[3-9]\d{9}$/;
if (!mobile.test(value)){
callback(new Error(t('mobileError')))
@ -154,7 +166,7 @@
type: 'string',
required: true,
message: t('addressPlaceholder'),
trigger: ['blur', 'change'],
trigger: ['blur', 'change']
}
}
})
@ -164,7 +176,7 @@
areaRef.value.open()
}
const areaSelectComplete = (event) => {
const areaSelectComplete = (event: any) => {
if(isSelectAddress.value && (formData.value.province_id == event.province.id || formData.value.city_id != event.city.id || formData.value.district_id != event.district.id)){
formData.value.lat = '';
formData.value.lng = '';
@ -197,7 +209,7 @@
return false;
}
save(formData.value).then((res) => {
save(formData.value).then((res: any) => {
operateLoading.value = false
setTimeout(() => {
btnDisabled.value = false
@ -229,20 +241,20 @@
}
// 选择地址
const chooseLocation = (data:Object = {})=> {
const chooseLocation = ()=> {
// #ifdef MP
uni.chooseLocation({
success: (res) => {
res.latitude && (formData.value.lat = res.latitude)
res.longitude && (formData.value.lng = res.longitude)
res.address && (formData.value.area = res.address)
res.name && (formData.value.address_name = res.address)
res.name && (formData.value.address = res.name)
if(res.latitude && res.longitude){
let latng = res.latitude+','+res.longitude;
getAddress(latng);
}
},
res.latitude && (formData.value.lat = res.latitude)
res.longitude && (formData.value.lng = res.longitude)
res.address && (formData.value.area = res.address)
res.name && (formData.value.address_name = res.address)
res.name && (formData.value.address = res.name)
if (res.latitude && res.longitude) {
let latng = res.latitude + ',' + res.longitude;
getAddress(latng);
}
},
fail: (res)=>{
// 在隐私协议中没有声明chooseLocation:fail api作用域
if(res.errMsg && res.errno) {
@ -307,5 +319,15 @@
</script>
<style lang="scss" scoped>
.address-edit :deep(.u-form-item__body__left__content__label){
font-size: 28rpx !important;
}
.address-edit :deep(.u-form-item__body__right){
display:flex;
align-items: center;
}
.footer{
height: calc(100rpx + var(--top-m) + var(--top-m) + constant(safe-area-inset-bottom)) !important;
height: calc(100rpx + var(--top-m) + var(--top-m) + env(safe-area-inset-bottom)) !important;
}
</style>

77
uni-app/src/app/pages/member/apply_cash_out.vue
View File

@ -1,46 +1,44 @@
<template>
<view :style="themeColor()">
<scroll-view :scroll-y="true" class="w-screen h-screen bg-page" v-if="!pageLoading && config.is_open == 1">
<view class="sidebar-marign pt-[20rpx]">
<scroll-view :scroll-y="true" class="w-screen h-screen bg-[var(--page-bg-color)]" v-if="!pageLoading && config.is_open == 1">
<view class="sidebar-margin pt-[var(--top-m)]">
<view class="card-template">
<view class="font-500 text-[32rpx] text-[#333] leading-[44rpx]">{{t('cashOutMoneyTip')}}</view>
<view class="font-500 text-[30rpx] text-[#333] leading-[42rpx]">{{t('cashOutMoneyTip')}}</view>
<view class="flex pt-[30rpx] pb-[8rpx] items-center border-0 border-b-[2rpx] border-solid border-[#F1F2F5]">
<text class="text-[54rpx] font-500 leading-[76rpx] ">{{ t('currency') }}</text>
<input type="digit" class="h-[76rpx] leading-[76rpx] pl-[10rpx] flex-1 font-bold text-[54rpx] bg-[#fff]" v-model="applyData.apply_money" maxlength="7" :placeholder="applyData.apply_money?'':(t('minWithdrawal') + t('currency') + moneyFormat(config.min))" placeholder-class="apply-price" :adjust-position="false"/>
<image @click="clearMoney" v-if="applyData.apply_money"
:src="img('static/resource/images/member/apply_withdrawal/close.png')" class="w-[40rpx] h-[40rpx]"
mode="widthFix" />
<text class="pt-[4rpx] text-[44rpx] text-[#333] iconfont iconrenminbiV6xx price-font "></text>
<input type="digit" class="h-[76rpx] leading-[76rpx] pl-[10rpx] flex-1 font-500 text-[54rpx] bg-[#fff]" v-model="applyData.apply_money" maxlength="7" :placeholder="applyData.apply_money?'':(t('minWithdrawal') + t('currency') + moneyFormat(config.min))" placeholder-class="apply-price" :adjust-position="false"/>
<text @click="clearMoney" v-if="applyData.apply_money" class="nc-iconfont nc-icon-cuohaoV6xx1 !text-[32rpx] text-[var(--text-color-light9)]"></text>
</view>
<view class="pt-[20rpx] flex items-center justify-between">
<view class="text-[26rpx] text-[#626779] leading-[36rpx]">
<view class="pt-[16rpx] flex items-center justify-between px-[4rpx]">
<view class="text-[24rpx] text-[var(--text-color-light6)] leading-[36rpx]">
<text>{{t('money')}}：{{ t('currency') }}{{ moneyFormat(cashOutMoney) }}</text>
<text>，{{t('commissionTo')}}{{ config.rate + '%' }}</text>
</view>
<view class="text-[26rpx] text-primary leading-[36rpx]" @click="allMoney">{{t('allTx')}}</view>
<view class="text-[24rpx] text-primary leading-[36rpx]" @click="allMoney">{{t('allTx')}}</view>
</view>
</view>
<view class="mt-[20rpx] card-template">
<view class="font-500 text-[32rpx] text-[#333] leading-[44rpx] mb-[30rpx]">到账方式</view>
<view class="font-500 text-[30rpx] text-[#333] leading-[42rpx] mb-[30rpx]">到账方式</view>
<!-- 提现到微信 -->
<view class="p-[20rpx] mb-[20rpx] flex items-center rounded-[16rpx] border-[1rpx] border-solid border-[#eee]" v-if="config.transfer_type.includes('wechatpay') && memberStore.info && (memberStore.info.wx_openid || memberStore.info.weapp_openid)" @click="applyData.transfer_type = 'wechatpay'" :class="{'border-[#089C98] bg-[#F6FFFF]': applyData.transfer_type == 'wechatpay'}">
<view class="p-[20rpx] mb-[20rpx] flex items-center rounded-[var(--rounded-mid)] border-[1rpx] border-solid border-[#eee]" v-if="config.transfer_type.includes('wechatpay') && memberStore.info && (memberStore.info.wx_openid || memberStore.info.weapp_openid)" @click="applyData.transfer_type = 'wechatpay'" :class="{'border-[#00C800] bg-[#ECF9EF]': applyData.transfer_type == 'wechatpay'}">
<view>
<image class="h-[60rpx] w-[60rpx]" :src="img('static/resource/images/member/apply_withdrawal/wechat.png')" mode="widthFix" />
</view>
<view class="flex-1 px-[20rpx]">
<view class="text-[28rpx] text-[#333] leading-[40rpx] mb-[6rpx]">{{ t('cashOutToWechat') }}</view>
<view class="text-[#999] text-[24rpx] leading-[34rpx]">{{ t('cashOutToWechatTips') }}</view>
<view class="text-[var(--text-color-light9)] text-[24rpx] leading-[34rpx]">{{ t('cashOutToWechatTips') }}</view>
</view>
</view>
<!-- 提现到支付宝 -->
<view class="p-[20rpx] mb-[20rpx] flex items-center rounded-[16rpx] border-[1rpx] border-solid border-[#eee]" v-if="config.transfer_type.includes('alipay')" :class="{'border-[#089C98] bg-[#F6FFFF]': applyData.transfer_type == 'alipay' && alipayAccountInfo}" >
<view class="p-[20rpx] mb-[20rpx] flex items-center rounded-[var(--rounded-mid)] border-[1rpx] border-solid border-[#eee]" v-if="config.transfer_type.includes('alipay')" :class="{'border-[#009FE8] bg-[#EEF8FC]': applyData.transfer_type == 'alipay' && alipayAccountInfo}" >
<view @click="transferAlipay" >
<image class="h-[60rpx] w-[60rpx] align-middle" :src="img('static/resource/images/member/apply_withdrawal/alipay-icon.png')" mode="widthFix" />
</view>
<view class="flex-1 px-[22rpx]" @click="transferAlipay" >
<view class="text-[28rpx] text-[#333] leading-[40rpx] mb-[6rpx]">{{ t('cashOutToAlipay') }}</view>
<view class="text-[#999] text-[24rpx] leading-[34rpx]">
<view class="text-[var(--text-color-light9)] text-[24rpx] leading-[34rpx]">
<view v-if="alipayAccountInfo" class="truncate max-w-[440rpx]">
<text>{{ t('cashOutTo') }}{{ t('alipayAccountNo') }}</text>
<text class="text-[#333]">{{ alipayAccountInfo.account_no }}</text>
@ -49,19 +47,19 @@
</view>
</view>
<view class="flex items-center">
<u-button :plain="true" :text="t('toAdd')" type="primary" shape="circle" :custom-style="{height: '54rpx'}" v-if="!alipayAccountInfo && !alipayLoading" @click="redirect({ url: '/app/pages/member/account', param: { type: 'alipay', mode: 'select' } , mode: 'redirectTo'})"></u-button>
<text v-else class="nc-iconfont nc-icon-youV6xx text-[40rpx] text-[#999] p-[10rpx]" @click.stop="redirect({ url: '/app/pages/member/account', param: { type: 'alipay', mode: 'select' } , mode: 'redirectTo'})"></text>
<button v-if="!alipayAccountInfo && !alipayLoading" hover-class="none" class="w-[110rpx] h-[54rpx] flex-center rounded-full p-[0] text-[var(--primary-color)] bg-transparent border-[2rpx] border-solid border-[var(--primary-color)] text-[22rpx]" @click="redirect({ url: '/app/pages/member/account', param: { type: 'alipay', mode: 'select' } , mode: 'redirectTo'})">{{t('toAdd')}}</button>
<text v-else class="nc-iconfont nc-icon-youV6xx text-[28rpx] text-[var(--text-color-light9)] p-[10rpx]" @click.stop="redirect({ url: '/app/pages/member/account', param: { type: 'alipay', mode: 'select' } , mode: 'redirectTo'})"></text>
</view>
</view>
<!-- 提现到银行卡 -->
<view class="p-[20rpx] flex items-center rounded-[16rpx] border-[1rpx] border-solid border-[#eee]" v-if="config.transfer_type.includes('bank')" :class="{'border-[#089C98] bg-[#F6FFFF]': applyData.transfer_type == 'bank' && bankAccountInfo}">
<view class="p-[20rpx] flex items-center rounded-[var(--rounded-mid)] border-[1rpx] border-solid border-[#eee]" v-if="config.transfer_type.includes('bank')" :class="{'border-[#089C98] bg-[#F6FFFF]': applyData.transfer_type == 'bank' && bankAccountInfo}">
<view @click="transferBank" >
<image class="h-[42rpx] w-[60rpx] align-middle" :src="img('static/resource/images/member/apply_withdrawal/bank-icon.png')" mode="widthFix" />
</view>
<view class="flex-1 px-[20rpx]" @click="transferBank" >
<view class="text-[28rpx] text-[#333] leading-[40rpx] mb-[6rpx]">{{ t('cashOutToBank') }}</view>
<view class="text-[#999] text-[24rpx] leading-[34rpx]">
<view class="text-[var(--text-color-light9)] text-[24rpx] leading-[34rpx]">
<view v-if="bankAccountInfo" class="truncate max-w-[440rpx]">
<text>{{ t('cashOutTo') }}{{ bankAccountInfo.bank_name }}{{ t('debitCard') }}</text>
<text class="text-[#333]">{{ bankAccountInfo.account_no.substring(bankAccountInfo.account_no.length - 4) }} </text>
@ -72,24 +70,29 @@
</view>
</view>
<view class="flex items-center">
<button hover-class="none" class="h-[54rpx] leading-[50rpx] rounded-full p-[0] w-[100rpx] text-[var(--primary-color)] bg-transparent border-[2rpx] border-solid border-[var(--primary-color)] text-[28rpx]" v-if="!bankAccountInfo && !bankLoading" @click="redirect({ url: '/app/pages/member/account', param: { type: 'bank', mode: 'select' }, mode: 'redirectTo' })">{{t('toAdd')}}</button>
<text v-else class="nc-iconfont nc-icon-youV6xx text-[40rpx] text-[#999] p-[10rpx]" @click.stop="redirect({ url: '/app/pages/member/account', param: { type: 'bank', mode: 'select' }, mode: 'redirectTo' })"></text>
<button hover-class="none" class="h-[54rpx] flex-center rounded-full p-[0] w-[110rpx] text-[var(--primary-color)] bg-transparent border-[2rpx] border-solid border-[var(--primary-color)] text-[22rpx]" v-if="!bankAccountInfo && !bankLoading" @click="redirect({ url: '/app/pages/member/account', param: { type: 'bank', mode: 'select' }, mode: 'redirectTo' })">{{t('toAdd')}}</button>
<text v-else class="nc-iconfont nc-icon-youV6xx text-[28rpx] text-[var(--text-color-light9)] p-[10rpx]" @click.stop="redirect({ url: '/app/pages/member/account', param: { type: 'bank', mode: 'select' }, mode: 'redirectTo' })"></text>
</view>
</view>
</view>
<view class="fixed bottom-[60rpx] left-0 right-0 px-[30rpx]">
<button class="mt-[100rpx] h-[80rpx] !text-[#fff] leading-[80rpx] primary-btn-bg rounded-[50rpx] text-[32rpx]" :disabled="applyData.apply_money == '' || applyData.apply_money == 0" :loading="loading" @click="cashOut">{{t('cashOutNow')}}</button>
<view class="mt-[20rpx] text-center text-[26rpx] text-primary" @click.stop="redirect({ url: '/app/pages/member/cash_out'})">
<view class="tab-bar-placeholder"></view>
<view class="fixed bottom-[0] tab-bar left-0 right-0 px-[var(--sidebar-m)]">
<button class="h-[80rpx] !text-[#fff] leading-[80rpx] primary-btn-bg rounded-[50rpx] text-[26rpx]" :disabled="applyData.apply_money == '' || applyData.apply_money == 0" :loading="loading" @click="cashOut">{{t('cashOutNow')}}</button>
<view class="mt-[30rpx] text-center text-[26rpx] text-primary" @click.stop="redirect({ url: '/app/pages/member/cash_out'})">
{{t('cashOutList')}}
</view>
</view>
</view>
</scroll-view>
<view class="h-[100vh] w-[100vw] flex justify-center items-center" v-if="config.is_open == 0 && !pageLoading">
<u-empty :text="t('isOpenApply')" width="320rpx" height="244rpx" :icon="img('static/resource/images/empty.png')"/>
<view class="h-[100vh] w-[100vw] bg-[var(--page-bg-color)] overflow-hidden" v-if="config.is_open == 0 && !pageLoading">
<view class="empty-page">
<image class="img" :src="img('addon/shop/cart-empty.png')" model="aspectFit" />
<view class="desc">{{ t('isOpenApply') }}</view>
</view>
</view>
<u-loading-page :loading="pageLoading" bg-color="#e8e8e8" loading-text=""></u-loading-page>
<loading-page :loading="pageLoading"></loading-page>
</view>
</template>
@ -140,7 +143,7 @@
transfer_type: [] // 提现方式
})
let query:AnyObject | undefined = {}
let query:any = {}
onLoad(async (data) => {
query = data
@ -237,7 +240,7 @@
data.account_id = query.account_id
}
alipayLoading.value = true
request(data).then(res => {
request(data).then((res: any) => {
if (res.data && res.data.account_id) {
alipayAccountInfo.value = res.data
// 初始化赋值
@ -253,7 +256,7 @@
* 获取银行卡提现账号信息
*/
const bankLoading = ref(false)
const bankAccountInfo = ref(null)
const bankAccountInfo: any = ref(null)
const getBankAccountInfo = () => {
const data = { account_type: 'bank', account_id: 0 }
let request = getFirstCashoutAccountInfo
@ -263,7 +266,7 @@
data.account_id = query.account_id
}
bankLoading.value = true
request(data).then(res => {
request(data).then((res: any) => {
if (res.data && res.data.account_id) {
bankAccountInfo.value = res.data
// 初始化赋值
@ -312,9 +315,17 @@
<style lang="scss" scoped>
:deep(.apply-price){
color: #8288A2;
color: var(--text-color-light9);
font-size: 26rpx;
font-weight: normal;
line-height: 76rpx;
}
.tab-bar-placeholder {
padding-bottom: calc(constant(safe-area-inset-bottom) + 166rpx);
padding-bottom: calc(env(safe-area-inset-bottom) + 166rpx);
}
.tab-bar {
padding-bottom: calc(constant(safe-area-inset-bottom) + 30rpx);
padding-bottom: calc(env(safe-area-inset-bottom) + 30rpx);
}
</style>

114
uni-app/src/app/pages/member/balance.vue
View File

@ -1,75 +1,68 @@
<template>
<view class="min-h-[100vh] !bg-[#F6F6F6]" :style="themeColor()" v-if="memberStore.info">
<view class="fixed w-full z-2 !bg-[#F6F6F6]">
<view class="pb-[203rpx] text-[#fff] w-full" :style="headerStyle">
<view class="min-h-[100vh] !bg-[var(--page-bg-color)]" :style="themeColor()" v-if="memberStore.info">
<view class="fixed w-full z-2 !bg-[var(--page-bg-color)]">
<view class="pb-[190rpx] text-[#fff] w-full" :style="headerStyle">
<!-- #ifdef MP-WEIXIN -->
<top-tabbar :data="param" class="top-header"/>
<!-- #endif -->
<view class="leading-[39rpx] text-[28rpx] pl-[53rpx] pt-[79rpx]">{{t('accountBalance')}}</view>
<view class="flex items-baseline pl-[53rpx]">
<text class="text-[40rpx] leading-[56rpx]">￥</text>
<text class="text-[70rpx] leading-[98rpx]">{{ memberStore.info ? moneyFormat((parseFloat(memberStore.info.balance) + parseFloat(memberStore.info.money)).toString()) : '0.00' }}</text>
<view class="leading-[38rpx] text-[28rpx] pl-[60rpx] pt-[100rpx]">{{t('accountBalance')}}</view>
<view class="flex items-baseline pl-[60rpx]" >
<text class="text-[36rpx] leading-[52rpx] mr-[6rpx] price-font">￥</text>
<text class="text-[56rpx] leading-[72rpx] price-font">{{ memberStore.info ? moneyFormat((parseFloat(memberStore.info.balance) + parseFloat(memberStore.info.money)).toString()).split('.')[0] : '0' }}.</text>
<text class="text-[36rpx] leading-[56rpx] price-font">{{ memberStore.info ? moneyFormat((parseFloat(memberStore.info.balance) + parseFloat(memberStore.info.money)).toString()).split('.')[1] : '00' }}</text>
</view>
</view>
<view class="sidebar-marign py-[30rpx] bg-[#fff] rounded-[16rpx] px-[40rpx] box-border w-[calc(100% - 60rpx)] mt-[-112rpx]">
<view class="sidebar-margin pt-[50rpx] pb-[40rpx] bg-[#fff] rounded-[var(--rounded-big)] px-[40rpx] box-border mt-[-112rpx]">
<view class="flex flex-col items-center w-full" @click="redirect({ url: '/app/pages/member/detailed_account', param: { type : 'money' } })" :class="{'pt-[12rpx]': !Object.keys(cashOutConfigObj).length || (Object.keys(cashOutConfigObj).length && !systemStore.siteAddons.includes('recharge') && cashOutConfigObj.is_open != 1)}">
<view class=" text-[#999] text-[24rpx] leading-[34rpx] font-400">{{t('money')}}</view>
<view class="flex items-baseline text-[#333]">
<text class="text-[26rpx] leading-[36rpx]">￥</text>
<text class="text-[44rpx] leading-[62rpx] font-bold">{{ moneyFormat(memberStore.info?.money)|| '0.00' }}</text>
<view class=" text-[var(--text-color-light9)] text-[26rpx] leading-[34rpx] mb-[12rpx]">{{t('money')}}</view>
<view class="text-[#333] inline-block">
<text class="text-[36rpx] mr-[6rpx] price-font">￥</text>
<text class="text-[56rpx] font-500 price-font">{{ moneyFormat(memberStore.info?.money).split('.')[0] }}.</text>
<text class="text-[36rpx] font-500 price-font">{{ moneyFormat(memberStore.info?.money).split('.')[1] }}</text>
</view>
</view>
<view class="mt-[50rpx] flex justify-between" v-if="Object.keys(cashOutConfigObj).length && (systemStore.siteAddons.includes('recharge') || cashOutConfigObj.is_open == 1)">
<button :class="{'!w-[630rpx]': cashOutConfigObj.is_open != 1}" class="w-[280rpx] h-[66rpx] rounded-[40rpx] text-[30rpx] !bg-[#fff] !text-[var(--primary-color)] leading-[64rpx] !m-0 border-[2rpx] border-[var(--primary-color)] border-solid box-border" shape="circle" v-if="systemStore.siteAddons.includes('recharge')"
@click="redirect({url: '/addon/recharge/pages/recharge'})">充值</button>
<view v-if="cashOutConfigObj.is_open == 1" :class="{'!w-[630rpx]': !systemStore.siteAddons.includes('recharge')}" class="text-center w-[280rpx] h-[66rpx] rounded-[40rpx] text-[30rpx] !text-[#fff] leading-[66rpx] !m-0"
<view class="mt-[60rpx] flex justify-around" v-if="Object.keys(cashOutConfigObj).length && (systemStore.siteAddons.includes('recharge') || cashOutConfigObj.is_open == 1)">
<block v-if="systemStore.siteAddons.includes('recharge')">
<button v-if="cashOutConfigObj.is_open != 1" class="!w-[340rpx] h-[70rpx] font-500 rounded-full text-[26rpx] primary-btn-bg !text-[#fff] flex-center !m-0" hover-class="none" shape="circle" @click="redirect({url: '/addon/recharge/pages/recharge'})">充值</button>
<button v-else class="w-[250rpx] h-[70rpx] rounded-[40rpx] text-[26rpx] font-500 !bg-[#fff] !text-[var(--primary-color)] flex-center !m-0 border-[2rpx] border-[var(--primary-color)] border-solid box-border" hover-class="none" shape="circle" @click="redirect({url: '/addon/recharge/pages/recharge'})">充值</button>
</block>
<view v-if="cashOutConfigObj.is_open == 1" :class="{'!w-[340rpx]': !systemStore.siteAddons.includes('recharge')}" class="text-center w-[250rpx] h-[70rpx] rounded-[40rpx] text-[26rpx] !text-[#fff] flex-center font-500 !m-0"
style="background: linear-gradient( 94deg, #FB7939 0%, #FE120E 99%), #EF000C;" @click="applyCashOut">{{t('cashOut')}}</view>
</view>
</view>
<view class="px-[var(--sidebar-m)] box-border mt-[20rpx] flex justify-between items-center">
<scroll-view :scroll-x="true" scroll-with-animation :scroll-into-view="'id' + (subActive>3 ? subActive - 2 : 0)" class="!h-[100%] flex-1">
<view class="flex whitespace-nowrap">
<view :id="'id' + index" class="text-[26rpx] leading-[70rpx] text-[#666] font-400" :class="{ 'class-select': fromType === item.key,'ml-30rpx':index}" @click="fromTypeFn(item.key,index)" v-for="(item, index) in accountTypeList">{{ item.name }}</view>
</view>
</scroll-view>
<view class="flex items-center" @click="handleSelect">
<view class="text-[26rpx] text-[#333] mr-[10rpx]">日期</view>
<view class="nc-iconfont nc-icon-riliV6xx !text-[28rpx] leading-[36rpx]"></view>
<view class="mt-[30rpx] bg-[var(--page-bg-color)] tab-style-1">
<view class="tab-left">
<view class="tab-left-item" :class="{ 'class-select': fromType === item.key}" @click="fromTypeFn(item.key,index)" v-for="(item, index) in accountTypeList">{{ item.name }}</view>
</view>
<view class="tab-right" @click="handleSelect">
<view class="tab-right-date">日期</view>
<view class="nc-iconfont nc-icon-a-riliV6xx-36 tab-right-icon"></view>
</view>
</view>
</view>
<mescroll-body ref="mescrollRef" @init="mescrollInit" :down="{ use: false }" height="auto" @up="getListFn" :top="mescrollTop">
<view class="sidebar-marign pt-[20rpx] body-bottom" v-if="list.length">
<view v-for="(item,index) in list" :key="item.id" class="w-full h-[120rpx] flex justify-between items-center bg-[#fff] box-border p-[20rpx] rounded-[16rpx]" :class="{'mt-[20rpx]':index>0}">
<view class="sidebar-margin pt-[10rpx] body-bottom" v-if="list.length">
<view v-for="(item,index) in list" :key="item.id" class="w-full h-[140rpx] flex justify-between items-center box-border card-template" :class="{'mt-[var(--top-m)]':index>0}">
<view class="flex items-center">
<view class="w-[80rpx] h-[80rpx] text-center rounded-[40rpx] text-[40rpx] font-bold leading-[80rpx] text-[#fff]"
<view class="w-[80rpx] h-[80rpx] text-center rounded-[40rpx] text-[40rpx] font-500 leading-[80rpx] text-[#fff]"
:class="{'bg-[#EF000C]' :item.account_data > 0&&item.account_type!='money', 'bg-[#03B521]':item.account_data <= 0&&item.account_type!='money','bg-[#1379FF]':item.account_type=='money'}">
{{item.account_type=='money'?'提':item.account_data > 0?'收':'支'}}
</view>
<view class="flex flex-col ml-[20rpx]">
<view class="text-[#000] text-[26rpx] leading-[36rpx]">{{item.from_type_name}}</view>
<view class="text-[#999] text-[24rpx] leading-[34rpx] mt-[4rpx] font-400">{{item.create_time}}</view>
<view class="text-[#333] text-[28rpx] leading-[36rpx]">{{item.from_type_name}}</view>
<view class="text-[var(--text-color-light9)] text-[24rpx] mt-[12rpx]">{{item.create_time}}</view>
</view>
</view>
<view class="text-right">
<view class="text-[36rpx] leading-[50rpx]"
<view class="text-[36rpx] leading-[40rpx] price-font"
:class="{'text-[#EF000C]' :item.account_data > 0&&item.account_type!='money', 'text-[#03B521]':item.account_data <= 0&&item.account_type!='money'}">{{ item.account_data > 0 ? '+' + item.account_data : item.account_data }}</view>
<view class="text-[#999] text-[24rpx] leading-[34rpx] mt-[4rpx] font-400">
<text class="mr-[15rpx]">剩余余额</text>
<text>{{item.account_sum}}</text>
</view>
</view>
</view>
</view>
<view class="box-border pt-[20rpx] px-[30rpx] body-bottom" :style="{'height':'calc(100vh - '+mescrollTop +')'}" v-if="!list.length && !loading &&!listLoading">
<view class="h-full rounded-[16rpx] flex items-center justify-center">
<mescroll-empty></mescroll-empty>
</view>
</view>
<mescroll-empty v-if="!list.length && !loading &&!listLoading"></mescroll-empty>
</mescroll-body>
<u-loading-page bg-color="rgb(248,248,248)" :loading="loading" loadingText="" fontSize="16" color="#303133"></u-loading-page>
<loading-page :loading="loading"></loading-page>
<!-- <pay ref="payRef" @close="rechargeLoading = false"></pay> -->
<!-- 时间选择 -->
<select-date ref="selectDateRef" @confirm="confirmFn" />
@ -99,9 +92,9 @@
let param = topTabarObj.setTopTabbarParam({title:'我的余额'})
/********* 自定义头部 - end ***********/
const cashOutConfigObj = reactive({})
const cashOutConfigObj: any = reactive({})
onShow(() => {
cashOutConfig().then((res) => {
cashOutConfig().then((res: any) => {
for (let key in res.data) {
cashOutConfigObj[key] = res.data[key];
}
@ -110,7 +103,7 @@
})
// 获取系统状态栏的高度
let menuButtonInfo:any = {};
let menuButtonInfo: any = {};
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
menuButtonInfo = uni.getMenuButtonBoundingClientRect();
@ -127,15 +120,15 @@
const mescrollTop = computed(()=>{
if(Object.keys(cashOutConfigObj).length && (systemStore.siteAddons.includes('recharge') || cashOutConfigObj.is_open == 1)){
if(Object.keys(menuButtonInfo).length){
return (pxToRpx(Number(menuButtonInfo.height)) + pxToRpx(menuButtonInfo.top) +pxToRpx(8)+669)+'rpx'
return (pxToRpx(Number(menuButtonInfo.height)) + pxToRpx(menuButtonInfo.top) +pxToRpx(8)+708)+'rpx'
}else{
return '669rpx'
return '708rpx'
}
}else {
if(Object.keys(menuButtonInfo).length){
return (pxToRpx(Number(menuButtonInfo.height)) + pxToRpx(menuButtonInfo.top) +pxToRpx(8)+566)+'rpx'
return (pxToRpx(Number(menuButtonInfo.height)) + pxToRpx(menuButtonInfo.top) +pxToRpx(8)+590.39)+'rpx'
}else{
return '566rpx'
return '590.39rpx'
}
}
})
@ -151,7 +144,7 @@
const create_time = ref([])
//来源类型
const subActive = ref(0)
const fromTypeFn = (key,index)=>{
const fromTypeFn = (key: any,index: any)=>{
fromType.value = key
subActive.value = index
getMescroll().resetUpScroll();
@ -181,7 +174,6 @@
limit: mescroll.size,
trade_type:fromType.value,
create_time: create_time.value
};
interface acceptingDataStructure {
data : acceptingDataItemStructure,
@ -193,7 +185,7 @@
[propName : string] : number | string | object
}
getBalanceListAll(data).then((res : acceptingDataStructure) => {
getBalanceListAll(data).then((res : any) => {
let newArr = res.data.data;
mescroll.endSuccess(newArr.length);
//设置列表数据
@ -215,7 +207,7 @@
selectDateRef.value.show = true
}
// 确定时间筛选
const confirmFn = (data) =>{
const confirmFn = (data: any) =>{
create_time.value = data;
list.value = []
getMescroll().resetUpScroll();
@ -223,22 +215,6 @@
</script>
<style lang="scss" scoped>
.class-select {
position: relative;
font-weight: 500;
color: var(--primary-color);
&::before {
content: "";
position: absolute;
bottom: 0;
height: 4rpx;
border-radius: 4rpx;
background-color: var(--primary-color);
width: 40rpx;
left: 50%;
transform: translateX(-50%);
}
}
:deep(.uni-scroll-view){
overflow: auto hidden !important;
}

29
uni-app/src/app/pages/member/cash_out.vue
View File

@ -1,14 +1,14 @@
<template>
<view class="member-record-list" :style="themeColor()">
<view class="min-h-[100vh] bg-[var(--page-bg-color)] overflow-hidden" :style="themeColor()">
<mescroll-body ref="mescrollRef" @init="mescrollInit" :down="{ use: false }" @up="getCashOutListFn">
<view v-for="(item,index) in cashOutList" :key="item.id" class="member-record-item" @click="toDetailFn(item)">
<view class="name">{{item.transfer_type_name}}</view>
<view class="desc">{{t('applyTime')}}: {{item.create_time}}</view>
<view class="desc">{{ item.status != -1 ? currentStatusDesc(item.status) : item.refuse_reason}}</view>
<view class="money" :class="item.apply_money > 0 ? 'text-active' : ''">
{{ item.apply_money > 0 ? '+' + item.apply_money : item.apply_money }}
<view v-for="(item,index) in cashOutList" :key="item.id" class="sidebar-margin card-template mt-[var(--top-m)]" @click="toDetailFn(item)">
<view class="flex items-center justify-between mb-[20rpx]">
<view class="text-[36rpx] font-500 price-font" :class="item.apply_money > 0 ? 'text-active' : ''">{{ item.apply_money }}</view>
<view class="leading-[38rpx] text-[26rpx] ">{{ item.status_name }}</view>
</view>
<view class="state">{{ item.status_name }}</view>
<view class="text-[24rpx] text-[var(--text-color-light6)] mb-[10rpx] leading-[34rpx]">{{ t('rechargeType') }} {{item.transfer_type_name}}</view>
<view class="text-[24rpx] text-[var(--text-color-light6)] mb-[10rpx] leading-[34rpx]">{{t('applyTime')}}: {{item.create_time}}</view>
<view class="text-[24rpx] text-[var(--text-color-light9)] leading-[34rpx]">{{ item.status != -1 ? currentStatusDesc(item.status) : item.refuse_reason}}</view>
</view>
<mescroll-empty v-if="!cashOutList.length && loading" :option="{tip : t('emptyTip')}"></mescroll-empty>
</mescroll-body>
@ -26,12 +26,11 @@ import useMescroll from '@/components/mescroll/hooks/useMescroll.js';
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app';
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom);
const cashOutList = ref<Array<any>>([]);
const mescrollRef = ref(null);
const loading = ref<boolean>(false);
let account_type = uni.getStorageSync('cashOutAccountType')
const currentStatusDesc = (status) =>{
const currentStatusDesc = (status: any) =>{
switch(status){
case 1:
return t('toBeReviewed')
@ -44,13 +43,13 @@ const currentStatusDesc = (status) =>{
}
}
const getCashOutListFn = (mescroll)=>{
const getCashOutListFn = (mescroll: any)=>{
let data:any = {}
loading.value = false;
data.page = mescroll.num;
data.page_size = mescroll.size;
data.account_type = account_type;
getCashOutList(data).then((res) => {
getCashOutList(data).then((res: any) => {
let newArr = res.data.data;
mescroll.endSuccess(newArr.length);
//设置列表数据
@ -65,11 +64,13 @@ const getCashOutListFn = (mescroll)=>{
})
}
const toDetailFn = (data)=>{
const toDetailFn = (data: any)=>{
redirect({ url: '/app/pages/member/cash_out_detail', param: { id: data.id }});
}
</script>
<style lang="scss">
@import '@/styles/member_record_list.scss';
.text-active{
color: #FF0D3E;
}
</style>

106
uni-app/src/app/pages/member/cash_out_detail.vue
View File

@ -1,51 +1,53 @@
<template>
<view class="member-record-detail" :style="themeColor()">
<view class="min-h-[100vh] bg-[var(--page-bg-color)] overflow-hidden" :style="themeColor()">
<block v-if="!loading">
<view class="money-wrap">
<text>-{{ cashOutInfo.apply_money }}</text>
<text>{{ cashOutInfo.status_name }}</text>
</view>
<!-- 状态0待审核1.待转账2已转账 -1拒绝' -->
<view class="item">
<view class="line-wrap">
<text class="label w-[200rpx]">{{t('cashOutNo')}}</text>
<text class="value">{{ cashOutInfo.cash_out_no }}</text>
<view class="sidebar-margin card-template mt-[20rpx] !pt-[60rpx] !pb-[40rpx]">
<view class="flex items-center flex-col mb-[80rpx]">
<text class="text-[60rpx] font-bold price-font mb-[20rpx]">-{{ cashOutInfo.apply_money }}</text>
<text class="text-[28rpx] text-[#333]" :class="{'text-primary': cashOutInfo.status == 1}">{{ cashOutInfo.status_name }}</text>
</view>
<view class="line-wrap">
<text class="label w-[200rpx]">{{t('serviceMoney')}}</text>
<text class="value">￥{{ cashOutInfo.service_money }}</text>
</view>
<view class="line-wrap">
<text class="label w-[200rpx]">{{t('createTime')}}</text>
<text class="value">{{ cashOutInfo.create_time }}</text>
</view>
<view class="line-wrap" v-if="cashOutInfo.status && cashOutInfo.audit_time">
<text class="label w-[200rpx]">{{t('auditTime')}}</text>
<text class="value">{{ cashOutInfo.audit_time }}</text>
</view>
<view class="line-wrap" v-if="cashOutInfo.transfer_bank">
<text class="label w-[200rpx]">{{t('transferBank')}}</text>
<text class="value truncate">{{ cashOutInfo.transfer_bank }}</text>
</view>
<view class="line-wrap">
<text class="label w-[200rpx]">{{t('transferAccount')}}</text>
<text class="value truncate">{{ cashOutInfo.transfer_type == 'wechatpay' ? '微信' : cashOutInfo.transfer_account }}</text>
</view>
<view class="line-wrap" v-if="cashOutInfo.status == -1 && cashOutInfo.refuse_reason">
<text class="label w-[200rpx]">{{t('refuseReason')}}</text>
<text class="value truncate">{{ cashOutInfo.refuse_reason }}</text>
</view>
<view class="line-wrap" v-if="cashOutInfo.status == 2">
<text class="label w-[200rpx]">{{t('transferTypeName')}}</text>
<text class="value truncate">{{ cashOutInfo.transfer_type_name }}</text>
</view>
<view class="line-wrap" v-if="cashOutInfo.status == 2 && cashOutInfo.transfer_time">
<text class="label w-[200rpx]">{{t('transferTime')}}</text>
<text class="value truncate">{{ cashOutInfo.transfer_time }}</text>
<!-- 状态1.待审核2.待转账 3.已转账 -1拒绝' -->
<view>
<view class="flex justify-between text-[28rpx] mt-[34rpx] leading-[32rpx]">
<text class="text-[#333] w-[200rpx]">{{t('cashOutNo')}}</text>
<text class="text-[#333]">{{ cashOutInfo.cash_out_no }}</text>
</view>
<view class="flex justify-between text-[28rpx] mt-[34rpx] leading-[32rpx]">
<text class="text-[#333] w-[200rpx]">{{t('serviceMoney')}}</text>
<text class="text-[#333]">￥{{ cashOutInfo.service_money }}</text>
</view>
<view class="flex justify-between text-[28rpx] mt-[34rpx] leading-[32rpx]">
<text class="text-[#333] w-[200rpx]">{{t('createTime')}}</text>
<text class="text-[#333]">{{ cashOutInfo.create_time }}</text>
</view>
<view class="flex justify-between text-[28rpx] mt-[34rpx] leading-[32rpx]" v-if="cashOutInfo.status && cashOutInfo.audit_time">
<text class="text-[#333] w-[200rpx]">{{t('auditTime')}}</text>
<text class="text-[#333]">{{ cashOutInfo.audit_time }}</text>
</view>
<view class="flex justify-between text-[28rpx] mt-[34rpx] leading-[32rpx]" v-if="cashOutInfo.transfer_bank">
<text class="text-[#333] w-[200rpx]">{{t('transferBank')}}</text>
<text class="text-[#333] truncate">{{ cashOutInfo.transfer_bank }}</text>
</view>
<view class="flex justify-between text-[28rpx] mt-[34rpx] leading-[32rpx]">
<text class="text-[#333] w-[200rpx]">{{t('transferAccount')}}</text>
<text class="text-[#333] truncate">{{ cashOutInfo.transfer_type == 'wechatpay' ? '微信' : cashOutInfo.transfer_account }}</text>
</view>
<view class="flex justify-between text-[28rpx] mt-[34rpx] leading-[32rpx]" v-if="cashOutInfo.status == -1 && cashOutInfo.refuse_reason">
<text class="text-[#333] w-[200rpx]">{{t('refuseReason')}}</text>
<text class="text-[#333] truncate">{{ cashOutInfo.refuse_reason }}</text>
</view>
<view class="flex justify-between text-[28rpx] mt-[34rpx] leading-[32rpx]" v-if="cashOutInfo.status == 3">
<text class="text-[#333] w-[200rpx]">{{t('transferTypeName')}}</text>
<text class="text-[#333] truncate">{{ cashOutInfo.transfer_type_name }}</text>
</view>
<view class="flex justify-between text-[28rpx] mt-[34rpx] leading-[32rpx]" v-if="cashOutInfo.status == 3 && cashOutInfo.transfer_time">
<text class="text-[#333] w-[200rpx]">{{t('transferTime')}}</text>
<text class="text-[#333] truncate">{{ cashOutInfo.transfer_time }}</text>
</view>
</view>
</view>
</block>
<u-loading-page bg-color="rgb(248,248,248)" :loading="loading" loadingText="" fontSize="16" color="#303133"></u-loading-page>
<loading-page :loading="loading"></loading-page>
</view>
</template>
@ -53,20 +55,29 @@
import { reactive, ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { t } from '@/locale'
import { redirect, img } from '@/utils/common';
import { redirect, img, goback } from '@/utils/common';
import { getCashOutDetail } from '@/app/api/member';
const cashOutInfo = ref({});
const loading = ref<boolean>(true);
onLoad((option: any) => {
let id = option.id || "";
getCashoutAccountListFn(id)
let id = option.id || "";
if(id){
getCashoutAccountListFn(id)
}else{
let parameter = {
url:'/app/pages/member/cash_out',
title: '提现详情不存在',
mode: 'reLaunch'
};
goback(parameter);
}
})
const getCashoutAccountListFn = (id) => {
const getCashoutAccountListFn = (id: any) => {
loading.value = true;
getCashOutDetail(id).then((res) => {
getCashOutDetail(id).then((res: any) => {
cashOutInfo.value = res.data;
loading.value = false;
}).catch(() => {
@ -76,5 +87,4 @@ const getCashoutAccountListFn = (id) => {
</script>
<style lang="scss">
@import '@/styles/member_record_detail.scss';
</style>

76
uni-app/src/app/pages/member/commission.vue
View File

@ -1,74 +1,68 @@
<template>
<view class="bg-[#F6F6F6] min-h-[100vh] w-full" :style="themeColor()" v-if="memberStore.info">
<view class="fixed w-full z-2 !bg-[#F6F6F6]">
<view class="bg-[var(--page-bg-color)] min-h-[100vh] w-full" :style="themeColor()" v-if="memberStore.info">
<view class="fixed w-full z-2 !bg-[var(--page-bg-color)]">
<view class="pb-[272rpx]" :style="headerStyle">
<!-- #ifdef MP-WEIXIN -->
<top-tabbar :data="param" class="top-header"/>
<!-- #endif -->
</view>
<view class="mt-[-232rpx] sidebar-marign" :style="{ backgroundImage: 'url(' + img('static/resource/images/member/commission/account_bg.png') + ')',backgroundRepeat:'no-repeat',backgroundSize:'100% 100%'}">
<view class="mt-[-232rpx] sidebar-margin rounded-[var(--rounded-big)]" :style="{ backgroundImage: 'url(' + img('static/resource/images/member/commission/account_bg.png') + ')',backgroundRepeat:'no-repeat',backgroundSize:'100% 100%'}">
<view class="pt-[40rpx]">
<view class="flex items-center justify-between px-[30rpx]">
<view>
<view class="text-[26rpx] font-400 text-[#fff] leading-[36rpx] mb-[16rpx]">{{t('accountCommission')}}</view>
<view class="font-bold text-[#fff] flex items-baseline">
<text class="text-[56rpx] h-[72rpx] price-font">{{ memberStore.info ? (moneyFormat(memberStore.info.commission).split(".")[0]+'.') : '0.' }}</text>
<text class="text-[44rpx] h-[56rpx] price-font">{{ memberStore.info ? moneyFormat(memberStore.info.commission).split(".")[1] : '00' }}</text>
<view class="text-[26rpx] font-400 text-[#fff] mb-[20rpx]">{{t('accountCommission')}}</view>
<view class="font-bold text-[56rpx] price-font text-[#fff] flex items-baseline">
{{ memberStore.info ? moneyFormat(memberStore.info.commission) : '0.00' }}
</view>
</view>
<button @click="applyCashOut" hover-class="none" class="bg-[#fff] rounded-[100rpx] w-[150rpx] h-[66rpx] leading-[66rpx] text-[#EF000C] m-[0] border-[0] text-[32rpx]">{{t('transferMoney')}}</button>
<button @click="applyCashOut" hover-class="none" class="bg-[#fff] rounded-[100rpx] w-[160rpx] h-[70rpx] flex-center text-[#EF000C] m-[0] border-[0] text-[26rpx]">{{t('transferMoney')}}</button>
</view>
<view class="flex items-center mt-[68rpx] px-[30rpx] border-[0] border-t-[2rpx] border-solid border-[rgba(255,255,255,.3)] h-[126rpx]">
<view class="flex items-center mt-[60rpx] px-[30rpx] pb-[10rpx] border-[0] border-t-[2rpx] border-solid border-[rgba(255,255,255,.1)] h-[126rpx]">
<view class="flex-1">
<view class="font-bold text-[#fff] text-[36rpx] leading-[44rpx] mb-[6rpx] price-font">
<view class="font-bold text-[#fff] text-[40rpx] mb-[10rpx] price-font">
{{ moneyFormat(memberStore.info?.commission_get)|| '0.00' }}
</view>
<view class="text-[26rpx] text-[#fff] leading-[36rpx]">{{ t('commission') }}</view>
<view class="text-[24rpx] text-[#fff]">{{ t('commission') }}</view>
</view>
<view class="flex-1">
<view class="font-bold text-[#fff] text-[36rpx] leading-[44rpx] mb-[6rpx] price-font">
<view class="font-bold text-[#fff] text-[40rpx] mb-[10rpx] price-font">
{{ moneyFormat(memberStore.info?.commission_cash_outing)|| '0.00' }}
</view>
<view class="text-[26rpx] text-[#fff] leading-[36rpx]">{{ t('money') }}</view>
<view class="text-[24rpx] text-[#fff]">{{ t('money') }}</view>
</view>
</view>
</view>
</view>
<view class="mt-[40rpx] tab-style-1">
<view class="mt-[30rpx] tab-style-1">
<view class="tab-left">
<view class="tab-left-item" :class="{ 'class-select': fromType.from_type === item.from_type && fromType.account_data_gt === item.account_data_gt }" @click="fromTypeFn(item,index)" v-for="(item, index) in accountTypeList">{{ item.name }}</view>
</view>
<view class="tab-right" @click="handleSelect">
<view class="tab-right-date">日期</view>
<view class="nc-iconfont nc-icon-riliV6xx tab-right-icon"></view>
<view class="nc-iconfont nc-icon-a-riliV6xx-36 tab-right-icon"></view>
</view>
</view>
</view>
<mescroll-body ref="mescrollRef" @init="mescrollInit" :down="{ use: false }" @up="geCommissionListFn" :top="mescrollTop">
<view class="px-[var(--sidebar-m)] pt-[20rpx] body-bottom" v-if="list.length">
<view v-for="(item,index) in list" :key="item.id" class="w-full h-[140rpx] flex justify-between items-center card-template" :class="{'mt-[20rpx]':index}">
<view class="flex items-center">
<view class="w-[80rpx] h-[80rpx] text-center rounded-[40rpx] text-[40rpx] font-500 leading-[80rpx] text-[#fff]"
:class="{'bg-[#EF000C]' :item.account_data > 0, 'bg-[#1379FF]':item.account_data <= 0 }">
{{item.account_data > 0?'收':'提'}}
</view>
<view class="flex flex-col ml-[20rpx]">
<view class="text-[#333] text-[26rpx] leading-[36rpx]">{{item.from_type_name}}</view>
<view class="text-[#8288A2] text-[24rpx] leading-[34rpx] mt-[4rpx] font-400">{{item.create_time}}</view>
</view>
<view class="px-[var(--sidebar-m)] pt-[10rpx] body-bottom" v-if="list.length">
<view v-for="(item,index) in list" :key="item.id" class="w-full h-[140rpx] flex justify-between items-center card-template" :class="{'mt-[var(--top-m)]':index}">
<view class="flex items-center">
<view class="w-[80rpx] h-[80rpx] rounded-[40rpx] text-[40rpx] font-500 text-[#fff] flex items-center justify-center" :class="{'bg-[#EF000C]' :item.account_data > 0, 'bg-[#1379FF]':item.account_data <= 0 }">
{{item.account_data > 0?'收':'提'}}
</view>
<view class="flex flex-col ml-[20rpx]">
<view class="text-[#333] text-[28rpx] leading-[36rpx]">{{item.from_type_name}}</view>
<view class="text-[var(--text-color-light9)] text-[24rpx] mt-[12rpx]">{{item.create_time}}</view>
</view>
<view class="text-[36rpx] leading-[50rpx]" :class="{'text-[#EF000C]' :item.account_data > 0, 'text-[#333]':item.account_data <= 0 }">{{ item.account_data > 0 ? '+' + item.account_data : item.account_data }}</view>
</view>
<view class="text-[36rpx] leading-[50rpx] price-font" :class="{'text-[#EF000C]' :item.account_data > 0, 'text-[#1379FF]':item.account_data <= 0 }">{{ item.account_data > 0 ? '+' + item.account_data : item.account_data }}</view>
</view>
<view class="box-border pt-[20rpx] px-[30rpx] body-bottom" :style="{'height':'calc(100vh - '+ mescrollTop +')'}" v-if="!list.length && !loading &&!listLoading">
<view class="h-full rounded-[16rpx] flex items-center justify-center">
<mescroll-empty></mescroll-empty>
</view>
</view>
</mescroll-body>
<u-loading-page bg-color="rgb(248,248,248)" :loading="loading" loadingText="" fontSize="16" color="#303133"></u-loading-page>
<!-- 时间选择 -->
<select-date ref="selectDateRef" @confirm="confirmFn" />
</view>
<mescroll-empty v-if="!list.length && !loading &&!listLoading"></mescroll-empty>
</mescroll-body>
<loading-page :loading="loading"></loading-page>
<!-- 时间选择 -->
<select-date ref="selectDateRef" @confirm="confirmFn" />
</view>
</template>
@ -100,7 +94,7 @@
/********* 自定义头部 - end ***********/
// 获取系统状态栏的高度
let menuButtonInfo:any = {};
let menuButtonInfo: any = {};
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
menuButtonInfo = uni.getMenuButtonBoundingClientRect();
@ -115,7 +109,7 @@
})
// 16为自定头部的padding-bottom
const mescrollTop = computed(()=>{
return Object.keys(menuButtonInfo).length? (Number(menuButtonInfo.height) * 2 + menuButtonInfo.top * 2 + 486 + 16)+'rpx':'504rpx'
return Object.keys(menuButtonInfo).length? (Number(menuButtonInfo.height) * 2 + menuButtonInfo.top * 2 + 470 + 16)+'rpx':'470rpx'
})
//来源类型
@ -139,7 +133,7 @@
fromType.value.account_data_gt = data.account_data_gt
getMescroll().resetUpScroll();
}
const geCommissionListFn = (mescroll) => {
const geCommissionListFn = (mescroll: any) => {
listLoading.value = true;
let data : Object = {
page: mescroll.num,
@ -149,7 +143,7 @@
create_time:create_time.value
}
getMemberCommission(data).then((res:any) => {
let newArr = res.data.data;-
let newArr = res.data.data;
mescroll.endSuccess(newArr.length);
//设置列表数据
if (mescroll.num == 1) {
@ -170,7 +164,7 @@ const handleSelect = () =>{
selectDateRef.value.show = true
}
// 确定时间筛选
const confirmFn = (data) =>{
const confirmFn = (data: any) =>{
create_time.value = data;
list.value = []
getMescroll().resetUpScroll();

20
uni-app/src/app/pages/member/components/select-date.vue
View File

@ -7,12 +7,12 @@
</view>
<view class="px-[30rpx] mb-[20rpx]">
<view class="flex items-center justify-between mb-[30rpx]">
<view class="w-[160rpx] h-[60rpx] leading-[60rpx] rounded-[30rpx] bg-[#F4F6FA] text-center text-[26rpx] text-[#666] border-[2rpx] border-solid border-[#F4F6FA]" v-for="(item,index) in curselectDate" :key="'a'+index" :class="{'text-primary !border-[var(--primary-color)] !bg-[rgba(239,0,12,0.04)]': currentValue.type == item.type}" @click="loadDateFn(item)">{{item.name}}</view>
<view class="w-[160rpx] h-[60rpx] leading-[60rpx] rounded-[30rpx] bg-[#F4F6FA] text-center text-[26rpx] text-[var(--text-color-light6)] border-[2rpx] border-solid border-[#F4F6FA]" v-for="(item,index) in curselectDate" :key="'a'+index" :class="{'text-primary !border-[var(--primary-color)] !bg-[rgba(239,0,12,0.04)]': currentValue.type == item.type}" @click="loadDateFn(item)">{{item.name}}</view>
</view>
<view class="flex items-center justify-between">
<view class="w-[316rpx] h-[60rpx] leading-[60rpx] rounded-[30rpx] bg-[#F4F6FA] text-center text-[26rpx] text-[#666] border-[2rpx] border-solid border-[#F4F6FA]" :class="{'text-primary !border-[var(--primary-color)] !bg-[rgba(239,0,12,0.04)]': currentValue.type == 'first'}" @click="currentValue.type = 'first'">{{dateList.nowDate[0]}}</view>
<view class="w-[316rpx] h-[60rpx] leading-[60rpx] rounded-[30rpx] bg-[#F4F6FA] text-center text-[26rpx] text-[var(--text-color-light6)] border-[2rpx] border-solid border-[#F4F6FA]" :class="{'text-primary !border-[var(--primary-color)] !bg-[rgba(239,0,12,0.04)]': currentValue.type == 'first'}" @click="currentValue.type = 'first'">{{dateList.nowDate[0]}}</view>
<view class="nc-iconfont nc-icon-jianV6xx"></view>
<view class="w-[316rpx] h-[60rpx] leading-[60rpx] rounded-[30rpx] bg-[#F4F6FA] text-center text-[26rpx] text-[#666] border-[2rpx] border-solid border-[#F4F6FA]" :class="{'text-primary !border-[var(--primary-color)] !bg-[rgba(239,0,12,0.04)]': currentValue.type == 'second'}" @click="currentValue.type = 'second'">{{dateList.nowDate[1]}}</view>
<view class="w-[316rpx] h-[60rpx] leading-[60rpx] rounded-[30rpx] bg-[#F4F6FA] text-center text-[26rpx] text-[var(--text-color-light6)] border-[2rpx] border-solid border-[#F4F6FA]" :class="{'text-primary !border-[var(--primary-color)] !bg-[rgba(239,0,12,0.04)]': currentValue.type == 'second'}" @click="currentValue.type = 'second'">{{dateList.nowDate[1]}}</view>
</view>
</view>
<view class="h-[396rpx]">
@ -29,8 +29,8 @@
</picker-view>
</view>
<view class="px-[30rpx] pb-[30rpx] pt-[20rpx] flex justify-between">
<button class="w-[330rpx] h-[88rpx] text-[var(--primary-color)] text-[32rpx] leading-[84rpx] border-[2rpx] border-solid border-[var(--primary-color)] rounded-[100rpx] bg-transparent" @click="reset">重置</button>
<button class="w-[330rpx] h-[88rpx] text-[#fff] text-[32rpx] leading-[88rpx] border-[0] rounded-[100rpx] primary-btn-bg" shape="circle" @click="save">确定</button>
<button class="w-[330rpx] h-[80rpx] font-500 text-[var(--primary-color)] text-[26rpx] leading-[76rpx] border-[2rpx] border-solid border-[var(--primary-color)] rounded-[100rpx] bg-transparent" @click="reset">重置</button>
<button class="w-[330rpx] h-[80rpx] font-500 text-[#fff] text-[26rpx] leading-[80rpx] border-[0] rounded-[100rpx] primary-btn-bg" shape="circle" @click="save">确定</button>
</view>
</view>
</u-popup>
@ -42,7 +42,7 @@ import { ref,reactive } from 'vue'
const emits = defineEmits(['confirm'])
// 弹框时间选择
const show = ref(false)
const create_time = ref([])
const create_time: any = ref([])
// 日期
const init = () =>{
const date = new Date();
@ -88,11 +88,11 @@ const init = () =>{
lastYear: formatDate(lastYear)
}
}
const getDaysInMonth = (year, month) => {
const getDaysInMonth = (year: any, month: any) => {
let date = new Date(year, month, 0).getDate()
return date
}
const getDaysCount = (year, month) =>{
const getDaysCount = (year: any, month: any) =>{
let count = getDaysInMonth(year, month)
let days = []
for (let i = 1; i <= count; i++) {
@ -108,7 +108,7 @@ const dateList = reactive({
nowDate:[init().nowDate,init().nowDate] //当前选中日期
})
const bindChange = (e) =>{
const bindChange = (e: any) =>{
const val = e.detail.value
let year = dateList.years[val[0]]
let month= dateList.months[val[1]]
@ -148,7 +148,7 @@ const currentValue = ref({
type: 'first',
time: []
})
const loadDateFn = (data) =>{
const loadDateFn = (data: any) =>{
currentValue.value.type = data.type
currentValue.value.time = data.time
}

22
uni-app/src/app/pages/member/contact.vue
View File

@ -1,15 +1,13 @@
<template>
<view class="flex items-center justify-center min-h-[100vh]" :style="themeColor()">
<view class="contact-wrap pt-[5%]">
<view class="min-h-[100vh]" :style="themeColor()">
<view class="contact-wrap pt-[22%]">
<image :src="img('static/resource/images/member/contact_service.png')" mode="widthFix" />
<view class="mt-[40rpx] text-[28rpx]">
欢迎您联系我们，提供您宝贵的意见！
</view>
<view class="mt-[40rpx] text-[28rpx]">欢迎您联系我们，提供您宝贵的意见！</view>
<nc-contact
:send-message-title="sendMessageTitle"
:send-message-path="sendMessagePath"
:send-message-img="sendMessageImg">
<button type="primary" class="btn-wrap primary-btn-bg">{{ t('customerService') }}</button>
<button type="primary" class="btn-wrap font-500 primary-btn-bg">{{ t('customerService') }}</button>
</nc-contact>
</view>
</view>
@ -38,12 +36,12 @@
}
.btn-wrap {
margin-top: 120rpx;
width: 530rpx;
height: 88rpx;
font-size: 32rpx;
border-radius: 50rpx;
line-height: 88rpx;
margin-top: 100rpx;
width: 500rpx;
height: 80rpx;
font-size: 26rpx;
border-radius: 100rpx;
line-height: 80rpx;
}
}
</style>

55
uni-app/src/app/pages/member/detailed_account.vue
View File

@ -1,34 +1,35 @@
<template>
<view class="min-h-[100vh] bg-[#F6F6F6] overflow-hidden" :style="themeColor()">
<view class="min-h-[100vh] bg-[var(--page-bg-color)] overflow-hidden" :style="themeColor()">
<view class="fixed left-0 right-0 top-0 z-99">
<view class="bg-[#fff] px-[var(--sidebar-m)] h-[88rpx] flex items-center">
<view class="flex-1 flex items-center h-[60rpx] bg-[#F8F9FD] rounded-[30rpx] px-[20rpx]">
<u-input class="flex-1" maxlength="50" v-model="keyword" @confirm="searchTypeFn()" placeholder="请输入搜索关键词" placeholderClass="text-[#999] text-[24rpx]" fontSize="26rpx" clearable border="none"></u-input>
<text class="nc-iconfont nc-icon-sousuo-duanV6xx1 text-[28rpx] ml-[32rpx] !text-[#999]" @click="searchTypeFn()"></text>
<view class="bg-[#fff] px-[var(--sidebar-m)] py-[14rpx] flex items-center">
<view class="search-input">
<text class="nc-iconfont nc-icon-sousuo-duanV6xx1 btn" @click="searchTypeFn()"></text>
<input class="input" maxlength="50" type="text" v-model="keyword" placeholder="请输入搜索关键词" placeholderClass="text-[var(--text-color-light9)] text-[24rpx]" confirm-type="search" @confirm="searchTypeFn()">
<text v-if="keyword" class="nc-iconfont nc-icon-cuohaoV6xx1 clear" @click="keyword=''"></text>
</view>
</view>
<view class="tab-style-1 pt-[14rpx] bg-[#fff]">
<view class="tab-style-1 pt-[4rpx] bg-[#fff]">
<view class="tab-left">
<view class="tab-left-item" :class="{'!text-primary class-select':fromType.from_type === item.from_type && fromType.account_data_gt === item.account_data_gt}" v-for="(item,index) in accountTypeList" :key="index" @click="fromTypeFn(item,index)">{{ item.name }}</view>
</view>
<view class="tab-right" @click="handleSelect">
<view class="tab-right-date">日期</view>
<view class="nc-iconfont nc-icon-riliV6xx tab-right-icon"></view>
</view>
</view>
</view>
<mescroll-body ref="mescrollRef" @init="mescrollInit" :down="{ use: false }" @up="getListFn" top="196rpx">
<view v-for="(item,index) in list" :key="item.id" class="sidebar-marign mb-[20rpx] card-template relative">
<view class="flex items-center justify-between mb-[10rpx]">
<view class="text-[28rpx] font-500 text-[#333] leading-[40rpx]">{{item.from_type_name}}</view>
<view class="absolute right-[30rpx] top-[30rpx] text-[36rpx] font-500 text-[#03B521] leading-[50rpx]" :class="{'!text-[var(--price-text-color)]':item.account_data > 0}">{{ item.account_data > 0 ? '+' + item.account_data : item.account_data }}</view>
<view class="tab-right-date">日期</view>
<view class="nc-iconfont nc-icon-a-riliV6xx-36 tab-right-icon"></view>
</view>
<view class="text-[24rpx] leading-[34rpx] text-[#8288A2] mb-[10rpx]" v-if="item.memo">{{item.memo}}</view>
<view class="text-[24rpx] leading-[34rpx] text-[#8288A2]">{{item.create_time}}</view>
</view>
<view class="mx-[30rpx] rounded-[16rpx] noData flex items-center justify-center" v-if="!list.length && loading">
<mescroll-empty :option="{tip : tip}"></mescroll-empty>
</view>
<mescroll-body ref="mescrollRef" @init="mescrollInit" :down="{ use: false }" @up="getListFn" top="152rpx">
<view class="pt-[var(--top-m)] body-bottom" v-if="list.length">
<view v-for="(item,index) in list" :key="item.id" class="sidebar-margin mb-[var(--top-m)] card-template relative">
<view class="flex items-center justify-between mb-[20rpx]">
<view class="text-[28rpx] font-500 text-[#333] leading-[40rpx]">{{item.from_type_name}}</view>
<view class="absolute right-[30rpx] top-[30rpx] text-[36rpx] font-500 text-[#03B521] leading-[50rpx] price-font" :class="{'!text-[var(--price-text-color)]':item.account_data > 0}">{{ item.account_data > 0 ? '+' + item.account_data : item.account_data }}</view>
</view>
<view class="text-[24rpx] text-[var(--text-color-light6)] mb-[14rpx]" v-if="item.memo">{{item.memo}}</view>
<view class="text-[24rpx] text-[var(--text-color-light6)]">{{item.create_time}}</view>
</view>
</view>
<mescroll-empty :option="{tip : tip}" v-if="!list.length && loading"></mescroll-empty>
</mescroll-body>
<!-- 时间选择 -->
<select-date ref="selectDateRef" @confirm="confirmFn" />
@ -108,12 +109,12 @@
[propName : string] : number | string | object
}
let fnList = (params : any) => { };
let fnList:any = (params : any) => { };
if (type.value == 'balance') fnList = getBalanceList;
else if (type.value == 'money') fnList = getMoneyList;
else if (type.value == 'commission') fnList = getCommissionList;
fnList(data).then((res : acceptingDataStructure) => {
fnList(data).then((res : any) => {
let newArr = res.data.data;
mescroll.endSuccess(newArr.length);
//设置列表数据
@ -147,7 +148,7 @@ const handleSelect = () =>{
selectDateRef.value.show = true
}
// 确定时间筛选
const confirmFn = (data) =>{
const confirmFn = (data: any) =>{
create_time.value = data;
list.value = []
getMescroll().resetUpScroll();
@ -155,8 +156,8 @@ const confirmFn = (data) =>{
</script>
<style lang="scss">
.noData{
height: calc(100vh - 210rpx - constant(safe-area-inset-bottom));
height: calc(100vh - 210rpx - env(safe-area-inset-bottom));
}
.body-bottom{
padding-bottom: calc(20rpx + constant(safe-area-inset-bottom));
padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
}
</style>

15
uni-app/src/app/pages/member/index.vue
View File

@ -1,7 +1,6 @@
<template>
<view :style="themeColor()">
<u-loading-page :loading="diy.getLoading()" loadingText="" bg-color="#f7f7f7" />
<loading-page :loading="diy.getLoading()"></loading-page>
<view v-show="!diy.getLoading()">
@ -30,7 +29,7 @@
</template>
<script setup lang="ts">
import {ref, computed} from 'vue';
import {ref, computed,nextTick} from 'vue';
import {useDiy} from '@/hooks/useDiy'
import {redirect} from '@/utils/common';
import diyGroup from '@/addon/components/diy/group/index.vue'
@ -47,6 +46,8 @@
const diyGroupRef = ref(null)
const wxPrivacyPopupRef:any = ref(null)
// 监听页面加载
diy.onLoad();
@ -64,7 +65,15 @@
if (userInfo.value) {
useMemberStore().getMemberInfo()
}
// #ifdef MP
nextTick(()=>{
if(wxPrivacyPopupRef.value) wxPrivacyPopupRef.value.proactive();
})
// #endif
});
// 监听页面隐藏
diy.onHide();
// 监听页面卸载
diy.onUnload();

98
uni-app/src/app/pages/member/level.vue
View File

@ -1,39 +1,39 @@
<template>
<view :style="themeColor()">
<u-loading-page :loading="loading && memberInfo" loadingText="" bg-color="#f7f7f7"></u-loading-page>
<view v-if="!loading && memberInfo && list && list.length" class=" min-h-[100vh] overflow-hidden flex flex-col" :style="{backgroundColor: currLevelInfo.level_style.bg_color }">
<view :style="themeColor()" class="bg-[var(--page-bg-color)] min-h-[100vh] overflow-hidden">
<loading-page :loading="loading && memberInfo"></loading-page>
<view v-if="!loading && memberInfo && list && list.length" class="min-h-[100vh] overflow-hidden flex flex-col" :style="{backgroundColor: currLevelInfo.level_style.bg_color }">
<!-- #ifdef MP -->
<top-tabbar :data="topTabbarData" :scrollBool="topTabarObj.getScrollBool()"/>
<!-- #endif -->
<view>
<view class="pt-[40rpx] mb-[20rpx]">
<view class="pt-[40rpx] mb-[40rpx]">
<!-- 轮播图 -->
<view class="relative">
<swiper class="swiper ns-indicator-dots relative" :style="{ height: '300rpx' }" @change="swiperChange" :current = "swiperIndex" previous-margin="48rpx" next-margin="48rpx">
<swiper class="swiper ns-indicator-dots relative" :style="{ height: '300rpx' }" @change="swiperChange" :current = "swiperIndex" previous-margin="30rpx" next-margin="30rpx">
<swiper-item class="swiper-item" v-for="(item,index) in list" :key="item.id">
<view class="h-[300rpx] relative">
<view v-if="memberInfo.member_level == item.level_id && swiperIndex == index" class="text-[24rpx] absolute top-0 left-0 z-10 h-[66rpx] !bg-contain w-[150rpx] flex pt-[12rpx] pl-[16rpx] box-border" :style="{ background: 'url(' + img(currLevelInfo.level_tag) + ') no-repeat',color: currLevelInfo.level_style.level_color}">
当前等级
</view>
<view class="absolute top-0 left-0 right-0 bottom-0 z-20 px-[30rpx] pt-[76rpx] box-border" :class="{'px-[50rpx]': swiperIndex != index}">
<view class="flex items-center leading-[50rpx] mb-[70rpx]">
<view class="absolute top-0 left-0 right-0 bottom-0 z-20 px-[30rpx] pt-[68rpx] box-border" :class="{'px-[50rpx]': swiperIndex != index}">
<view class="flex items-center leading-[50rpx] mb-[90rpx]">
<image class="h-[32rpx] w-[34rpx] align-middle" :src="img(item.level_icon ? item.level_icon : '')" mode="aspectFill" />
<view class="text-[36rpx] font-bold ml-[10rpx] max-w-[340rpx] truncate" :style="{color:currLevelInfo.level_style.level_color}">{{item.level_name}}</view>
</view>
<view class="flex items-center" :style="{color: currLevelInfo.level_style.level_color}">
<view class="text-[28rpx] font-bold leading-[38rpx]">{{ memberInfo.growth }}</view>
<view class="text-[24rpx] leading-[34rpx] font-500">/{{list[index].growth}}成长值</view>
<view class="flex items-baseline" :style="{color: currLevelInfo.level_style.level_color}">
<view class="text-[30rpx] font-500 leading-[38rpx]">{{ memberInfo.growth }}</view>
<view class="text-[24rpx] leading-[34rpx]">/{{list[index].growth}}成长值</view>
</view>
<view class="flex justify-between items-center mt-[10rpx]">
<view class="flex flex-col flex-1">
<view>
<progress :percent="progress(index)" :border-radius="100" :activeColor="currLevelInfo.level_style.level_color" backgroundColor="#fff" stroke-width="6" />
<progress :percent="progress(index)" :border-radius="100" :activeColor="currLevelInfo.level_style.level_color" backgroundColor="#fff" stroke-width="4" />
</view>
</view>
</view>
</view>
<view class="relatvie h-full w-full">
<image class="h-full w-full" :src="img(item.level_bg)" mode="aspectFit" :class="{'swiper-animation': swiperIndex != index}" :show-menu-by-longpress="true"/>
<image class="h-full w-full" :src="img(item.level_bg)" :class="{'swiper-animation': swiperIndex != index}" :show-menu-by-longpress="true"/>
</view>
</view>
</swiper-item>
@ -49,52 +49,51 @@
<block v-for="(item,index) in list" :key="item.id">
<view :style="levelStyle" class=" flex-shrink-0 flex flex-col items-center justify-center" @click="changeLevel(index)" :id="'id' + index">
<view class="w-[14rpx] h-[14rpx] level-class" :class="{'level-select': levelIndex == (index)}"></view>
<view :style="maxWidth" class="text-[24rpx] text-[#aaa] mt-[10rpx] truncate">{{item.level_name}}</view>
<view :style="maxWidth" class="text-[22rpx] text-[#aaa] mt-[16rpx] truncate" :class="{'!text-[#fff]': levelIndex == (index)}">{{item.level_name}}</view>
</view>
</block>
</view>
</scroll-view>
</view>
</view>
<view class="flex mx-[30rpx] pt-[30rpx] pb-[46rpx] items-center flex-col level_benefits" v-if="currLevelInfo.benefits_arr && currLevelInfo.benefits_arr.length" :style="{ backgroundImage: 'url(' + img(currLevelInfo.member_bg) + ')'}">
<view class="flex mx-[var(--sidebar-m)] pt-[30rpx] pb-[46rpx] items-center flex-col level_benefits" v-if="currLevelInfo.benefits_arr && currLevelInfo.benefits_arr.length" :style="{ backgroundImage: 'url(' + img(currLevelInfo.member_bg) + ')'}">
<view class="flex items-center justify-center">
<text class="text-[#fff] text-[32rpx] font-bold leading-[44rpx]">会员权益</text>
<text class="text-[#fff] text-[30rpx] font-500 leading-[44rpx]">会员权益</text>
</view>
<view class="flex flex-wrap w-[690rpx] mt-[40rpx] justify-between">
<view class="flex flex-col w-[25%] items-center" v-for="(item,index) in currLevelInfo.benefits_arr" :key="index">
<image class="h-[100rpx] w-[100rpx]" :src="img(item.icon)" mode="heightFix" />
<text class="text-[rgba(255,255,255,0.9)] mt-[10rpx] text-[24rpx] leading-[34rpx]">{{item.title}}</text>
<image class="h-[88rpx] w-[88rpx]" :src="img(item.icon)" mode="heightFix" />
<text class="text-[rgba(255,255,255,0.9)] mt-[16rpx] text-[24rpx] leading-[34rpx]">{{item.title}}</text>
</view>
</view>
</view>
</view>
<view class="flex-1 rounded-t-[40rpx] px-[30rpx] pt-[30rpx] mt-[-16rpx] relative tab-bar" :style="{background: `linear-gradient( 180deg, ${currLevelInfo.level_style.gift} 0%, #FFFFFF 20%)`}">
<view class="flex-1 rounded-t-[40rpx] px-[30rpx] pt-[var(--pad-top-m)] mt-[-10rpx] relative tab-bar" :style="{background: `linear-gradient( 180deg, ${currLevelInfo.level_style.gift} 0%, #FFFFFF 20%)`}">
<!-- 升级礼包 -->
<view v-if="currLevelInfo.gifts_arr && currLevelInfo.gifts_arr.length">
<view class="pt-[10rpx] pb-[30rpx] flex items-center">
<text class="text-[32rpx] text-[#333] font-bold leading-[44rpx]">升级礼包</text>
<view class="pb-[30rpx] flex items-center">
<text class="text-[30rpx] text-[#333] font-500 leading-[44rpx]">升级礼包</text>
</view>
<view class="flex flex-wrap">
<view v-for="(item,index) in currLevelInfo.gifts_arr" :key="index" class="mb-[20rpx]" :class="{'mr-[20rpx]': (index+1) % 3 != 0}">
<view class="relative box-border mb-[12rpx] w-[216rpx] h-[180rpx] !bg-contain" :style="{ background: 'url(' + img(item.background) + ') no-repeat'}">
</view>
<view class="text-center text-[#333] text-[28rpx] font-500 truncate leading-[40rpx] max-w-[216rpx]">{{item.text}}</view>
<view v-for="(item,index) in currLevelInfo.gifts_arr" :key="index" class="mb-[20rpx]" :class="{'mr-[21rpx]': (index+1) % 3 != 0}">
<view class="relative box-border mb-[16rpx] w-[216rpx] h-[180rpx] !bg-contain" :style="{ background: 'url(' + img(item.background) + ') no-repeat'}"></view>
<view class="text-center font-500 text-[#333] text-[28rpx] truncate leading-[40rpx] max-w-[216rpx]">{{item.text}}</view>
</view>
</view>
</view>
<!-- 升级技巧 -->
<view v-if="upgradeSkills && upgradeSkills.length">
<view class="pt-[10rpx] pb-[30rpx] flex items-center">
<text class="text-[32rpx] text-[#333] font-bold leading-[44rpx]">升级技巧</text>
<view class="pt-[30rpx] pb-[30rpx] flex items-center">
<text class="text-[30rpx] text-[#333] font-500 leading-[44rpx]">升级技巧</text>
</view>
<view>
<view class="flex items-center mb-[30rpx]" v-for="(item,index) in upgradeSkills" :key="index">
<view class="pb-[30rpx]">
<view class="flex items-center mb-[34rpx]" v-for="(item,index) in upgradeSkills" :key="index">
<image class="h-[100rpx] w-[100rpx] mr-[20rpx]" :src="img(item.icon)" mode="heightFix" />
<view class="flex flex-col">
<view class="text-[#3A3945] text-[28rpx] font-bold leading-[38rpx] mb-[8rpx]">{{item.title}}</view>
<view class="text-[24rpx] text-[#3A3945] leading-[34rpx]">{{item.desc}}</view>
<view class="text-[28rpx] leading-[38rpx] mb-[8rpx]">{{item.title}}</view>
<view class="text-[24rpx] text-[var(--text-color-light9)] leading-[34rpx]">{{item.desc}}</view>
</view>
<text class="skill-btn" @click="redirect({ url: item.button.wap_redirect, param: {} , mode: 'redirectTo'})">{{item.button.text}}</text>
</view>
@ -102,10 +101,10 @@
</view>
</view>
</view>
<view v-if="!loading && (!list || !list.length)" class="h-[100vh] w-full flex items-center justify-center">
<u-empty :icon="img('static/resource/images/empty.png')" text="暂无会员等级" />
<view class="empty-page" v-if="!loading && (!list || !list.length)">
<image class="img" :src="img('static/resource/images/empty.png')" mode="aspectFill"></image>
<text class="desc">暂无会员等级</text>
</view>
</view>
</template>
@ -168,13 +167,13 @@
const getMemberLevelFn = ()=>{
loading.value = true;
getMemberLevel().then((res) => {
getMemberLevel().then((res: any) => {
list.value = res.data || [];
// 初始化会员等级数据
let bool = true;
if(memberInfo.value && list.value && list.value.length){
list.value.forEach((item,index)=>{
list.value.forEach((item: any,index)=>{
if(item.level_id == memberInfo.value.member_level){
bool = false;
swiperIndex.value = index;
@ -211,12 +210,12 @@
}
const getTaskGrowthFn = ()=>{
getTaskGrowth().then((res) => {
getTaskGrowth().then((res: any) => {
upgradeSkills.value = res.data
})
}
const swiperChange = (e) => {
const swiperChange = (e: any) => {
swiperIndex.value = e.detail.current;
levelIndex.value = swiperIndex.value
infoStructureFn(e.detail.current);
@ -229,7 +228,7 @@
// 会员权益
if(data && data.level_benefits){
data.benefits_arr = [];
Object.values(data.level_benefits).forEach((item,index,Array)=>{
Object.values(data.level_benefits).forEach((item: any,index,Array)=>{
if(item.content){
data.benefits_arr.push(item.content)
}
@ -242,7 +241,7 @@
for(let key in data.level_gifts){
if(data.level_gifts[key].content){
// 增加类型
data.level_gifts[key].content.forEach((item,index,Array)=>{
data.level_gifts[key].content.forEach((item: any,index: any,Array: any)=>{
Array[index].type = key
})
data.gifts_arr = data.gifts_arr.concat(data.level_gifts[key].content);
@ -261,17 +260,19 @@
<style lang="scss" scoped>
.skill-btn{
padding: 0 20rpx;
width: 120rpx;
height: 54rpx;
line-height: 56rpx;
display: flex;
align-items: center;
justify-content: center;
color: #333;
background: linear-gradient( 180deg, #FEE8AC 0%, #F5D36E 85%);
border-radius: 30rpx;
border-radius: 100rpx;
margin-left: auto;
font-size: 24rpx;
font-size: 22rpx;
}
.swiper-animation{
transform: scale(0.92, 0.92);
transform: scale(0.95, 0.95);
transition-duration: 0.3s;
transition-timing-function: ease;
}
@ -290,7 +291,7 @@
position: absolute;
width: 14rpx;
height: 14rpx;
background-color: #aaa;
background-color: #bbb;
border-radius: 14rpx;
top:50%;
left: 50%;
@ -305,14 +306,17 @@
position: absolute;
width: 26rpx;
height: 26rpx;
background-color: #F6F6F6;
opacity: 0.4;
background-color: #fff;
opacity: 0.6;
border-radius: 26rpx;
top:50%;
left: 50%;
transform: translate(-50%,-50%);
z-index: 1;
}
&::before{
background-color: #fff !important;
}
}
.level_benefits{
background-repeat: no-repeat;

186
uni-app/src/app/pages/member/personal.vue
View File

@ -1,53 +1,63 @@
<template>
<view class="w-full h-screen bg-page personal-wrap" v-if="info" :style="themeColor()">
<view class="flex flex-col items-center pt-[30rpx]">
<!-- #ifdef MP-WEIXIN -->
<button open-type="chooseAvatar" @chooseavatar="onChooseAvatar" :plain="true" class="border-0" @click="checkWxPrivacy">
<u-avatar :src="img(info.headimg)" :default-url="img('static/resource/images/default_headimg.png')" size="60" leftIcon="none"></u-avatar>
<view class="text-primary text-sm mt-[10rpx]">{{ t('updateHeadimg') }}</view>
</button>
<!-- #endif -->
<!-- #ifndef MP-WEIXIN -->
<u-upload @afterRead="afterRead" :maxCount="1">
<u-avatar :src="img(info.headimg)" :default-url="img('static/resource/images/default_headimg.png')" size="60" leftIcon="none"></u-avatar>
<view class="text-primary text-sm mt-[10rpx]">{{ t('updateHeadimg') }}</view>
</u-upload>
<!-- #endif -->
</view>
<view class="w-full h-screen bg-page personal-wrap overflow-hidden" v-if="info" :style="themeColor()">
<view class="m-[30rpx] bg-white rounded-md overflow-hidden px-[20rpx] py-[10rpx]">
<u-cell-group :border="false">
<u-cell :title="t('nickname')" :is-link="true" :value="info.nickname" @click="updateNickname.modal = true"></u-cell>
<u-cell :title="t('sex')" :is-link="true" :value="info.sex_name || t('unknown')" @click="sexSheetShow = true"></u-cell>
<u-cell :title="t('mobile')">
<view class="my-[var(--top-m)] sidebar-margin overflow-hidden card-template py-[20rpx]">
<u-cell-group :border="false" class="cell-group">
<u-cell :title="t('headimg')" :titleStyle="{'font-size': '28rpx'}" :is-link="true">
<template #value>
<!-- #ifdef MP-WEIXIN -->
<button open-type="chooseAvatar" @chooseavatar="onChooseAvatar" :plain="true" class="border-0" @click="checkWxPrivacy">
<u-avatar :src="img(info.headimg)" :default-url="img('static/resource/images/default_headimg.png')" size="40" leftIcon="none" />
</button>
<!-- #endif -->
<!-- #ifndef MP-WEIXIN -->
<u-upload @afterRead="afterRead" :maxCount="1">
<u-avatar :src="img(info.headimg)" :default-url="img('static/resource/images/default_headimg.png')" size="40" leftIcon="none" />
</u-upload>
<!-- #endif -->
</template>
</u-cell>
<u-cell :title="t('nickname')" :titleStyle="{'font-size': '28rpx'}" :is-link="true" :value="info.nickname" @click="updateNickname.modal = true"></u-cell>
<u-cell :title="t('sex')" :titleStyle="{'font-size': '28rpx'}" :is-link="true" :value="info.sex_name || t('unknown')" @click="sexSheetShow = true"></u-cell>
<u-cell :title="t('mobile')" :titleStyle="{'font-size': '28rpx'}">
<template #value>
<view v-if="info.mobile" class="mr-[10rpx]">{{ mobileConceal(info.mobile) }}</view>
<view v-else @click="redirect({ url: '/app/pages/auth/bind' })">
<button class="bg-transparent w-[132rpx] p-[0] rounded-[100rpx] text-[var(--primary-color)] !border-[2rpx] !border-solid border-[var(--primary-color)] text-[20rpx] h-[44rpx] leading-[40rpx]">{{t('bindMobile')}}</button>
<view v-else>
<!-- #ifdef H5 -->
<button @click="redirect({ url: '/app/pages/auth/bind' })" class="bg-transparent w-[170rpx] p-[0] rounded-[100rpx] text-[var(--primary-color)] !border-[2rpx] !border-solid border-[var(--primary-color)] text-[24rpx] h-[54rpx] flex-center">{{t('bindMobile')}}</button>
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<button class="bg-transparent w-[170rpx] p-[0] rounded-[100rpx] text-[var(--primary-color)] !border-[2rpx] !border-solid border-[var(--primary-color)] text-[24rpx] h-[54rpx] flex-center" open-type="getPhoneNumber" @getphonenumber="memberStore.bindMobile">{{t('bindMobile')}}</button>
<!-- #endif -->
</view>
</template>
</u-cell>
<u-cell :title="t('birthday')" :is-link="true" :value="formatDate(info.birthday) || t('unknown')" @click="birthdayPicker = true"></u-cell>
<u-cell :title="t('birthday')" :titleStyle="{'font-size': '28rpx'}" :is-link="true" :value="formatDate(info.birthday) || t('unknown')" @click="birthdayPicker = true"></u-cell>
</u-cell-group>
</view>
<u-modal :show="updateNickname.modal" :closeOnClickOverlay="true" @close="updateNickname.modal = false"
:show-cancel-button="true"
@cancel="updateNickname.modal = false" :title="t('updateNickname')" confirmColor="var(--primary-color)">
<view class="w-full mt-[20rpx] border-0 border-b border-gray-300 border-solid py-[20rpx]">
<input type="nickname" v-model="updateNickname.value" :placeholder="t('nicknamePlaceholder')" @blur="bindNickname">
</view>
<template #confirmButton>
<view class="mt-[10rpx]">
<button class="bg-[var(--primary-color)] text-[#fff] h-[80rpx] leading-[80rpx] rounded-[100rpx] text-[28rpx]" @click="updateNicknameConfirm">{{t('confirm')}}</button>
</view>
</template>
</u-modal>
<u-action-sheet :actions="sexList" :show="sexSheetShow" :closeOnClickOverlay="true"
<!-- 修改昵称 -->
<u-popup class="popup-type" :safeAreaInsetBottom="false" round="var(--rounded-big)" :show="updateNickname.modal" mode="center" @close="updateNickname.modal = false">
<view class="w-[620rpx] popup-common pb-[40rpx]" @touchmove.prevent.stop>
<view class="title !pt-[50rpx] !pb-[60rpx]">{{t('updateNickname')}}</view>
<view class="mx-[50rpx] border-0 border-b border-[#eee] border-solid">
<input type="nickname" class="h-[88rpx] text-[26rpx]" v-model="updateNickname.value" :placeholder="t('nicknamePlaceholder')" placeholderClass="text-[26rpx] h-[88rpx] flex items-center" @blur="bindNickname">
</view>
<view class="px-[60rpx] pt-[70rpx]">
<button hover-class="none" class="primary-btn-bg text-[#fff] h-[80rpx] font-500 leading-[80rpx] rounded-[100rpx] text-[26rpx]" @click="updateNicknameConfirm">{{t('confirm')}}</button>
</view>
</view>
</u-popup>
<!-- 修改性别 -->
<u-action-sheet class="" :actions="sexList" :show="sexSheetShow" :closeOnClickOverlay="true"
:safeAreaInsetBottom="true"
@close="sexSheetShow = false" @select="updateSex"></u-action-sheet>
<!-- 修改生日 -->
<u-datetime-picker v-model="info.birthday" :show="birthdayPicker" mode="date" :confirm-text="t('confirm')"
:maxDate="new Date().valueOf()" :minDate="0"
:cancel-text="t('cancel')" @cancel="birthdayPicker = false" @confirm="updateBirthday"></u-datetime-picker>
@ -60,23 +70,26 @@
</template>
<script setup lang="ts">
import { ref, computed, reactive } from 'vue'
import { ref, computed, reactive,nextTick } from 'vue'
import { t } from '@/locale'
import useMemberStore from '@/stores/member'
import { img, redirect,mobileConceal } from '@/utils/common'
import { modifyMember } from '@/app/api/member'
import { fetchBase64Image, uploadImage } from '@/app/api/system'
import { onLoad } from '@dcloudio/uni-app'
const memberStore = useMemberStore()
const info = computed(() => memberStore.info)
const wxPrivacyPopupRef:any = ref(null)
// 检测是否同意隐私协议
const checkWxPrivacy = ()=>{
wxPrivacyPopupRef.value.proactive();
}
onLoad(()=>{
// #ifdef MP
nextTick(()=>{
if(wxPrivacyPopupRef.value) wxPrivacyPopupRef.value.proactive();
})
// #endif
})
/**
* 修改昵称
@ -86,7 +99,7 @@
value: info.nickname || ''
})
const bindNickname = (e) => {
const bindNickname = (e: any) => {
updateNickname.value = e.detail.value
}
@ -112,7 +125,7 @@
{ name: t('woman'), value: 2 }
]
})
const updateSex = (e) => {
const updateSex = (e: any) => {
modifyMember({
field: 'sex',
value: e.value
@ -124,12 +137,12 @@
/**
* 修改用户头像
*/
const onChooseAvatar = (e) => {
const onChooseAvatar = (e: any) => {
uni.getFileSystemManager().readFile({
filePath: e.detail.avatarUrl, //选择图片返回的相对路径
encoding: 'base64', //编码格式
success: res => {
fetchBase64Image({ content: res.data }).then(uploadRes => {
fetchBase64Image({ content: res.data }).then((uploadRes: any) => {
modifyMember({
field: 'headimg',
value: uploadRes.data.url
@ -141,11 +154,11 @@
})
}
const afterRead = (event) => {
const afterRead = (event: any) => {
uploadImage({
filePath: event.file.url,
name: 'file'
}).then(res => {
}).then((res: any) => {
modifyMember({
field: 'headimg',
value: res.data.url
@ -160,7 +173,7 @@
* 编辑生日
*/
const birthdayPicker = ref(false)
const updateBirthday = (e) => {
const updateBirthday = (e: any) => {
modifyMember({
field: 'birthday',
value: uni.$u.date(e.value, 'yyyy-mm-dd')
@ -178,32 +191,65 @@
page {
background: var(--page-bg-color);
}
:deep(.u-upload__wrap ){
>view{
justify-content: center;
align-items: center;
}
:deep(.u-upload ){
flex: none;
}
:deep(.u-cell-group__wrapper) {
.u-cell__body {
padding-left: 0;
padding-right: 0;
}
.u-cell {
&:last-child .u-line {
display: none;
}
}
:deep(.cell-group), :deep(.u-cell-group){
.u-cell{
.u-cell__body{
padding: 0;
height: 90rpx;
margin-top: 16rpx;
}
&:first-of-type .u-cell__body{
margin-top: 0;
}
.u-cell__title-text{
font-size:28rpx;
line-height: 40rpx;
}
.u-icon__icon{
font-size: 24rpx !important;
}
.u-cell__value{
line-height: 1;
font-size:28rpx;
color: #333 !important;
}
.u-line{
display: none;
}
}
}
:deep(button, button:after) {
border: none;
}
// 修改性别
:deep(.u-action-sheet){
.u-line{
margin: 0 30rpx !important;
width: auto !important;
border-color: #ddd !important;
}
.u-action-sheet__cancel{
padding: 0;
}
.u-action-sheet__item-wrap__item__name{
font-size: 30rpx !important;
}
}
:deep(.u-picker) .u-toolbar{
font-size: 32rpx !important;
padding: 26rpx 10rpx;
height: auto !important;
font-weight: 500;
}
</style>
<style lang="scss">
.personal-wrap .u-cell--clickable{
background-color: transparent;
background-color: transparent !important;
}
</style>

86
uni-app/src/app/pages/member/point.vue
View File

@ -1,56 +1,56 @@
<template>
<view class="bg-[#F6F6F6] min-h-[100vh]" :style="themeColor()">
<view class="bg-[var(--page-bg-color)] min-h-[100vh]" :style="themeColor()">
<template v-if="!loading">
<view class="w-full bg-[#F6F6F6]">
<view class="w-full bg-[var(--page-bg-color)]">
<view class="pb-[210rpx] relative" :style="headerStyle">
<!-- #ifdef MP-WEIXIN -->
<top-tabbar :data="param" :scrollBool="topTabarObj.getScrollBool()" class="top-header"/>
<!-- #endif -->
<view class="text-[70rpx] leading-[98rpx] text-[#fff] pl-[60rpx] font-600 pt-[77rpx]">{{pointInfo.point||0}}</view>
<view class="text-[70rpx] leading-[90rpx] text-[#fff] pl-[60rpx] font-500 pt-[77rpx] price-font">{{pointInfo.point||0}}</view>
<view class="flex items-center pl-[60rpx]">
<image class="h-[36rpx] w-[36rpx]" :src="img('static/resource/images/member/point/icon.png')" mode="heightFix" />
<image class="h-[36rpx] w-[36rpx] -mb-[4rpx]" :src="img('static/resource/images/member/point/icon.png')" mode="heightFix" />
<view class="text-[26rpx] leading-[36rpx] text-[#fff] ml-[10rpx]">我的积分</view>
</view>
<view class="flex items-center absolute right-0 px-[14rpx] bg-color rounded-l-[35rpx] text-[#fff] text-[24rpx] h-[50rpx] z-10" :style="{top: topStyle}" @click="toLink('/app/pages/member/point_detail')">
<text class="nc-iconfont nc-icon-jifenduihuanV6xx1 text-[28rpx] text-[#fff] mr-[10rpx]"></text>
<text class="text-[24rpx]">积分明细</text>
<view class="side-tab" :style="{top: topStyle}" @click="toLink('/app/pages/member/point_detail')">
<text class="nc-iconfont nc-icon-jifenduihuanV6xx1 icon"></text>
<text class="desc">积分明细</text>
</view>
</view>
<view class="sidebar-marign flex flex-col mt-[-178rpx] relative">
<view class="w-[322rpx] h-[80rpx] leading-[80rpx] text-[26rpx] text-[#333] font-bold box-border pl-[30rpx]"
<view class="sidebar-margin flex flex-col mt-[-178rpx] relative">
<view class="w-[322rpx] h-[80rpx] text-[30rpx] text-[#333] font-500 box-border pl-[30rpx] pt-[var(--pad-top-m)] rounded-tl-[var(--rounded-big)] overflow-hidden mb-[-2rpx]"
:style="{backgroundImage: 'url(' + img('static/resource/images/member/point/top_bg.png') + ') ',backgroundSize: '100% 100%',backgroundRepeat: 'no-repeat'}">
积分详情
<text class="leading-[42rpx]">积分详情</text>
</view>
<view class="flex items-center px-[30rpx] rounded-[16rpx] !rounded-tl-none bg-[#fff] h-[173rpx] box-border">
<view class="flex items-center px-[30rpx] rounded-[var(--rounded-big)] !rounded-tl-none bg-[#fff] h-[173rpx] box-border">
<view class="w-[196rpx] flex-shrink-0 text-center">
<view class="text-[#333] text-[42rpx] leading-[59rpx] font-bold">{{pointInfo.point_get||0}}</view>
<view class="mt-[8rpx] text-[#666] text-[26rpx] leading-[36rpx] font-400">累计积分</view>
<view class="text-[#333] text-[42rpx] leading-[54rpx] price-font">{{pointInfo.point_get||0}}</view>
<view class="mt-[8rpx] text-[var(--text-color-light6)] text-[26rpx] leading-[36rpx] font-400">累计积分</view>
</view>
<view class="w-[1rpx] h-[50rpx] flex-shrink-0 bg-[#EBEBEB] mx-[10rpx]"></view>
<view class="w-[1rpx] h-[50rpx] flex-shrink-0 bg-[var(--temp-bg)] mx-[10rpx]"></view>
<view class="w-[196rpx] flex-shrink-0 text-center">
<view class="text-[#333] text-[42rpx] leading-[59rpx] font-bold">{{pointInfo.use||0}}</view>
<view class="mt-[8rpx] text-[#666] text-[26rpx] leading-[36rpx] font-400">累计消费</view>
<view class="text-[#333] text-[42rpx] leading-[54rpx] price-font">{{pointInfo.use||0}}</view>
<view class="mt-[8rpx] text-[var(--text-color-light6)] text-[26rpx] leading-[36rpx] font-400">累计消费</view>
</view>
<view class="w-[1rpx] h-[50rpx] flex-shrink-0 bg-[#EBEBEB] mx-[10rpx]"></view>
<view class="w-[1rpx] h-[50rpx] flex-shrink-0 bg-[var(--temp-bg)] mx-[10rpx]"></view>
<view class="w-[196rpx] min-w-[209.33rpx] flex-shrink-0 text-center">
<view class="text-[#333] text-[42rpx] leading-[59rpx] font-bold">{{pointInfo.point||0}}</view>
<view class="mt-[8rpx] text-[#666] text-[26rpx] leading-[36rpx] font-400">可用积分</view>
<view class="text-[#333] text-[42rpx] leading-[54rpx] price-font">{{pointInfo.point||0}}</view>
<view class="mt-[8rpx] text-[var(--text-color-light6)] text-[26rpx] leading-[36rpx] font-400">可用积分</view>
</view>
</view>
</view>
</view>
<view class="mt-[20rpx] sidebar-marign p-[30rpx] pb-[70rpx] box-border rounded-[16rpx] bg-[#fff]">
<view class="text-[32rpx] leading-[45rpx] font-bold">热门活动</view>
<view class="mt-[50rpx] flex justify-between">
<view class="mt-[var(--top-m)] sidebar-margin card-template">
<view class="title">热门活动</view>
<view class="mt-[60rpx] flex justify-between">
<view class="w-[200rpx] h-[253rpx] box-border pt-[69rpx] relative text-center"
:style="{backgroundImage: 'url(' + img('static/resource/images/member/point/activity_1.png') + ') ',
backgroundSize: '100% 100%',
backgroundRepeat: 'no-repeat'}">
<image class="h-[78rpx] w-[78rpx] absolute left-[65rpx] top-[-21rpx]" :src="img('static/resource/images/member/point/activity_icon_1.png')" mode="heightFix" />
<view class="text-[28rpx] leading-[39rpx] text-[#333]">每日赚积分</view>
<view class="mt-[10rpx] text-[24rpx] leading-[34rpx] text-[#999] font-500">每日签到</view>
<view class="mt-[10rpx] text-[24rpx] leading-[34rpx] text-[var(--text-color-light6)]">每日签到</view>
<view class="w-full flex justify-center mt-[20rpx]">
<button class="h-[40rpx] !m-0 rounded-[40rpx] text-[26rpx] leading-[40rpx] !text-[#fff] !" shape="circle"
<button class="h-[54rpx] !m-0 rounded-[100rpx] text-[24rpx] flex-center !text-[#fff]" shape="circle"
:style="{background: 'linear-gradient( 94deg, #FB7939 0%, #FE120E 99%), #EF000C'}" @click="toLink('/app/pages/member/sign_in')">去签到</button>
</view>
</view>
@ -60,9 +60,9 @@
backgroundRepeat: 'no-repeat'}">
<image class="h-[78rpx] w-[78rpx] absolute left-[65rpx] top-[-21rpx]" :src="img('static/resource/images/member/point/activity_icon_2.png')" mode="heightFix" />
<view class="text-[28rpx] leading-[39rpx] text-[#333]">积分当钱花</view>
<view class="mt-[10rpx] text-[24rpx] leading-[34rpx] text-[#999] font-500">抵扣部分费用</view>
<view class="mt-[10rpx] text-[24rpx] leading-[34rpx] text-[var(--text-color-light6)]">抵扣部分费用</view>
<view class="w-full flex justify-center mt-[20rpx]">
<button class="h-[40rpx] !m-0 rounded-[40rpx] text-[26rpx] leading-[40rpx] !text-[#fff] !" shape="circle"
<button class="h-[54rpx] !m-0 rounded-[100rpx] text-[24rpx] flex-center !text-[#fff]" shape="circle"
:style="{background: 'linear-gradient( 94deg, #FB7939 0%, #FE120E 99%), #EF000C'}" @click="toLink('/addon/shop/pages/point/index')">去兑换</button>
</view>
</view>
@ -72,43 +72,32 @@
backgroundRepeat: 'no-repeat'}">
<image class="h-[78rpx] w-[78rpx] absolute left-[65rpx] top-[-21rpx]" :src="img('static/resource/images/member/point/icon.png')" mode="heightFix" />
<view class="text-[28rpx] leading-[39rpx] text-[#333]">购物返积分</view>
<view class="mt-[10rpx] text-[24rpx] leading-[34rpx] text-[#999] font-500">下单得积分</view>
<view class="mt-[10rpx] text-[24rpx] leading-[34rpx] text-[var(--text-color-light6)]">下单得积分</view>
<view class="w-full flex justify-center mt-[20rpx]">
<button class="h-[40rpx] !m-0 rounded-[40rpx] text-[26rpx] leading-[40rpx] !text-[#fff] !" shape="circle"
<button class="h-[54rpx] !m-0 rounded-[100rpx] text-[24rpx] flex-center !text-[#fff]" shape="circle"
:style="{background: 'linear-gradient( 94deg, #FB7939 0%, #FE120E 99%), #EF000C'}" @click="toLink('/addon/shop/pages/goods/list')">去逛逛</button>
</view>
</view>
</view>
</view>
<view class="mt-[20rpx] mx-[30rpx] p-[30rpx] box-border rounded-[16rpx] bg-[#fff]" v-if="pointList.length">
<view class="flex justify-between items-center">
<view class="text-[32rpx] leading-[45rpx] font-bold">做任务领积分</view>
<!-- <view class="flex items-center text-[#666]">
<text class=" text-[26rpx] leading-[36rpx] mr-[10rpx]">更多</text>
<text class=" text-[18rpx] leading-[36rpx] iconfont iconxiayibu1 text-[#999]"></text>
</view> -->
</view>
<view class="mt-[var(--top-m)] sidebar-margin card-template" v-if="pointList.length">
<view class="title">做任务领积分</view>
<block v-for="(item,index) in pointList">
<view class="flex items-center justify-between mt-[30rpx]">
<view class="flex items-center flex-1">
<image class="h-[62rpx] w-[62rpx]" :src="img(item.icon||'')" mode="heightFix" />
<image class="h-[80rpx] w-[80rpx]" :src="img(item.icon||'')" mode="heightFix" />
<view class="flex flex-col ml-[20rpx]">
<view class="flex">
<text class="text-[28rpx] leading-[39rpx]">{{item.title}}</text>
<!-- <image class="h-[28rpx] w-[28rpx] ml-[10rpx] mr-[6rpx]" :src="img('static/resource/images/member/point/icon.png')" mode="heightFix" /> -->
<!-- <text class="text-[#EF000C] text-[28rpx] leading-[39rpx]">+10</text> -->
</view>
<view class="mt-[10rpx] text-[#999] text-[24rpx] leading-[34rpx] font-400">{{item.desc}}</view>
<text class="text-[28rpx]">{{item.title}}</text>
<view class="mt-[14rpx] text-[var(--text-color-light6)] text-[24rpx] font-400">{{item.desc}}</view>
</view>
</view>
<button v-if="item.button" class="h-[56rpx] !m-0 rounded-[40rpx] text-[26rpx] leading-[56rpx] !text-[#fff] !" shape="circle"
:style="{background: 'linear-gradient( 94deg, #FB7939 0%, #FE120E 99%), #EF000C'}" @click="toLink(item.button.wap_redirect)">{{item.button.text}}</button>
<button v-if="item.button" class="h-[54rpx] !m-0 rounded-[40rpx] text-[24rpx] flex-center !text-[#fff] primary-btn-bg" shape="circle" @click="toLink(item.button.wap_redirect)">{{item.button.text}}</button>
</view>
</block>
</view>
</template>
<u-loading-page bg-color="rgb(248,248,248)" :loading="loading" loadingText="" fontSize="16" color="#303133"></u-loading-page>
<loading-page :loading="loading"></loading-page>
</view>
</template>
@ -126,7 +115,7 @@ let param = topTabarObj.setTopTabbarParam({title:'我的积分'})
/********* 自定义头部 - end ***********/
// 获取系统状态栏的高度
let menuButtonInfo:any = {};
let menuButtonInfo: any = {};
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
menuButtonInfo = uni.getMenuButtonBoundingClientRect();
@ -141,8 +130,7 @@ const headerStyle = computed(()=>{
}
})
const topStyle = computed(() => {
let style = ''
style = Object.keys(menuButtonInfo).length?(pxToRpx(Number(menuButtonInfo.height)) + pxToRpx(menuButtonInfo.top) + 38) + 'rpx;':'38rpx'
let style = Object.keys(menuButtonInfo).length?(pxToRpx(Number(menuButtonInfo.height)) + pxToRpx(menuButtonInfo.top) + 50) + 'rpx;':'50rpx'
return style
})

76
uni-app/src/app/pages/member/point_detail.vue
View File

@ -1,40 +1,42 @@
<template>
<view class="bg-[#F6F6F6] min-h-[100vh]" :style="themeColor()">
<view class="bg-[var(--page-bg-color)] min-h-[100vh]" :style="themeColor()">
<view class="fixed left-0 right-0 top-0 z-10085">
<view class="bg-[#fff] px-[var(--sidebar-m)] py-[14rpx] relative z-10084">
<view class="flex items-center h-[60rpx] bg-[#F8F9FD] rounded-[30rpx] px-[20rpx]">
<view class="flex-1 text-[26rpx] leading-[60rpx] text-[#8288A2]" :class="{'!text-[#333]':from_type}" @click="typePopup = true">{{from_type_name || '请选择来源用途'}}</view>
<text class="nc-iconfont nc-icon-shangV6xx-1 text-[32rpx] ml-[18rpx] !text-[#626779]" v-if="typePopup" @click="typePopup = false"></text>
<text class="nc-iconfont nc-icon-xiaV6xx text-[32rpx] ml-[18rpx] !text-[#626779]" v-else @click="typePopup = true"></text>
<view class="bg-[#fff] px-[30rpx] h-[88rpx] flex-center relative z-10084">
<view class="search-input">
<view class="flex-1 text-[24rpx] leading-[60rpx] text-[var(--text-color-light9)]" :class="{'!text-[#333]':from_type}" @click="typePopup = true">{{from_type_name || '请选择来源用途'}}</view>
<text class="nc-iconfont nc-icon-shangV6xx-1 !text-[26rpx] ml-[18rpx] !text-[var(--text-color-light6)]" v-if="typePopup" @click="typePopup = false"></text>
<text class="nc-iconfont nc-icon-xiaV6xx !text-[26rpx] ml-[18rpx] !text-[var(--text-color-light6)]" v-else @click="typePopup = true"></text>
</view>
</view>
<u-popup :show="typePopup" mode="top" @close="typePopup = false" class="type-class">
<view @touchmove.prevent.stop class="py-[22rpx]">
<view class="leading-[80rpx] text-[26rpx] text-[#333] px-[50rpx]" :class="{'bg-[#FDF8F8] !text-primary font-500' : from_type == ''}" @click="searchTypeFn()">全部</view>
<view class="leading-[80rpx] text-[26rpx] text-[#333] px-[50rpx]" :class="{'bg-[#FDF8F8] !text-primary font-500' : from_type == index}" v-for="(item,index) in pointType" @click="searchTypeFn(index,item)">{{ item.name }}</view>
</view>
</u-popup>
<view class="px-[var(--sidebar-m)] pt-[30rpx] pb-[20rpx] flex items-center justify-between bg-[#F6F6F6]">
<view class="type-class">
<u-popup :show="typePopup" mode="top" @close="typePopup = false">
<view @touchmove.prevent.stop class="py-[22rpx]">
<view class="leading-[80rpx] text-[26rpx] text-[#333] px-[50rpx]" :class="{'bg-[#FDF8F8] !text-primary font-500' : from_type == ''}" @click="searchTypeFn()">全部</view>
<view class="leading-[80rpx] text-[26rpx] text-[#333] px-[50rpx]" :class="{'bg-[#FDF8F8] !text-primary font-500' : from_type == index}" v-for="(item,index) in pointType" @click="searchTypeFn(index,item)">{{ item.name }}</view>
</view>
</u-popup>
</view>
<view class="px-[var(--sidebar-m)] py-[30rpx] flex items-center justify-between">
<view class="flex items-center">
<view class="px-[20rpx] py-[6rpx] bg-[#fff] rounded-[30rpx] text-[26rpx] leading-[36rpx] mr-[20rpx] text-[#333]" :class="{'!text-[var(--primary-color)] font-500':amount_type == item.status}" v-for="(item,index) in typeList" :key="index" @click="loadTypeFn(item.status)">{{ item.name }}</view>
<view class="px-[30rpx] bg-[#fff] rounded-[30rpx] text-[24rpx] leading-[54rpx] mr-[20rpx] text-[#333]" :class="{'!text-[var(--primary-color)] font-500':amount_type == item.status}" v-for="(item,index) in typeList" :key="index" @click="loadTypeFn(item.status)">{{ item.name }}</view>
</view>
<view class="flex items-center" @click="handleSelect">
<view class="text-[26rpx] text-[#333] mr-[10rpx]">日期</view>
<view class="nc-iconfont nc-icon-riliV6xx !text-[28rpx] leading-[36rpx]"></view>
<view class="nc-iconfont nc-icon-a-riliV6xx-36 !text-[28rpx] leading-[36rpx]"></view>
</view>
</view>
</view>
<mescroll-body ref="mescrollRef" @init="mescrollInit" :down="{ use: false }" @up="getPointListFn" top="186rpx">
<view v-for="(item,index) in pointList" :key="index" class="bg-white sidebar-marign rounded-[16rpx] px-[30rpx] mb-[20rpx] py-[12rpx]">
<mescroll-body ref="mescrollRef" @init="mescrollInit" :down="{ use: false }" @up="getPointListFn" top="202rpx">
<view v-for="(item,index) in pointList" :key="index" class="sidebar-margin card-template mb-[var(--top-m)]">
<view class="flex justify-between items-center">
<view class="text-[20rpx] text-[#333] font-500">
<text>{{item.month_info.year}}年</text>
<text class="text-[36rpx] font-bold ml-[10rpx] mr-[4rpx]">{{item.month_info.month}}</text>
<text>月</text>
<view class="text-[#333]">
<text class="text-[26rpx]">{{item.month_info.year}}年</text>
<text class="text-[36rpx] font-500 ml-[10rpx] mr-[4rpx]">{{item.month_info.month}}</text>
<text class="text-[26rpx]">月</text>
</view>
<view>
<text class="nc-iconfont nc-icon-xiaV6xx !text-[32rpx] text-[#626779]" v-if="item.flag" @click="item.flag = false"></text>
<text class="nc-iconfont nc-icon-shangV6xx-1 !text-[32rpx] text-[#626779]" v-else @click="item.flag = true"></text>
<text class="nc-iconfont nc-icon-xiaV6xx !text-[26rpx] text-[var(--text-color-light6)]" v-if="item.flag" @click="item.flag = false"></text>
<text class="nc-iconfont nc-icon-shangV6xx-1 !text-[26rpx] text-[var(--text-color-light6)]" v-else @click="item.flag = true"></text>
</view>
</view>
<view v-show="item.flag">
@ -44,20 +46,18 @@
<image v-if="subItem.account_data > 0" :src="img('static/resource/images/member/point/detail/point_add.png')" class="w-[60rpx] h-[60rpx]"></image>
<image v-else :src="img('static/resource/images/member/point/detail/point_min.png')" class="w-[60rpx] h-[60rpx]"></image>
</view>
<view class="flex-1 flex items-center ml-[20rpx] box-border py-[20rpx] border-0" :class="{'border-solid border-t-[2rpx] border-[#F0F2F8]' : subIndex}">
<view class="flex-1 flex items-center ml-[20rpx] box-border py-[30rpx] border-0" :class="{'border-solid border-t-[2rpx] border-[#F0F2F8]' : subIndex}">
<view class="flex-1">
<view class="text-[26rpx] font-500 leading-[36rpx] text-[#333]">{{subItem.from_type_name}}</view>
<view class="text-[24rpx] text-[#8288A2] leading-[34rpx] mt-[4rpx]">{{subItem.create_time}}</view>
<view class="text-[26rpx] text-[#333]">{{subItem.from_type_name}}</view>
<view class="text-[24rpx] text-[var(--text-color-light9)] mt-[16rpx]">{{subItem.create_time}}</view>
</view>
<view class="text-[36rpx] font-500 text-[#03B521]" :class="{ '!text-primary' : subItem.account_data > 0 }">{{subItem.account_data > 0 ? '+' + subItem.account_data : subItem.account_data}}</view>
<view class="text-[36rpx] font-500 text-[#03B521] price-font" :class="{ '!text-primary' : subItem.account_data > 0 }">{{subItem.account_data > 0 ? '+' + subItem.account_data : subItem.account_data}}</view>
</view>
</view>
</block>
</view>
</view>
<view class="mx-[30rpx] rounded-[16rpx] noData flex items-center justify-center" v-if="!pointList.length && loading">
<mescroll-empty :option="{tip : '暂无积分明细'}"></mescroll-empty>
</view>
<mescroll-empty :option="{tip : '暂无积分明细'}" v-if="!pointList.length && loading"></mescroll-empty>
</mescroll-body>
<!-- 时间选择 -->
<select-date ref="selectDateRef" @confirm="confirmFn" />
@ -74,6 +74,7 @@ import MescrollEmpty from '@/components/mescroll/mescroll-empty/mescroll-empty.v
import useMescroll from '@/components/mescroll/hooks/useMescroll.js';
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app';
import selectDate from '@/components/select-date/select-date.vue';
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom);
const from_type = ref('');
@ -89,7 +90,7 @@ const typeList = ref([
{name:'支出',status:'disburse'}
])
const getPointListFn = (mescroll)=> {
const getPointListFn = (mescroll: any)=> {
let data = {
page: mescroll.num,
page_size: mescroll.size,
@ -98,7 +99,7 @@ const getPointListFn = (mescroll)=> {
create_time: create_time.value
};
loading.value = false;
getPointList(data).then((res) => {
getPointList(data).then((res: any) => {
let newArr = res.data.data;
mescroll.endSuccess(newArr.length);
//设置列表数据
@ -119,7 +120,7 @@ const getPointListFn = (mescroll)=> {
const pointType = ref({})
const getPointTypeFn = () =>{
getPointType('point').then(res =>{
getPointType('point').then((res: any) =>{
pointType.value = res.data
})
}
@ -154,12 +155,7 @@ const confirmFn = (data:any) =>{
</script>
<style lang="scss" scoped>
:deep(.u-popup.type-class .u-transition) {
top: 88rpx !important;
box-shadow: 1rpx 1rpx 6rpx 2rpx rgba(184,201,212,0.25);
:deep(.type-class .u-popup .u-transition){
top: 86rpx !important;
}
.noData{
height: calc(100vh - 206rpx - constant(safe-area-inset-bottom));
height: calc(100vh - 206rpx - env(safe-area-inset-bottom));
}
</style>

128
uni-app/src/app/pages/member/sign_in.vue
View File

@ -1,48 +1,46 @@
<template>
<view :style="themeColor()">
<view class="bg-[#F6F6F6] min-h-screen overflow-hidden" v-if="Object.values(info).length">
<view class="min-h-screen overflow-hidden" v-if="Object.values(info).length" :class="{ 'bg-[#F6F6F6]' : info && info.is_use }">
<view v-if="info.is_use">
<view class="sigin-header">
<!-- #ifdef MP-WEIXIN -->
<view class="flex items-center absolute right-0 px-[14rpx] bg-color rounded-l-[35rpx] text-[#fff] text-[24rpx] h-[40rpx] z-10" :style="{top: topStyle}" @click="signPopup = true">
<text class="nc-iconfont nc-icon-meiriqiandaoV6xx text-[28rpx] text-[#fff] mr-[6rpx]"></text>
<text class="text-[24rpx]">签到规则</text>
<view class="side-tab" :style="{top: topStyle}" @click="signPopup = true">
<text class="nc-iconfont nc-icon-a-meiriqiandaoV6xx-36 icon"></text>
<text class="desc">签到规则</text>
</view>
<view :style="{height: headStyle, backgroundImage: 'url(' + img('static/resource/images/app/sigin_uniapp.png') + ')',backgroundSize: '100% 100%', backgroundRepeat: 'no-repeat'}">
<top-tabbar :data="topTabbarData" :scrollBool="topTabarObj.getScrollBool()" class="top-header" />
</view>
<!-- #endif -->
<!-- #ifdef H5 -->
<view v-if="info.rule_explain" class="flex items-center absolute top-[44rpx] right-0 px-[14rpx] bg-color rounded-l-[35rpx] text-[#fff] text-[24rpx] h-[40rpx] z-10" @click="signPopup = true">
<text class="nc-iconfont nc-icon-meiriqiandaoV6xx text-[28rpx] text-[#fff] mr-[6rpx]"></text>
<text class="text-[24rpx]">签到规则</text>
<view v-if="info.rule_explain" class="side-tab" @click="signPopup = true">
<text class="nc-iconfont nc-icon-a-meiriqiandaoV6xx-36 icon"></text>
<text class="desc">签到规则</text>
</view>
<view class="h-[382rpx]" :style="{ backgroundImage: 'url(' + img('static/resource/images/app/sigin_h5.png') + ')',backgroundSize: '100%', backgroundRepeat: 'no-repeat'}">
</view>
<!-- #endif -->
</view>
<view>
<view class="sidebar-marign bg-[#fff] rounded-[16rpx] -mt-[85rpx]">
<view class="sidebar-margin bg-[#fff] rounded-[16rpx] -mt-[85rpx]">
<view class="card-template">
<view class=" mb-[30rpx] flex justify-between items-center" v-if="flag">
<view class="mb-[30rpx] flex justify-between items-center" v-if="flag">
<view class="flex items-center">
<text class="iconfont iconshangyibu text-[#333] text-[24rpx]" @click="changeMonth('prev')"></text>
<view class="mx-[30rpx] font-bold text-[32rpx] text-[#333] leading-[45rpx]">{{ state.curYear }}年{{ state.curMonth+1 }}月</view>
<text class="iconfont iconxiayibu1 text-[#333] text-[24rpx]" @click="changeMonth('next')"></text>
<text class="iconfont iconshangyibu text-[#303133] text-[20rpx]" @click="changeMonth('prev')"></text>
<view class="mx-[24rpx] text-[30rpx] font-500 text-[#303133] leading-[45rpx]">{{ state.curYear }}年{{ state.curMonth+1 }}月</view>
<text class="iconfont iconxiayibu1 text-[#303133] text-[20rpx]" @click="changeMonth('next')"></text>
</view>
<view class="flex items-center">
<text class="nc-iconfont nc-icon-shangV6xx-1 text-[#626779] text-[26rpx]" @click="handleChange"></text>
<text class="nc-iconfont nc-icon-shangV6xx-1 text-[var(--text-color-light9)] pt-[4rpx] px-[6rpx] text-[24rpx]" @click="handleChange"></text>
</view>
</view>
<view class="mb-[30rpx] flex justify-between items-center" v-else>
<view class="flex items-center">
<view class="font-500 text-[32rpx] text-[#333] leading-[45rpx]">已连续签到<text class="text-[#EF000C] mx-[4rpx]">{{ info.days }}</text>天</view>
</view>
<text class="nc-iconfont nc-icon-xiaV6xx text-[#626779] text-[26rpx]" v-if="!flag" @click="flag = !flag"></text>
<view class="font-500 text-[30rpx]">已连续签到<text class="text-[#EF000C] mx-[4rpx]">{{ info.days }}</text>天</view>
<text class="nc-iconfont nc-icon-xiaV6xx pt-[4rpx] px-[6rpx] text-[var(--text-color-light9)] text-[24rpx]" v-if="!flag" @click="flag = !flag"></text>
</view>
<view class="relative z-9 bg-[#fff] rounded-[18rpx]">
<view>
<view class="flex items-center justify-between text-[#626779] text-[24rpx] mb-[16rpx]">
<view class="flex items-center justify-between text-[var(--text-color-light9)] text-[24rpx] mb-[16rpx]">
<text class="w-[14.28%] leading-[36rpx] text-center">周一</text>
<text class="w-[14.28%] leading-[36rpx] text-center">周二</text>
<text class="w-[14.28%] leading-[36rpx] text-center">周三</text>
@ -54,7 +52,7 @@
<view class="flex flex-wrap items-center justify-start" v-if="!flag">
<block v-for="(item,index) in state.weekCount" :key="index">
<view class="w-[14.28%] flex flex-col justify-center items-center">
<view v-if="filteredDate(item)" class="w-[74rpx] h-[92rpx] bg-[#F1F2F5] text-[#626779] box-border py-[10rpx] rounded-[8rpx] flex flex-col items-center" :class="{'sigin-bg !text-[#fff]': isVerDate(item),'!bg-[#F6FAFF] border-[1rpx] border-[#F0F4FA] border-solid': !isVerDate(item) && item < state.curDate && (state.curMonth + 1) == (new Date().getMonth() + 1) ,'mb-[20rpx]':isCurrentDate(item),'mb-[30rpx]':!isCurrentDate(item)}" @click="getDayPackFn(item)">
<view v-if="filteredDate(item)" class="w-[74rpx] h-[92rpx] bg-[#f4f4f4] text-[var(--text-color-light6)] box-border py-[10rpx] rounded-[8rpx] flex flex-col items-center" :class="{'sigin-bg !text-[#fff]': isVerDate(item),'!bg-[#f9f9f9] border-[1rpx] !text-[var(--text-color-light9)] border-[#f5f5f5] border-solid': !isVerDate(item) && item < state.curDate && (state.curMonth + 1) == (new Date().getMonth() + 1) ,'mb-[20rpx]':isCurrentDate(item),'mb-[30rpx]':!isCurrentDate(item)}" @click="getDayPackFn(item)">
<text class="text-[24rpx] leading-[28rpx] mb-[6rpx]">{{ filteredDate(item) }}</text>
<view v-if="filteredDate(item)" class="flex items-center justufy-center">
<image v-if="isPackDate(item)" :src="img('static/resource/images/app/package.png')" class="w-[40rpx] h-[40rpx]"></image>
@ -70,9 +68,9 @@
</block>
</view>
<view class="flex flex-wrap items-center justify-start" v-else>
<block v-for="(item,index) in state.dataCount" >
<block v-for="(item,index) in state.dataCount">
<view class="w-[14.28%] flex flex-col justify-center items-center mb-[30rpx]">
<view v-if="filteredDate(item)" class="w-[74rpx] h-[92rpx] bg-[#F6FAFF] text-[#626779] box-border py-[10rpx] rounded-[8rpx] flex flex-col items-center" :class="{'sigin-bg !text-[#fff]': isVerDate(item) && active ,'!bg-[#FDFDFD] border-[1rpx] border-[#F0F4FA] border-solid': !isVerDate(item) && item < state.curDate && (state.curMonth + 1) == (new Date().getMonth() + 1) && state.curYear == new Date().getFullYear() ,'mb-[20rpx]':isCurrentDate(item),'mb-[30rpx]':!isCurrentDate(item)}" @click="getDayPackFn(item)">
<view v-if="filteredDate(item)" class="w-[74rpx] h-[92rpx] bg-[#F6FAFF] text-[var(--text-color-light6)] box-border py-[10rpx] rounded-[8rpx] flex flex-col items-center" :class="{'sigin-bg !text-[#fff]': isVerDate(item) && active ,'!bg-[#FDFDFD] border-[1rpx] border-[#F0F4FA] border-solid': !isVerDate(item) && item < state.curDate && (state.curMonth + 1) == (new Date().getMonth() + 1) && state.curYear == new Date().getFullYear() ,'mb-[20rpx]':isCurrentDate(item),'mb-[30rpx]':!isCurrentDate(item)}" @click="getDayPackFn(item)">
<text class="text-[24rpx] leading-[28rpx] mb-[6rpx]">{{ filteredDate(item) }}</text>
<view v-if="filteredDate(item)" class="flex items-center justufy-center">
<image v-if="isPackDate(item)" :src="img('static/resource/images/app/package.png')" class="w-[40rpx] h-[40rpx]"></image>
@ -81,7 +79,6 @@
<image v-if="!isVerDate(item) && item < state.curDate && (state.curMonth + 1) == (new Date().getMonth() + 1)" :src="img('static/resource/images/app/nosigin.png')" class="w-[34rpx] h-[34rpx]"></image>
<image v-else :src="img('static/resource/images/app/nosigin1.png')" class="w-[34rpx] h-[34rpx]"></image>
</template>
</view>
</view>
<view class="w-[10rpx] h-[10rpx] rounded-[50%] bg-[#FF5527]" v-if="isCurrentDate(item)"></view>
@ -89,12 +86,12 @@
</block>
</view>
<view class="mt-[40rpx] flex justify-center" v-if="state.curMonth + 1 == (new Date().getMonth() + 1) && state.curYear == new Date().getFullYear() ">
<button v-if="!info.is_sign" class="rounded-[40rpx] !bg-transparent" :style="{width:'490rpx',height:'88rpx',border:'none', color:'#fff', fontSize:'32rpx',lineHeight:'84rpx',backgroundImage: `url(${img('static/resource/images/app/button_bg2.png')})`,backgroundSize: '100%', backgroundRepeat: 'no-repeat'}" shape="circle" @click="setSignFn">
<text class="nc-iconfont nc-icon-meiriqiandaoV6xx text-[32rpx] text-[#fff] mr-[8rpx]"></text>
<button v-if="!info.is_sign" class="rounded-[40rpx] flex-center !bg-transparent text-[26rpx] font-500" :style="{width:'490rpx',height:'80rpx',border:'none', color:'#fff',backgroundImage: `url(${img('static/resource/images/app/button_bg2.png')})`,backgroundSize: '100%', backgroundRepeat: 'no-repeat'}" shape="circle" @click="setSignFn">
<text class="nc-iconfont nc-icon-a-meiriqiandaoV6xx-36 text-[26rpx] text-[#fff] mr-[8rpx]"></text>
<text>立即签到</text>
</button>
<button v-else class="rounded-[40rpx] !bg-transparent" :style="{width:'490rpx',height:'88rpx',border:'none',color:'#fff', fontSize:'32rpx',lineHeight:'84rpx',backgroundImage: `url(${img('static/resource/images/app/button_bg1.png')})`,backgroundSize: '100%', backgroundRepeat: 'no-repeat'}" shape="circle">
<text class="nc-iconfont nc-icon-meiriqiandaoV6xx text-[32rpx] text-[#fff] mr-[8rpx]"></text>
<button v-else class="rounded-[40rpx] flex-center !bg-transparent text-[26rpx] font-500" :style="{width:'490rpx',height:'80rpx',border:'none',color:'#fff', backgroundImage: `url(${img('static/resource/images/app/button_bg1.png')})`,backgroundSize: '100%', backgroundRepeat: 'no-repeat'}" shape="circle">
<text class="nc-iconfont nc-icon-a-meiriqiandaoV6xx-36 text-[26rpx] text-[#fff] mr-[8rpx]"></text>
<text>已签到</text>
</button>
</view>
@ -103,10 +100,10 @@
</view>
</view>
<view class="mt-[20rpx] mb-[30rpx] sidebar-marign card-template" v-if="info && info.continue_award && Object.keys(info.continue_award).length">
<view class="mt-[20rpx] mb-[30rpx] sidebar-margin card-template" v-if="info && info.continue_award && Object.keys(info.continue_award).length">
<view class="mb-[30rpx] flex items-center">
<view class="font-500 text-[32rpx] text-[#333] leading-[44rpx]">签到奖励</view>
<!-- <view class="text-[#666] text-[26rpx] leading-[30rpx]">
<view class="font-500 text-[30rpx] text-[#303133]">签到奖励</view>
<!-- <view class="text-[var(--text-color-light6)] text-[26rpx] leading-[30rpx]">
<text>签到记录</text>
<image :src="img('static/resource/images/app/more.png')" class="w-[12rpx] h-[18rpx] ml-[8rpx]"></image>
</view> -->
@ -126,7 +123,7 @@
<image :src="img('static/resource/images/app/icon_05.png')" class="w-[40rpx] h-[40rpx]"></image>
</view>
<view class="flex-1 mx-[20rpx]">
<view class="font-400 text-[28rpx] text-[#333] leading-[38rpx] mb-[8rpx]">连续签到{{item.continue_sign}}天</view>
<view class="font-400 text-[28rpx] text-[#303133] leading-[38rpx] mb-[10rpx]">连续签到{{item.continue_sign}}天</view>
<view class="flex flex-wrap" v-if="item.gift">
<view class="flex">
<image :src="img(item.gift.total.icon)" class="w-[30rpx] h-[30rpx] flex-shrink-0"></image>
@ -135,8 +132,8 @@
</view>
</view>
<view class="flex-shrink-0">
<view v-if="Number(info.days) < Number(item.continue_sign) " class="w-[130rpx] h-[56rpx] text-center bg-[#FFECE9] rounded-[28rpx] font-400 text-[26rpx] text-[#FF343E] leading-[56rpx]">待完成</view>
<view v-else class="w-[130rpx] h-[56rpx] text-center rounded-[28rpx] font-400 text-[26rpx] text-[#fff] leading-[56rpx]" style="background:linear-gradient( 90deg, #FB7939 0%, #FE120E 100%) ;">已完成</view>
<view v-if="Number(info.days) < Number(item.continue_sign) " class="w-[130rpx] h-[54rpx] text-center bg-primary-light rounded-[28rpx] text-[22rpx] text-[var(--primary-color)] flex-center font-500">待完成</view>
<view v-else class="primary-btn-bg w-[130rpx] h-[54rpx] text-center rounded-[27rpx] text-[22rpx] text-[#fff] flex-center font-500">已完成</view>
</view>
</view>
</view>
@ -150,83 +147,83 @@
<u-empty text="签到未开启" width="347rpx" height="265rpx" :icon="img('static/resource/images/system/empty.png')"/>
</view>
<!-- 签到规则-->
<u-popup :show="signPopup" :round="16" mode="bottom" :closeable="true" @close="signPopup = false">
<view class="pt-[30rpx] px-[32rpx] pb-[20rpx]">
<view class="text-center text-[32rpx] font-700 text-[#323233]">签到规则</view>
<scroll-view :scroll-y="true" class="my-[20rpx] h-[360rpx] overflow-auto">
<u-popup :show="signPopup" :round="16" mode="bottom" @close="signPopup = false">
<view class="popup-common">
<view class="title">签到规则</view>
<scroll-view :scroll-y="true" class="px-[30rpx] box-border h-[360rpx] overflow-auto">
<block v-for="(item) in info.rule_explain.split('\n')">
<view class="text-[28rpx] leading-[40rpx] mb-[20rpx]">{{ item }}</view>
</block>
</scroll-view>
<view>
<button class="primary-btn-bg h-[66rpx] text-[#fff] text-[28rpx] border-[0] leading-[66rpx] rounded-[50rpx]" shape="circle" @click="signPopup = false">知道了</button>
<view class="btn-wrap">
<button class="primary-btn-bg btn" @click="signPopup = false">知道了</button>
</view>
</view>
</u-popup>
<!-- 签到奖励 -->
<u-popup :show="awardShow" class="award-popup" :customStyle="{backgroundColor:'transparent'}" @close="awardShow = false" mode="center" :round="5" :safeAreaInsetBottom="false" >
<u-popup :show="awardShow" class="award-popup overflow-hidden" :customStyle="{backgroundColor:'transparent'}" @close="awardShow = false" mode="center" round="var(--rounded-big)" :safeAreaInsetBottom="false" >
<view class="w-[550rpx] -mt-[124rpx]" v-if="Object.values(signAward).length">
<view class="flex justify-center">
<image :src="img('static/resource/images/app/award.png')" class="w-[484rpx] h-[480rpx] z-10" mode="aspectFill"></image>
</view>
<view class="-mt-[265rpx] bg-award rounded-[30rpx] pt-[100rpx] pb-[40rpx] mb-[50rpx] relative">
<view class="-mt-[265rpx] bg-award rounded-[40rpx] pt-[100rpx] pb-[50rpx] mb-[50rpx] relative">
<view class="px-[32rpx]">
<view class="text-[48rpx] text-[#EF000C] font-bold leading-[68rpx] mb-[6rpx] text-center">{{ signAward.title }}</view>
<view class="text-[24rpx] text-[#F05F66] leading-[34rpx] text-center mb-[60rpx]" v-if="signAward.info">{{ signAward.info }}</view>
<view class="px-[68rpx] mb-[80rpx]">
<view class="text-[36rpx] text-[#EF000C] font-500 mb-[10rpx] text-center">{{ signAward.title }}</view>
<view class="text-[24rpx] text-[#333] leading-[34rpx] text-center mb-[60rpx]" v-if="signAward.info">{{ signAward.info }}</view>
<view class="px-[68rpx] mb-[100rpx]">
<block v-for="(item,index) in signAward.awards">
<template v-if="item.content" v-for="(subItem,subIndex) in item.content">
<view class="flex items-center mb-[30rpx]" >
<image :src="img(subItem.icon)" class="w-[42rpx] h-[42rpx]"></image>
<view class="ml-[20rpx] text-[28rpx] text-[#333] leading-[38rpx]">{{subItem.text }}</view>
<view class="ml-[20rpx] text-[28rpx] text-[#303133] leading-[38rpx]">{{subItem.text }}</view>
</view>
</template>
</block>
</view>
<view class="flex justify-center relative z-30">
<view class="w-[370rpx] h-[88rpx] primary-btn-bg rounded-[50rpx] text-[#ffffff] text-center leading-[88rpx] text-[32rpx]" @click="awardShow = false">我知道了</view>
<view class="w-[370rpx] h-[80rpx] primary-btn-bg font-500 rounded-[100rpx] text-[#ffffff] text-center leading-[80rpx] text-[26rpx]" @click="awardShow = false">我知道了</view>
</view>
</view>
</view>
<view class="flex justify-center">
<text class="nc-iconfont nc-icon-cuohaoV6xx text-[#fff] text-[60rpx]" @click="awardShow = false"></text>
<text class="nc-iconfont nc-icon-cuohaoV6xx1 text-[#fff] text-[50rpx]" @click="awardShow = false"></text>
</view>
</view>
</u-popup>
<!-- 查看当日或连续签到奖励 -->
<u-popup :show="packShow" class="award-popup" :customStyle="{backgroundColor:'transparent'}" @close="packShow = false" mode="center" :round="5" :safeAreaInsetBottom="false">
<u-popup :show="packShow" class="award-popup overflow-hidden" :customStyle="{backgroundColor:'transparent'}" @close="packShow = false" mode="center" round="var(--rounded-big)" :safeAreaInsetBottom="false">
<view class="w-[550rpx] -mt-[124rpx]" v-if="Object.values(packInfo).length">
<view class="flex justify-center">
<image :src="img('static/resource/images/app/award.png')" class="w-[484rpx] h-[480rpx] z-10" mode="aspectFill"></image>
</view>
<view class="-mt-[265rpx] bg-award rounded-[30rpx] pt-[100rpx] pb-[40rpx] mb-[50rpx] relative">
<view class="-mt-[265rpx] bg-award rounded-[40rpx] pt-[100rpx] pb-[50rpx] mb-[50rpx] relative">
<view class="px-[32rpx]">
<view class="text-[48rpx] text-[#333] font-bold leading-[68rpx] mb-[6rpx] text-center relative z-20">
<view class="text-[36rpx] text-[#303133] font-500 mb-[10rpx] text-center relative z-20">
{{ packInfo.title }}
</view>
<view class="text-[24rpx] text-[#F05F66] leading-[34rpx] text-center mb-[60rpx]">{{ packInfo.info }}</view>
<view class="px-[68rpx] mb-[80rpx]">
<view class="text-[24rpx] text-[#333] leading-[34rpx] text-center mb-[60rpx]">{{ packInfo.info }}</view>
<view class="px-[68rpx] mb-[100rpx]">
<block v-for="(item,index) in packInfo.awards">
<template v-if="item.content">
<view class="flex items-center mb-[32rpx]" v-for="(subItem,subIndex) in item.content" :key="subIndex">
<image :src="img(subItem.icon)" class="w-[42rpx] h-[42rpx]"></image>
<view class="ml-[20rpx] text-[28rpx] text-[#333] leading-[38rpx]">{{ subItem.text }}</view>
<view class="ml-[20rpx] text-[28rpx] text-[#303133] leading-[38rpx]">{{ subItem.text }}</view>
</view>
</template>
</block>
</view>
<view class="flex justify-center relative z-30">
<view class="w-[370rpx] h-[88rpx] border-[4rpx] border-[#EF000C] border-solid rounded-[50rpx] text-[#EF000C] text-center leading-[88rpx] text-[32rpx] font-500 box-border" @click="packShow = false">我知道了</view>
<view class="w-[370rpx] h-[80rpx] border-[2rpx] text-[var(--primary-color)] border-solid rounded-[40rpx] border-[var(--primary-color)] text-center flex-center text-[26rpx] box-border" @click="packShow = false">我知道了</view>
</view>
</view>
</view>
<view class="flex justify-center">
<text class="nc-iconfont nc-icon-cuohaoV6xx text-[#fff] text-[60rpx]" @click="packShow = false"></text>
<text class="nc-iconfont nc-icon-cuohaoV6xx1 text-[#fff] text-[50rpx]" @click="packShow = false"></text>
</view>
</view>
</u-popup>
</view>
<u-loading-page bg-color="rgb(248,248,248)" :loading="loading" loadingText="" fontSize="16" color="#303133"></u-loading-page>
<loading-page :loading="loading"></loading-page>
</view>
</template>
@ -254,9 +251,9 @@ const week = reactive({
})
const loading = ref(false)
const flag = ref(false)
const info = ref({}) //签到配置
const info: any = ref({}) //签到配置
const signPopup = ref(false)//签到规则弹框
const signAward = ref({}) //当日签到奖励
const signAward: any = ref({}) //当日签到奖励
const awardShow = ref(false) // 每日签到弹框
const packShow = ref(false) //查看每天礼包
const packInfo = ref({}) //礼包奖励
@ -287,7 +284,7 @@ const getSignConfigFn = () =>{
getSignConfig().then((res:any) =>{
info.value = res.data
if(!info.value.is_use){
topTabbarData = topTabarObj.setTopTabbarParam({title:'我的签到',topStatusBar:{textColor:'#333',bgColor:'#fff'}})
topTabbarData = topTabarObj.setTopTabbarParam({title:'我的签到',topStatusBar:{textColor:'#303133',bgColor:'#fff'}})
}
loading.value = false
})
@ -310,7 +307,7 @@ const getSignInfoFn = (data:any) =>{
}
//获取当月总天数
const getDayCounts= () => {
const getDayCounts = () => {
let counts = new Date(state.curYear,state.curMonth+1,0).getDate()
//获取当前第一天是星期几
let firstWeekDay = new Date(state.curYear,state.curMonth,1).getDay()
@ -376,12 +373,12 @@ const memberStore = useMemberStore()
// 点击签到
const setSignFn = () =>{
setSign().then(res =>{
setSign().then((res: any) =>{
if(Object.values(res.data).length){
signAward.value = res.data
// 如果没有奖励内容则不展示描述信息
let isShowInfo = 0
Object.values(signAward.value.awards).forEach((item,index)=>{
Object.values(signAward.value.awards).forEach((item: any,index)=>{
if(!item.content){
isShowInfo++;
}
@ -396,9 +393,8 @@ const setSignFn = () =>{
}
})
}
// 查看每日礼包
const curPickDay = ref(null)
const curPickDay: any = ref(null)
const getDayPackFn = (date:number) =>{
let {curYear,curMonth}=toRefs(state)
let itemDate=`${curYear.value}-${(curMonth.value+1) < 10 ? '0' + (curMonth.value+1) : (curMonth.value+1)}-${date < 10 ? '0'+date : date}`
@ -426,7 +422,7 @@ const isVerDate = (val:any) => {
}
//判断是否是当前日期
const isCurrentDate=(date)=>{
const isCurrentDate=(date: any)=>{
if(date> 0 && date <= state.dataCount.length){
if(date == state.curDate && currentYear == state.curYear && currentMonth == state.curMonth){
return true
@ -451,7 +447,7 @@ const filteredDate=(date :any)=>{
}
// 获取系统状态栏的高度
let menuButtonInfo = {};
let menuButtonInfo: any = {};
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
menuButtonInfo = uni.getMenuButtonBoundingClientRect();
@ -466,7 +462,7 @@ const headStyle = computed(() => {
return style
})
const topStyle = computed(() => {
let style = pxToRpx(Number(menuButtonInfo.height) + menuButtonInfo.top + 8)+38 + 'rpx;'
let style = pxToRpx(Number(menuButtonInfo.height) + menuButtonInfo.top + 8)+ 50 + 'rpx;'
return style
})
</script>

36
uni-app/src/app/pages/pay/result.vue
View File

@ -1,17 +1,23 @@
<template>
<view :style="themeColor()">
<view class="w-screen h-screen flex flex-col items-center" v-if="payInfo">
<view class="flex-1 flex flex-col items-center w-full pt-[100rpx]">
<text class="iconfont text-2xl" :class="payInfo.status==2 ? 'text-primary iconduigou' : 'iconzhifushibai text-red'"></text>
<view class=" text-sm">{{ payInfo.status == 2 ? t('pay.paySuccess') : t('pay.payFail') }}</view>
<view class="text-xl font-bold pt-[30rpx]">
<text class="text-base">{{ t('currency') }}</text>
<top-tabbar ref="topTabbarRef" :data="topTabbarParam" />
<view class="flex-1 flex flex-col items-center w-full pt-[180rpx]">
<view class="flex items-baseline" :class="{'text-[#06c05d]': payInfo.status==2, 'text-red': payInfo.status!=2}">
<text class="nc-iconfont -mb-[4rpx] !text-[32rpx]" :class="{'nc-icon-duihaoV6mm': payInfo.status==2, 'nc-icon-tanhaoV6mm': payInfo.status!=2}"></text>
<text class="text-[36rpx] ml-[16rpx] font-500">{{ payInfo.status == 2 ? '支付成功' : '支付失败' }}</text>
</view>
<view class="text-[56rpx] font-500 mt-[60rpx] price-font">
<text class="text-[36rpx] mr-[6rpx]">{{ t('currency') }}</text>
<text>{{ moneyFormat(payInfo.money) }}</text>
</view>
</view>
<view class="pb-[200rpx] w-[240rpx]">
<u-button type="primary" :text="payInfo.status == 2 ? t('complete') : t('close')" :plain="true" @click="complete"></u-button>
</view>
<view class="pb-[260rpx]">
<button class="w-[380rpx] !border-0 h-[80rpx] text-[28rpx] text-[#333] !bg-[#f2f2f2] flex-center font-500 rounded-[20rpx]" :plain="true" @click="complete">
{{payInfo.status == 2 ? t('complete') : t('close')}}
</button>
</view>
</view>
<u-modal :show="loading" :showCancelButton="true" :confirmText="t('pay.completePay')" :cancelText="t('pay.incompletePay')" @cancel="complete" confirmColor="var(--primary-color)">
<view class="py-[20rpx]">
@ -28,12 +34,18 @@
import { t } from '@/locale'
import { redirect, moneyFormat } from '@/utils/common'
import { getFirstPage } from '@/utils/pages'
import { topTabar } from '@/utils/topTabbar'
const payInfo = ref<AnyObject | null>(null)
const loading = ref(false)
let tradeType = ''
let tradeId = 0
let requestNum = 0
/********* 自定义头部 - start ***********/
const topTabarObj = topTabar()
let topTabbarParam = topTabarObj.setTopTabbarParam({title:'',isBack:false})
/********* 自定义头部 - end ***********/
onLoad((data : any) => {
tradeType = data.trade_type
@ -45,7 +57,7 @@
* 获取支付信息
*/
const getPayInfo = () => {
getPayInfoApi(tradeType, tradeId).then((res: responseResult) => {
getPayInfoApi(tradeType, tradeId).then((res: any) => {
if (!uni.$u.test.isEmpty(res.data)) {
if (res.data.status == 1 && requestNum < 5) {
loading.value = true
@ -57,9 +69,9 @@
}
payInfo.value = res.data
loading.value = false
uni.setNavigationBarTitle({
title: payInfo.value.status == 2 ? t('pay.paySuccess') : t('pay.payFail')
})
// uni.setNavigationBarTitle({
// title: payInfo.value.status == 2 ? t('pay.paySuccess') : t('pay.payFail')
// })
}
})
}

72
uni-app/src/app/pages/setting/index.vue
View File

@ -1,24 +1,20 @@
<template>
<view class="w-full h-screen box-border pt-[30rpx] bg-page setting-wrap" :style="themeColor()">
<view class="m-[30rpx] mt-0 bg-white rounded-md overflow-hidden px-[20rpx] py-[10rpx]">
<u-cell-group :border="false">
<view class="w-full h-screen box-border pt-[var(--top-m)] bg-[var(--page-bg-color)] setting-wrap" :style="themeColor()">
<view class="mb-[var(--top-m)] sidebar-margin card-template !py-[20rpx]">
<u-cell-group :border="false" class="cell-group">
<u-cell :title="t('personalSettings')" :is-link="true" url="/app/pages/member/personal"></u-cell>
<u-cell :title="t('switchLang')" :is-link="true" :value="lang" @click="langSheetShow = true"></u-cell>
<u-cell :title="t('version')" :value="version"></u-cell>
</u-cell-group>
</view>
<view class="m-[30rpx] bg-white rounded-md overflow-hidden px-[20rpx] py-[10rpx]">
<u-cell-group :border="false">
<view class="mb-[var(--top-m)] sidebar-margin card-template !py-[20rpx]">
<u-cell-group :border="false" class="cell-group">
<u-cell :title="t('userAgreement')" :is-link="true" url="/app/pages/auth/agreement?key=service"></u-cell>
<u-cell :title="t('privacyAgreement')" :is-link="true" url="/app/pages/auth/agreement?key=privacy"></u-cell>
</u-cell-group>
</view>
<view class="m-[30rpx] bg-white rounded-md overflow-hidden px-[20rpx]">
<u-cell-group :border="false">
<view class="text-center py-[20rpx] text-sm" @click="memberStore.logout(true)">{{ t('logout') }}</view>
</u-cell-group>
</view>
<view class="h-[88rpx] flex-center bg-[#fff] mx-[var(--sidebar-m)] rounded-[var(--rounded-big)] text-[28rpx]" @click="memberStore.logout(true)">{{ t('logout') }}</view>
<u-action-sheet :actions="langList" :show="langSheetShow" :closeOnClickOverlay="true"
:safeAreaInsetBottom="true"
@ -30,7 +26,6 @@
import { ref, reactive, computed } from 'vue'
import useMemberStore from '@/stores/member'
import { t, language } from '@/locale'
import { currRoute, isWeixinBrowser } from '@/utils/common'
const memberStore = useMemberStore()
@ -63,24 +58,49 @@
page {
background: var(--page-bg-color);
}
:deep(.u-cell-group__wrapper) {
.u-cell__body {
padding-left: 0;
padding-right: 0;
}
.u-cell__value{
line-height: 1;
:deep(.cell-group), :deep(.u-cell-group){
.u-cell{
.u-cell__body{
padding: 0;
height: 90rpx;
margin-top: 16rpx;
}
&:first-of-type .u-cell__body{
margin-top: 0;
}
.u-cell__title-text{
font-size:28rpx;
line-height: 40rpx;
}
.u-icon__icon{
font-size: 24rpx !important;
}
.u-cell__value{
line-height: 1;
font-size:28rpx;
}
.u-line{
display: none;
}
}
.u-cell {
&:last-child .u-line {
display: none;
}
}
}
}
:deep(.u-action-sheet){
.u-line{
margin: 0 30rpx !important;
width: auto !important;
border-color: #ddd !important;
}
.u-action-sheet__cancel{
padding: 0;
}
.u-action-sheet__item-wrap__item__name{
font-size: 30rpx !important;
}
}
</style>
<style>
.setting-wrap .u-cell--clickable{
background-color: transparent;
background-color: transparent !important;
}
</style>

61
uni-app/src/app/pages/verify/detail.vue
View File

@ -1,53 +1,56 @@
<template>
<view :style="themeColor()" class="bg-[#f8f8f8] min-h-[100vh] overflow-hidden">
<view :style="themeColor()" class="bg-[var(--page-bg-color)] min-h-[100vh] overflow-hidden">
<block v-if="!loading">
<view class="pt-[20rpx] sidebar-marign">
<view class="pt-[20rpx] sidebar-margin">
<view class="flex flex-col card-template">
<view class="flex" :class="{'mb-[20rpx]': verifyInfo.value.list.length-1 != index}" v-for="(item,index) in verifyInfo.value.list" :key="index">
<image class="w-[150rpx] h-[150rpx] rounded-[8rpx]" mode="aspectFill" v-if="item.cover" :src="img(item.cover)"></image>
<image class="w-[150rpx] h-[150rpx] rounded-[8rpx]" mode="aspectFill" v-else :src="img('addon/tourism/tourism/member/hotel.png')"></image>
<image class="w-[150rpx] h-[150rpx] rounded-[var(--goods-rounded-big)]" mode="aspectFill" v-if="item.cover" :src="img(item.cover)"></image>
<image class="w-[150rpx] h-[150rpx] rounded-[var(--goods-rounded-big)]" mode="aspectFill" v-else :src="img('addon/tourism/tourism/member/hotel.png')"></image>
<view class="flex flex-col flex-1 ml-[20rpx] py-[4rpx]">
<view class="leading-[1.3] text-[28rpx] multi-hidden">{{item.name}}</view>
<view class="self-end text-[#626779] text-[26rpx] mt-[20rpx]">x1</view>
<view class="leading-[40rpx] truncate max-w-[490rpx] text-[28rpx]">{{item.name}}</view>
<view class="mt-[14rpx] truncate text-[24rpx] text-[var(--text-color-light9)] leading-[28rpx] max-w-[490rpx] " v-if="item.sub_name">
{{ item.sub_name }}
</view>
<view class="text-[var(--text-color-light6)] text-[26rpx] mt-[20rpx]">x1</view>
</view>
</view>
</view>
<view class="flex flex-col card-template mt-[20rpx]">
<view class="text-[32rpx] text-[#333333] font-500 leading-[1.2] mb-[30rpx]">核销信息</view>
<view class="flex justify-between h-[36rpx] items-center">
<text class="text-[26rpx] text-[#626779]">核销类型</text>
<view class="text-[26rpx] text-[#333]">{{verifyInfo.type_name}}</view>
<view class="flex flex-col card-template mt-[20rpx] text-[28rpx]">
<view class="title">核销信息</view>
<view class="card-template-item justify-between">
<text class="text-[28rpx] text-[#333]">核销类型</text>
<view class="text-[28rpx] text-[#333]">{{verifyInfo.type_name}}</view>
</view>
<view class="flex justify-between h-[36rpx] items-center mt-[20rpx]">
<text class="text-[26rpx] text-[#626779]">核销状态</text>
<view class="text-[26rpx] text-[#333]">已核销</view>
<view class="card-template-item justify-between">
<text class="text-[28rpx] text-[#333]">核销状态</text>
<view class="text-[28rpx] text-[#333]">已核销</view>
</view>
<view class="flex justify-between h-[36rpx] items-center mt-[20rpx]">
<text class="text-[26rpx] text-[#626779]">核销时间</text>
<view class="text-[#333333] text-[26rpx]">{{verifyInfo.create_time}}</view>
<view class="card-template-item justify-between">
<text class="text-[28rpx] text-[#333]">核销时间</text>
<view class="text-[#333333] text-[28rpx]">{{verifyInfo.create_time}}</view>
</view>
<view class="flex justify-between h-[36rpx] items-center mt-[20rpx]">
<text class="text-[26rpx] text-[#626779]">核销人员</text>
<view class="text-[#333333] text-[26rpx]">{{verifyInfo.member ? verifyInfo.member.nickname : '--'}}</view>
<view class="card-template-item justify-between">
<text class="text-[28rpx] text-[#333]">核销人员</text>
<view class="text-[#333333] text-[28rpx]">{{verifyInfo.member ? verifyInfo.member.nickname : '--'}}</view>
</view>
<view class="flex items-center h-[36rpx] justify-between mt-[20rpx]" v-for="(item,index) in verifyInfo.value.content.fixed">
<text class="text-[26rpx] text-[#626779]">{{item.title}}</text>
<view class="text-[26rpx] text-[#333]">{{item.value}}</view>
<view class="card-template-item justify-between" v-for="(item,index) in verifyInfo.value.content.fixed">
<text class="text-[28rpx] text-[#333]">{{item.title}}</text>
<view class="text-[28rpx] text-[#333]">{{item.value}}</view>
</view>
</view>
<view v-for="(item,index) in verifyInfo.value.content.diy" :key="index" class="card-template mt-[20rpx]">
<view class="text-[32rpx] text-[#333333] font-500 leading-[1.2] mb-[30rpx]">{{item.title}}</view>
<view class="flex items-center h-[36rpx] justify-between mt-[20rpx]" v-for="(subItem,subIndex) in item.list" :key="subIndex" :class="{'mt-30rpx' : subIndex == '0'}">
<text class="text-[26rpx] text-[#626779]">{{subItem.title}}</text>
<view class="text-[26rpx] text-[#333]">{{subItem.value}}</view>
<view v-for="(item,index) in verifyInfo.value.content.diy" :key="index" class="card-template top-mar">
<view class="title">{{item.title}}</view>
<view class="card-template-item justify-between" v-for="(subItem,subIndex) in item.list" :key="subIndex" :class="{'mt-30rpx' : subIndex == '0'}">
<text class="text-[28rpx] text-[#333]">{{subItem.title}}</text>
<view class="text-[28rpx] text-[#333]">{{subItem.value}}</view>
</view>
</view>
</view>
</block>
<u-loading-page :loading="loading" loading-text="" loadingColor="var(--primary-color)" iconSize="35"></u-loading-page>
<loading-page :loading="loading"></loading-page>
</view>
</template>

92
uni-app/src/app/pages/verify/index.vue
View File

@ -1,37 +1,37 @@
<template>
<view :style="themeColor()">
<view class="w-[100vw] min-h-[100vh] bg-[#f8f8f8]" v-if="!loading">
<view class="w-[100vw] min-h-[100vh] bg-[#f8f8f8]" v-if="!loading && isVerify">
<view class="w-full bg-[#fff] verify-box h-[760rpx]">
<view class="text-[var(--primary-color)] fixed top-[40rpx] right-[30rpx] flex items-center" @click="redirect({url:'/app/pages/verify/record'})">
<image class="w-[26rpx] h-[28rpx]" :src="img('static/resource/images/verify/history.png')"/>
<text class="text-[26rpx] ml-[10rpx]">核销记录</text>
<text class="nc-iconfont nc-icon-lishijiluV6xx !text-[28rpx] -mb-[2rpx]"></text>
<text class="text-[26rpx] ml-[8rpx]">核销记录</text>
</view>
<view v-show="operationType == 'sweepCode'" class="flex flex-col items-center justify-center">
<view class="sweep-code flex items-center justify-center" @click="scanCode">
<image class="w-[354rpx] h-[354rpx]" :src="img('static/resource/images/verify/saoma.png')"/>
</view>
<view class="mt-[40rpx] text-[32rpx]">点击扫描二维码</view>
<view class="mt-[20rpx] text-[#8288A2] text-[26rpx] font-400 pb-[142rpx]">扫描二维码进行核销</view>
<view class="mt-[40rpx] text-[30rpx]">点击扫描二维码</view>
<view class="mt-[20rpx] text-[var(--text-color-light9)] text-[26rpx] font-400 pb-[142rpx]">扫描二维码进行核销</view>
</view>
<view v-show="operationType == 'manualInput'">
<view class="flex pt-[126rpx] items-center justify-center">
<view class="flex justify-center items-center flex-col pr-[30rpx] w-[130rpx]">
<view class="flex justify-center items-center flex-col pr-[30rpx] min-w-[130rpx]">
<image class="w-[100rpx] h-[100rpx]" :src="img('static/resource/images/verify/shuruhexiaoma.png')"/>
<view class="text-[26rpx] h-[36rpx] leading-[36rpx] mt-[12rpx]">验证核销码</view>
<view class="text-[26rpx] h-[36rpx] leading-[36rpx] mt-[14rpx]">验证核销码</view>
</view>
<image class="w-[74rpx] h-[12rpx] mb-[50rpx]" :src="img('static/resource/images/verify/youjiantou.png')"/>
<view class="flex justify-center items-center flex-col pl-[30rpx] w-[130rpx]">
<view class="flex justify-center items-center flex-col pl-[30rpx] min-w-[130rpx]">
<image class="w-[100rpx] h-[100rpx]" :src="img('static/resource/images/verify/hexiao1.png')"/>
<view class="text-[26rpx] h-[36rpx] leading-[36rpx] mt-[12rpx]">核销</view>
<view class="text-[26rpx] h-[36rpx] leading-[36rpx] mt-[14rpx]">核销</view>
</view>
</view>
<view class="mt-[50rpx]">
<view class="h-[90rpx] border-[2rpx] border-solid border-[#DCE0EF] rounded-[16rpx] box-border p-[20rpx] mx-[60rpx] flex items-center" >
<view class="h-[90rpx] border-[2rpx] border-solid border-[#eee] rounded-[16rpx] box-border p-[20rpx] mx-[60rpx] flex items-center" >
<text class="nc-iconfont nc-icon-saotiaoxingmaV6xx text-[44rpx] text-[#EF000C]"></text>
<input type="text" placeholder="请输入核销码" class="h-[90rpx] border-none text-start ml-[30rpx] text-[28rpx] flex-1" placeholder-class="_placeholder" v-model="verify_code" :focus="isFocus" ref="input"/>
</view>
<view class="h-[88rpx] min-w-[630rpx] text-[#fff] flex items-center justify-center !text-[32rpx] save-btn rounded-[50rpx] h-[88rpx] mx-[60rpx] mt-[146rpx] relative z-1" @click="confirm">确认</view>
<view class="h-[80rpx] primary-btn-bg min-w-[630rpx] text-[#fff] flex-center !text-[26rpx] save-btn rounded-[100rpx] h-[80rpx] font-500 mx-[60rpx] mt-[146rpx] relative z-1" @click="confirm">核销</view>
</view>
</view>
</view>
@ -56,7 +56,13 @@
<privacy-popup ref="privacyPopup"></privacy-popup>
<!-- #endif -->
</view>
<u-loading-page :loading="loading" loading-text="" loadingColor="var(--primary-color)" iconSize="35"></u-loading-page>
<view class="w-[100vw] min-h-[100vh] bg-[#f8f8f8] overflow-hidden" v-if="!loading && !isVerify">
<view class="empty-page">
<image class="img" :src="img('static/resource/images/system/empty.png')" mode="aspectFit" />
<view class="desc">非核销员无此权限</view>
</view>
</view>
<loading-page :loading="loading"></loading-page>
</view>
</template>
@ -79,6 +85,7 @@
const isFocus = ref(false)
const verify_code = ref('');
const loading = ref(true)
const isVerify = ref(false)
onShow(() => {
if(getToken()) checkIsVerifier();
})
@ -87,29 +94,31 @@
const checkIsVerifier = () => {
getCheckVerifier().then((res:any) =>{
if(!res.data){
uni.showToast({
title: '非核销员无此权限',
icon: 'none'
});
setTimeout(() => {
if(getCurrentPages().length > 1){
uni.navigateBack({
delta: 1
});
}else{
redirect({
url: '/app/pages/member/index',
mode: 'reLaunch'
});
}
}, 1000);
isVerify.value = false
loading.value = false;
// uni.showToast({
// title: '非核销员无此权限',
// icon: 'none'
// });
// setTimeout(() => {
// if(getCurrentPages().length > 1){
// uni.navigateBack({
// delta: 1
// });
// }else{
// redirect({
// url: '/app/pages/member/index',
// mode: 'reLaunch'
// });
// }
// }, 1000);
}else{
isVerify.value = true
loading.value = false;
}
})
}
const scanCode = () => {
// #ifdef MP
uni.scanCode({
@ -169,13 +178,13 @@
const changeOperationType = (type: string) => {
// #ifdef H5
if (type == 'sweepCode' && !isWeixinBrowser()) {
uni.showToast({
title: 'H5端不支持扫码核销',
icon: 'none'
});
return;
}
// if (type == 'sweepCode' && !isWeixinBrowser()) {
// uni.showToast({
// title: 'H5端不支持扫码核销',
// icon: 'none'
// });
// return;
// }
// #endif
operationType.value = type;
}
@ -188,11 +197,11 @@
background: linear-gradient( 180deg, #FF7354 0%, #FF020F 100%), #EF000C;
}
.xuanZhong{
background: linear-gradient( 270deg, #FFD1D1 0%, rgba(255,209,209,0.2) 100%), #FFFFFF;
background: linear-gradient( 270deg, #FFD1D1 0%, rgba(255,209,209,0.1) 100%), #FFFFFF;
color:#EF000C;
}
.xuanZhong1{
background: linear-gradient( 90deg, #FFD1D1 0%, rgba(255,209,209,0.2) 100%), #FFFFFF;
background: linear-gradient( 90deg, #FFD1D1 0%, rgba(255,209,209,0.1) 100%), #FFFFFF;
color:#EF000C;
}
.sweep-code {
@ -206,11 +215,8 @@
border-bottom-left-radius: 400rpx 60rpx;
border-bottom-right-radius: 400rpx 60rpx;
}
.save-btn{
background: linear-gradient( 94deg, #FB7939 0%, #FE120E 99%), #EF000C;
}
._placeholder{
color: #8288A2;
font-size: 26rpx;
color: var(--text-color-light9);
font-size: 28rpx;
}
</style>

153
uni-app/src/app/pages/verify/record.vue
View File

@ -1,110 +1,128 @@
<template>
<view class="bg-[#f8f8f8] min-h-screen overflow-hidden" :style="themeColor()">
<view class="fixed left-0 right-0 top-0 z-99 bg-[#fff] px-[var(--sidebar-m)]">
<view class="py-[14rpx] flex items-center justify-between">
<view class="flex-1 flex items-center h-[60rpx] bg-[#F8F9FD] rounded-[30rpx] px-[20rpx] mr-[30rpx]">
<u-input class="flex-1" maxlength="50" v-model="keyword" @confirm="searchTypeFn()" placeholder="请输入搜索关键词" placeholderClass="text-[#8288A2] text-[24rpx]" fontSize="26rpx" clearable border="none"></u-input>
<text class="nc-iconfont nc-icon-sousuo-duanV6xx1 text-[32rpx] ml-[18rpx] !text-[#999]" @click="searchTypeFn()"></text>
<view class="bg-[var(--page-bg-color)] min-h-screen overflow-hidden" :style="themeColor()">
<view class="fixed left-0 right-0 top-0 z-99 bg-[#fff]">
<view class="py-[14rpx] flex items-center justify-between px-[20rpx]">
<view class="flex-1 search-input mr-[20rpx]">
<text @click.stop="searchTypeFn()" class="nc-iconfont nc-icon-sousuo-duanV6xx1 btn"></text>
<input class="input" maxlength="50" type="text" v-model="keyword" placeholder="请输入搜索关键词" placeholderClass="text-[var(--text-color-light9)] text-[24rpx]" confirm-type="search" @confirm="searchTypeFn()">
<text v-if="keyword" class="nc-iconfont nc-icon-cuohaoV6xx1 clear" @click="keyword=''"></text>
</view>
<view class="nc-iconfont nc-icon-riliV6xx !text-[30rpx] leading-[36rpx]" @click="handleSelect"></view>
<view class="nc-iconfont nc-icon-a-riliV6xx-36 !text-[30rpx] leading-[36rpx] text-[var(--text-color-light6)]" @click="handleSelect"></view>
</view>
</view>
<mescroll-body ref="mescrollRef" top="108rpx" @init="mescrollInit" :down="{ use: false }" @up="geVerifyRecordFn">
<view class="sidebar-marign">
<mescroll-body ref="mescrollRef" top="88rpx" @init="mescrollInit" :down="{ use: false }" @up="geVerifyRecordFn">
<view class="sidebar-margin pt-[var(--top-m)]" v-if="list.length">
<block v-for="(item,index) in list" :key="item.id">
<view class="w-full flex flex-col mb-[20rpx] card-template" @click="toLink(item)">
<view class="flex items-center mb-[30rpx] leading-[1]">
<view class="w-full flex flex-col mb-[var(--top-m)] card-template" @click="toLink(item)">
<view class="flex items-center mb-[30rpx] leading-[1] text-[26rpx]">
<view class="nc-iconfont nc-icon-hexiaotaiV6xx !text-[26rpx] pr-[10rpx]"></view>
<text class="truncate text-[#333333] text-[26rpx]">核销码：{{ item.code }}</text>
<text class="truncate text-[#303133] text-[26rpx]">核销码:</text>
<text class="ml-[10rpx] max-w-[494rpx]">{{ item.code }}</text>
<text class="text-[#303133] text-[26rpx] font-400 nc-iconfont nc-icon-fuzhiV6xx1 ml-[11rpx]" @click.stop="copy(item.code)"></text>
</view>
<view class="flex flex-1" v-for="(dataItem,dataIndex) in item.value.list" :key="dataIndex">
<u--image class="rounded-[8rpx] overflow-hidden" width="120rpx" height="120rpx" :src="img(dataItem.cover ? dataItem.cover : '')" model="aspectFill">
<u--image width="130rpx" height="130rpx" :radius="'var(--goods-rounded-big)'" :src="img(dataItem.cover ? dataItem.cover : '')" mode="aspectFill">
<template #error>
<image class="w-[120rpx] h-[120rpx] rounded-[8rpx] overflow-hidden" :src="img('static/resource/images/diy/shop_default.jpg')" mode="aspectFill"></image>
<image class="w-[130rpx] h-[130rpx] rounded-[var(--goods-rounded-big)] overflow-hidden" :src="img('static/resource/images/diy/shop_default.jpg')" mode="aspectFill"></image>
</template>
</u--image>
<view class="flex flex-col flex-1 justify-between ml-[20rpx] py-[4rpx]" >
<view class="leading-[1.3] multi-hidden text-[28rpx] text-[#333]">{{dataItem.name}}</view>
<view class="self-end text-[26rpx] mt-[10rpx] text-[#626779]">x1</view>
<view class="flex flex-col flex-1 ml-[20rpx] py-[4rpx]" >
<view class="max-w-[490rpx] leading-[1.3] truncate text-[28rpx] text-[#303133]">{{dataItem.name}}</view>
<view class="mt-[14rpx] truncate text-[24rpx] text-[var(--text-color-light9)] max-w-[490rpx] " v-if="item.sub_name">
{{ item.sub_name }}
</view>
<view class="text-[24rpx] mt-[10rpx] text-[var(--text-color-light9)]">x1</view>
</view>
</view>
<view class="flex bg-[#F8F9FD] py-[20rpx] px-[20rpx] rounded-[12rpx] mt-[20rpx]">
<view class="flex bg-[var(--temp-bg)] py-[20rpx] px-[20rpx] rounded-[12rpx] mt-[20rpx]">
<view class="flex-1">
<view class="text-[22rpx] text-[#8288A2] mb-[10rpx] leading-[30rpx]">核销时间</view>
<view class="text-[26rpx] text-[#333] leading-[36rpx]">{{ item.create_time }}</view>
<view class="text-[22rpx] text-[var(--text-color-light9)] mb-[10rpx] leading-[30rpx]">核销时间</view>
<view class="text-[26rpx] text-[#303133] leading-[36rpx]">{{ item.create_time }}</view>
</view>
<view class="flex-1">
<view class="text-[22rpx] text-[#8288A2] mb-[10rpx] leading-[30rpx]">核销员</view>
<view class="text-[26rpx] text-[#333] leading-[36rpx]">{{ item.member ? item.member.nickname : '--' }}</view>
<view class="text-[22rpx] text-[var(--text-color-light9)] mb-[10rpx] leading-[30rpx]">核销员</view>
<view class="text-[26rpx] text-[#303133] leading-[36rpx]">{{ item.member ? item.member.nickname : '--' }}</view>
</view>
</view>
</view>
</block>
</view>
<view class="mx-[30rpx] rounded-[16rpx] noData flex items-center justify-center" v-if="!list.length && loading">
<mescroll-empty :option="{tip : '暂无核销记录'}"></mescroll-empty>
</view>
<mescroll-empty v-if="!list.length && loading" :option="{tip : '暂无核销记录'}"></mescroll-empty>
</mescroll-body>
<!-- 时间选择 -->
<select-date ref="selectDateRef" @confirm="confirmFn" />
<!-- #ifdef MP-WEIXIN -->
<!-- 小程序隐私协议 -->
<wx-privacy-popup ref="wxPrivacyPopupRef"></wx-privacy-popup>
<!-- #endif -->
</view>
</template>
<script setup lang="ts">
import { ref, reactive, computed } from 'vue'
import MescrollBody from '@/components/mescroll/mescroll-body/mescroll-body.vue'
import MescrollEmpty from '@/components/mescroll/mescroll-empty/mescroll-empty.vue'
import useMescroll from '@/components/mescroll/hooks/useMescroll.js'
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
import { getVerifyRecords } from '@/app/api/verify'
import { img, redirect } from '@/utils/common'
import selectDate from '@/components/select-date/select-date.vue';
import { ref, reactive, computed,nextTick } from 'vue'
import MescrollBody from '@/components/mescroll/mescroll-body/mescroll-body.vue'
import MescrollEmpty from '@/components/mescroll/mescroll-empty/mescroll-empty.vue'
import useMescroll from '@/components/mescroll/hooks/useMescroll.js'
import { onPageScroll, onReachBottom,onLoad } from '@dcloudio/uni-app'
import { getVerifyRecords } from '@/app/api/verify'
import { img, redirect,copy } from '@/utils/common'
import selectDate from '@/components/select-date/select-date.vue';
const keyword = ref<string>('')
const create_time = ref([])
const list = ref<Array<Object>>([])
const loading = ref<boolean>(false)
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom)
const keyword = ref<string>('')
const create_time = ref([])
const list = ref<Array<Object>>([])
const loading = ref<boolean>(false)
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom)
const wxPrivacyPopupRef:any = ref(null)
onLoad(() => {
// #ifdef MP
nextTick(()=>{
if(wxPrivacyPopupRef.value) wxPrivacyPopupRef.value.proactive();
})
// #endif
});
const geVerifyRecordFn = (mescroll: any) => {
loading.value = false;
let data : object = {
page: mescroll.num,
limit: mescroll.size,
keyword:keyword.value,
create_time: create_time.value
};
const geVerifyRecordFn = (mescroll) => {
loading.value = false;
let data : object = {
page: mescroll.num,
limit: mescroll.size,
keyword:keyword.value,
create_time: create_time.value
};
getVerifyRecords(data).then((res: any) => {
let newArr = (res.data.data as Array<Object>);
//设置列表数据
if (mescroll.num == 1) {
list.value = []; //如果是第一页需手动制空列表
}
list.value = list.value.concat(newArr);
mescroll.endSuccess(newArr.length);
loading.value = true;
}).catch(() => {
loading.value = true;
mescroll.endErr(); // 请求失败, 结束加载
})
}
getVerifyRecords(data).then((res) => {
let newArr = (res.data.data as Array<Object>);
//设置列表数据
if (mescroll.num == 1) {
list.value = []; //如果是第一页需手动制空列表
}
list.value = list.value.concat(newArr);
mescroll.endSuccess(newArr.length);
loading.value = true;
}).catch(() => {
loading.value = true;
mescroll.endErr(); // 请求失败, 结束加载
})
}
const toLink = (data: AnyObject)=> {
redirect({ url: '/app/pages/verify/detail', param: { code: data.code } })
}
const toLink = (data: AnyObject)=> {
redirect({ url: '/app/pages/verify/detail', param: { code: data.code } })
}
// 关键词搜索条件搜索
const searchTypeFn = () =>{
getMescroll().resetUpScroll();
}
//日期筛选
const selectDateRef = ref()
const handleSelect = () =>{
selectDateRef.value.show = true
}
// 确定时间筛选
const confirmFn = (data) =>{
const confirmFn = (data: any) =>{
create_time.value = data;
list.value = []
getMescroll().resetUpScroll();
@ -122,8 +140,5 @@ const confirmFn = (data) =>{
:deep(.uni-picker-view-indicator::after){
border: none !important;
}
.noData{
height: calc(100vh - 132rpx - constant(safe-area-inset-bottom));
height: calc(100vh - 132rpx - env(safe-area-inset-bottom));
}
</style>

70
uni-app/src/app/pages/verify/verify.vue
View File

@ -1,57 +1,62 @@
<template>
<view :style="themeColor()" class="bg-[#f8f8f8] min-h-[100vh] overflow-hidden">
<view :style="themeColor()" class="bg-[var(--page-bg-color)] min-h-[100vh] overflow-hidden">
<block v-if="!loading && verifyInfo && verifyInfo.value">
<view class="w-full bg-[#fff] flex justify-center">
<view class="text-[var(--primary-color)] absolute top-[40rpx] right-[30rpx] flex items-center" @click="redirect({url:'/app/pages/verify/record'})">
<image class="w-[26rpx] h-[28rpx]" :src="img('static/resource/images/verify/history.png')"/>
<text class="text-[26rpx] ml-[10rpx]">核销记录</text>
<view class="p-[30rpx] bg-[#fff]">
<view class="text-[var(--primary-color)] fixed top-[40rpx] right-[30rpx] flex items-center" @click="redirect({url:'/app/pages/verify/record'})">
<text class="nc-iconfont nc-icon-lishijiluV6xx !text-[28rpx] -mb-[2rpx]"></text>
<text class="text-[26rpx] ml-[8rpx]">核销记录</text>
</view>
<view class="flex pt-[120rpx] pb-[30rpx] items-center">
<view class="flex justify-center items-center flex-col pr-[30rpx] w-[130rpx]">
<view class="flex items-center mt-[60rpx] justify-center">
<view class="flex justify-center items-center flex-col pr-[30rpx]">
<image class="w-[100rpx] h-[100rpx]" :src="img('static/resource/images/verify/yanzhenghexiaoma.png')"/>
<view class="text-[26rpx] mt-[12rpx] h-[36rpx] leading-[36rpx]">验证核销码</view>
<view class="text-[26rpx] mt-[14rpx] h-[36rpx] leading-[36rpx] flex-shrink-0">验证核销码</view>
</view>
<image class="w-[74rpx] h-[12rpx] mb-[50rpx]" :src="img('static/resource/images/verify/youjiantou.png')"/>
<view class="flex justify-center items-center flex-col pl-[30rpx] w-[130rpx]">
<view class="flex justify-center items-center flex-col pl-[30rpx]">
<image class="w-[100rpx] h-[100rpx]" :src="img('static/resource/images/verify/hexiao.png')"/>
<view class="text-[26rpx] mt-[12rpx] h-[36rpx] leading-[36rpx]">确定核销</view>
<view class="text-[26rpx] mt-[14rpx] h-[36rpx] leading-[36rpx] flex-shrink-0">确定核销</view>
</view>
</view>
</view>
<view class="card-template mt-[20rpx] sidebar-marign">
<view class="flex" :class="{'mb-[20rpx]': (verifyInfo.value.list.length - 1 != index)}" v-for="(item,index) in verifyInfo.value.list" :key="index">
<image class="w-[150rpx] h-[150rpx] rounded-[8rpx]" mode="aspectFill" v-if="item.cover" :src="img(item.cover)"></image>
<image class="w-[150rpx] h-[150rpx] rounded-[8rpx]" mode="aspectFill" v-else :src="img('addon/tourism/tourism/member/hotel.png')"></image>
<view class="card-template mt-[var(--top-m)] sidebar-margin">
<view class="flex" :class="{'mb-[var(--top-m)]': (verifyInfo.value.list.length - 1 != index)}" v-for="(item,index) in verifyInfo.value.list" :key="index">
<image class="w-[150rpx] h-[150rpx] rounded-[var(--goods-rounded-big)]" mode="aspectFill" v-if="item.cover" :src="img(item.cover)"></image>
<image class="w-[150rpx] h-[150rpx] rounded-[var(--goods-rounded-big)]" mode="aspectFill" v-else :src="img('addon/tourism/tourism/member/hotel.png')"></image>
<view class="flex flex-col flex-1 ml-[20rpx] py-[4rpx]">
<view class="leading-[1.3] multi-hidden">{{item.name}}</view>
<view class="self-end text-[#626779] text-[28rpx] mt-[10rpx]">x1</view>
<view class="leading-[1]">
<view class="leading-[40rpx] truncate max-w-[490rpx] text-[28rpx]">{{item.name}}</view>
<view class="mt-[14rpx] truncate text-[24rpx] text-[var(--text-color-light9)] leading-[28rpx] max-w-[490rpx]" v-if="item.sub_name">
{{ item.sub_name }}
</view>
</view>
<view class="text-[var(--text-color-light6)] text-[28rpx] mt-[20rpx]">x1</view>
</view>
</view>
</view>
<view class="card-template mt-[20rpx] sidebar-marign">
<view class="text-[32rpx] font-500 leading-[1.3]">核销信息</view>
<view class="flex pt-[30rpx] items-center justify-between min-h-[36rpx]">
<text class="text-[26rpx] text-[#626779]">核销类型</text>
<view class="text-[26rpx] text-[#333333]">{{verifyInfo.type_name}}</view>
<view class="card-template mt-[var(--top-m)] sidebar-margin">
<view class="title">核销信息</view>
<view class="card-template-item justify-between">
<text class="text-[28rpx] text-[#333]">核销类型</text>
<view class="text-[28rpx] text-[#333]">{{verifyInfo.type_name}}</view>
</view>
<view class="flex pt-[20rpx] items-center justify-between min-h-[36rpx]" v-for="(item,index) in verifyInfo.value.content.fixed">
<text class="text-[26rpx] text-[#626779]">{{item.title}}</text>
<view class="text-[26rpx] text-[#333333]">{{item.value}}</view>
<view class="card-template-item justify-between" v-for="(item,index) in verifyInfo.value.content.fixed">
<text class="text-[28rpx] text-[#333]">{{item.title}}</text>
<view class="text-[28rpx] text-[#333]">{{item.value}}</view>
</view>
</view>
<view v-for="(item,index) in verifyInfo.value.content.diy" :key="index" class="card-template mt-[20rpx] sidebar-marign">
<view class="text-[32rpx] font-500 leading-[1.3]">{{item.title}}</view>
<view class="flex items-center justify-between min-h-[36rpx]" :class="{'pt-[30rpx]': subIndex==0, 'pt-[20rpx]': subIndex!=0}" v-for="(subItem,subIndex) in item.list" :key="subIndex">
<text class="text-[26rpx] text-[#626779]">{{subItem.title}}</text>
<text class="text-[26rpx] text-[#333333]">{{ subItem.value }}</text>
<view v-for="(item,index) in verifyInfo.value.content.diy" :key="index" class="card-template mt-[var(--top-m)] sidebar-margin">
<view class="title">{{item.title}}</view>
<view class="card-template-item justify-between" v-for="(subItem,subIndex) in item.list" :key="subIndex">
<text class="text-[28rpx] text-[#333]">{{subItem.title}}</text>
<text class="text-[28rpx] text-[#333]">{{ subItem.value }}</text>
</view>
</view>
<text class=" min-w-[630rpx] fixed bottom-[60rpx] confirmBtn text-[#fff] flex items-center justify-center !text-[32rpx] rounded-[50rpx] h-[88rpx] ml-[60rpx] mr-[60rpx]" @click="verifyFn">确定</text>
<view class="fixed bottom-[30rpx] primary-btn-bg text-[#fff] flex-center !text-[26rpx] rounded-[50rpx] h-[80rpx] left-[20rpx] right-[20rpx] font-500" @click="verifyFn">确定</view>
</block>
<u-loading-page :loading="loading" loading-text="" loadingColor="var(--primary-color)" iconSize="35"></u-loading-page>
<loading-page :loading="loading"></loading-page>
</view>
</template>
@ -144,7 +149,4 @@
</script>
<style lang="scss" scoped>
.confirmBtn{
background: linear-gradient( 94deg, #FB7939 0%, #FE120E 99%), #EF000C;
}
</style>

2
uni-app/src/app/pages/webview/index.vue
View File

@ -23,7 +23,7 @@
});
}else{
redirect({
url: '/app/pages/index/index',
url: '/app/pages/index/index',
mode: 'reLaunch'
});
}

20
uni-app/src/components/area-select/area-select.vue
View File

@ -1,18 +1,18 @@
<template>
<u-popup :show="show" @close="show = false" mode="bottom" :round="10" :closeable="true">
<view @touchmove.prevent.stop>
<view class="text-center p-[30rpx]">请选择地区</view>
<u-popup :show="show" @close="show = false" mode="bottom" :round="10">
<view @touchmove.prevent.stop class="popup-common">
<view class="title">请选择地区</view>
<view class="flex p-[30rpx] text-sm font-semibold">
<view v-if="areaList.province.length" class="flex-1" :class="{'text-[var(--primary-color)]': currSelect == 'province'}" @click="currSelect = 'province'">
<view class="flex p-[30rpx] pt-[0] text-sm font-500">
<view v-if="areaList.province.length" class="flex-1 pr-[10rpx]" :class="{'text-[var(--primary-color)]': currSelect == 'province'}" @click="currSelect = 'province'">
<view v-if="selected.province">{{ selected.province.name }}</view>
<view v-else>请选择</view>
</view>
<view v-if="areaList.city.length" class="flex-1" :class="{'text-[var(--primary-color)]': currSelect == 'city' }" @click="currSelect = 'city'">
<view v-if="areaList.city.length" class="flex-1 pr-[10rpx]" :class="{'text-[var(--primary-color)]': currSelect == 'city' }" @click="currSelect = 'city'">
<view v-if="selected.city">{{ selected.city.name }}</view>
<view v-else>请选择</view>
</view>
<view v-if="areaList.district.length" class="flex-1" :class="{'text-[var(--primary-color)]': currSelect == 'district' }" @click="currSelect = 'district'">
<view v-if="areaList.district.length" class="flex-1 pr-[10rpx]" :class="{'text-[var(--primary-color)]': currSelect == 'district' }" @click="currSelect = 'district'">
<view v-if="selected.district">{{ selected.district.name }}</view>
<view v-else>请选择</view>
</view>
@ -20,15 +20,15 @@
<scroll-view scroll-y="true" class="h-[50vh]">
<view class="flex p-[30rpx] pt-0 text-sm">
<view v-if="areaList.province.length" v-show="currSelect == 'province'">
<view v-for="item in areaList.province" class="leading-loose" :class="{'text-[var(--primary-color)]': selected.province && selected.province.id == item.id }"
<view v-for="item in areaList.province" class="h-[80rpx] flex items-center" :class="{'text-[var(--primary-color)]': selected.province && selected.province.id == item.id }"
@click="selected.province = item" >{{ item.name }}</view>
</view>
<view v-if="areaList.city.length" v-show="currSelect == 'city'">
<view v-for="item in areaList.city" class="leading-loose" :class="{'text-[var(--primary-color)]': selected.city && selected.city.id == item.id }"
<view v-for="item in areaList.city" class="h-[80rpx] flex items-center" :class="{'text-[var(--primary-color)]': selected.city && selected.city.id == item.id }"
@click="selected.city = item">{{ item.name }}</view>
</view>
<view v-if="areaList.district.length" v-show="currSelect == 'district'">
<view v-for="item in areaList.district" class="leading-loose" :class="{'text-[var(--primary-color)]': selected.district && selected.district.id == item.id }"
<view v-for="item in areaList.district" class="h-[80rpx] flex items-center " :class="{'text-[var(--primary-color)]': selected.district && selected.district.id == item.id }"
@click="selected.district = item">{{ item.name }}</view>
</view>
</view>

121
uni-app/src/components/bind-mobile/bind-mobile.vue
View File

@ -1,48 +1,39 @@
<template>
<u-popup :show="show" @close="show = false" mode="center" :round="10" :closeable="true" :safeAreaInsetBottom="false" zIndex="10086">
<view @touchmove.prevent.stop class="max-w-[630rpx] w-[630rpx] box-border">
<view class="text-center py-[50rpx] text-[32rpx] font-500 leading-[46rpx]">{{t('bindMobile')}}</view>
<view class="px-[50rpx] pb-[50rpx]">
<view @touchmove.prevent.stop class="max-w-[550rpx] w-[550rpx] box-border">
<view class="text-center py-[var(--pad-top-m)] text-[32rpx] font-500 leading-[46rpx]">{{t('bindMobile')}}</view>
<view class="px-[var(--pad-sidebar-m)] pb-[var(--pad-top-m)]">
<u-form labelPosition="left" :model="formData" errorType='toast' :rules="rules" ref="formRef">
<u-form-item label="" prop="mobile" :borderBottom="true">
<input v-model="formData.mobile" :placeholder="t('mobilePlaceholder')" class=" w-full h-[50rpx] leading-[50rpx] !bg-transparent !px-[20rpx] text-[26rpx] text-[#333]" :disabled="real_name_input" placeholder-class="bind-mobile" />
<input v-model="formData.mobile" type="number" maxlength="11" :placeholder="t('mobilePlaceholder')" class="w-full h-[50rpx] leading-[50rpx] !bg-transparent !px-[20rpx] text-[26rpx] text-[#333]" :disabled="real_name_input" placeholder-class="bind-mobile" />
</u-form-item>
<view class="mt-[20rpx]">
<u-form-item label="" prop="mobile_code" :borderBottom="true">
<input v-model="formData.mobile_code" :placeholder="t('codePlaceholder')" class=" box-border w-full h-[50rpx] leading-[50rpx] !bg-transparent !px-[20rpx] text-[26rpx] text-[#333]" :disabled="real_name_input" placeholder-class="bind-mobile" />
<input v-model="formData.mobile_code" type="number" maxlength="6" :placeholder="t('codePlaceholder')" class="box-border w-full h-[50rpx] leading-[50rpx] !bg-transparent !px-[20rpx] text-[26rpx] text-[#333]" :disabled="real_name_input" placeholder-class="bind-mobile" />
<template #right>
<sms-code :mobile="formData.mobile" type="bind_mobile" v-model="formData.mobile_key"></sms-code>
<sms-code v-if="config.agreement_show" :mobile="formData.mobile" type="login" v-model="formData.mobile_key" :isAgree="isAgree"></sms-code>
<sms-code v-else :mobile="formData.mobile" type="login" v-model="formData.mobile_key"></sms-code>
</template>
</u-form-item>
</view>
<view class="flex items-baseline mt-[20rpx] pl-[10rpx]" v-if="config.agreement_show">
<u-checkbox-group>
<u-checkbox activeColor="var(--primary-color)" :checked="isAgree" shape="shape" size="12" @change="agreeChange" :customStyle="{marginTop: '0rpx',marginBottom: '0rpx'}" :label=" t('agreeTips')" labelSize="22rpx" labelColor="#8288A2" />
</u-checkbox-group>
<view class="text-[22rpx] text-[#8288A2] leading-[30rpx] flex flex-wrap">
<view @click="redirect({ url: '/app/pages/auth/agreement?key=service' })">
《<text class="text-primary">{{ t('userAgreement') }}</text>》
</view>
<view @click="redirect({ url: '/app/pages/auth/agreement?key=privacy' })">
《<text class="text-primary">{{ t('privacyAgreement') }}</text>》
</view>
</view>
<view v-if="config.agreement_show" class="flex items-center mt-[30rpx] pl-[10rpx] py-[10rpx]" @click.stop="agreeChange">
<u-checkbox-group @change="agreeChange">
<u-checkbox activeColor="var(--primary-color)" :checked="isAgree" shape="circle" size="24rpx" :customStyle="{ 'marginTop': '4rpx' }"/>
</u-checkbox-group>
<view class="text-[24rpx] text-[var(--text-color-light6)] flex items-center flex-wrap">
<text>{{ t('agreeTips') }}</text>
<text @click.stop="redirect({ url: '/app/pages/auth/agreement?key=privacy' })" class="text-primary">《{{t('privacyAgreement')}}》</text>
<text>{{ t('and') }}</text>
<text @click.stop="redirect({ url: '/app/pages/auth/agreement?key=service' })" class="text-primary">《{{t('userAgreement')}}》</text>
</view>
</view>
<view class="mt-[100rpx]">
<button class="primary-btn-bg text-[26rpx] !text-[#fff] !h-[80rpx] leading-[80rpx] rounded-full font-500"
:class="{'opacity-50': loading}" :disabled="loading" @click="handleBind">{{t('bind')}}</button>
</view>
<view class="mt-[120rpx]">
<button class="primary-btn-bg text-[26rpx] text-[#fff] !h-[80rpx] leading-[80rpx] rounded-full font-bold" :loading="loading" :loadingText="t('binding')" @click="handleBind">{{t('bind')}}</button>
</view>
<!-- #ifdef MP-WEIXIN -->
<view class="mt-[20rpx]">
<u-button :customStyle="{border:'none',color:'var(--primary-color)',fontSize:'26rpx',height:'40rpx', lineHeight:'40rpx'}" :text="t('mobileQuickLogin')" open-type="getPhoneNumber" @getphonenumber="mobileAuth" @click="checkWxPrivacy"></u-button>
</view>
<!-- #endif -->
</u-form>
</view>
</view>
<!-- #ifdef MP-WEIXIN -->
<!-- 小程序隐私协议 -->
<wx-privacy-popup ref="wxPrivacyPopupRef"></wx-privacy-popup>
<!-- #endif -->
</u-popup>
</template>
@ -62,13 +53,6 @@
return useConfigStore().login
})
const wxPrivacyPopupRef:any = ref(null)
// 检测是否同意隐私协议
const checkWxPrivacy = ()=>{
wxPrivacyPopupRef.value.proactive();
}
const loading = ref(false)
const isAgree = ref(false)
@ -78,17 +62,17 @@
mobile_key: ''
})
let real_name_input = ref(true);
const real_name_input = ref(true);
onMounted(() => {
// 防止浏览器自动填充
setTimeout(()=>{
real_name_input.value = false;
},800)
});
uni.getStorageSync('openid') && (Object.assign(formData, { openid: uni.getStorageSync('openid') }))
uni.getStorageSync('pid') && (Object.assign(formData, { pid: uni.getStorageSync('pid') }))
uni.getStorageSync('unionid') && (Object.assign(formData, { unionid: uni.getStorageSync('unionid') }))
uni.getStorageSync('openid') && (Object.assign(formData, { openid: uni.getStorageSync('openid') }))
uni.getStorageSync('pid') && (Object.assign(formData, { pid: uni.getStorageSync('pid') }))
uni.getStorageSync('unionid') && (Object.assign(formData, { unionid: uni.getStorageSync('unionid') }))
});
const rules = {
'mobile': [
@ -99,7 +83,7 @@
trigger: ['blur', 'change'],
},
{
validator(rule, value, callback) {
validator(rule: any, value: any, callback: any) {
let mobile = /^1[3-9]\d{9}$/;
if (!mobile.test(value)){
callback(new Error('请输入正确的手机号'))
@ -123,11 +107,15 @@
isAgree.value = !isAgree.value
}
const formRef = ref(null)
const formRef: any = ref(null)
const handleBind = () => {
formRef.value.validate().then(() => {
if (!isAgree.value && config.value.agreement_show) {
uni.showToast({ title: t('isAgreeTips'), icon: 'none' })
return
}
if (loading.value) return
loading.value = true
@ -143,44 +131,6 @@
})
}
const mobileAuth = (e) => {
if (!isAgree.value && config.value.agreement_show) {
uni.showToast({
title: `${ t('pleaceAgree') }《${ t('userAgreement') }》《${ t('privacyAgreement') }》`,
icon: 'none'
})
return
}
if (e.detail.errMsg == 'getPhoneNumber:ok') {
uni.showLoading({ title: '' })
bindMobile({
mobile_code: e.detail.code
}).then((res) => {
uni.hideLoading()
memberStore.getMemberInfo()
if(res.msg == 1){
uni.removeStorageSync('isbindmobile');
}
show.value = false
}).catch((res) => {
setTimeout(() => {
show.value = false
uni.hideLoading()
}, 2000);
})
}
if (e.detail.errno == 104) {
let msg = '用户未授权隐私权限';
uni.showToast({ title: msg, icon: 'none' })
}
if (e.detail.errMsg == "getPhoneNumber:fail user deny") {
let msg = '用户拒绝获取手机号码';
uni.showToast({ title: msg, icon: 'none' })
}
}
const open = ()=> {
show.value = true
}
@ -192,7 +142,10 @@
<style lang="scss" scoped>
:deep(.bind-mobile){
color:#8288A2;
color:var(--text-color-light9);
font-size: 26rpx;
}
:deep(.u-checkbox){
margin:0 !important;
}
</style>

107
uni-app/src/components/information-filling/information-filling.vue
View File

@ -8,7 +8,7 @@
<view class="mx-[30rpx]">
<view class="mt-[20rpx]">
<u-form-item :label="t('headimg')" prop="headimg" :border-bottom="true">
<button class="m-0 my-[10rpx] p-0 w-[140rpx] h-[140rpx]" open-type="chooseAvatar" @chooseavatar="onChooseAvatar" @click="checkWxPrivacy">
<button class="m-0 my-[10rpx] p-0 w-[140rpx] h-[140rpx]" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
<view class="w-full h-full flex items-center justify-center overflow-hidden">
<u-image :src="img(formData.headimg)" width="140rpx" height="140rpx" v-if="formData.headimg" mode="aspectFill"></u-image>
<u-icon name="plus" v-else></u-icon>
@ -18,9 +18,9 @@
<u-form-item :label=" t('nickname')" prop="nickname" :border-bottom="true">
<input type="nickname" v-model="formData.nickname" :placeholder="t('nicknamePlaceholder')" @blur="bindNickname">
</u-form-item>
<u-form-item :label=" t('mobile')" prop="mobile" :border-bottom="true" v-if="isBindMobile">
<u-form-item :label="t('mobile')" prop="mobile" :border-bottom="true" v-if="isBindMobile">
<input type="mobile" v-model="formData.mobile" :disabled="true" v-if="formData.mobile">
<u-button :customStyle="{border:'none',color: 'var(--primary-color)',width:'140rpx', textAlign:'left',margin:'0rpx'}" :text="t('getMobile')" open-type="getPhoneNumber" @getphonenumber="mobileAuth" @click="checkWxPrivacy" v-else></u-button>
<u-button :customStyle="{border:'none',color: 'var(--primary-color)',width:'140rpx', textAlign:'left',margin:'0rpx'}" :text="t('getMobile')" open-type="getPhoneNumber" @getphonenumber="memberStore.bindMobile" v-else></u-button>
</u-form-item>
</view>
</view>
@ -36,11 +36,11 @@
</template>
<script setup lang="ts">
import { ref, reactive, computed, watch,onMounted } from 'vue'
import { ref, reactive, computed, watch,onMounted,nextTick } from 'vue'
import { t } from '@/locale'
import useMemberStore from '@/stores/member'
import { img, getToken } from '@/utils/common'
import { modifyMember, bindMobile } from '@/app/api/member'
import { img } from '@/utils/common'
import { modifyMember } from '@/app/api/member'
import { fetchBase64Image } from '@/app/api/system'
import { useLogin } from '@/hooks/useLogin'
@ -63,22 +63,22 @@
}
}, { immediate: true })
let isBindMobile = ref(null)
const isBindMobile = ref(null)
const wxPrivacyPopupRef:any = ref(null)
onMounted(()=>{
uni.getStorageSync('openid') && (Object.assign(formData, { openid: uni.getStorageSync('openid') }))
uni.getStorageSync('pid') && (Object.assign(formData, { pid: uni.getStorageSync('pid') }))
uni.getStorageSync('unionid') && (Object.assign(formData, { unionid: uni.getStorageSync('unionid') }))
isBindMobile.value = uni.getStorageSync('isbindmobile');
// #ifdef MP
nextTick(()=>{
if(wxPrivacyPopupRef.value) wxPrivacyPopupRef.value.proactive();
})
// #endif
})
const wxPrivacyPopupRef:any = ref(null)
// 检测是否同意隐私协议
const checkWxPrivacy = ()=>{
wxPrivacyPopupRef.value.proactive();
}
const onChooseAvatar = (e) => {
uni.getFileSystemManager().readFile({
filePath: e.detail.avatarUrl, //选择图片返回的相对路径
@ -116,67 +116,38 @@
}
}
const formRef = ref(null)
const formRef: any = ref(null)
const confirm = async () => {
formRef.value.validate().then(async() => {
if (loading.value) return
loading.value = true
formRef.value.validate().then(async() => {
if (loading.value) return
loading.value = true
// 修改头像
await modifyMember({ field: 'headimg', value: formData.headimg }).then(() => {
memberStore.info.headimg = formData.headimg
}).catch(() => {
loading.value = false
})
if (!loading.value) return
// 修改头像
await modifyMember({ field: 'headimg', value: formData.headimg }).then(() => {
memberStore.info.headimg = formData.headimg
}).catch(() => {
loading.value = false
})
if (!loading.value) return
// 修改昵称
modifyMember({ field: 'nickname', value: formData.nickname }).then(() => {
memberStore.info.nickname = formData.nickname
loading.value = false
show.value = false
}).catch(() => {
loading.value = false
})
// 修改昵称
modifyMember({ field: 'nickname', value: formData.nickname }).then(() => {
memberStore.info.nickname = formData.nickname
loading.value = false
show.value = false
}).catch(() => {
loading.value = false
})
// #ifdef MP-WEIXIN
const login = useLogin()
if( info.value && !info.value.weapp_openid){
login.getAuthCode('',true)
}
// #endif
if (info.value && !info.value.weapp_openid) {
login.getAuthCode({ updateFlag: true }) // 更新oppenid
}
// #endif
})
}
const mobileAuth = (e) => {
if (e.detail.errMsg == 'getPhoneNumber:ok') {
uni.showLoading({ title: '' })
bindMobile({
openid: formData.openid,
mobile_code: e.detail.code
}).then((res) => {
uni.hideLoading()
memberStore.getMemberInfo()
if(info.value.mobile){
uni.removeStorageSync('isbindmobile');
}
}).catch((res) => {
setTimeout(() => {
uni.hideLoading()
}, 2000);
})
}
if (e.detail.errno == 104) {
let msg = '用户未授权隐私权限';
uni.showToast({ title: msg, icon: 'none' })
}
if (e.detail.errMsg == "getPhoneNumber:fail user deny") {
let msg = '用户拒绝获取手机号码';
uni.showToast({ title: msg, icon: 'none' })
}
}
})
}
defineExpose({
show

27
uni-app/src/components/loading-page/loading-page.vue Normal file
View File

@ -0,0 +1,27 @@
<template>
<view>
<u-loading-page class="" bg-color="props.bgColor" icon-size="props.iconSize" :loading="props.loading" loadingText=""></u-loading-page>
</view>
</template>
<script setup lang="ts">
import { reactive, ref } from 'vue'
const props = defineProps({
loading: {
type: Boolean,
default: false
},
iconSize: {
type: String || Number,
default: 30
},
bgColor: {
type: String,
default: "rgb(248,248,248)"
}
});
</script>
<style lang="scss" scoped>
</style>

114
uni-app/src/components/mescroll/hooks/useMescroll.js
View File

@ -1,66 +1,66 @@
// 小程序无法在hook中使用页面级别生命周期,需单独传入: https://ask.dcloud.net.cn/question/161173
// import { onPageScroll, onReachBottom, onPullDownRefresh} from '@dcloudio/uni-app';
/**
* 初始化mescroll, 相当于vue2的mescroll-mixins.js文件 (mescroll-body 和 mescroll-uni 通用)
/**
* 初始化mescroll, 相当于vue2的mescroll-mixins.js文件 (mescroll-body 和 mescroll-uni 通用)
* mescroll-body需传入onPageScroll, onReachBottom
* mescroll-uni无需传onPageScroll, onReachBottom
* 当down.native为true时,需传入onPullDownRefresh
*/
function useMescroll(onPageScroll, onReachBottom, onPullDownRefresh){
// mescroll实例对象
let mescroll = null;
// mescroll组件初始化的回调,可获取到mescroll对象
const mescrollInit = (e)=> {
mescroll = e;
}
// 获取mescroll对象, mescrollInit执行之后会有值, 生命周期created中会有值
const getMescroll = ()=>{
return mescroll
}
// 下拉刷新的回调 (mixin默认resetUpScroll)
const downCallback = ()=> {
if(mescroll.optUp.use){
mescroll.resetUpScroll()
}else{
setTimeout(()=>{
mescroll.endSuccess();
}, 500)
}
}
// 上拉加载的回调
const upCallback = ()=> {
// mixin默认延时500自动结束加载
setTimeout(()=>{
mescroll.endErr();
}, 500)
}
// 注册系统自带的下拉刷新 (配置down.native为true时生效, 还需在pages配置enablePullDownRefresh:true;详请参考mescroll-native的案例)
onPullDownRefresh && onPullDownRefresh(() => {
mescroll && mescroll.onPullDownRefresh();
})
// 注册列表滚动事件,用于判定在顶部可下拉刷新,在指定位置可显示隐藏回到顶部按钮 (此方法为页面生命周期,无法在子组件中触发, 仅在mescroll-body生效)
onPageScroll && onPageScroll(e=>{
mescroll && mescroll.onPageScroll(e);
})
// 注册滚动到底部的事件,用于上拉加载 (此方法为页面生命周期,无法在子组件中触发, 仅在mescroll-body生效)
onReachBottom && onReachBottom(()=>{
mescroll && mescroll.onReachBottom();
})
return {
getMescroll,
mescrollInit,
downCallback,
upCallback
}
*/
function useMescroll(onPageScroll, onReachBottom, onPullDownRefresh) {
// mescroll实例对象
let mescroll = null;
// mescroll组件初始化的回调,可获取到mescroll对象
const mescrollInit = (e) => {
mescroll = e;
}
// 获取mescroll对象, mescrollInit执行之后会有值, 生命周期created中会有值
const getMescroll = () => {
return mescroll
}
// 下拉刷新的回调 (mixin默认resetUpScroll)
const downCallback = () => {
if (mescroll.optUp.use) {
mescroll.resetUpScroll()
} else {
setTimeout(() => {
mescroll.endSuccess();
}, 500)
}
}
// 上拉加载的回调
const upCallback = () => {
// mixin默认延时500自动结束加载
setTimeout(() => {
mescroll.endErr();
}, 500)
}
// 注册系统自带的下拉刷新 (配置down.native为true时生效, 还需在pages配置enablePullDownRefresh:true;详请参考mescroll-native的案例)
onPullDownRefresh && onPullDownRefresh(() => {
mescroll && mescroll.onPullDownRefresh();
})
// 注册列表滚动事件,用于判定在顶部可下拉刷新,在指定位置可显示隐藏回到顶部按钮 (此方法为页面生命周期,无法在子组件中触发, 仅在mescroll-body生效)
onPageScroll && onPageScroll(e => {
mescroll && mescroll.onPageScroll(e);
})
// 注册滚动到底部的事件,用于上拉加载 (此方法为页面生命周期,无法在子组件中触发, 仅在mescroll-body生效)
onReachBottom && onReachBottom(() => {
mescroll && mescroll.onReachBottom();
})
return {
getMescroll,
mescrollInit,
downCallback,
upCallback
}
}
export default useMescroll

20
uni-app/src/components/mescroll/mescroll-body/mescroll-body.css
View File

@ -1,19 +1,19 @@
.mescroll-body {
position: relative; /* 下拉刷新区域相对自身定位 */
height: auto; /* 不可固定高度,否则overflow:hidden导致无法滑动; 同时使设置的最小高生效,实现列表不满屏仍可下拉*/
overflow: hidden; /* 当有元素写在mescroll-body标签前面时,可遮住下拉刷新区域 */
box-sizing: border-box; /* 避免设置padding出现双滚动条的问题 */
position: relative; /* 下拉刷新区域相对自身定位 */
height: auto; /* 不可固定高度,否则overflow:hidden导致无法滑动; 同时使设置的最小高生效,实现列表不满屏仍可下拉*/
overflow: hidden; /* 当有元素写在mescroll-body标签前面时,可遮住下拉刷新区域 */
box-sizing: border-box; /* 避免设置padding出现双滚动条的问题 */
}
/* 使sticky生效: 父元素不能overflow:hidden或者overflow:auto属性 */
.mescroll-body.mescorll-sticky{
overflow: unset !important
.mescroll-body.mescorll-sticky {
overflow: unset !important
}
/* 适配 iPhoneX */
@supports (bottom: constant(safe-area-inset-bottom)) or (bottom: env(safe-area-inset-bottom)) {
.mescroll-safearea {
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
.mescroll-safearea {
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
}

33
uni-app/src/components/mescroll/mescroll-empty/mescroll-empty.vue
View File

@ -3,10 +3,10 @@
<mescroll-empty v-if="isShowEmpty" :option="optEmpty" @emptyclick="emptyClick"></mescroll-empty>
-->
<template>
<view class="mescroll-empty" :class="{ 'empty-fixed': option.fixed }" :style="{ 'z-index': option.zIndex, top: option.top }">
<view> <image v-if="icon" class="empty-icon" :src="icon" mode="widthFix" /> </view>
<view v-if="tip" class="empty-tip">{{ tip }}</view>
<view v-if="btnText" class="empty-btn" @click="emptyClick">{{ btnText }}</view>
<view class="mescroll-empty empty-page" :class="{ 'empty-fixed': option.fixed }" :style="{ 'z-index': option.zIndex, top: option.top }">
<view> <image v-if="icon" class="img" :src="icon" mode="aspectFit" /> </view>
<view v-if="tip" class="desc">{{ tip }}</view>
<view v-if="btnText" class="btn" @click="emptyClick">{{ btnText }}</view>
</view>
</template>
@ -74,13 +74,6 @@ export default {
<style>
/* 无任何数据的空布局 */
.mescroll-empty {
box-sizing: border-box;
width: 100%;
padding: 100rpx 50rpx;
text-align: center;
}
.mescroll-empty.empty-fixed {
z-index: 99;
position: absolute; /*transform会使fixed失效,最终会降级为absolute */
@ -89,25 +82,25 @@ export default {
}
.mescroll-empty .empty-icon {
width: 348rpx;
height: 348rpx;
width: 400rpx;
height: 300rpx;
}
.mescroll-empty .empty-tip {
font-size: 24rpx;
color: gray;
font-size: 26rpx;
color: var(--text-color-light9);
}
.mescroll-empty .empty-btn {
margin-top: 40rpx;
margin-top: 36rpx;
display: inline-block;
min-width: 220rpx;
height: 66rpx;
line-height: 66rpx;
font-size: 28rpx;
border: 1rpx solid #EF000C;
border-radius: 60rpx;
color: #EF000C;
font-size: 24rpx;
border: 1rpx solid var(--primary-color);
border-radius: 100rpx;
color: var(--primary-color);
}
.mescroll-empty .empty-btn:active {

3
uni-app/src/components/nc-contact/nc-contact.vue
View File

@ -24,8 +24,7 @@
<view @click="callPhone" class="text-primary truncate">{{ siteInfo.phone }}</view>
</view>
<view class="px-6 py-3 w-[480rpx] h-[100rpx] leading-[100rpx] text-sm" v-else>抱歉，商家暂无客服，请线下联系</view>
<button @click="popupShow = false"
class="!mx-[30rpx] !mb-[40rpx] !w-auto !h-[70rpx] text-[24rpx] leading-[70rpx] rounded-full text-white !bg-[#ff4500] !text-[#fff]">
<button @click="popupShow = false" class="!mx-[30rpx] !mb-[40rpx] !w-auto !h-[70rpx] text-[24rpx] leading-[70rpx] rounded-full text-white !bg-[#ff4500] !text-[#fff]">
我知道了
</button>
</view>

121
uni-app/src/components/pay/pay.vue
View File

@ -1,31 +1,33 @@
<template>
<u-popup :show="show" :round="10" @close="handleClose" :closeable="true" bgColor="#fff" zIndex="10081" :closeOnClickOverlay="false">
<view class="flex flex-col h-[75vh]" v-if="payInfo" @touchmove.prevent.stop>
<view class="flex flex-col h-[75vh] popup-common" v-if="payInfo" @touchmove.prevent.stop>
<view class="head">
<view class="text-center py-[26rpx]">{{ t('pay.payTitle') }}</view>
<view class="flex items-end justify-center w-full text-xl font-bold py-[20rpx]">
<view class="title">
{{ t('pay.payTitle') }}
</view>
<view class="flex items-end justify-center w-full text-xl font-bold py-[20rpx] price-font">
<view class="text-base mr-[4rpx]">{{ t('currency') }}</view>
{{ moneyFormat(payInfo.money) }}
</view>
</view>
<scroll-view scroll-y="true" class="flex-1 pt-[20rpx]">
<view class="flex text-sm px-[30rpx] py-[20rpx]">
<view class="text-gray-500">{{ t('pay.orderInfo') }}</view>
<view class="text-right flex-1 pl-[30rpx] using-hidden">{{ payInfo.body }}</view>
<view class="flex text-[28rpx] px-[36rpx] py-[20rpx] mb-[10rpx]">
<view class="text-[var(--text-color-light6)]">{{ t('pay.orderInfo') }}</view>
<view class="text-right flex-1 pl-[30rpx] truncate">{{ payInfo.body }}</view>
</view>
<view class="mx-[30rpx] py-[10rpx] px-[30rpx] bg-white rounded-md bg-page">
<view class="mx-[var(--popup-sidebar-m)] px-[30rpx] bg-white rounded-[20rpx] bg-[var(--temp-bg)]">
<block v-if="payInfo.pay_type_list.length">
<view class="pay-item py-[18rpx] flex items-center border-0 border-b border-solid border-[#eee]" v-for="(item, index) in payInfo.pay_type_list" :key="index" @click="type = item.key">
<view class="pay-item py-[30rpx] flex items-center border-0 border-b border-solid border-[#eee]" v-for="(item, index) in payInfo.pay_type_list" :key="index" @click="type = item.key">
<u-image :src="img(item.icon)" width="50rpx" height="50rpx"></u-image>
<view class="flex-1 px-[20rpx] text-sm font-bold">{{ item.name }}</view>
<view class="flex-1 px-[20rpx] text-[28rpx] font-500">{{ item.name }}</view>
<u-icon name="checkbox-mark" color="var(--primary-color)" v-if="item.key == type"></u-icon>
</view>
</block>
<view class="py-[20rpx] text-center text-sm text-gray-subtitle" v-else>{{ t('pay.notHavePayType') }}</view>
<view class="py-[30rpx] text-center text-[24rpx] text-gray-subtitle" v-else>{{ t('pay.notHavePayType') }}</view>
</view>
</scroll-view>
<view class="p-[30rpx]">
<button class="primary-btn-bg h-[80rpx] rounded-[50rpx] leading-[80rpx] text-[28rpx] text-[#fff]" hover-class="none" :loading="loading" @click="confirmPay">{{t('pay.confirmPay')}}</button>
<view class="btn-wrap">
<button class="primary-btn-bg btn" hover-class="none" :loading="loading" @click="confirmPay">{{t('pay.confirmPay')}}</button>
</view>
</view>
</u-popup>
@ -61,20 +63,20 @@
pay({
trade_type: payInfo.value?.trade_type,
trade_id: payInfo.value?.trade_id,
trade_id: payInfo.value?.trade_id,
type: type.value,
openid: uni.getStorageSync('openid') || ''
}).then(res => {
openid: uni.getStorageSync('openid') || ''
}).then((res: any) => {
switch (type.value) {
case 'wechatpay':
// #ifndef H5
uni.requestPayment({
provider: 'wxpay',
...res.data,
success: (res) => {
toPayResult()
success: (res: any) => {
toPayResult()
},
fail: (res) => {
fail: (res: any) => {
loading.value = false
}
})
@ -86,14 +88,17 @@
wechat.pay({
...res.data,
success: () => {
toPayResult()
toPayResult()
},
cancel: () => {
loading.value = false
}
})
} else {
uni.setStorageSync('paymenting', { trade_type: payInfo.value?.trade_type, trade_id: payInfo.value?.trade_id })
uni.setStorageSync('paymenting', {
trade_type: payInfo.value?.trade_type,
trade_id: payInfo.value?.trade_id
})
location.href = res.data.h5_url
}
// #endif
@ -101,25 +106,34 @@
case 'alipay':
// #ifdef H5
if (isWeixinBrowser()) {
redirect({ url: '/app/pages/pay/browser', param: { trade_type: payInfo.value?.trade_type, trade_id: payInfo.value?.trade_id, alipay: encodeURIComponent(res.data.url) }, mode: 'redirectTo' })
redirect({
url: '/app/pages/pay/browser',
param: {
trade_type: payInfo.value?.trade_type,
trade_id: payInfo.value?.trade_id,
alipay: encodeURIComponent(res.data.url)
},
mode: 'redirectTo'
})
} else {
uni.setStorageSync('paymenting', { trade_type: payInfo.value?.trade_type, trade_id: payInfo.value?.trade_id })
uni.setStorageSync('paymenting', {
trade_type: payInfo.value?.trade_type,
trade_id: payInfo.value?.trade_id
})
location.href = res.data.url
}
// #endif
break;
default:
if (res.data.url) {
redirect({
url: res.data.url,
param: res.data.param || {},
mode: 'redirectTo',
success() {
}
})
return
}
toPayResult()
if (res.data.url) {
redirect({
url: res.data.url,
param: res.data.param || {},
mode: 'redirectTo'
})
return
}
toPayResult()
}
}).catch(() => {
loading.value = false
@ -149,30 +163,29 @@
const open = (tradeType : string, tradeId : number, payReturn: string = '') => {
if (repeat.value) return
repeat.value = true
// 设置支付后跳转页面
uni.setStorageSync('payReturn', encodeURIComponent(payReturn))
getPayInfo(tradeType, tradeId)
.then((res : any) => {
let { data } = res
payInfo.value = data
// 设置支付后跳转页面
uni.setStorageSync('payReturn', encodeURIComponent(payReturn))
if (uni.$u.test.isEmpty(data)) {
uni.showToast({ title: t('pay.notObtainedInfo'), icon: 'none' })
return
}
if (data.money == 0) {
toPayResult()
return
}
type.value = data.pay_type_list[0] ? data.pay_type_list[0].key : ''
show.value = true
repeat.value = false
getPayInfo(tradeType, tradeId).then((res: any) => {
let { data } = res
payInfo.value = data
})
.catch(() => {
repeat.value = false
})
if (uni.$u.test.isEmpty(data)) {
uni.showToast({ title: t('pay.notObtainedInfo'), icon: 'none' })
return
}
if (data.money == 0) {
toPayResult()
return
}
type.value = data.pay_type_list[0] ? data.pay_type_list[0].key : ''
show.value = true
repeat.value = false
}).catch(() => {
repeat.value = false
})
}
const toPayResult = ()=> {

68
uni-app/src/components/select-date/select-date.vue
View File

@ -1,36 +1,33 @@
<template>
<u-popup :show="show" @close="show = false" mode="bottom" :round="10" zIndex="10090">
<view>
<view class="py-[30rpx] px-[40rpx] flex items-center justify-between">
<view class="text-center flex-1 text-[32rpx] font-500 leading-[44rpx]">选择时间</view>
<view class="nc-iconfont nc-icon-guanbiV6xx text-[36rpx] text-primary" @click="show = false"></view>
</view>
<view class="px-[30rpx] mb-[20rpx] mt-[10rpx]">
<view class="popup-common">
<view class="title">选择时间</view>
<view class="px-[var(--popup-sidebar-m)] mb-[20rpx] mt-[10rpx]">
<view class="flex items-center justify-between mb-[30rpx]">
<view class="w-[160rpx] h-[60rpx] box-border leading-[60rpx] rounded-[30rpx] bg-[#F4F6FA] text-center text-[26rpx] text-[#666] border-[2rpx] border-solid border-[#F4F6FA]" v-for="(item,index) in curselectDate" :key="'a'+index" :class="{'text-primary !border-[var(--primary-color)] !bg-[rgba(239,0,12,0.04)]': currentValue.type == item.type}" @click="loadDateFn(item)">{{item.name}}</view>
<view class="w-[160rpx] h-[66rpx] box-border flex-center rounded-[33rpx] bg-[var(--temp-bg)] text-center text-[26rpx] text-[var(--text-color-light6)] border-[2rpx] border-solid border-[var(--temp-bg)]" v-for="(item,index) in curselectDate" :key="'a'+index" :class="{'text-primary !border-[var(--primary-color)] !bg-[rgba(239,0,12,0.04)]': currentValue.type == item.type}" @click="loadDateFn(item)">{{item.name}}</view>
</view>
<view class="flex items-center justify-between">
<view class="w-[316rpx] h-[60rpx] box-border leading-[60rpx] rounded-[30rpx] bg-[#F4F6FA] text-center text-[26rpx] text-[#666] border-[2rpx] border-solid border-[#F4F6FA]" :class="{'text-primary !border-[var(--primary-color)] !bg-[rgba(239,0,12,0.04)]': currentValue.type == 'first'}" @click="currentValue.type = 'first'">{{dateList.nowDate[0].substr(0,10)}}</view>
<view class="w-[316rpx] h-[66rpx] box-border leading-[62rpx] rounded-[33rpx] bg-[var(--temp-bg)] text-center text-[26rpx] text-[var(--text-color-light6)] border-[2rpx] border-solid border-[var(--temp-bg)]" :class="{'text-primary !border-[var(--primary-color)] !bg-[var(--primary-color-light)]': currentValue.type == 'first'}" @click="currentValue.type = 'first'">{{dateList.nowDate[0].substr(0,10)}}</view>
<view class="nc-iconfont nc-icon-jianV6xx"></view>
<view class="w-[316rpx] h-[60rpx] box-border leading-[60rpx] rounded-[30rpx] bg-[#F4F6FA] text-center text-[26rpx] text-[#666] border-[2rpx] border-solid border-[#F4F6FA]" :class="{'text-primary !border-[var(--primary-color)] !bg-[rgba(239,0,12,0.04)]': currentValue.type == 'second'}" @click="currentValue.type = 'second'">{{dateList.nowDate[1].substr(0,10)}}</view>
<view class="w-[316rpx] h-[66rpx] box-border leading-[62rpx] rounded-[33rpx] bg-[var(--temp-bg)] text-center text-[26rpx] text-[var(--text-color-light6)] border-[2rpx] border-solid border-[var(--temp-bg)]" :class="{'text-primary !border-[var(--primary-color)] !bg-[var(--primary-color-light)]': currentValue.type == 'second'}" @click="currentValue.type = 'second'">{{dateList.nowDate[1].substr(0,10)}}</view>
</view>
</view>
<view>
<picker-view indicator-class="!h-[70rpx] !bg-[#F4F6FA]" :value="dateList.curIndex" @change="bindChange" class="w-[750rpx] px-[60rpx] h-[396rpx] box-border">
<view class="gradation-picker">
<picker-view indicator-class="!h-[80rpx] !bg-[var(--temp-bg)]" :value="dateList.curIndex" @change="bindChange" class="w-[750rpx] px-[60rpx] h-[396rpx] box-border">
<picker-view-column>
<view class="text-center leading-[70rpx] text-[28rpx]" v-for="(item,index) in dateList.years" :key="index">{{item}}年</view>
<view class="text-center leading-[80rpx] text-[28rpx]" v-for="(item,index) in dateList.years" :key="index">{{item}}年</view>
</picker-view-column>
<picker-view-column>
<view class="text-center leading-[70rpx] text-[28rpx]" v-for="(item,index) in dateList.months" :key="index">{{item}}月</view>
<view class="text-center leading-[80rpx] text-[28rpx]" v-for="(item,index) in dateList.months" :key="index">{{item}}月</view>
</picker-view-column>
<picker-view-column>
<view class="text-center leading-[70rpx] text-[28rpx]" v-for="(item,index) in dateList.days" :key="index">{{item}}日</view>
<view class="text-center leading-[80rpx] text-[28rpx]" v-for="(item,index) in dateList.days" :key="index">{{item}}日</view>
</picker-view-column>
</picker-view>
</view>
<view class="px-[30rpx] pb-[30rpx] pt-[20rpx] flex justify-between">
<button class="w-[330rpx] h-[88rpx] text-[var(--primary-color)] text-[32rpx] leading-[84rpx] border-[2rpx] border-solid border-[var(--primary-color)] rounded-[100rpx] bg-transparent" hover-class="none" @click="reset">重置</button>
<button class="w-[330rpx] h-[88rpx] text-[#fff] text-[32rpx] leading-[88rpx] border-[0] rounded-[100rpx] primary-btn-bg" shape="circle" hover-class="none" @click="save">确定</button>
<view class="btn-wrap flex justify-between items-center !pt-[30rpx]">
<button class="btn flex-1 !leading-[76rpx] mr-[20rpx] !text-[var(--primary-color)] border-[2rpx] border-solid border-[var(--primary-color)] rounded-[100rpx] bg-transparent box-border" hover-class="none" @click="reset">重置</button>
<button class="btn flex-1 border-[0] rounded-[100rpx] primary-btn-bg" shape="circle" hover-class="none" @click="save">确定</button>
</view>
</view>
</u-popup>
@ -42,7 +39,7 @@ import { ref,reactive } from 'vue'
const emits = defineEmits(['confirm'])
// 弹框时间选择
const show = ref(false)
let create_time = ref([])
const create_time: any = ref([])
// 日期
const init = () =>{
const date = new Date();
@ -92,11 +89,11 @@ const init = () =>{
lastYear: formatDate(lastYear)
}
}
const getDaysInMonth = (year, month) => {
const getDaysInMonth = (year: any, month: any) => {
let date = new Date(year, month, 0).getDate()
return date
}
const getDaysCount = (year, month) =>{
const getDaysCount = (year: any, month: any) =>{
let count = getDaysInMonth(year, month)
let days = []
for (let i = 1; i <= count; i++) {
@ -112,7 +109,7 @@ const dateList = reactive({
nowDate:[init().nowDateStart,init().nowDateEnd] //当前选中日期
})
const bindChange = (e) =>{
const bindChange = (e: any) =>{
const val = e.detail.value
let year = dateList.years[val[0]]
let month= dateList.months[val[1]]
@ -148,11 +145,11 @@ const curselectDate = reactive([
}
])
// 时间搜索
let currentValue = ref({
const currentValue = ref({
type: 'first',
time: []
})
const loadDateFn = (data) =>{
const loadDateFn = (data: any) =>{
currentValue.value.type = data.type
currentValue.value.time = data.time
dateList.nowDate[0] = currentValue.value.time[0]
@ -196,4 +193,29 @@ defineExpose({
:deep(.uni-picker-view-indicator::after){
border: none !important;
}
</style>
<style lang="scss">
.gradation-picker{
position: relative;
&::after{
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
height: 70rpx;
background: linear-gradient(#fff, rgba(255,255,255,.5));
z-index: 10;
}
&::before{
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 70rpx;
background: linear-gradient(#fff, rgba(255,255,255,.5));
z-index: 12;
}
}
</style>

33
uni-app/src/components/share-poster/share-poster.vue
View File

@ -5,7 +5,7 @@
<view @touchmove.prevent.stop>
<view class="poster-img-wrap" :style="{'top': shareTop}">
<image v-if="isPosterAnimation" class="poster-animation" :src="img('addon/shop/poster_animation.gif')" mode="aspectFit"></image>
<image v-if="isPosterImg" class="poster-img" :src="img(poster)" mode="aspectFit"></image>
<image v-if="isPosterImg" class="poster-img" :src="img(poster)" mode="aspectFit" :show-menu-by-longpress="true"></image>
</view>
<view class="share-content">
<!-- #ifdef MP || APP-PLUS -->
@ -79,16 +79,23 @@ const props = defineProps({
}
})
let sharePopupShow = ref(false);
const sharePopupShow = ref(false);
// 复制
const copyUrl = () => {
let data = ''
if(props.copyUrl) {
data = location.origin + props.copyUrl + props.copyUrlParam;
}else {
data = location.origin + location.pathname + props.copyUrlParam;
}
if (props.copyUrl) {
let pathName = location.pathname;
let packageArr: any = ['/app/', '/addon/'];
for (let i = 0; i < packageArr.length; i++) {
if (pathName.indexOf(packageArr[i]) != -1) {
pathName = pathName.substr(0, pathName.indexOf(packageArr[i]));
}
}
data = location.origin + pathName + props.copyUrl + props.copyUrlParam;
} else {
data = location.origin + location.pathname + props.copyUrlParam;
}
copy(data, () => {
sharePopupShow.value = false;
});
@ -100,10 +107,10 @@ const openShare = ()=>{
}
//生成海报
let isPosterAnimation = ref(false)
let isPosterImg = ref(false)
const isPosterAnimation = ref(false)
const isPosterImg = ref(false)
// 获取分享海报
let poster = ref('');
const poster = ref('');
const goodsPosterShowFn = () => {
isPosterAnimation.value = true;
isPosterImg.value = false;
@ -132,7 +139,7 @@ const goodsPosterShowFn = () => {
sharePopuClose();
})
}
let show = ref(false);
const show = ref(false);
const closeDialog = ()=> {
show.value = false;
@ -181,10 +188,10 @@ const saveGoodsPoster = () => {
}
// #endif
let shareTop = ref(0)
const shareTop: any = ref(0)
/************ 获取微信头部-start ****************/
// 获取系统状态栏的高度
let menuButtonInfo = {};
let menuButtonInfo: any = {};
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
menuButtonInfo = uni.getMenuButtonBoundingClientRect();

24
uni-app/src/components/sms-code/sms-code.vue
View File

@ -18,6 +18,10 @@ import { t } from '@/locale'
const prop = defineProps({
mobile: String,
type: String,
isAgree:{
type:Boolean,
default:true
},
modelValue: {
type: String,
default: ''
@ -34,7 +38,7 @@ const value = computed({
}
})
const smsRef = ref(null)
const smsRef: any = ref(null)
const sendSms = useSendSms(smsRef)
const show = ref(false)
@ -50,11 +54,21 @@ const captcha = useCaptcha(formData)
const handleSend = async()=> {
if (smsRef.value.canGetCode) {
formData.mobile = prop.mobile
if (uni.$u.test.isEmpty(formData.mobile)) { uni.showToast({ title: t('mobilePlaceholder'), icon:'none' }); return }
if (!uni.$u.test.mobile(formData.mobile)) { uni.showToast({ title: t('mobileError'), icon:'none' }); return }
if (!prop.isAgree) {
uni.showToast({ title: t('isAgreeTips'), icon: 'none' });
return
}
if (uni.$u.test.isEmpty(formData.mobile)) {
uni.showToast({ title: t('mobilePlaceholder'), icon: 'none' });
return
}
if (!uni.$u.test.mobile(formData.mobile)) {
uni.showToast({ title: t('mobileError'), icon: 'none' });
return
}
await captcha.refresh()
show.value = true
show.value = true
}
}

102
uni-app/src/components/tabbar/tabbar.vue
View File

@ -1,16 +1,16 @@
<template>
<template v-if="tabbar && Object.keys(tabbar).length">
<u-tabbar :value="value" @change="tabbarChange" zIndex="9999" :fixed="true" :placeholder="true" :safeAreaInsetBottom="true"
<u-tabbar :value="value" zIndex="9999" :fixed="true" :placeholder="true" :safeAreaInsetBottom="true"
:inactive-color="tabbar.value.textColor" :active-color="tabbar.value.textHoverColor">
<block v-for="item in tabbar.value.list">
<u-tabbar-item class="py-[5rpx]" :style="{'background-color': tabbar.value.backgroundColor}" :text="item.text"
:icon="img(value == item.link.url ? item.iconSelectPath : item.iconPath)" :name="item.link.url"
v-if="tabbar.value.type == 1"></u-tabbar-item>
v-if="tabbar.value.type == 1" @click="itemBtn(item.link.url)"></u-tabbar-item>
<u-tabbar-item class="py-[5rpx]" :style="{'background-color': tabbar.value.backgroundColor}"
:icon="img(value == item.link.url ? item.iconSelectPath : item.iconPath)" :name="item.link.url"
v-if="tabbar.value.type == 2"></u-tabbar-item>
v-if="tabbar.value.type == 2" @click="itemBtn(item.link.url)"></u-tabbar-item>
<u-tabbar-item class="py-[5rpx]" :style="{'background-color': tabbar.value.backgroundColor}" :text="item.text" :name="item.link.url"
v-if="tabbar.value.type == 3"></u-tabbar-item>
v-if="tabbar.value.type == 3" @click="itemBtn(item.link.url)"></u-tabbar-item>
</block>
</u-tabbar>
<view class="tab-bar-placeholder"></view>
@ -21,6 +21,7 @@
import { ref,reactive,computed,watch } from 'vue'
import { redirect, currRoute,currShareRoute, img } from '@/utils/common'
import useConfigStore from '@/stores/config'
import { cloneDeep } from 'lodash-es'
const props = defineProps({
addon: {
@ -38,18 +39,45 @@
const tabbar:any = reactive({})
const setTabbar = ()=>{
let list = useConfigStore().tabbarList;
if(list.length == 1){
Object.assign(tabbar,list[0]);
}else{
for(let i=0;i<list.length;i++){
if(list[i].key == addon){
Object.assign(tabbar,list[i]);
break;
}
}
}
const setTabbar = ()=> {
let list = cloneDeep(useConfigStore().tabbarList);
if (list.length == 1) {
Object.assign(tabbar, list[0]);
} else {
let isExist = false;
for (let i = 0; i < list.length; i++) {
if (list[i].key == addon) {
Object.assign(tabbar, list[i]);
isExist = true;
break;
}
}
if (!isExist) {
// 检测是否单应用
let count = 0;
let singleTabbar = {}
try {
if (list) {
list.forEach((item: any) => {
if (item.info.type == 'app') {
count++;
singleTabbar = item;
}
})
}
if (count == 1) {
Object.assign(tabbar, singleTabbar);
}
} catch (e) {
}
}
}
}
setTabbar()
@ -85,25 +113,33 @@
return '/' + currRoute() + (str.length > 0 ? '?' + str.join('&') : '')
})
const tabbarChange = (url : string) => {
// const tabbarChange = (url : string) => {
// 外部链接
if (url.indexOf('http') != -1 || url.indexOf('http') != -1) {
// #ifdef H5
window.location.href = url;
// #endif
// #ifdef MP
redirect({
url: '/app/pages/webview/index',
param: { src: encodeURIComponent(url) }
});
// #endif
} else {
redirect({ url,mode: 'reLaunch' })
}
// }
const itemBtn = (url)=>{
if (url.indexOf('http') != -1 || url.indexOf('http') != -1) {
// #ifdef H5
window.location.href = url;
// #endif
// #ifdef MP
redirect({
url: '/app/pages/webview/index',
param: { src: encodeURIComponent(url) }
});
// #endif
} else {
let query:any = currShareRoute().params;
let str = [];
for (let key in query) {
str.push(key + '=' + query[key]);
}
if(url == ('/' + currRoute()) && !str.length) return
redirect({ url,mode: 'reLaunch' })
}
}
defineExpose({
})
</script>

59
uni-app/src/components/top-tabbar/top-tabbar.vue
View File

@ -23,9 +23,9 @@
<view class="title-wrap" @click="diyStore.toRedirect(topStatusBarData.link)">
<image :src="img(topStatusBarData.imgUrl)" mode="heightFix"></image>
</view>
<view class="search" @click="diyStore.toRedirect(topStatusBarData.link)" :style="{ height: menuButtonInfo.height - 2 + 'px', lineHeight: menuButtonInfo.height - 2 + 'px' }">
<text class="nc-iconfont nc-icon-sousuoV6xx absolute left-[20rpx]"></text>
<text class="text-[28rpx]">{{topStatusBarData.inputPlaceholder}}</text>
<view class="search" @click="diyStore.toRedirect(topStatusBarData.link)" :style="{ height: systemStore.menuButtonInfo.height - 2 + 'px', lineHeight: systemStore.menuButtonInfo.height - 2 + 'px' }">
<text class="nc-iconfont nc-icon-sousuo-duanV6xx1 text-[24rpx] absolute left-[20rpx]"></text>
<text class="text-[24rpx]">{{topStatusBarData.inputPlaceholder}}</text>
</view>
<view :style="{ 'width': capsuleWidth }"></view>
</view>
@ -41,11 +41,6 @@
<!-- 解决fixed定位后导航栏塌陷的问题 -->
<view class="u-navbar-placeholder" :style="{ width: '100%', paddingTop: placeholderHeight + 'px' }"></view>
<!-- #ifdef MP-WEIXIN -->
<!-- 小程序隐私协议 -->
<wx-privacy-popup ref="wxPrivacyPopupRef"></wx-privacy-popup>
<!-- #endif -->
</view>
</template>
@ -56,15 +51,12 @@ import { getAddressByLatlng } from '@/app/api/system';
import useSystemStore from '@/stores/system';
import useDiyStore from '@/app/stores/diy';
import manifestJson from '@/manifest.json'
import { cloneDeep } from 'lodash-es'
// 获取系统状态栏的高度
let systemInfo = uni.getSystemInfoSync();
let platform = systemInfo.platform;
let menuButtonInfo = {};
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
menuButtonInfo = uni.getMenuButtonBoundingClientRect();
// #endif
const systemStore = useSystemStore();
const diyStore = useDiyStore();
@ -117,8 +109,8 @@ const navbarInnerStyle = computed(() => {
}
// #ifdef MP
// 导航栏宽度，如果在小程序下，导航栏宽度为胶囊的左边到屏幕左边的距离
style += 'height:' + menuButtonInfo.height + 'px;';
style += 'padding-top:' + menuButtonInfo.top + 'px;';
style += 'height:' + systemStore.menuButtonInfo.height + 'px;';
style += 'padding-top:' + systemStore.menuButtonInfo.top + 'px;';
style += 'padding-bottom: 8px;';
// #endif
return style;
@ -183,8 +175,8 @@ if(componentsScrollVal){
}
/******************************* 存储滚动值-end ***********************/
/******************************* 返回按钮-start ***********************/
let isBackShow = ref(false);
/******************************* 返回按钮-start ***********************/
const isBackShow = ref(false);
let pages = getCurrentPages();
// 返回按钮的函数
@ -200,34 +192,37 @@ const goBack = () => {
// 微信胶囊宽度+right
const capsuleWidth = computed(() => {
let width = `calc(100vw - ${menuButtonInfo.right}px + ${menuButtonInfo.width}px + 10px)`;
let width = `calc(100vw - ${systemStore.menuButtonInfo.right}px + ${systemStore.menuButtonInfo.width}px + 10px)`;
return width;
})
// 导航栏塌陷的高度
let placeholderHeight = ref(0);
const placeholderHeight = ref(0);
const instance = getCurrentInstance();
// #ifdef MP
let statusBarHeight = systemStore.menuButtonInfo.height + systemStore.menuButtonInfo.top + 8;
placeholderHeight.value = statusBarHeight || 0;
// #endif
const navbarPlaceholderHeight = () => {
nextTick(() => {
const query = uni.createSelectorQuery().in(instance);
query.select('.ns-navbar-wrap .u-navbar .content-wrap').boundingClientRect(data => {
placeholderHeight.value = data ? data.height : 0;
diyStore.topTabarHeight = placeholderHeight.value;
}).exec();
})
const query = uni.createSelectorQuery().in(instance);
query.select('.ns-navbar-wrap .u-navbar .content-wrap').boundingClientRect(data => {
placeholderHeight.value = data ? data.height : 0;
diyStore.topTabarHeight = placeholderHeight.value;
}).exec();
})
}
/******************************* 定位-start ***********************/
// 获取地图配置
const systemStore = useSystemStore();
let currentPosition = ref('定位中...')
const currentPosition = ref('定位中...')
let mapConfig = uni.getStorageSync('mapConfig');
const initPosition = () =>{
// #ifdef H5
if (getQueryVariable('latng')) {
currentPosition.value = "定位中..."
let locationInfo = systemStore.location;
let locationInfo: any = systemStore.location;
var tempArr = getQueryVariable('latng').split(',');
locationInfo.latitude = tempArr[0];
locationInfo.longitude = tempArr[1];
@ -241,7 +236,7 @@ const initPosition = () =>{
// 定位信息过期后，重新获取定位
if(mapConfig.is_open == 1 && locationStorage() && locationStorage().is_expired) {
getLocation({
fail: (res) => {
fail: (res: any) => {
// 拒绝定位，进入默认总店
currentPosition.value = "定位中..."
}
@ -249,7 +244,7 @@ const initPosition = () =>{
}
}
watch(() => systemStore.location, (nval, oval)=> {
watch(() => systemStore.location, (nval: any, oval)=> {
if (nval.latitude && nval.longitude) {
getAddressByLatlngFn()
}else{
@ -278,7 +273,7 @@ const reposition = () => {
// #ifdef MP
uni.chooseLocation({
success: (res) => {
var urlencode = JSON.parse(JSON.stringify(systemStore.location));
var urlencode = cloneDeep(systemStore.location);
urlencode = Object.assign(urlencode,res)
systemStore.setLocation(urlencode);
},
@ -317,7 +312,6 @@ const getQueryVariable = (variable:any)=> {
return false;
}
/******************************* 定位-end ***********************/
onMounted(() => {
navbarPlaceholderHeight();
if (pages.length > 1) {
@ -465,6 +459,7 @@ defineExpose({
align-items: center;
margin-right: 10rpx;
overflow: hidden;
box-sizing: border-box;
text{
overflow: hidden; //超出的文本隐藏
text-overflow: ellipsis; //用省略号显示

6
uni-app/src/components/x-skeleton/x-skeleton.vue
View File

@ -95,12 +95,12 @@
// 骨架的背景色
bgColor: {
type: String,
default: '#EAEDF5'
default: '' // #EAEDF5
},
// 骨架的动画高亮背景色
highlightBgColor: {
type: String,
default: '#F9FAFF'
default: '' // #F9FAFF
},
// 自定义配置
config: {
@ -155,7 +155,7 @@
const rows = []
for (let i = 0; i < skeletonConfig.value.textRows; i++) {
const {gridRows, textWidth, textHeight} = skeletonConfig.value;
let item = {},
let item: any = {},
// 需要预防超出数组边界的情况
rowWidth = isArray(textWidth) ? (textWidth[i] || (i === gridRows - 1 ? '70%' : '100%')) : i === gridRows - 1 ? '70%' : textWidth,
rowHeight = isArray(textHeight) ? (textHeight[i] || '30rpx') : textHeight

2
uni-app/src/hooks/useCaptcha.ts
View File

@ -11,7 +11,7 @@ export function useCaptcha(formData: formData) {
const refresh = async ()=> {
try {
const res:AnyObject = await getCaptcha()
const res:any = await getCaptcha()
formData.captcha_key = res.data.captcha_key
formData.captcha_code = ''
image.value = res.data.img.replace(/\r\n/g, '')

55
uni-app/src/hooks/useDiy.ts
View File

@ -1,5 +1,5 @@
import { ref, reactive, computed } from 'vue';
import { onLoad, onShow, onPullDownRefresh, onPageScroll, onUnload } from '@dcloudio/uni-app';
import { onLoad, onShow, onHide, onPullDownRefresh, onPageScroll, onUnload } from '@dcloudio/uni-app';
import { img, handleOnloadParams } from '@/utils/common';
import { getDiyInfo } from '@/app/api/diy';
import useDiyStore from '@/app/stores/diy';
@ -13,6 +13,7 @@ export function useDiy(params: any = {}) {
const id = ref(0)
const name = ref(params.name || '')
const template = ref('')
let currRoute = "" //当前路由
// 自定义页面 数据
const diyData = reactive({
@ -26,7 +27,7 @@ export function useDiy(params: any = {}) {
return loading.value;
}
const data = computed(() => {
const data: any = computed(() => {
if (diyStore.mode == 'decorate') {
return diyStore;
} else {
@ -80,6 +81,20 @@ export function useDiy(params: any = {}) {
// 监听页面显示
const onShowLifeCycle = (callback: any = null) => {
onShow(() => {
/******** 解决跳转自定义页面空白问题-第二步-start **********/
let curPage: any = getCurrentPages();
currRoute = curPage[curPage.length - 1] ? curPage[curPage.length - 1].route : ''; //获取当前页面的路由
let urlArr = []
if (uni.getStorageSync('diyPageBlank')) {
urlArr = uni.getStorageSync('diyPageBlank');
}
if (!urlArr.length || urlArr.length && urlArr.indexOf(currRoute) == -1) {
diyStore.topFixedStatus = 'home'
} else if (urlArr.length && urlArr.indexOf(currRoute) != -1) {
diyStore.topFixedStatus = 'diy'
}
/******** 解决跳转自定义页面空白问题-第二步-end **********/
// 装修模式
if (diyStore.mode == 'decorate') {
diyStore.init();
@ -115,7 +130,7 @@ export function useDiy(params: any = {}) {
});
// 控制自定义头部是否出现 | 微信小程序
isShowTopTabbar.value = diyData.value.some((item) => {
isShowTopTabbar.value = diyData.value.some((item: any) => {
return item && item.position && item.position == 'top_fixed'
});
@ -135,11 +150,40 @@ export function useDiy(params: any = {}) {
})
}
// 监听页面隐藏
const onHideLifeCycle = (callback: any = null) => {
onHide(() => {
/******** 解决跳转自定义页面空白问题-第一步 -start **********/
let url = [];
if (uni.getStorageSync('diyPageBlank')) {
url = uni.getStorageSync('diyPageBlank');
}
// 清空重复、与当前页面路径一致的url
if (url.length) {
url = Array.from(new Set(url))
url.forEach((item, index, arr) => {
if (item == currRoute) {
arr.splice(index, 1);
}
})
}
// 当diyStore.topFixedStatus == "diy"时,存储到diyPageBlank缓存中
if (diyStore.topFixedStatus == "diy") {
url.push(currRoute);
}
uni.setStorageSync('diyPageBlank', url);
/******** 解决跳转自定义页面空白问题-第一步 -end **********/
if (callback) callback()
})
}
// 监听页面卸载
const onUnloadLifeCycle = () => {
onUnload(() => {
// 兼容轮播搜索组件-切换分类时，导致个人中心白屏
diyStore.topFixedStatus = 'home'
})
}
@ -168,6 +212,7 @@ export function useDiy(params: any = {}) {
pageStyle,
onLoad: onLoadLifeCycle,
onShow: onShowLifeCycle,
onHide: onHideLifeCycle,
onUnload: onUnloadLifeCycle,
onPullDownRefresh: onPullDownRefreshLifeCycle,
onPageScroll: onPageScrollLifeCycle,

153
uni-app/src/hooks/useLogin.ts
View File

@ -19,6 +19,7 @@ export function useLogin() {
uni.setStorage({ key: 'loginBack', data })
setTimeout(() => {
const config = useConfigStore()
// #ifdef MP-WEIXIN
if (!uni.getStorageSync('autoLoginLock') && uni.getStorageSync('openid') && config.login.is_bind_mobile) {
uni.setStorageSync('isbindmobile', true)
@ -32,10 +33,42 @@ export function useLogin() {
return
}
// #endif
redirect({ url: '/app/pages/auth/login', mode: 'redirectTo' })
// 如果只开启了账号密码登录，就不需要跳转到登录中间页了，直接进入普通账号密码登录页面
// #ifdef MP-WEIXIN
if (config.login.is_username && !config.login.is_mobile && !config.login.is_auth_register) {
redirect({ url: '/app/pages/auth/login', param: { type: 'username' }, mode: 'redirectTo' })
} else if (!config.login.is_username && !config.login.is_mobile && !config.login.is_auth_register) {
uni.showToast({ title: '商家未开启登录注册', icon: 'none' })
} else {
redirect({ url: '/app/pages/auth/index', mode: 'redirectTo' })
}
// #endif
// #ifdef H5
if (isWeixinBrowser()) {
// 微信浏览器
if (config.login.is_username && !config.login.is_mobile && !config.login.is_auth_register) {
redirect({ url: '/app/pages/auth/login', param: { type: 'username' }, mode: 'redirectTo' })
} else if (!config.login.is_username && !config.login.is_mobile && !config.login.is_auth_register) {
uni.showToast({ title: '商家未开启登录注册', icon: 'none' })
} else {
redirect({ url: '/app/pages/auth/index', mode: 'redirectTo' })
}
} else {
// 普通浏览器
if (config.login.is_username && !config.login.is_mobile) {
redirect({ url: '/app/pages/auth/login', param: { type: 'username' }, mode: 'redirectTo' })
} else if (!config.login.is_username && !config.login.is_mobile) {
uni.showToast({ title: '商家未开启登录注册', icon: 'none' })
} else {
redirect({ url: '/app/pages/auth/index', mode: 'redirectTo' })
}
}
// #endif
})
}
/**
* 执行登录后跳转
*/
@ -43,8 +76,13 @@ export function useLogin() {
uni.removeStorageSync('autoLoginLock')
uni.getStorage({
key: 'loginBack',
success: (data: AnyObject) => {
data ? redirect(data.data) : redirect({ url: '/app/pages/index/index', mode: 'switchTab' })
success: (res: any) => {
res ? redirect(
{
...res.data,
mode: 'redirectTo'
}
) : redirect({ url: '/app/pages/index/index', mode: 'switchTab' })
},
fail: (res) => {
redirect({ url: '/app/pages/index/index', mode: 'switchTab' })
@ -54,36 +92,42 @@ export function useLogin() {
/**
* 授权登录
* @param params { code, backFlag, successCallback }
*/
const authLogin = (code: string | null,backFlag = false,callback: any = null) => {
let obj = {};
const authLogin = (params: any) => {
let obj: any = {
code: params.code
};
// #ifdef MP-WEIXIN
obj.code = code;
uni.getStorageSync('pid') && (Object.assign(obj, { pid: uni.getStorageSync('pid') }))
weappLogin(obj).then((res: AnyObject) => {
weappLogin(obj).then((res: any) => {
if (res.data.token) {
useMemberStore().setToken(res.data.token)
const config = useConfigStore()
setTimeout(() => {
const memberInfo = useMemberStore().info
memberInfo && memberInfo.weapp_openid && uni.setStorageSync('openid', memberInfo.weapp_openid)
useMemberStore().setToken(res.data.token, () => {
const config = useConfigStore()
const memberInfo: any = useMemberStore().info
if (memberInfo) {
memberInfo.weapp_openid && uni.setStorageSync('openid', memberInfo.weapp_openid)
memberInfo.mobile && uni.setStorageSync('wap_member_mobile', memberInfo.mobile) // 存储会员手机号，防止重复请求微信获取手机号接口
}
// 开启绑定手机号标识
if (uni.getStorageSync('isbindmobile')) {
uni.removeStorageSync('isbindmobile');
}
if (config.login.is_bind_mobile && memberInfo && !memberInfo.mobile) {
uni.setStorageSync('isbindmobile', true)
}
if(backFlag) handleLoginBack() //一键登录返回
}, 1000)
if (params.successCallback) params.successCallback(res.data)
if (params.backFlag) handleLoginBack() // 一键登录返回
})
} else {
// 目前业务不会执行到这里
uni.setStorageSync('openid', res.data.openid)
uni.setStorageSync('unionid', res.data.unionid)
if(callback) callback({
openid: uni.getStorageSync('openid'),
unionid: uni.getStorageSync('unionid')
})
}
}).catch((err) => {
uni.showToast({ title: err.msg, icon: 'none' })
@ -91,15 +135,13 @@ export function useLogin() {
// #endif
// #ifdef H5
obj.code = code;
uni.getStorageSync('pid') && (Object.assign(obj, { pid: uni.getStorageSync('pid') }))
wechatUser(obj).then((user_res: AnyObject) => {
wechatUser(obj).then((user_res: any) => {
if (user_res.data) {
wechatUserLogin(user_res.data).then((res: AnyObject) => {
wechatUserLogin(user_res.data).then((res: any) => {
if (res.data.token) {
useMemberStore().setToken(res.data.token)
const config = useConfigStore()
setTimeout(() => {
useMemberStore().setToken(res.data.token, () => {
const config = useConfigStore()
const memberInfo = useMemberStore().info
memberInfo && memberInfo.wx_openid && uni.setStorageSync('openid', memberInfo.wx_openid)
// 开启绑定手机号标识
@ -109,8 +151,9 @@ export function useLogin() {
if (config.login.is_bind_mobile && memberInfo && !memberInfo.mobile) {
uni.setStorageSync('isbindmobile', true)
}
}, 1000)
})
} else {
// 目前业务不会执行到这里
uni.setStorageSync('openid', res.data.openid)
uni.setStorageSync('unionid', res.data.unionid)
}
@ -118,7 +161,7 @@ export function useLogin() {
}
}).catch((err) => {
if (err.msg == -1) {
getAuthCode('snsapi_userinfo')
getAuthCode({ scopes: 'snsapi_userinfo' })
} else {
uni.showToast({ title: err.msg, icon: 'none' })
}
@ -129,40 +172,49 @@ export function useLogin() {
* 登录普通账号后修改openid
*/
const updateOpenid = (code: string | null) => {
let obj = {};
let obj: any = {
code
};
// #ifdef MP-WEIXIN
obj.code = code;
updateWeappOpenid(obj).then((res) => {
useMemberStore().getMemberInfo()
setTimeout(() => {
useMemberStore().getMemberInfo(() => {
const memberInfo = useMemberStore().info
memberInfo && memberInfo.weapp_openid && uni.setStorageSync('openid', memberInfo.weapp_openid)
}, 1000)
})
})
// #endif
// #ifdef H5
obj.code = code;
updateWechatOpenid(obj).then((res) => {
useMemberStore().getMemberInfo()
setTimeout(() => {
useMemberStore().getMemberInfo(() => {
const memberInfo = useMemberStore().info
memberInfo && memberInfo.wx_openid && uni.setStorageSync('openid', memberInfo.wx_openid)
}, 1000)
})
})
// #endif
}
/**
* 获取授权码
* updateFlag：更新oppenid
* backFlag 控制一键登录返回
* @param params { scopes, updateFlag, backFlag, successCallback }
*/
const getAuthCode = (scopes: '' | 'snsapi_base' | 'snsapi_userinfo' = 'snsapi_base', updateFlag: boolean = false, backFlag: boolean = false,callback = null) => {
const getAuthCode = (params: any = {}) => {
params.scopes = params.scopes || 'snsapi_base'; // 公众号用
// 微信小程序用
params.updateFlag = params.updateFlag || false; // updateFlag：更新oppenid
params.backFlag = params.backFlag || false; // backFlag 控制一键登录返回
params.successCallback = params.successCallback || null;
// #ifdef MP-WEIXIN
wx.login({
success(res) {
success(res: any) {
if (res.code) {
updateFlag ? updateOpenid(res.code) : authLogin(res.code,backFlag,callback)
params.updateFlag ? updateOpenid(res.code) : authLogin({
code: res.code,
backFlag: params.backFlag,
successCallback: params.successCallback
})
} else {
console.log('登录失败！' + res.errMsg)
}
@ -171,17 +223,26 @@ export function useLogin() {
// #endif
// #ifdef H5
let url = `${ location.origin }${ location.pathname }`
let query = urlDeconstruction(location.href).query
query.code && (delete query.code)
Object.keys(query).length && (url += uni.$u.queryParams(query))
// 如果当前在登录中间页，那么要跳转到首页
if (url.indexOf('app/pages/auth/index') != -1) {
url = url.replace('app/pages/auth/index', 'app/pages/index/index')
} else {
let query: any = urlDeconstruction(location.href).query
query.code && (delete query.code)
Object.keys(query).length && (url += uni.$u.queryParams(query))
}
getWechatAuthCode({
url,
scopes
}).then((res: AnyObject) => {
scopes: params.scopes
}).then((res: any) => {
uni.setStorageSync('wechat_login_back', true) // 微信公众号手动授权登录回调标识
location.href = res.data.url
})
// #endif
}

6
uni-app/src/hooks/useSendSms.ts
View File

@ -2,7 +2,7 @@ import { ref, computed } from 'vue'
import { t } from '@/locale'
import { sendSms } from '@/app/api/system'
export function useSendSms(smsRef: AnyObject | null) {
export function useSendSms(smsRef: any) {
const tips = ref(t('getSmsCode'))
const seconds = 90
const changeText = 'X' + t('smsCodeChangeText')
@ -20,7 +20,7 @@ export function useSendSms(smsRef: AnyObject | null) {
smsRef.value.start()
let result: string | boolean = false
await sendSms(param).then(res => {
await sendSms(param).then((res: any) => {
if (res.code == 1) {
result = res.data.key
} else {
@ -41,7 +41,7 @@ export function useSendSms(smsRef: AnyObject | null) {
return {
tips: tips,
seconds,
canGetCode: canGetCode,
canGetCode,
send,
codeChange,
changeText

13
uni-app/src/hooks/useShare.ts
View File

@ -1,6 +1,7 @@
import { img, isWeixinBrowser, currRoute, currShareRoute } from '@/utils/common'
import { onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app'
import { getShareInfo } from '@/app/api/diy';
import useSystemStore from '@/stores/system';
// #ifdef H5
import wechat from '@/utils/wechat'
@ -8,7 +9,6 @@ import wechat from '@/utils/wechat'
export const useShare = () => {
var wechatOptions: any = {};
var weappOptions: any = {};
const wechatInit = () => {
@ -68,13 +68,16 @@ export const useShare = () => {
wechatOptions.link = options.wechat.link || h5Link
wechatOptions.desc = options.wechat.desc || ''
wechatOptions.imgUrl = options.wechat.url ? img(options.wechat.url) : ''
// wechatOptions.success = options.wechat.callback || null;
// useSystemStore().shareCallback = options.wechat.callback || null;
wechatShare()
// #endif
// #ifdef MP-WEIXIN
weappOptions.title = options.weapp.title || ''
weappOptions.query = options.weapp.path || queryStr.join('&')
if (options.weapp.path) weappOptions.path = options.weapp.path
weappOptions.imageUrl = options.weapp.url ? img(options.weapp.url) : ''
useSystemStore().shareCallback = options.weapp.callback || null;
// #endif
uni.setStorageSync('weappOptions', weappOptions)
@ -113,9 +116,10 @@ export const useShare = () => {
// 小程序分享，分享给好友
const shareApp = (options = {}) => {
onShareAppMessage(() => {
return onShareAppMessage(() => {
let config: any = uni.getStorageSync('weappOptions')
if (!config) config = {}
if (useSystemStore().shareCallback) useSystemStore().shareCallback();
return {
...config,
...options
@ -126,9 +130,10 @@ export const useShare = () => {
// 小程序分享，分享到朋友圈
const shareTime = (options = {}) => {
onShareTimeline(() => {
return onShareTimeline(() => {
let config: any = uni.getStorageSync('weappOptions')
if (!config) config = {}
if (useSystemStore().shareCallback) useSystemStore().shareCallback();
return {
...config,
...options

100
uni-app/src/locale/zh-Hans.json
View File

@ -6,13 +6,14 @@
"pages.index.diy": "",
"pages.article.list": "资讯中心",
"pages.article.detail": "文章详情",
"pages.auth.index": "登录",
"pages.auth.agreement": "协议",
"pages.auth.bind": "绑定手机号",
"pages.auth.login": "登录",
"pages.auth.register": "注册",
"pages.auth.resetpwd": "找回密码",
"pages.member.account": "会员账户",
"pages.member.account_edit": "编辑会员账户",
"pages.member.account_edit": "",
"pages.member.address": "收货地址",
"pages.member.address_edit": "编辑收货地址",
"pages.member.apply_cash_out": "申请提现",
@ -29,11 +30,104 @@
"pages.member.personal": "个人资料",
"pages.member.contact": "客服",
"pages.pay.browser": "支付",
"pages.pay.result": "支付结果",
"pages.pay.result": "",
"pages.setting.index": "设置",
"pages.verify.index": "核销台",
"pages.verify.verify": "核销",
"pages.verify.detail": "核销详情",
"pages.verify.record": "核销记录",
"pages.webview.index": ""
"pages.webview.index": "",
"tourism.pages.way.list": "线路列表",
"tourism.pages.way.detail": "线路详情",
"tourism.pages.way.order": "线路订单",
"tourism.pages.hotel.list": "酒店列表",
"tourism.pages.hotel.detail": "酒店详情",
"tourism.pages.hotel.order": "酒店订单",
"tourism.pages.scenic.list": "景点列表",
"tourism.pages.scenic.detail": "景点详情",
"tourism.pages.scenic.order": "景点订单",
"tourism.pages.order.list": "旅游订单",
"tourism.pages.order.detail": "订单详情",
"tourism.pages.verify.index": "核销",
"tourism.pages.verify.record": "核销记录",
"tourism.pages.verify.detail": "核销详情",
"vipcard.pages.verify.index": "核销",
"vipcard.pages.verify.record": "核销记录",
"vipcard.pages.verify.detail": "核销详情",
"vipcard.pages.order.payment": "订单结算",
"vipcard.pages.order.list": "订单列表",
"vipcard.pages.order.my_reserved": "我的预约",
"vipcard.pages.order.my_reserved_detail": "我的预约详情",
"vipcard.pages.order.my_card": "我的卡项",
"vipcard.pages.order.detail": "订单详情",
"vipcard.pages.service.list": "项目列表",
"vipcard.pages.card.list": "卡项列表",
"vipcard.pages.card.detail": "卡项详情",
"recharge.pages.recharge": "充值",
"recharge.pages.recharge_record": "充值记录",
"recharge.pages.recharge_record_detail": "充值记录详情",
"shop.pages.goods.search": "搜索",
"shop.pages.goods.cart": "购物车",
"shop.pages.goods.category": "商品分类",
"shop.pages.goods.detail": "商品详情",
"shop.pages.goods.list": "商品列表",
"shop.pages.member.index": "个人中心",
"shop.pages.member.my_coupon": "我的优惠券",
"shop.pages.order.list": "订单列表",
"shop.pages.order.detail": "订单详情",
"shop.pages.order.payment": "待付款订单",
"shop.pages.evaluate.order_evaluate": "商品评价",
"shop.pages.evaluate.order_evaluate_view": "商品评价",
"shop.pages.evaluate.list": "评价列表",
"shop.pages.coupon.list": "优惠券列表",
"shop.pages.coupon.detail": "优惠券详情",
"shop.pages.discount.list": "限时折扣",
"shop.pages.refund.list": "退款列表",
"shop.pages.refund.detail": "退款详情",
"shop.pages.refund.apply": "申请退款",
"shop.pages.refund.edit_apply": "编辑退款信息",
"shop.pages.refund.log": "协商记录",
"shop.pages.point.index":"积分商城",
"shop.pages.point.list":"积分商品列表",
"shop.pages.point.detail":"积分商品详情",
"shop.pages.point.payment":"待付款订单",
"shop.pages.point.order_list":"积分兑换记录",
"cms.pages.list": "资讯中心",
"cms.pages.detail": "文章详情",
"shop_fenxiao.pages.index": "分销中心",
"shop_fenxiao.pages.zone": "分销专区",
"shop_fenxiao.pages.level": "分销商等级",
"shop_fenxiao.pages.child_fenxiao": "分销商",
"shop_fenxiao.pages.goods": "分销商品",
"shop_fenxiao.pages.team": "团队",
"shop_fenxiao.pages.ranking_list": "排行榜",
"shop_fenxiao.pages.agent_list": "渠道代理",
"shop_fenxiao.pages.bill": "账单",
"shop_fenxiao.pages.order": "分销订单",
"shop_fenxiao.pages.order_detail": "订单详情",
"shop_fenxiao.pages.apply": "分销商申请",
"shop_fenxiao.pages.task_rewards": "任务奖励",
"shop_fenxiao.pages.task_detail": "任务奖励详情",
"shop_fenxiao.pages.task_rewards_detail": "任务奖励明细",
"shop_fenxiao.pages.sale": "销售奖励",
"shop_fenxiao.pages.sale_detail": "销售奖励详情",
"shop_fenxiao.pages.sale_ranking": "销售排行榜",
"shop_fenxiao.pages.promote_code": "分销推广",
"shop_giftcard.pages.index": "礼品卡首页",
"shop_giftcard.pages.list": "礼品卡列表",
"shop_giftcard.pages.detail": "加载中",
"shop_giftcard.pages.order_list": "礼品卡订单列表",
"shop_giftcard.pages.order_detail": "礼品卡订单详情",
"shop_giftcard.pages.member": "我的",
"shop_giftcard.pages.my_card_list": "我的卡包",
"shop_giftcard.pages.card_bag": "我的卡包",
"shop_giftcard.pages.activate": "卡密激活",
"shop_giftcard.pages.receive_list": "收到的礼品卡",
"shop_giftcard.pages.give_list": "送出的礼品卡",
"shop_giftcard.pages.give_detail": "送出礼品卡详情",
"shop_giftcard.pages.give": "礼品卡赠送",
"shop_giftcard.pages.receive_info": "领取礼品卡",
"shop_giftcard.pages.use_card": "礼品卡使用",
"shop_giftcard.pages.use_goods_select": "选择兑换商品",
"shop_giftcard.pages.payment": "待付款订单"
}

201
uni-app/src/locale/zh-Hans/common.json
View File

@ -1,102 +1,103 @@
{
"requestFail": "请求失败",
"notInDomainList": "不在request 合法域名列表中",
"baseUrlError": " 接口请求错误,请检查VITE_APP_BASE_URL参数配置或者伪静态配置",
"currency": "￥",
"getSmsCode": "获取验证码",
"smsCodeChangeText": "秒后重新获取",
"captchaTitle": "请完成验证",
"confirm": "确认",
"cancel": "取消",
"save": "保存",
"delete": "删除",
"captchaPlaceholder": "请输入验证码",
"mobilePlaceholder": "请输入手机号码",
"mobileError": "请输入正确的手机号",
"codePlaceholder": "请输入手机验证码",
"memberCenter": "个人中心",
"userAgreement": "用户协议",
"privacyAgreement": "隐私协议",
"nickname": "昵称",
"nicknamePlaceholder": "请输入昵称",
"headimg": "头像",
"headimgPlaceholder": "请设置头像",
"getAvatarNickname": "获取您的昵称头像",
"getAvatarNicknameTips": "获取用户头像、昵称完善个人资料，主要用于向用户提供具有辨识度的用户中心界面",
"mobile":"手机号",
"getMobile":"获取手机号",
"mobileTips":"请获取手机号",
"point": "积分",
"balance": "余额",
"login": "登录",
"bind": "绑定",
"binding": "绑定中",
"bindMobile": "绑定手机号",
"agreeTips": "请阅读并同意",
"pleaceAgree": "请勾选已阅读并同意",
"weixinUserAuth": "一键绑定",
"mobileQuickLogin": "手机号快捷登录",
"register": "注册",
"complete": "完成",
"close": "关闭",
"pay": {
"orderInfo": "订单信息",
"confirmPay": "确认支付",
"payTitle": "确认付款",
"notHavePayType": "没有可用的支付方式",
"notObtainedInfo": "未获取到支付信息",
"paymentDocuments": "该支付单据",
"paySuccess": "支付成功",
"payFail": "支付失败",
"completePay": "已完成支付",
"incompletePay": "未完成支付",
"getting": "获取支付结果中"
},
"myBalance": "我的余额",
"myPoint": "我的积分",
"customerService": "联系客服",
"siteClose": "站点已关闭",
"noSite": "站点不存在",
"scenic": "景点",
"seeMore": "查看更多",
"way": "线路",
"hotel": "酒店",
"rise": "起",
"cardReserve": "项目预约",
"card": "办理次卡",
"memberName": "会员名称",
"memberCode": "会员码",
"reserve": "预约",
"reserveSuccess": "预约成功",
"cardLink": "次卡",
"myLink": "我的",
"reserveBtn": "去抢购",
"cardBtn": "办理",
"soldOut": "已售",
"unpaidOrder": "待支付",
"waitingOrder": "待使用",
"remainOrder": "已完成",
"allOrder": "全部订单",
"myOrder": "我的订单",
"orderNo": "订单号",
"actualPayment": "实付款",
"orderClose": "关闭订单",
"orderFinish": "确认收货",
"orderDetail": "详情",
"wxPrivacyPopup": {
"title": "用户隐私保护提示",
"descBefore": "感谢您使用本小程序，在使用前您应当阅读并同意",
"descAfter": "当点击同意并继续时，即表示您已理解并同意该条款内容，该条款将对您产生法律约束力；如您不同意，将无法继续使用小程序相关功能。",
"disagree": "不同意",
"agree": "同意并继续",
"contractName": "用户隐私保护指引",
"disagreeDesc": "未同意隐私协议，无法使用相关功能"
},
"starLevel": "星级",
"star": "星",
"emptyAddress":"暂无收货地址，请先创建地址",
"addAddress":"新增收货地址",
"selectAddress":"选择地址",
"coupon":"优惠劵"
"requestFail": "请求失败",
"notInDomainList": "不在request 合法域名列表中",
"baseUrlError": " 接口请求错误,请检查VITE_APP_BASE_URL参数配置或者伪静态配置",
"currency": "￥",
"getSmsCode": "获取验证码",
"smsCodeChangeText": "秒后重新获取",
"captchaTitle": "请完成验证",
"confirm": "确认",
"cancel": "取消",
"save": "保存",
"delete": "删除",
"captchaPlaceholder": "请输入验证码",
"mobilePlaceholder": "请输入手机号码",
"mobileError": "请输入正确的手机号",
"codePlaceholder": "请输入手机验证码",
"memberCenter": "个人中心",
"userAgreement": "用户协议",
"and": "和",
"privacyAgreement": "隐私协议",
"isAgreeTips": "请先阅读并同意协议",
"nickname": "昵称",
"nicknamePlaceholder": "请输入昵称",
"headimg": "头像",
"headimgPlaceholder": "请设置头像",
"getAvatarNickname": "获取您的昵称头像",
"getAvatarNicknameTips": "获取用户头像、昵称完善个人资料，主要用于向用户提供具有辨识度的用户中心界面",
"mobile": "手机号",
"getMobile": "获取手机号",
"mobileTips": "请获取手机号",
"point": "积分",
"balance": "余额",
"login": "登录",
"bind": "绑定",
"binding": "绑定中",
"bindMobile": "绑定手机号",
"agreeTips": "请阅读并同意",
"pleaseAgree": "请勾选已阅读并同意",
"weixinUserAuth": "一键绑定",
"mobileQuickLogin": "手机号快捷登录",
"register": "注册",
"complete": "完成",
"close": "关闭",
"pay": {
"orderInfo": "订单信息",
"confirmPay": "确认支付",
"payTitle": "确认付款",
"notHavePayType": "没有可用的支付方式",
"notObtainedInfo": "未获取到支付信息",
"paymentDocuments": "该支付单据",
"paySuccess": "支付成功",
"payFail": "支付失败",
"completePay": "已完成支付",
"incompletePay": "未完成支付",
"getting": "获取支付结果中"
},
"myBalance": "我的余额",
"myPoint": "我的积分",
"customerService": "联系客服",
"siteClose": "站点已关闭",
"noSite": "站点不存在",
"scenic": "景点",
"seeMore": "查看更多",
"way": "线路",
"hotel": "酒店",
"rise": "起",
"cardReserve": "项目预约",
"card": "办理次卡",
"memberName": "会员名称",
"memberCode": "会员码",
"reserve": "预约",
"reserveSuccess": "预约成功",
"cardLink": "次卡",
"myLink": "我的",
"reserveBtn": "去抢购",
"cardBtn": "办理",
"soldOut": "已售",
"unpaidOrder": "待支付",
"waitingOrder": "待使用",
"remainOrder": "已完成",
"allOrder": "全部订单",
"myOrder": "我的订单",
"orderNo": "订单号",
"actualPayment": "实付款",
"orderClose": "关闭订单",
"orderFinish": "确认收货",
"orderDetail": "详情",
"wxPrivacyPopup": {
"title": "用户隐私保护提示",
"descBefore": "感谢您使用本小程序，在使用前您应当阅读并同意",
"descAfter": "当点击同意并继续时，即表示您已理解并同意该条款内容，该条款将对您产生法律约束力；如您不同意，将无法继续使用小程序相关功能。",
"disagree": "不同意",
"agree": "同意并继续",
"contractName": "用户隐私保护指引",
"disagreeDesc": "未同意隐私协议，无法使用相关功能"
},
"starLevel": "星级",
"star": "星",
"emptyAddress": "暂无收货地址，请先创建地址",
"addAddress": "新增收货地址",
"selectAddress": "选择地址",
"coupon": "优惠劵"
}

27
uni-app/src/stores/config.ts
View File

@ -1,13 +1,15 @@
import { defineStore } from 'pinia'
import { getConfig } from '@/app/api/auth'
import { getTabbarList } from '@/app/api/diy'
interface loginConfig {
is_username: number | boolean,
is_mobile: number | boolean,
is_auth_register: number | boolean,
is_bind_mobile: number | boolean,
agreement_show: number | boolean
agreement_show: number | boolean,
bg_url: string,
logo: string,
desc: string
}
interface tabbarConfig {
@ -33,7 +35,10 @@ const useConfigStore = defineStore('config', {
is_mobile: 0,
is_auth_register: 0,
is_bind_mobile: 0,
agreement_show: 0
agreement_show: 0,
bg_url: '',
logo: '',
desc: ''
},
tabbarList: {},
tabbar: null,
@ -43,19 +48,15 @@ const useConfigStore = defineStore('config', {
},
actions: {
async getLoginConfig() {
await getConfig().then((res: responseResult) => {
this.login.is_username = parseInt(res.data.is_username)
this.login.is_mobile = parseInt(res.data.is_mobile)
await getConfig().then((res: any) => {
this.login.is_username = res.data.is_username
this.login.is_mobile = res.data.is_mobile
this.login.is_auth_register = parseInt(res.data.is_auth_register)
this.login.is_bind_mobile = parseInt(res.data.is_bind_mobile)
this.login.agreement_show = parseInt(res.data.agreement_show)
}).catch(() => {
})
},
async getTabbarConfig() {
await getTabbarList({}).then((res: any) => {
this.tabbarList = res.data;
}).catch(() => {
this.login.bg_url = res.data.bg_url // 背景图
this.login.logo = res.data.logo //logo
this.login.desc = res.data.desc // 描述
})
},
// 获取主色调

73
uni-app/src/stores/member.ts
View File

@ -1,11 +1,13 @@
import { defineStore } from 'pinia'
import { setToken, removeToken, redirect } from '@/utils/common'
import { getMemberInfo, getMemberLevel } from '@/app/api/member'
import { getMemberInfo as getMemberInfoApi, bindMobile as bindMobileApi } from '@/app/api/member'
import { logout } from '@/app/api/auth'
import useConfigStore from '@/stores/config'
import { useLogin } from '@/hooks/useLogin'
interface Member {
token: string | null
info: AnyObject | null
info: any | null
levelList: Array<any> | null
}
@ -18,46 +20,85 @@ const useMemberStore = defineStore('member', {
}
},
actions: {
async setToken(token: string) {
setToken(token: string, callback: any = null) {
this.token = token
setToken(token)
await this.getMemberInfo()
this.getMemberInfo(callback)
},
async getMemberInfo() {
getMemberInfo(callback: any = null) {
if (!this.token) return
await getMemberInfo().then((res: any) => {
this.info = res.data
getMemberInfoApi().then((res: any) => {
this.info = res.data;
uni.setStorageSync('wap_member_info', this.info)
uni.setStorageSync('wap_member_id', res.data.member_id)
}).catch(async() => {
await this.logout()
if (this.info.mobile) {
uni.removeStorageSync('isbindmobile')
uni.setStorageSync('wap_member_mobile', this.info.mobile) // 存储会员手机号，防止重复请求微信获取手机号接口
}
// #ifdef MP-WEIXIN
if (this.info && this.info.weapp_openid) {
uni.setStorageSync('openid', this.info.weapp_openid)
} else {
const login = useLogin()
login.getAuthCode({ updateFlag: true }) // 更新oppenid
}
// #endif
if (callback) callback();
}).catch(() => {
this.logout()
})
},
async logout(isRedirect: boolean = false) {
logout(isRedirect: boolean = false) {
if (!this.token) return
this.token = ''
this.info = null
if(useConfigStore().login.is_auth_register){
if (useConfigStore().login.is_auth_register) {
uni.setStorageSync('autoLoginLock', true) // todo 普通账号退出登录,在进行三方账号登录不会自动登录
}
await logout().then(() => {
logout().then(() => {
removeToken()
uni.removeStorageSync('wap_member_info');
uni.removeStorageSync('openid');
uni.removeStorageSync('unionid');
uni.removeStorageSync('isbindmobile');
isRedirect && redirect({ url: '/app/pages/index/index', mode: 'switchTab' })
}).catch(() => {
removeToken()
uni.removeStorageSync('wap_member_info');
uni.removeStorageSync('openid');
uni.removeStorageSync('unionid');
uni.removeStorageSync('isbindmobile');
isRedirect && redirect({ url: '/app/pages/index/index', mode: 'switchTab' })
})
},
getMemberLevel() {
getMemberLevel().then((res: any) => {
this.levelList = res.data
})
// 一键绑定手机号
bindMobile(e: any) {
if (e.detail.errMsg == 'getPhoneNumber:ok') {
uni.showLoading({ title: '' })
bindMobileApi({
mobile_code: e.detail.code
}).then((res: any) => {
uni.hideLoading()
this.getMemberInfo()
}).catch(() => {
setTimeout(() => {
uni.hideLoading()
}, 2000);
})
}
if (e.detail.errno == 104) {
let msg = '用户未授权隐私权限';
uni.showToast({ title: msg, icon: 'none' })
}
if (e.detail.errMsg == "getPhoneNumber:fail user deny") {
let msg = '用户拒绝获取手机号码';
uni.showToast({ title: msg, icon: 'none' })
}
}
}
})

86
uni-app/src/stores/system.ts
View File

@ -1,5 +1,7 @@
import { defineStore } from 'pinia'
import { getSiteInfo, getMap } from '@/app/api/system'
import { getInitInfo, getSiteInfo } from '@/app/api/system'
import useConfigStore from '@/stores/config'
import useMemberStore from '@/stores/member'
interface System {
site: AnyObject | null,
@ -7,7 +9,10 @@ interface System {
siteAddons: string[],
currRoute: string,
location: Object | null, // 定位信息
mapConfig: Object
mapConfig: any,
initStatus: any, // 初始化状态
menuButtonInfo: any, // 如果是小程序，获取右上角胶囊的尺寸信息
shareCallback: any // 分享回调
}
const useSystemStore = defineStore('system', {
@ -21,15 +26,76 @@ const useSystemStore = defineStore('system', {
mapConfig: {
is_open: 1,
valid_time: 0
}
},
initStatus: 'wait',
menuButtonInfo: {
height: '',
top: '',
right: '',
width: ''
},
shareCallback: null
}
},
actions: {
// 获取初始化数据信息
getInitFn(callback: any) {
getInitInfo().then((res: any) => {
if (res.data) {
let data = res.data;
// 底部导航
const configStore = useConfigStore()
configStore.tabbarList = data.tabbar_list;
// 地图配置
this.mapConfig.is_open = data.map_config.is_open;
this.mapConfig.valid_time = data.map_config.valid_time;
uni.setStorageSync('mapConfig', this.mapConfig);
// 站点信息
this.site = data.site_info
const apps: any = [], addons: any = []
Object.keys(data.site_info.site_addons).forEach((key: string) => {
const item = data.site_info.site_addons[key]
item.type == 'app' ? apps.push(key) : addons.push(key)
})
this.siteApps = apps
this.siteAddons = addons
// 会员等级
const memberStore = useMemberStore();
memberStore.levelList = data.member_level;
// 登录注册配置
configStore.login.is_username = data.login_config.is_username
configStore.login.is_mobile = data.login_config.is_mobile
configStore.login.is_auth_register = parseInt(data.login_config.is_auth_register)
configStore.login.is_bind_mobile = parseInt(data.login_config.is_bind_mobile)
configStore.login.agreement_show = parseInt(data.login_config.agreement_show)
configStore.login.bg_url = data.login_config.bg_url // 背景图
configStore.login.logo = data.login_config.logo //logo
configStore.login.desc = data.login_config.desc // 描述
uni.setStorageSync('login_config', configStore.login)
this.initStatus = 'finish'; // 初始化完成
if (callback) callback()
}
})
this.getMenuButtonInfoFn();
},
getMenuButtonInfoFn() {
// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
this.menuButtonInfo = uni.getMenuButtonBoundingClientRect();
// #endif
},
async getSiteInfoFn() {
await getSiteInfo().then((res: any) => {
this.site = res.data
const apps = [], addons = []
Object.keys(res.data.site_addons).forEach((key:string) => {
const apps: any = [], addons: any = []
Object.keys(res.data.site_addons).forEach((key: string) => {
const item = res.data.site_addons[key]
item.type == 'app' ? apps.push(key) : addons.push(key)
})
@ -38,15 +104,7 @@ const useSystemStore = defineStore('system', {
}).catch((err) => {
})
},
async getMapFn() {
// 获取地图配置
await getMap().then((res: any) => {
this.mapConfig.is_open = res.data.is_open;
this.mapConfig.valid_time = res.data.valid_time;
uni.setStorageSync('mapConfig', this.mapConfig);
})
},
setLocation(value: Object) {
setLocation(value: any) {
var date = new Date();
date.setSeconds(60 * this.mapConfig.valid_time);
value.valid_time = date.getTime() / 1000; // 定位信息 5分钟内有效，过期后将重新获取定位信息

332
uni-app/src/styles/common.scss
View File

File diff suppressed because one or more lines are too long

82
uni-app/src/styles/iconfont.css
View File

@ -1,8 +1,8 @@
@font-face {
font-family: "iconfont"; /* Project id 3952239 */
src: url('//at.alicdn.com/t/c/font_3952239_mvhdfb735e.woff2?t=1719994029682') format('woff2'),
url('//at.alicdn.com/t/c/font_3952239_mvhdfb735e.woff?t=1719994029682') format('woff'),
url('//at.alicdn.com/t/c/font_3952239_mvhdfb735e.ttf?t=1719994029682') format('truetype');
src: url('//at.alicdn.com/t/c/font_3952239_urcc1eq7dmn.woff2?t=1726020629322') format('woff2'),
url('//at.alicdn.com/t/c/font_3952239_urcc1eq7dmn.woff?t=1726020629322') format('woff'),
url('//at.alicdn.com/t/c/font_3952239_urcc1eq7dmn.ttf?t=1726020629322') format('truetype');
}
.iconfont {
@ -13,6 +13,82 @@
-moz-osx-font-smoothing: grayscale;
}
.iconshengyinpc:before {
content: "\e7d1";
}
.iconkabao:before {
content: "\e7ec";
}
.iconchuzhikaV6mm:before {
content: "\e7ea";
}
.iconkabaoV6mm:before {
content: "\e7e9";
}
.iconduihuankaV6mm-1:before {
content: "\e7e8";
}
.iconduihuankaV6mm:before {
content: "\e7e7";
}
.iconshouyeV6mm1:before {
content: "\e7e5";
}
.iconshouyeV6xx1:before {
content: "\e7bb";
}
.icona-yingyongzhongxinV6xx-32:before {
content: "\e7e4";
}
.icona-yingyongliebiaoV6xx-32:before {
content: "\e7e3";
}
.icona-guanbi-34V6mm:before {
content: "\e7ae";
}
.icona-cuohaoV6mm-36:before {
content: "\e7b4";
}
.iconpaihangbangV6xx1:before {
content: "\e7e2";
}
.icona-guanbi-34V6xx:before {
content: "\e7ad";
}
.icona-shaixuan-36V6xx-36:before {
content: "\e7b3";
}
.icona-shaixuanV6xx-34:before {
content: "\e7a5";
}
.iconUnion:before {
content: "\e7b1";
}
.iconqiang:before {
content: "\e7b2";
}
.iconyanjing:before {
content: "\e8bf";
}
.iconyouV6xx:before {
content: "\e648";
}

2
uni-app/src/styles/member_record_list.scss
View File

@ -1,7 +1,7 @@
.member-record-list{
@apply min-h-[100vh];
.member-record-item{
@apply relative sidebar-marign border-solid border-t-0 border-l-0 border-r-0 border-b-1 border-[#ECEBEC] py-3 mx-[var(--sidebar-m)];
@apply relative sidebar-margin border-solid border-t-0 border-l-0 border-r-0 border-b-1 border-[#ECEBEC] py-3 mx-[var(--sidebar-m)];
.name{
@apply text-sm;
}

74
uni-app/src/styles/official-iconfont.css
View File

@ -1,8 +1,8 @@
@font-face {
font-family: "nc-iconfont"; /* Project id 4567203 */
src: url('//at.alicdn.com/t/c/font_4567203_fc0pt9szyn7.woff2?t=1721726440236') format('woff2'),
url('//at.alicdn.com/t/c/font_4567203_fc0pt9szyn7.woff?t=1721726440236') format('woff'),
url('//at.alicdn.com/t/c/font_4567203_fc0pt9szyn7.ttf?t=1721726440236') format('truetype');
src: url('//at.alicdn.com/t/c/font_4567203_p1l3213jbpf.woff2?t=1725850647351') format('woff2'),
url('//at.alicdn.com/t/c/font_4567203_p1l3213jbpf.woff?t=1725850647351') format('woff'),
url('//at.alicdn.com/t/c/font_4567203_p1l3213jbpf.ttf?t=1725850647351') format('truetype');
}
.nc-iconfont {
@ -13,6 +13,74 @@
-moz-osx-font-smoothing: grayscale;
}
.nc-icon-kabao:before {
content: "\e7ec";
}
.nc-icon-shouyeV6mm1:before {
content: "\e7e5";
}
.nc-icon-shouyeV6xx11:before {
content: "\e7bb";
}
.nc-icon-a-naozhongV6xx-36:before {
content: "\e7c4";
}
.nc-icon-a-shijianV6xx-36:before {
content: "\e7c3";
}
.nc-icon-a-yingyongzhongxinV6xx-36:before {
content: "\e7bf";
}
.nc-icon-a-bangzhuV6xx-36:before {
content: "\e7bc";
}
.nc-icon-a-riliV6xx-36:before {
content: "\e7c7";
}
.nc-icon-a-meiriqiandaoV6xx-36:before {
content: "\e7c6";
}
.nc-icon-a-yingyongliebiaoV6xx-36:before {
content: "\e7c5";
}
.nc-icon-a-shanchu-fanggai2V6xx-36:before {
content: "\e7be";
}
.nc-icon-cuohaoV6xx1:before {
content: "\e7cb";
}
.nc-icon-a-zhanghaoV6xx-36:before {
content: "\e7b9";
}
.nc-icon-a-wodeV6xx-36:before {
content: "\e7b8";
}
.nc-icon-a-shaixuan-36V6xx-36:before {
content: "\e7b3";
}
.nc-icon-lishijiluV6xx:before {
content: "\e6f6";
}
.nc-icon-paihangbangV6xx:before {
content: "\e79d";
}
.nc-icon-a-xiangshangV6xx1:before {
content: "\e799";
}

45
uni-app/src/uni_modules/uni-popup/components/uni-popup/keypress.js Normal file
View File

@ -0,0 +1,45 @@
// #ifdef H5
export default {
name: 'Keypress',
props: {
disable: {
type: Boolean,
default: false
}
},
mounted () {
const keyNames = {
esc: ['Esc', 'Escape'],
tab: 'Tab',
enter: 'Enter',
space: [' ', 'Spacebar'],
up: ['Up', 'ArrowUp'],
left: ['Left', 'ArrowLeft'],
right: ['Right', 'ArrowRight'],
down: ['Down', 'ArrowDown'],
delete: ['Backspace', 'Delete', 'Del']
}
const listener = ($event) => {
if (this.disable) {
return
}
const keyName = Object.keys(keyNames).find(key => {
const keyName = $event.key
const value = keyNames[key]
return value === keyName || (Array.isArray(value) && value.includes(keyName))
})
if (keyName) {
// 避免和其他按键事件冲突
setTimeout(() => {
this.$emit(keyName, {})
}, 0)
}
}
document.addEventListener('keyup', listener)
// this.$once('hook:beforeDestroy', () => {
// document.removeEventListener('keyup', listener)
// })
},
render: () => {}
}
// #endif

25
uni-app/src/uni_modules/uni-popup/components/uni-popup/popup.js Normal file
View File

@ -0,0 +1,25 @@
export default {
data() {
return {
}
},
created(){
this.popup = this.getParent()
},
methods:{
/**
* 获取父元素实例
*/
getParent(name = 'uniPopup') {
let parent = this.$parent;
let parentName = parent.$options.name;
while (parentName !== name) {
parent = parent.$parent;
if (!parent) return false
parentName = parent.$options.name;
}
return parent;
},
}
}

90
uni-app/src/uni_modules/uni-popup/components/uni-popup/uni-popup.uvue Normal file
View File

@ -0,0 +1,90 @@
<template>
<view class="popup-root" v-if="isOpen" v-show="isShow" @click="clickMask">
<view @click.stop>
<slot></slot>
</view>
</view>
</template>
<script>
type CloseCallBack = ()=> void;
let closeCallBack:CloseCallBack = () :void => {};
export default {
emits:["close","clickMask"],
data() {
return {
isShow:false,
isOpen:false
}
},
props: {
maskClick: {
type: Boolean,
default: true
},
},
watch: {
// 设置show = true 时，如果没有 open 需要设置为 open
isShow:{
handler(isShow) {
// console.log("isShow",isShow)
if(isShow && this.isOpen == false){
this.isOpen = true
}
},
immediate:true
},
// 设置isOpen = true 时，如果没有 isShow 需要设置为 isShow
isOpen:{
handler(isOpen) {
// console.log("isOpen",isOpen)
if(isOpen && this.isShow == false){
this.isShow = true
}
},
immediate:true
}
},
methods:{
open(){
// ...funs : CloseCallBack[]
// if(funs.length > 0){
// closeCallBack = funs[0]
// }
this.isOpen = true;
},
clickMask(){
if(this.maskClick == true){
this.$emit('clickMask')
this.close()
}
},
close(): void{
this.isOpen = false;
this.$emit('close')
closeCallBack()
},
hiden(){
this.isShow = false
},
show(){
this.isShow = true
}
}
}
</script>
<style>
.popup-root {
position: fixed;
top: 0;
left: 0;
width: 750rpx;
height: 100%;
flex: 1;
background-color: rgba(0, 0, 0, 0.3);
justify-content: center;
align-items: center;
z-index: 99;
}
</style>

501
uni-app/src/uni_modules/uni-popup/components/uni-popup/uni-popup.vue Normal file
View File

@ -0,0 +1,501 @@
<template>
<view v-if="showPopup" class="uni-popup" :class="[popupstyle, isDesktop ? 'fixforpc-z-index' : '']">
<view @touchstart="touchstart">
<uni-transition key="1" v-if="maskShow" name="mask" mode-class="fade" :styles="maskClass" :duration="duration" :show="showTrans" @click="onTap" />
<uni-transition key="2" :mode-class="ani" name="content" :styles="transClass" :duration="duration" :show="showTrans" @click="onTap">
<view class="uni-popup__wrapper" :style="getStyles" :class="[popupstyle]" @click="clear">
<slot />
</view>
</uni-transition>
</view>
<!-- #ifdef H5 -->
<keypress v-if="maskShow" @esc="onTap" />
<!-- #endif -->
</view>
</template>
<script>
// #ifdef H5
import keypress from './keypress.js'
// #endif
/**
* PopUp 弹出层
* @description 弹出层组件，为了解决遮罩弹层的问题
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
* @property {String} type = [top|center|bottom|left|right|message|dialog|share] 弹出方式
* @value top 顶部弹出
* @value center 中间弹出
* @value bottom 底部弹出
* @value left 左侧弹出
* @value right 右侧弹出
* @value message 消息提示
* @value dialog 对话框
* @value share 底部分享示例
* @property {Boolean} animation = [true|false] 是否开启动画
* @property {Boolean} maskClick = [true|false] 蒙版点击是否关闭弹窗(废弃)
* @property {Boolean} isMaskClick = [true|false] 蒙版点击是否关闭弹窗
* @property {String} backgroundColor 主窗口背景色
* @property {String} maskBackgroundColor 蒙版颜色
* @property {String} borderRadius 设置圆角(左上、右上、右下和左下) 示例:"10px 10px 10px 10px"
* @property {Boolean} safeArea 是否适配底部安全区
* @event {Function} change 打开关闭弹窗触发，e={show: false}
* @event {Function} maskClick 点击遮罩触发
*/
export default {
name: 'uniPopup',
components: {
// #ifdef H5
keypress
// #endif
},
emits: ['change', 'maskClick'],
props: {
// 开启动画
animation: {
type: Boolean,
default: true
},
// 弹出层类型，可选值，top: 顶部弹出层；bottom：底部弹出层；center：全屏弹出层
// message: 消息提示 ; dialog : 对话框
type: {
type: String,
default: 'center'
},
// maskClick
isMaskClick: {
type: Boolean,
default: null
},
// TODO 2 个版本后废弃属性 ，使用 isMaskClick
maskClick: {
type: Boolean,
default: null
},
backgroundColor: {
type: String,
default: 'none'
},
safeArea: {
type: Boolean,
default: true
},
maskBackgroundColor: {
type: String,
default: 'rgba(0, 0, 0, 0.4)'
},
borderRadius:{
type: String,
}
},
watch: {
/**
* 监听type类型
*/
type: {
handler: function(type) {
if (!this.config[type]) return
this[this.config[type]](true)
},
immediate: true
},
isDesktop: {
handler: function(newVal) {
if (!this.config[newVal]) return
this[this.config[this.type]](true)
},
immediate: true
},
/**
* 监听遮罩是否可点击
* @param {Object} val
*/
maskClick: {
handler: function(val) {
this.mkclick = val
},
immediate: true
},
isMaskClick: {
handler: function(val) {
this.mkclick = val
},
immediate: true
},
// H5 下禁止底部滚动
showPopup(show) {
// #ifdef H5
// fix by mehaotian 处理 h5 滚动穿透的问题
document.getElementsByTagName('body')[0].style.overflow = show ? 'hidden' : 'visible'
// #endif
}
},
data() {
return {
duration: 300,
ani: [],
showPopup: false,
showTrans: false,
popupWidth: 0,
popupHeight: 0,
config: {
top: 'top',
bottom: 'bottom',
center: 'center',
left: 'left',
right: 'right',
message: 'top',
dialog: 'center',
share: 'bottom'
},
maskClass: {
position: 'fixed',
bottom: 0,
top: 0,
left: 0,
right: 0,
backgroundColor: 'rgba(0, 0, 0, 0.4)'
},
transClass: {
backgroundColor: 'transparent',
borderRadius: this.borderRadius || "0",
position: 'fixed',
left: 0,
right: 0
},
maskShow: true,
mkclick: true,
popupstyle: 'top'
}
},
computed: {
getStyles() {
let res = { backgroundColor: this.bg };
if (this.borderRadius || "0") {
res = Object.assign(res, { borderRadius: this.borderRadius })
}
return res;
},
isDesktop() {
return this.popupWidth >= 500 && this.popupHeight >= 500
},
bg() {
if (this.backgroundColor === '' || this.backgroundColor === 'none') {
return 'transparent'
}
return this.backgroundColor
}
},
mounted() {
const fixSize = () => {
const {
windowWidth,
windowHeight,
windowTop,
safeArea,
screenHeight,
safeAreaInsets
} = uni.getSystemInfoSync()
this.popupWidth = windowWidth
this.popupHeight = windowHeight + (windowTop || 0)
// TODO fix by mehaotian 是否适配底部安全区 ,目前微信ios 、和 app ios 计算有差异，需要框架修复
if (safeArea && this.safeArea) {
// #ifdef MP-WEIXIN
this.safeAreaInsets = screenHeight - safeArea.bottom
// #endif
// #ifndef MP-WEIXIN
this.safeAreaInsets = safeAreaInsets.bottom
// #endif
} else {
this.safeAreaInsets = 0
}
}
fixSize()
// #ifdef H5
// window.addEventListener('resize', fixSize)
// this.$once('hook:beforeDestroy', () => {
// window.removeEventListener('resize', fixSize)
// })
// #endif
},
// #ifndef VUE3
// TODO vue2
destroyed() {
this.setH5Visible()
},
// #endif
// #ifdef VUE3
// TODO vue3
unmounted() {
this.setH5Visible()
},
// #endif
activated() {
this.setH5Visible(!this.showPopup);
},
deactivated() {
this.setH5Visible(true);
},
created() {
// this.mkclick = this.isMaskClick || this.maskClick
if (this.isMaskClick === null && this.maskClick === null) {
this.mkclick = true
} else {
this.mkclick = this.isMaskClick !== null ? this.isMaskClick : this.maskClick
}
if (this.animation) {
this.duration = 300
} else {
this.duration = 0
}
// TODO 处理 message 组件生命周期异常的问题
this.messageChild = null
// TODO 解决头条冒泡的问题
this.clearPropagation = false
this.maskClass.backgroundColor = this.maskBackgroundColor
},
methods: {
setH5Visible(visible = true) {
// #ifdef H5
// fix by mehaotian 处理 h5 滚动穿透的问题
document.getElementsByTagName('body')[0].style.overflow = visible ? "visible" : "hidden";
// #endif
},
/**
* 公用方法，不显示遮罩层
*/
closeMask() {
this.maskShow = false
},
/**
* 公用方法，遮罩层禁止点击
*/
disableMask() {
this.mkclick = false
},
// TODO nvue 取消冒泡
clear(e) {
// #ifndef APP-NVUE
e.stopPropagation()
// #endif
this.clearPropagation = true
},
open(direction) {
// fix by mehaotian 处理快速打开关闭的情况
if (this.showPopup) {
return
}
let innerType = ['top', 'center', 'bottom', 'left', 'right', 'message', 'dialog', 'share']
if (!(direction && innerType.indexOf(direction) !== -1)) {
direction = this.type
}
if (!this.config[direction]) {
console.error('缺少类型：', direction)
return
}
this[this.config[direction]]()
this.$emit('change', {
show: true,
type: direction
})
},
close(type) {
this.showTrans = false
this.$emit('change', {
show: false,
type: this.type
})
clearTimeout(this.timer)
// // 自定义关闭事件
// this.customOpen && this.customClose()
this.timer = setTimeout(() => {
this.showPopup = false
}, 300)
},
// TODO 处理冒泡事件，头条的冒泡事件有问题 ，先这样兼容
touchstart() {
this.clearPropagation = false
},
onTap() {
if (this.clearPropagation) {
// fix by mehaotian 兼容 nvue
this.clearPropagation = false
return
}
this.$emit('maskClick')
if (!this.mkclick) return
this.close()
},
/**
* 顶部弹出样式处理
*/
top(type) {
this.popupstyle = this.isDesktop ? 'fixforpc-top' : 'top'
this.ani = ['slide-top']
this.transClass = {
position: 'fixed',
left: 0,
right: 0,
backgroundColor: this.bg,
borderRadius:this.borderRadius || "0"
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
this.$nextTick(() => {
if (this.messageChild && this.type === 'message') {
this.messageChild.timerClose()
}
})
},
/**
* 底部弹出样式处理
*/
bottom(type) {
this.popupstyle = 'bottom'
this.ani = ['slide-bottom']
this.transClass = {
position: 'fixed',
left: 0,
right: 0,
bottom: 0,
paddingBottom: this.safeAreaInsets + 'px',
backgroundColor: this.bg,
borderRadius:this.borderRadius || "0",
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
},
/**
* 中间弹出样式处理
*/
center(type) {
this.popupstyle = 'center'
//微信小程序下，组合动画会出现文字向上闪动问题，再此做特殊处理
// #ifdef MP-WEIXIN
this.ani = ['fade']
// #endif
// #ifndef MP-WEIXIN
this.ani = ['zoom-out', 'fade']
// #endif
this.transClass = {
position: 'fixed',
/* #ifndef APP-NVUE */
display: 'flex',
flexDirection: 'column',
/* #endif */
bottom: 0,
left: 0,
right: 0,
top: 0,
justifyContent: 'center',
alignItems: 'center',
borderRadius:this.borderRadius || "0"
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
},
left(type) {
this.popupstyle = 'left'
this.ani = ['slide-left']
this.transClass = {
position: 'fixed',
left: 0,
bottom: 0,
top: 0,
backgroundColor: this.bg,
borderRadius:this.borderRadius || "0",
/* #ifndef APP-NVUE */
display: 'flex',
flexDirection: 'column'
/* #endif */
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
},
right(type) {
this.popupstyle = 'right'
this.ani = ['slide-right']
this.transClass = {
position: 'fixed',
bottom: 0,
right: 0,
top: 0,
backgroundColor: this.bg,
borderRadius:this.borderRadius || "0",
/* #ifndef APP-NVUE */
display: 'flex',
flexDirection: 'column'
/* #endif */
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
}
}
}
</script>
<style lang="scss">
.uni-popup {
position: fixed;
/* #ifndef APP-NVUE */
z-index: 99;
/* #endif */
&.top,
&.left,
&.right {
/* #ifdef H5 */
top: var(--window-top);
/* #endif */
/* #ifndef H5 */
top: 0;
/* #endif */
}
.uni-popup__wrapper {
/* #ifndef APP-NVUE */
display: block;
/* #endif */
position: relative;
/* iphonex 等安全区设置，底部安全区适配 */
/* #ifndef APP-NVUE */
// padding-bottom: constant(safe-area-inset-bottom);
// padding-bottom: env(safe-area-inset-bottom);
/* #endif */
&.left,
&.right {
/* #ifdef H5 */
padding-top: var(--window-top);
/* #endif */
/* #ifndef H5 */
padding-top: 0;
/* #endif */
flex: 1;
}
}
}
.fixforpc-z-index {
/* #ifndef APP-NVUE */
z-index: 999;
/* #endif */
}
.fixforpc-top {
top: 0;
}
</style>

88
uni-app/src/uni_modules/uni-popup/package.json Normal file
View File

@ -0,0 +1,88 @@
{
"id": "uni-popup",
"displayName": "uni-popup 弹出层",
"version": "1.9.1",
"description": " Popup 组件，提供常用的弹层",
"keywords": [
"uni-ui",
"弹出层",
"弹窗",
"popup",
"弹框"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
},
"uni_modules": {
"dependencies": [
"uni-scss",
"uni-transition"
],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y",
"alipay": "n"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

8
uni-app/src/uni_modules/uni-scss/changelog.md Normal file
View File

@ -0,0 +1,8 @@
## 1.0.3（2022-01-21）
- 优化 组件示例
## 1.0.2（2021-11-22）
- 修复 / 符号在 vue 不同版本兼容问题引起的报错问题
## 1.0.1（2021-11-22）
- 修复 vue3中scss语法兼容问题
## 1.0.0（2021-11-18）
- init

1
uni-app/src/uni_modules/uni-scss/index.scss Normal file
View File

@ -0,0 +1 @@
@import './styles/index.scss';

82
uni-app/src/uni_modules/uni-scss/package.json Normal file
View File

@ -0,0 +1,82 @@
{
"id": "uni-scss",
"displayName": "uni-scss 辅助样式",
"version": "1.0.3",
"description": "uni-sass是uni-ui提供的一套全局样式 ，通过一些简单的类名和sass变量，实现简单的页面布局操作，比如颜色、边距、圆角等。",
"keywords": [
"uni-scss",
"uni-ui",
"辅助样式"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"category": [
"JS SDK",
"通用 SDK"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "u"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "n",
"联盟": "n"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

4
uni-app/src/uni_modules/uni-scss/readme.md Normal file
View File

@ -0,0 +1,4 @@
`uni-sass` 是 `uni-ui`提供的一套全局样式 ，通过一些简单的类名和`sass`变量，实现简单的页面布局操作，比如颜色、边距、圆角等。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-sass)
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839

7
uni-app/src/uni_modules/uni-scss/styles/index.scss Normal file
View File

@ -0,0 +1,7 @@
@import './setting/_variables.scss';
@import './setting/_border.scss';
@import './setting/_color.scss';
@import './setting/_space.scss';
@import './setting/_radius.scss';
@import './setting/_text.scss';
@import './setting/_styles.scss';

3
uni-app/src/uni_modules/uni-scss/styles/setting/_border.scss Normal file
View File

@ -0,0 +1,3 @@
.uni-border {
border: 1px $uni-border-1 solid;
}

66
uni-app/src/uni_modules/uni-scss/styles/setting/_color.scss Normal file
View File

@ -0,0 +1,66 @@
// TODO 暂时不需要 class ，需要用户使用变量实现 ，如果使用类名其实并不推荐
// @mixin get-styles($k,$c) {
// @if $k == size or $k == weight{
// font-#{$k}:#{$c}
// }@else{
// #{$k}:#{$c}
// }
// }
$uni-ui-color:(
// 主色
primary: $uni-primary,
primary-disable: $uni-primary-disable,
primary-light: $uni-primary-light,
// 辅助色
success: $uni-success,
success-disable: $uni-success-disable,
success-light: $uni-success-light,
warning: $uni-warning,
warning-disable: $uni-warning-disable,
warning-light: $uni-warning-light,
error: $uni-error,
error-disable: $uni-error-disable,
error-light: $uni-error-light,
info: $uni-info,
info-disable: $uni-info-disable,
info-light: $uni-info-light,
// 中性色
main-color: $uni-main-color,
base-color: $uni-base-color,
secondary-color: $uni-secondary-color,
extra-color: $uni-extra-color,
// 背景色
bg-color: $uni-bg-color,
// 边框颜色
border-1: $uni-border-1,
border-2: $uni-border-2,
border-3: $uni-border-3,
border-4: $uni-border-4,
// 黑色
black:$uni-black,
// 白色
white:$uni-white,
// 透明
transparent:$uni-transparent
) !default;
@each $key, $child in $uni-ui-color {
.uni-#{"" + $key} {
color: $child;
}
.uni-#{"" + $key}-bg {
background-color: $child;
}
}
.uni-shadow-sm {
box-shadow: $uni-shadow-sm;
}
.uni-shadow-base {
box-shadow: $uni-shadow-base;
}
.uni-shadow-lg {
box-shadow: $uni-shadow-lg;
}
.uni-mask {
background-color:$uni-mask;
}

55
uni-app/src/uni_modules/uni-scss/styles/setting/_radius.scss Normal file
View File

@ -0,0 +1,55 @@
@mixin radius($r,$d:null ,$important: false){
$radius-value:map-get($uni-radius, $r) if($important, !important, null);
// Key exists within the $uni-radius variable
@if (map-has-key($uni-radius, $r) and $d){
@if $d == t {
border-top-left-radius:$radius-value;
border-top-right-radius:$radius-value;
}@else if $d == r {
border-top-right-radius:$radius-value;
border-bottom-right-radius:$radius-value;
}@else if $d == b {
border-bottom-left-radius:$radius-value;
border-bottom-right-radius:$radius-value;
}@else if $d == l {
border-top-left-radius:$radius-value;
border-bottom-left-radius:$radius-value;
}@else if $d == tl {
border-top-left-radius:$radius-value;
}@else if $d == tr {
border-top-right-radius:$radius-value;
}@else if $d == br {
border-bottom-right-radius:$radius-value;
}@else if $d == bl {
border-bottom-left-radius:$radius-value;
}
}@else{
border-radius:$radius-value;
}
}
@each $key, $child in $uni-radius {
@if($key){
.uni-radius-#{"" + $key} {
@include radius($key)
}
}@else{
.uni-radius {
@include radius($key)
}
}
}
@each $direction in t, r, b, l,tl, tr, br, bl {
@each $key, $child in $uni-radius {
@if($key){
.uni-radius-#{"" + $direction}-#{"" + $key} {
@include radius($key,$direction,false)
}
}@else{
.uni-radius-#{$direction} {
@include radius($key,$direction,false)
}
}
}
}

56
uni-app/src/uni_modules/uni-scss/styles/setting/_space.scss Normal file
View File

@ -0,0 +1,56 @@
@mixin fn($space,$direction,$size,$n) {
@if $n {
#{$space}-#{$direction}: #{$size*$uni-space-root}px
} @else {
#{$space}-#{$direction}: #{-$size*$uni-space-root}px
}
}
@mixin get-styles($direction,$i,$space,$n){
@if $direction == t {
@include fn($space, top,$i,$n);
}
@if $direction == r {
@include fn($space, right,$i,$n);
}
@if $direction == b {
@include fn($space, bottom,$i,$n);
}
@if $direction == l {
@include fn($space, left,$i,$n);
}
@if $direction == x {
@include fn($space, left,$i,$n);
@include fn($space, right,$i,$n);
}
@if $direction == y {
@include fn($space, top,$i,$n);
@include fn($space, bottom,$i,$n);
}
@if $direction == a {
@if $n {
#{$space}:#{$i*$uni-space-root}px;
} @else {
#{$space}:#{-$i*$uni-space-root}px;
}
}
}
@each $orientation in m,p {
$space: margin;
@if $orientation == m {
$space: margin;
} @else {
$space: padding;
}
@for $i from 0 through 16 {
@each $direction in t, r, b, l, x, y, a {
.uni-#{$orientation}#{$direction}-#{$i} {
@include get-styles($direction,$i,$space,true);
}
.uni-#{$orientation}#{$direction}-n#{$i} {
@include get-styles($direction,$i,$space,false);
}
}
}
}

167
uni-app/src/uni_modules/uni-scss/styles/setting/_styles.scss Normal file
View File

@ -0,0 +1,167 @@
/* #ifndef APP-NVUE */
$-color-white:#fff;
$-color-black:#000;
@mixin base-style($color) {
color: #fff;
background-color: $color;
border-color: mix($-color-black, $color, 8%);
&:not([hover-class]):active {
background: mix($-color-black, $color, 10%);
border-color: mix($-color-black, $color, 20%);
color: $-color-white;
outline: none;
}
}
@mixin is-color($color) {
@include base-style($color);
&[loading] {
@include base-style($color);
&::before {
margin-right:5px;
}
}
&[disabled] {
&,
&[loading],
&:not([hover-class]):active {
color: $-color-white;
border-color: mix(darken($color,10%), $-color-white);
background-color: mix($color, $-color-white);
}
}
}
@mixin base-plain-style($color) {
color:$color;
background-color: mix($-color-white, $color, 90%);
border-color: mix($-color-white, $color, 70%);
&:not([hover-class]):active {
background: mix($-color-white, $color, 80%);
color: $color;
outline: none;
border-color: mix($-color-white, $color, 50%);
}
}
@mixin is-plain($color){
&[plain] {
@include base-plain-style($color);
&[loading] {
@include base-plain-style($color);
&::before {
margin-right:5px;
}
}
&[disabled] {
&,
&:active {
color: mix($-color-white, $color, 40%);
background-color: mix($-color-white, $color, 90%);
border-color: mix($-color-white, $color, 80%);
}
}
}
}
.uni-btn {
margin: 5px;
color: #393939;
border:1px solid #ccc;
font-size: 16px;
font-weight: 200;
background-color: #F9F9F9;
// TODO 暂时处理边框隐藏一边的问题
overflow: visible;
&::after{
border: none;
}
&:not([type]),&[type=default] {
color: #999;
&[loading] {
background: none;
&::before {
margin-right:5px;
}
}
&[disabled]{
color: mix($-color-white, #999, 60%);
&,
&[loading],
&:active {
color: mix($-color-white, #999, 60%);
background-color: mix($-color-white,$-color-black , 98%);
border-color: mix($-color-white, #999, 85%);
}
}
&[plain] {
color: #999;
background: none;
border-color: $uni-border-1;
&:not([hover-class]):active {
background: none;
color: mix($-color-white, $-color-black, 80%);
border-color: mix($-color-white, $-color-black, 90%);
outline: none;
}
&[disabled]{
&,
&[loading],
&:active {
background: none;
color: mix($-color-white, #999, 60%);
border-color: mix($-color-white, #999, 85%);
}
}
}
}
&:not([hover-class]):active {
color: mix($-color-white, $-color-black, 50%);
}
&[size=mini] {
font-size: 16px;
font-weight: 200;
border-radius: 8px;
}
&.uni-btn-small {
font-size: 14px;
}
&.uni-btn-mini {
font-size: 12px;
}
&.uni-btn-radius {
border-radius: 999px;
}
&[type=primary] {
@include is-color($uni-primary);
@include is-plain($uni-primary)
}
&[type=success] {
@include is-color($uni-success);
@include is-plain($uni-success)
}
&[type=error] {
@include is-color($uni-error);
@include is-plain($uni-error)
}
&[type=warning] {
@include is-color($uni-warning);
@include is-plain($uni-warning)
}
&[type=info] {
@include is-color($uni-info);
@include is-plain($uni-info)
}
}
/* #endif */

Some files were not shown because too many files have changed in this diff Show More