源文件
This commit is contained in:
14
jeepay-ui-uapp-merchant/pageRed/list/readme.txt
Normal file
14
jeepay-ui-uapp-merchant/pageRed/list/readme.txt
Normal file
@@ -0,0 +1,14 @@
|
||||
pages/list/search.vue ： 通用搜索显示卡片
|
||||
|
||||
pages/list/render/ : 定义了列表数据渲染样式。
|
||||
PayOrderRender.vue ： 支付订单
|
||||
RefundOrderRender.vue ： 退款订单
|
||||
...
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
187
jeepay-ui-uapp-merchant/pageRed/list/render/AppConfigRender.vue
Normal file
187
jeepay-ui-uapp-merchant/pageRed/list/render/AppConfigRender.vue
Normal file
@@ -0,0 +1,187 @@
|
||||
<!--
|
||||
|
||||
订单列表页面， 数据渲染
|
||||
业务： 应用配置信息
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/12/02 16:57
|
||||
-->
|
||||
<template>
|
||||
|
||||
<JeepayTableListItem :title="props.record.wayName" :subtitle="props.record.wayCode" @tap="openConfig">
|
||||
<template #titleRight>
|
||||
<view v-if="props.record.isConfig" class="state-dot state-dot-enable">已配置</view>
|
||||
<view v-else class="state-dot state-dot-disable">未配置</view>
|
||||
</template>
|
||||
</JeepayTableListItem>
|
||||
|
||||
<!-- 选择支付 接口 -->
|
||||
<JeepayPopupListSelect
|
||||
ref="selectIfcodeRef"
|
||||
title='请选择支付渠道'
|
||||
:reqTableDataFunc="reqTableDataByIfcodeFunc"
|
||||
:fields="{ key: 'ifCode', left: 'ifName', right: 'ifCode' }"
|
||||
@confirm="confirmFunc"
|
||||
>
|
||||
|
||||
<!-- 小程序， 插槽不生效， 待排查！ TODO -->
|
||||
<!-- 详见： https://ask.dcloud.net.cn/question/158765 -->
|
||||
<!-- JeepayPopupListSelect.js 修改 "content-" + i0, 改为： content 即可。 -->
|
||||
|
||||
<!-- #ifdef APP-PLUS || H5 -->
|
||||
<template #content="{record}">
|
||||
<view class="pay-wrapper">
|
||||
<view class="pay-info">
|
||||
<view class="pay-logo flex-center" :style="{ backgroundColor: record.bgColor }">
|
||||
<image :src="record.icon" mode="scaleToFill" />
|
||||
</view>
|
||||
<view>
|
||||
<view class="pay-title">{{ record.ifName }}</view>
|
||||
<view class="pay-rate">{{getRateStr(record.paywayFee)}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<!-- #endif -->
|
||||
|
||||
</JeepayPopupListSelect>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { reqLoad, API_URL_PAY_PASSAGE_LIST, $getAvailablePayInterface, $wayCodeConfigIfCode } from '@/http/apiManager.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
import infoBox from '@/commons/utils/infoBox.js'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
|
||||
const selectIfcodeRef = ref()
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
|
||||
record: {type:Object, default: () => {}}, // 渲染对象
|
||||
|
||||
configAppId: { type: String }, // 配置的appId
|
||||
|
||||
})
|
||||
|
||||
const vdata = reactive({
|
||||
|
||||
configedIfCode: '', // 已配置的ifCode
|
||||
|
||||
apiRes: { }, //接口返回数据缓存
|
||||
})
|
||||
|
||||
// 请求
|
||||
function reqTableDataByIfcodeFunc (params) {
|
||||
return Promise.resolve(vdata.apiRes)
|
||||
}
|
||||
|
||||
|
||||
// 打开面板 ( 先查询过滤下。 )
|
||||
function openConfig(wayCode){
|
||||
|
||||
vdata.configedIfCode = '';
|
||||
|
||||
$getAvailablePayInterface(props.configAppId, props.record.wayCode).then(res => {
|
||||
vdata.apiRes = res
|
||||
if(!res.bizData.records.length) return infoBox.showToast('暂无可配置的渠道')
|
||||
res.bizData.records.forEach(r => {
|
||||
if(r.configState == 1){
|
||||
vdata.configedIfCode = r.ifCode
|
||||
}
|
||||
})
|
||||
|
||||
if(vdata.configedIfCode){
|
||||
selectIfcodeRef.value.open({ifCode: vdata.configedIfCode})
|
||||
}else{
|
||||
selectIfcodeRef.value.open()
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
function confirmFunc(v){
|
||||
|
||||
if(!v){
|
||||
return infoBox.showToast('请选择接口')
|
||||
}
|
||||
|
||||
$wayCodeConfigIfCode(props.configAppId, props.record.wayCode, v.ifCode).then(() => {
|
||||
infoBox.showSuccessToast("配置完成")
|
||||
|
||||
emit.refPageAndSearchEmit(emit.ENAME_REF_PAY_PASSAGE_LIST)
|
||||
|
||||
selectIfcodeRef.value.close();
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
function getRateStr(paywayFee){
|
||||
|
||||
if(paywayFee.feeType == 'SINGLE'){
|
||||
return '单笔费率:' + cal.cert2Dollar(paywayFee.feeRate * 10000) + "%"
|
||||
}else{
|
||||
return '阶梯费率'
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.pay-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 170rpx;
|
||||
.dot {
|
||||
position: relative;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
border-radius: 50%;
|
||||
background-color: #d7d8d9;
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 50%;
|
||||
height: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
border-radius: 50%;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
.dot-active {
|
||||
background-color: #2980fd;
|
||||
}
|
||||
.pay-info {
|
||||
display: flex;
|
||||
|
||||
.pay-logo {
|
||||
margin: 0 20rpx 0 0rpx;
|
||||
width: 90rpx;
|
||||
height: 90rpx;
|
||||
border-radius: $v-b-r20;
|
||||
background-color: #07112d;
|
||||
image {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
}
|
||||
}
|
||||
.pay-title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
.pay-rate {
|
||||
margin-top: 16rpx;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
color: $J-color-t99;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,99 @@
|
||||
<!--
|
||||
组件功能： 设备通用渲染页面
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/12/06 13:25
|
||||
-->
|
||||
<template>
|
||||
<!-- 码牌 -->
|
||||
<template v-if="props.type == 'qrc'">
|
||||
<JeepayTableListItem :logo="codeImgListByQrc[record.qrcState]" :title="record.qrcAlias || '未命名'" :subtitle="record.qrcId" :state="record.qrcState" @tap="toDetailPage" />
|
||||
</template>
|
||||
|
||||
<!-- 辅助终端 -->
|
||||
<template v-if="props.type == 'storeTerminal'">
|
||||
<JeepayTableListItem :logo="codeImgListByTerm[record.state]" :title="record.trmName" :subtitle="record.trmNo" :state="record.state" @tap="toDetailPage" />
|
||||
</template>
|
||||
|
||||
<!-- 通用设备 -->
|
||||
<template v-if="props.type == 'device'">
|
||||
<JeepayTableListItem
|
||||
:logo="vdata[`imgListByType${props.record.deviceType}`][props.record.state]"
|
||||
:title="record.deviceName"
|
||||
:subtitle="record.deviceId"
|
||||
:state="record.state"
|
||||
@tap="toDetailPage"
|
||||
/>
|
||||
</template>
|
||||
<template v-if="props.type == 'face'">
|
||||
<JeepayTableListItem :logo="faceImgListByFace[record.state]" :subtitle="record.deviceNo" :state="record.qrcState" @tap="toDetailPage">
|
||||
<template #title>
|
||||
{{ record.deviceName }}
|
||||
<JeepayTag :type="record.provider == 'wxpayQWPro' ? 'green-rgba' : 'blue'">{{ record.provider == 'wxpayQWPro' ? '青蛙刷脸Pro' : '蜻蜓F4' }}</JeepayTag>
|
||||
</template>
|
||||
</JeepayTableListItem>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import go from '@/commons/utils/go.js'
|
||||
|
||||
const codeImgListByQrc = ['/pageDevice/static/detailsLislImg/code-none.svg', '/pageDevice/static/devIconImg/icon-code.svg']
|
||||
|
||||
const codeImgListByTerm = ['/pageDevice/static/detailsLislImg/trm-none.svg', '/pageDevice/static/devIconImg/icon-term.svg']
|
||||
const faceImgListByFace = ['/pageDevice/static/devIconImg/icon-face-0.svg', '/pageDevice/static/devIconImg/icon-face-1.svg']
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
type: { type: String, default: 'device' }, // 类型
|
||||
|
||||
record: { type: Object, default: () => {} }, // 渲染对象
|
||||
})
|
||||
|
||||
const vdata = reactive({
|
||||
imgListByType1: ['/pageDevice/static/detailsLislImg/horn-none.svg', '/pageDevice/static/devIconImg/icon-horn.svg'],
|
||||
imgListByType2: ['/pageDevice/static/detailsLislImg/print-none.svg', '/pageDevice/static/devIconImg/icon-print.svg'],
|
||||
imgListByType3: ['/pageDevice/static/detailsLislImg/scanPos-none.svg', '/pageDevice/static/devIconImg/icon-scanPos.svg'],
|
||||
imgListByType4: ['/pageDevice/static/detailsLislImg/pos-none.svg', '/pageDevice/static/devIconImg/icon-pos.svg'],
|
||||
imgListByType5: ['/pageDevice/static/detailsLislImg/horn-none.svg', '/pageDevice/static/devIconImg/icon-horn.svg'],
|
||||
imgListByType7: ['/pageDevice/static/detailsLislImg/lite-none.svg', '/pageDevice/static/detailsLislImg/icon-lite.svg'],
|
||||
})
|
||||
|
||||
function toDetailPage() {
|
||||
if (props.type == 'qrc') {
|
||||
return go.to('PAGES_APP_CODE_DETAILS', { codeId: props.record.qrcId })
|
||||
}
|
||||
|
||||
if (props.type == 'storeTerminal') {
|
||||
return go.to('PAGES_APP_TERMINAL_DETAILS', { trmId: props.record.trmId })
|
||||
}
|
||||
|
||||
// 通用设备 1-喇叭 2-打印机 3-扫码POS 4-智能POS
|
||||
if (props.record.deviceType) {
|
||||
const deviceId = props.record.deviceId
|
||||
switch (props.record.deviceType) {
|
||||
case 1:
|
||||
go.to('PAGES_APP_HORN_DETAILS', { deviceId })
|
||||
break
|
||||
case 2:
|
||||
go.to('PAGES_APP_PRINT_DETAILS', { deviceId })
|
||||
break
|
||||
case 3:
|
||||
go.to('PAGES_APP_SCANPOS_DETAILS', { deviceId })
|
||||
break
|
||||
case 4:
|
||||
go.to('PAGES_APP_POS_DETAILS', { deviceId })
|
||||
break
|
||||
case 6:
|
||||
go.to('PAGES_APP_FACE_DETAILS', { deviceId })
|
||||
break
|
||||
case 7:
|
||||
go.to('PAGES_LITE_DETAILS', { deviceId })
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
26
jeepay-ui-uapp-merchant/pageRed/list/render/Example.vue
Normal file
26
jeepay-ui-uapp-merchant/pageRed/list/render/Example.vue
Normal file
@@ -0,0 +1,26 @@
|
||||
<!--
|
||||
|
||||
订单列表页面， 数据渲染
|
||||
业务： 示例模板
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/23 16:57
|
||||
-->
|
||||
<template>
|
||||
<view>{{ props.record }}</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from "vue"
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: {type:Object, default: () => {}}, // 渲染对象
|
||||
})
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
@@ -0,0 +1,33 @@
|
||||
<template>
|
||||
<JeepayTableListItem :logo="imgUrl" :subtitle="advertId" logoStyle="border-radius:20rpx" @tap="toAdDetails">
|
||||
<template #title>
|
||||
{{ title }}
|
||||
<JeepayTag type="green-rgba" v-if="releaseState">已发布</JeepayTag>
|
||||
</template>
|
||||
</JeepayTableListItem>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
unix
|
||||
} from 'dayjs';
|
||||
import go from '@/commons/utils/go.js'
|
||||
const props = defineProps({
|
||||
title: {
|
||||
type: String
|
||||
},
|
||||
advertId: {
|
||||
type: String
|
||||
},
|
||||
imgUrl: {
|
||||
type: String
|
||||
},
|
||||
releaseState: {
|
||||
type: [String, Number]
|
||||
}
|
||||
})
|
||||
const toAdDetails = () => go.to('/pageDevice/adManager/view', { id: props.advertId })
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
36
jeepay-ui-uapp-merchant/pageRed/list/render/MchAppRender.vue
Normal file
36
jeepay-ui-uapp-merchant/pageRed/list/render/MchAppRender.vue
Normal file
@@ -0,0 +1,36 @@
|
||||
<!--
|
||||
|
||||
订单列表页面， 数据渲染
|
||||
业务： 示例模板
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/23 16:57
|
||||
-->
|
||||
<template>
|
||||
<JeepayTableListItem :subtitle="props.record.appId" @tap="toDetailPage" :state="props.record.state">
|
||||
<template #title>
|
||||
{{ props.record.appName }}
|
||||
<JeepayTag v-if="props.record.defaultFlag == 1" type="green-rgba">默认</JeepayTag>
|
||||
</template>
|
||||
</JeepayTableListItem>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import ak from '@/commons/utils/ak.js'
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: { type: Object, default: () => {} }, // 渲染对象
|
||||
})
|
||||
|
||||
function toDetailPage() {
|
||||
if(ak.ent.has('ENT_MCH_APP_VIEW')){
|
||||
go.to('PAGES_APP_DETAIL', { appId: props.record.appId })
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
@@ -0,0 +1,343 @@
|
||||
<!--
|
||||
|
||||
订单列表页面， 数据渲染
|
||||
业务： 进件
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/29 09:17
|
||||
-->
|
||||
<template>
|
||||
<!-- 草稿 灰色 失败红色 审核中 黄色 -->
|
||||
<!-- 列表卡片 -->
|
||||
<view class="apply-card">
|
||||
<view class="apply-title" @tap="toViewPage">
|
||||
<view class="pay-img-wrapper flex-center" :style="{ backgroundColor: record.bgColor }">
|
||||
<image :src="props.record.icon" mode="scaleToFill" />
|
||||
</view>
|
||||
<view class="apply-title-wrapper">
|
||||
<view class="apply-title-info">
|
||||
<text class="single-text-beyond" style="width: 340rpx">{{ props.record.mchFullName }}</text>
|
||||
<view class="apply-state">
|
||||
<text>{{ stateList[record.state]?.text }}</text>
|
||||
<view class="apply-dot" :style="{ backgroundColor: stateList[record.state]?.bgColor }"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="apply-time">{{ props.record.createdAt }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="apply-info-title" @tap="toViewPage">
|
||||
<view class="title">进件渠道</view>
|
||||
<view class="info">{{ props.record.ifName }}</view>
|
||||
</view>
|
||||
<view class="apply-info-title" @tap="toViewPage">
|
||||
<view class="title">进件单号</view>
|
||||
<view class="info">{{ props.record.applyId }}</view>
|
||||
</view>
|
||||
<view class="apply-button">
|
||||
<view
|
||||
v-if="
|
||||
ent.has('ENT_MCH_APPLYMENT_SIGN') && (props.record.state == 1 || props.record.state == 2 || props.record.state == 4 || props.record.state == 5 || props.record.state == 6)
|
||||
"
|
||||
class="sign flex-center"
|
||||
hover-class="touch-hover"
|
||||
@tap="toSignPage"
|
||||
>
|
||||
签约开通
|
||||
</view>
|
||||
<view
|
||||
v-if="ent.has('ENT_MCH_APPLYMENT_GET_INFO') && (props.record.state == 1 || props.record.state == 4 || props.record.state == 5)"
|
||||
class="new-state flex-center"
|
||||
hover-class="touch-button"
|
||||
>
|
||||
获取最新状态
|
||||
</view>
|
||||
|
||||
<view v-if="ent.has('ENT_MCH_APPLYMENT_ADD')" class="new-state flex-center" hover-class="touch-button" @tap='toShowSelectIfCode()'>复用信息</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
<!-- 选择支付 接口 -->
|
||||
<JeepayPopupListSelect
|
||||
ref="selectIfcodeRef"
|
||||
title='请选择渠道'
|
||||
:reqTableDataFunc="reqTableDataByIfcodeFunc"
|
||||
:fields="{ key: 'ifCode', left: 'ifName', right: 'ifCode' }"
|
||||
@confirm="confirmIfCode"
|
||||
>
|
||||
|
||||
<!-- 小程序， 插槽不生效， 待排查！ TODO -->
|
||||
<!-- 详见： https://ask.dcloud.net.cn/question/158765 -->
|
||||
<!-- JeepayPopupListSelect.js 修改 "content-" + i0, 改为： content 即可。 -->
|
||||
|
||||
<!-- #ifdef APP-PLUS || H5 -->
|
||||
<template #content="{record}">
|
||||
<view class="pay-wrapper">
|
||||
<view class="pay-info">
|
||||
<view class="pay-logo flex-center" :style="{ backgroundColor: record.bgColor }">
|
||||
<image :src="record.icon" mode="scaleToFill" />
|
||||
</view>
|
||||
<view>
|
||||
<view class="pay-title">{{ record.ifName }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<!-- #endif -->
|
||||
|
||||
</JeepayPopupListSelect>
|
||||
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import datamap from '@/commons/utils/datamap.js'
|
||||
import ent from '@/commons/utils/ent.js'
|
||||
import ak from '@/commons/utils/ak.js'
|
||||
import { $getAllAllowApplymentIfCodeList } from "@/http/apiManager.js"
|
||||
|
||||
const selectIfcodeRef = ref()
|
||||
|
||||
const vdata = reactive({
|
||||
addIfCodeList: [], // 可以选择的接口集合
|
||||
})
|
||||
|
||||
function toH5ApplyOptionPage(applyId, configPage) {
|
||||
uni.navigateTo({ url: `/pageApply/applyDetailH5ApplyOption?applyId=${applyId}&configPage=${configPage}` })
|
||||
}
|
||||
|
||||
// 去进件详情 / 修改页
|
||||
function toViewPage() {
|
||||
let isView = 1
|
||||
|
||||
if ([0, 3, 8].indexOf(props.record.state) >= 0) {
|
||||
isView = 0
|
||||
}
|
||||
go.to('PAGES_APPLYMENT_H5_DETAIL', { autoConfigMchAppId: props.record.autoConfigMchAppId, isvNo: props.record.isvNo, applyId: props.record.applyId, isView: isView })
|
||||
}
|
||||
|
||||
// 签约开通
|
||||
function toSignPage() {
|
||||
go.to('PAGES_APPLYMENT_H5_OPTION', { applyId: props.record.applyId, configPage: 'NEXT_BIZS' })
|
||||
}
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: { type: Object, default: () => {} }, // 渲染对象
|
||||
})
|
||||
const stateList = reactive([
|
||||
{
|
||||
text: '草稿', //0
|
||||
bgColor: '#D9D9D9',
|
||||
},
|
||||
{
|
||||
text: '审核中', //1
|
||||
bgColor: '#FFCC66',
|
||||
},
|
||||
{
|
||||
text: '已开通', //2
|
||||
bgColor: '#18BC73',
|
||||
},
|
||||
{
|
||||
text: '申请被驳回', //3
|
||||
bgColor: '#FF4D5B',
|
||||
},
|
||||
{
|
||||
text: '待验证', //4
|
||||
bgColor: '#FFCC66',
|
||||
},
|
||||
{
|
||||
text: '待签约', //5
|
||||
bgColor: '#2980FD',
|
||||
},
|
||||
{
|
||||
text: '', //6 占位
|
||||
bgColor: '',
|
||||
},
|
||||
{
|
||||
text: '等待预审', //7
|
||||
bgColor: '#FFCC66',
|
||||
},
|
||||
{
|
||||
text: '预审拒绝', //8
|
||||
bgColor: '#FF4D5B',
|
||||
},
|
||||
])
|
||||
|
||||
|
||||
|
||||
// 打开选择渠道页面
|
||||
function toShowSelectIfCode(){
|
||||
ak.go.to('PAGES_APPLYMENT_SELECETDPAY',{applyId: props.record.applyId,ifCode: props.record.ifCode,range: props.record.range})
|
||||
return
|
||||
$getAllAllowApplymentIfCodeList().then(({bizData}) => {
|
||||
vdata.addIfCodeList = bizData
|
||||
selectIfcodeRef.value.open()
|
||||
})
|
||||
}
|
||||
|
||||
// 请求可以选择的支付渠道
|
||||
function reqTableDataByIfcodeFunc(){
|
||||
// 模拟请求数据
|
||||
return Promise.resolve({ bizData: { records: vdata.addIfCodeList, hasNext: false }})
|
||||
}
|
||||
|
||||
function confirmIfCode(selected){
|
||||
if(!selected){
|
||||
ak.infoBox.showToast('请选择进件渠道')
|
||||
return false;
|
||||
}
|
||||
selectIfcodeRef.value.close()
|
||||
ak.go.to('PAGES_APPLYMENT_H5_DETAIL', {isView: 0, ifCode: selected.ifCode, copyInfoSourceApplyId: props.record.applyId })
|
||||
}
|
||||
|
||||
|
||||
function toCopyPage(){
|
||||
}
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
// 列表卡片样式
|
||||
.apply-card {
|
||||
padding: 0.1rpx 30rpx;
|
||||
padding-bottom: 10rpx;
|
||||
margin: 20rpx;
|
||||
|
||||
background-color: #fff;
|
||||
border-radius: $J-b-r32;
|
||||
.apply-title {
|
||||
display: flex;
|
||||
margin-top: 30rpx;
|
||||
margin-bottom: 40rpx;
|
||||
font-size: 30rpx;
|
||||
.pay-img-wrapper {
|
||||
margin-right: 20rpx;
|
||||
width: 90rpx;
|
||||
height: 90rpx;
|
||||
border-radius: 20rpx;
|
||||
image {
|
||||
width: 65%;
|
||||
height: 65%;
|
||||
}
|
||||
}
|
||||
.apply-title-wrapper {
|
||||
flex: 1;
|
||||
.apply-title-info {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
height: 40rpx;
|
||||
.apply-state {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
white-space: nowrap;
|
||||
text {
|
||||
transform: translateX(-10rpx);
|
||||
}
|
||||
.apply-dot {
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
border-radius: 50%;
|
||||
background-color: #2980fd;
|
||||
}
|
||||
}
|
||||
}
|
||||
.apply-time {
|
||||
color: #999;
|
||||
margin-top: 10rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.apply-info-title {
|
||||
margin: 20rpx 0;
|
||||
display: flex;
|
||||
font-size: 26rpx;
|
||||
.title {
|
||||
color: #808080;
|
||||
}
|
||||
.info {
|
||||
text-indent: 56rpx;
|
||||
}
|
||||
}
|
||||
.apply-button {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-bottom: 20rpx;
|
||||
view {
|
||||
font-size: 26rpx;
|
||||
font-weight: 500;
|
||||
height: 62rpx;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
.sign {
|
||||
width: 164rpx;
|
||||
border: 1rpx solid #d3d3d4;
|
||||
}
|
||||
.new-state {
|
||||
margin-left: 20rpx;
|
||||
width: 216rpx;
|
||||
color: #fff;
|
||||
background: $jeepay-bg-primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pay-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 170rpx;
|
||||
.dot {
|
||||
position: relative;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
border-radius: 50%;
|
||||
background-color: #d7d8d9;
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 50%;
|
||||
height: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
border-radius: 50%;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
.dot-active {
|
||||
background-color: #2980fd;
|
||||
}
|
||||
.pay-info {
|
||||
display: flex;
|
||||
|
||||
.pay-logo {
|
||||
margin: 0 20rpx 0 0rpx;
|
||||
width: 90rpx;
|
||||
height: 90rpx;
|
||||
border-radius: $v-b-r20;
|
||||
background-color: #07112d;
|
||||
image {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
}
|
||||
}
|
||||
.pay-title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,38 @@
|
||||
<!--
|
||||
|
||||
订单列表页面， 数据渲染
|
||||
业务： 门店
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/23 16:57
|
||||
-->
|
||||
<template>
|
||||
|
||||
<JeepayTableListItem :subtitle="props.record.storeId" @tap="toDetailPage" :logo="props.record.storeLogo||'/static/indexImg/icon-store.svg'">
|
||||
<template #title>
|
||||
{{ props.record.storeName }}
|
||||
<JeepayTag v-if="props.record.defaultFlag == 1" type="green-rgba">默认</JeepayTag>
|
||||
<JeepayTag v-if="props.record.alipayShopStatus == 99" type="blue">蚂蚁店铺</JeepayTag>
|
||||
</template>
|
||||
</JeepayTableListItem>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from "vue"
|
||||
import go from '@/commons/utils/go.js'
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: {type:Object, default: () => {}}, // 渲染对象
|
||||
})
|
||||
|
||||
function toDetailPage(){
|
||||
go.to("PAGES_APP_STORE_DETAIL", {storeId: props.record.storeId})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
@@ -0,0 +1,141 @@
|
||||
<!--
|
||||
|
||||
会员账户流水列表页面， 数据渲染
|
||||
业务： 会员账户流水
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/30 07:07
|
||||
-->
|
||||
<template>
|
||||
<view class="card">
|
||||
<view class="card-content" @tap="toDetails">
|
||||
<view class="card-content-title">
|
||||
<view class="card-content-title-left">
|
||||
<image :src="props.record.avatarUrl" />
|
||||
<text>{{ props.record.mbrName }}</text>
|
||||
</view>
|
||||
<view class="card-content-title-right">
|
||||
|
||||
<text>{{ props.record.changeAmount < 0? '-' : '+'}}{{cal.cert2Dollar(Math.abs(props.record.changeAmount))}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="card-content-line"></view>
|
||||
<view class="card-content-body">
|
||||
<view class="card-content-body-row">
|
||||
<text>变动时间</text>
|
||||
<text>{{ props.record.createdAt }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text>业务类型</text>
|
||||
<text>{{ props.record.bizType==1?'支付充值':props.record.bizType==2?'现金充值':props.record.bizType==3?'会员消费':props.record.bizType==4?'消费退款':props.record.bizType==5?'人工调账':'其他' }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text>变动后余额</text>
|
||||
<text>￥{{ cal.cert2Dollar(props.record.afterAmount) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: { type: Object, default: () => {} }, // 渲染对象
|
||||
})
|
||||
|
||||
//前往会员详情
|
||||
const toDetails = () => {
|
||||
go.to('PAGES_MEMBER_ACCOUNT_HISTORY_DETAIL', { hid: props.record.hid })
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card {
|
||||
width: 690rpx;
|
||||
|
||||
margin: 30rpx auto;
|
||||
}
|
||||
.card-content {
|
||||
border-radius: 20rpx;
|
||||
background-color: $J-bg-ff;
|
||||
margin: 10rpx 0;
|
||||
}
|
||||
|
||||
.card-content-title {
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
|
||||
.card-content-title-left {
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
color: #000000ff;
|
||||
font-size: 30rpx;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
text {
|
||||
padding-left: 10rpx;
|
||||
}
|
||||
}
|
||||
.card-content-title-right {
|
||||
font-weight: 600;
|
||||
color: #000000ff;
|
||||
|
||||
text {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.card-content-line {
|
||||
border-bottom: 2rpx solid rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
.card-content-body {
|
||||
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: space-evenly;
|
||||
box-sizing: border-box;
|
||||
|
||||
.card-content-body-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
padding-left: 50rpx;
|
||||
height: 60rpx;
|
||||
text:first-child {
|
||||
width: 170rpx;
|
||||
color: #999999ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
text:last-child {
|
||||
color: #000000ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,165 @@
|
||||
<!--
|
||||
|
||||
会员充值记录列表页面， 数据渲染
|
||||
业务： 会员充值记录
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/30 07:07
|
||||
-->
|
||||
<template>
|
||||
<view class="card">
|
||||
<view class="card-content" @tap="toDetails">
|
||||
<view class="card-content-title">
|
||||
<view class="card-content-title-left">
|
||||
<image :src="props.record.avatarUrl" />
|
||||
<text>{{ props.record.mbrName }}</text>
|
||||
</view>
|
||||
<view class="card-content-title-right">
|
||||
<text>￥</text>
|
||||
<text>{{ cal.cert2Dollar(props.record.entryAmount) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="card-content-line"></view>
|
||||
<view class="card-content-body">
|
||||
<view class="card-content-body-row">
|
||||
<text>充值时间</text>
|
||||
<text>{{ props.record.createdAt }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text>充值状态</text>
|
||||
<view class="order">
|
||||
<view class="order-spot" :style="{ backgroundColor: datamap.rechargeRecordImage(props.record.state).color }"></view>
|
||||
<text class="order-text">{{ datamap.rechargeRecordImage(props.record.state).text }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="props.record.state==2" class="card-content-body-row">
|
||||
<text>充值后余额</text>
|
||||
<text>￥{{ cal.cert2Dollar(props.record.afterBalance) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import datamap from '@/commons/utils/datamap.js'
|
||||
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: { type: Object, default: () => {} }, // 渲染对象
|
||||
})
|
||||
|
||||
//前往会员详情
|
||||
const toDetails = () => {
|
||||
go.to('PAGES_MEMBER_RECHARGE_RECORD_DETAIL', { rechargeRecordId: props.record.rechargeRecordId })
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card {
|
||||
width: 690rpx;
|
||||
|
||||
margin: 30rpx auto;
|
||||
}
|
||||
.card-content {
|
||||
border-radius: 20rpx;
|
||||
background-color: $J-bg-ff;
|
||||
margin: 10rpx 0;
|
||||
}
|
||||
|
||||
.card-content-title {
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
|
||||
.card-content-title-left {
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
color: #000000ff;
|
||||
font-size: 30rpx;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
text {
|
||||
padding-left: 10rpx;
|
||||
}
|
||||
}
|
||||
.card-content-title-right {
|
||||
font-weight: 600;
|
||||
color: #000000ff;
|
||||
|
||||
text:first-child {
|
||||
font-size: 20rpx;
|
||||
}
|
||||
text:last-child {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card-content-line {
|
||||
border-bottom: 2rpx solid rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
.card-content-body {
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: space-evenly;
|
||||
box-sizing: border-box;
|
||||
|
||||
.card-content-body-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
opacity: 1;
|
||||
padding-left: 50rpx;
|
||||
height: 60rpx;
|
||||
text:first-child {
|
||||
width: 160rpx;
|
||||
color: #999999ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
text:last-child {
|
||||
color: #000000ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.order {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.order-spot {
|
||||
width: 10rpx;
|
||||
height: 10rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.order-text {
|
||||
padding-left: 10rpx;
|
||||
color: #000000ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,148 @@
|
||||
<!--
|
||||
|
||||
充值规则列表页面， 数据渲染
|
||||
业务： 充值规则
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/30 07:07
|
||||
-->
|
||||
<template>
|
||||
<view class="card">
|
||||
<view class="card-content">
|
||||
<view class="card-content-left">
|
||||
<view class="rule">
|
||||
<view class="rule-amount">
|
||||
<text>充：</text>
|
||||
<text class="rule-amount-recharge">￥{{ cal.cert2Dollar(props.record.rechargeAmount) }}</text>
|
||||
</view>
|
||||
<view class="rule-amount">
|
||||
<text>赠：</text>
|
||||
<text class="rule-amount-give">￥{{ cal.cert2Dollar(props.record.giveAmount) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rule-state">
|
||||
<view class="order-spot" :style="{ backgroundColor: props.record.state ? '#09BB07' : '#CB2972' }"></view>
|
||||
<text>{{ props.record.state ? '启用' : '禁用' }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="card-content-right">
|
||||
<image src="/static/member/edit.svg" @tap="editFunc(props.record.ruleId)"></image>
|
||||
<view class="right-line"></view>
|
||||
<image src="/static/member/delete.svg" @tap="deleteFunc(props.record.ruleId)"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<JeepayPopupConfirm ref="jeepayPopupConfirmRef" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
import infoBox from '@/commons/utils/infoBox.js'
|
||||
import { reqLoad, API_URL_MEMBER_RECHARGE_RULES } from "@/http/apiManager.js"
|
||||
|
||||
const jeepayPopupConfirmRef = ref()
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: { type: Object, default: () => {} }, // 渲染对象
|
||||
})
|
||||
|
||||
const editFunc = (ruleId) => {
|
||||
go.to("PAGES_RECHARGE_RULE_EDIT", { ruleId: ruleId })
|
||||
}
|
||||
|
||||
const deleteFunc = (ruleId) => {
|
||||
jeepayPopupConfirmRef.value.open('确定删除规则？', { confirmColor: 'red' }).then(() => {
|
||||
return reqLoad.delById(API_URL_MEMBER_RECHARGE_RULES, ruleId).then(() => {
|
||||
infoBox.showSuccessToast("删除成功");
|
||||
emit.pageEmit(emit.ENAME_REF_RECHARGE_RULE_LIST) // 更新列表
|
||||
})
|
||||
}).catch(() => {
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card {
|
||||
width: 711rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.card-content {
|
||||
height: 180rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-radius: 20rpx;
|
||||
background-color: $J-bg-ff;
|
||||
margin: 20rpx 0;
|
||||
}
|
||||
.card-content-left {
|
||||
width: 590rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 40rpx;
|
||||
|
||||
.rule {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
|
||||
.rule-amount {
|
||||
color: #808080ff;
|
||||
font-size: 30rpx;
|
||||
padding: 8rpx 0;
|
||||
}
|
||||
.rule-amount-recharge {
|
||||
color: #000000ff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.rule-amount-give {
|
||||
color: #3d8affff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.rule-state {
|
||||
color: #000000ff;
|
||||
font-size: 26rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.order-spot {
|
||||
width: 10rpx;
|
||||
height: 10rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
text {
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.card-content-right {
|
||||
width: 120rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
border-left: 2rpx solid rgba(0, 0, 0, 0.06);
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
.right-line {
|
||||
width: 100%;
|
||||
border-bottom: 2rpx solid rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
118
jeepay-ui-uapp-merchant/pageRed/list/render/MemberRender.vue
Normal file
118
jeepay-ui-uapp-merchant/pageRed/list/render/MemberRender.vue
Normal file
@@ -0,0 +1,118 @@
|
||||
<!--
|
||||
|
||||
会员列表页面， 数据渲染
|
||||
业务： 会员管理
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/30 07:07
|
||||
-->
|
||||
<template>
|
||||
<view class="card-wrapper">
|
||||
<view class="card-main" hover-class="touch-hover" :style="{ right: right + 'rpx' }">
|
||||
<view class="card-item" @tap="toDetails">
|
||||
<view class="img-wrapper">
|
||||
<image :src="props.record.avatarUrl" mode="scaleToFill" />
|
||||
</view>
|
||||
<view class="card-info">
|
||||
<view class="info-text">
|
||||
<view class="text-main single-text-beyond">{{ props.record.mbrName }}</view>
|
||||
</view>
|
||||
<view class="info-phone">
|
||||
{{props.record.mbrTel}}
|
||||
<text class="info-balance">余额：￥{{ cal.cert2Dollar(props.record.balance) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: { type: Object, default: () => {} }, // 渲染对象
|
||||
})
|
||||
|
||||
//前往会员详情
|
||||
const toDetails = () => {
|
||||
go.to('PAGES_MEMBER_DETAIL', { mbrId: props.record.mbrId })
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card-wrapper {
|
||||
overflow: hidden;
|
||||
.card-main {
|
||||
position: relative;
|
||||
padding: 0 30rpx;
|
||||
height: 170rpx;
|
||||
background-color: $J-bg-ff;
|
||||
transition: 0.2s ease-in;
|
||||
.card-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.img-wrapper {
|
||||
position: relative;
|
||||
flex-shrink: 0;
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
background-color: skyblue;
|
||||
border-radius: 50%;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.card-info {
|
||||
margin-left: 30rpx;
|
||||
.info-text {
|
||||
display: flex;
|
||||
.text-main {
|
||||
max-width: 446rpx;
|
||||
font-size: 30rpx;
|
||||
font-weight: 400;
|
||||
color: #000000ff;
|
||||
opacity: 1;
|
||||
}
|
||||
.info-state {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 30rpx;
|
||||
padding: 0 15rpx;
|
||||
height: 40rpx;
|
||||
font-size: 23rpx;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
white-space: nowrap;
|
||||
background: linear-gradient(270deg, rgba(61, 220, 68, 1) 0%, rgba(23, 187, 118, 1) 100%);
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
}
|
||||
.info-phone {
|
||||
margin-top: 16rpx;
|
||||
font-size: 25rpx;
|
||||
font-weight: 400;
|
||||
color: $J-color-t99;
|
||||
|
||||
.info-balance {
|
||||
padding-left: 30rpx;
|
||||
color: #000000ff;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
142
jeepay-ui-uapp-merchant/pageRed/list/render/PayOrderRender.vue
Normal file
142
jeepay-ui-uapp-merchant/pageRed/list/render/PayOrderRender.vue
Normal file
@@ -0,0 +1,142 @@
|
||||
<!--
|
||||
|
||||
订单列表页面， 数据渲染
|
||||
业务： 支付订单列表页
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/23 16:57
|
||||
-->
|
||||
<template>
|
||||
<!-- 列表卡片循环渲染start -->
|
||||
<view class="order-card" hover-class="touch-hover" hover-stay-time="150" @tap="toDetail()">
|
||||
<view class="img-wrapper flex-center" :style="{ backgroundColor: datamap.payOrderImage(record?.wayCodeType)?.bgColor }">
|
||||
<image :src="datamap.payOrderImage(record?.wayCodeType)?.imgUrl" mode="scaleToFill"></image>
|
||||
</view>
|
||||
<view class="order-info">
|
||||
<view class="order-num">
|
||||
<view> <text class="icon-money">￥</text> {{ cal.cert2Dollar(props.record.amount) }} </view>
|
||||
<view class="order-state">
|
||||
{{ datamap.payOrderState(props.record.state).text }}
|
||||
<text class="order-spot" :style="{ backgroundColor: datamap.payOrderState(props.record.state).color }"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-time">{{ props.record.createdAt }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import datamap from '@/commons/utils/datamap.js'
|
||||
|
||||
// 跳转详情页
|
||||
function toDetail() {
|
||||
go.to('PAGES_PAY_ORDER_DETAIL', { payOrderId: props.record.payOrderId })
|
||||
}
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: { type: Object, default: () => {} }, // 渲染对象
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.store-name {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 33rpx;
|
||||
font-weight: 500;
|
||||
image {
|
||||
width: 44rpx;
|
||||
height: 44rpx;
|
||||
margin-left: 5rpx;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
.input-wrapper {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
padding-top: 22rpx;
|
||||
height: 110rpx;
|
||||
background-color: $J-bg-ff;
|
||||
.input-main {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 70rpx;
|
||||
background: $J-bg-f5;
|
||||
border-radius: $J-b-r12;
|
||||
image {
|
||||
padding: 22rpx;
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
}
|
||||
input {
|
||||
flex: 1;
|
||||
font-size: 27rpx;
|
||||
}
|
||||
}
|
||||
.screen-wrapper {
|
||||
margin: 0 12rpx 0 20rpx;
|
||||
font-size: 32rpx;
|
||||
color: $J-color-t99;
|
||||
image {
|
||||
width: 28rpx;
|
||||
height: 26rpx;
|
||||
padding: 0 21rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.order-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
height: 170rpx;
|
||||
background-color: $J-bg-ff;
|
||||
.img-wrapper {
|
||||
margin-right: 30rpx;
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.order-info {
|
||||
flex: 1;
|
||||
.order-num {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
.icon-money {
|
||||
font-size: 23rpx;
|
||||
}
|
||||
.order-state {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: $J-color-t80;
|
||||
.order-spot {
|
||||
display: block;
|
||||
margin: 0 10rpx 0 20rpx;
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.order-time {
|
||||
margin-top: 16rpx;
|
||||
font-size: 26rpx;
|
||||
color: $J-color-t99;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,190 @@
|
||||
<!--
|
||||
|
||||
会员充值记录列表页面， 数据渲染
|
||||
业务： 会员充值记录
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/30 07:07
|
||||
-->
|
||||
<template>
|
||||
<view class="card">
|
||||
<view class="card-content" >
|
||||
<view class="card-content-title">
|
||||
<view class="card-content-title-left">
|
||||
<!-- <image :src="props.record.avatarUrl" /> -->
|
||||
<text>{{ props.record.storeName }}[{{ props.record.storeId }}]</text>
|
||||
</view>
|
||||
<!-- <view class="card-content-title-right">
|
||||
<text v-if="props.record.type == 1">下单奖励 </text>
|
||||
<text v-if="props.record.type == 2">消费退款 </text>
|
||||
<text>{{ cal.cert2Dollar(props.record.entryAmount) }}</text>
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="card-content-line"></view>
|
||||
<view class="card-content-body">
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">流水号</text>
|
||||
<text>{{ props.record.flowNo }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">顾客uid</text>
|
||||
<text class="card-content-body-row-text">{{ props.record.payUserId }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">顾客来源</text>
|
||||
<text v-if="props.record.type == 'WECHAT'">微信 </text>
|
||||
<text v-if="props.record.type == 'ALIPAY'">支付宝 </text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">交易金额</text>
|
||||
<text>{{cal.cert2Dollar(props.record.transAmt) }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">红包优惠</text>
|
||||
<text>{{ props.record.discountScale }}折</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">实付金额</text>
|
||||
<text>{{ cal.cert2Dollar(props.record.findAmt) }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">奖励红包</text>
|
||||
<text>{{ cal.cert2Dollar(props.record.rewardAmt) }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">交易时间</text>
|
||||
<text>{{ props.record.transTime }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">红包有效期</text>
|
||||
<text>{{ props.record.expireTime }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">创建日期</text>
|
||||
<text>{{ props.record.createdAt }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import datamap from '@/commons/utils/datamap.js'
|
||||
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: { type: Object, default: () => {} }, // 渲染对象
|
||||
})
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card {
|
||||
width: 690rpx;
|
||||
|
||||
margin: 30rpx auto;
|
||||
}
|
||||
.card-content {
|
||||
border-radius: 20rpx;
|
||||
background-color: $J-bg-ff;
|
||||
margin: 10rpx 0;
|
||||
}
|
||||
|
||||
.card-content-title {
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
|
||||
.card-content-title-left {
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
color: #000000ff;
|
||||
font-size: 30rpx;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
text {
|
||||
padding-left: 10rpx;
|
||||
}
|
||||
}
|
||||
.card-content-title-right {
|
||||
font-weight: 600;
|
||||
color: #000000ff;
|
||||
|
||||
text:first-child {
|
||||
font-size: 20rpx;
|
||||
}
|
||||
text:last-child {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card-content-line {
|
||||
border-bottom: 2rpx solid rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
.card-content-body {
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: space-evenly;
|
||||
box-sizing: border-box;
|
||||
|
||||
.card-content-body-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
opacity: 1;
|
||||
// padding-left: 50rpx;
|
||||
height: 60rpx;
|
||||
text:first-child {
|
||||
width: 150rpx;
|
||||
color: #999999ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
text-align: right;
|
||||
padding-right: 20rpx;
|
||||
}
|
||||
text:last-child {
|
||||
color: #000000ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.order {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.order-spot {
|
||||
width: 10rpx;
|
||||
height: 10rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.order-text {
|
||||
padding-left: 10rpx;
|
||||
color: #000000ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,178 @@
|
||||
<!--
|
||||
|
||||
会员充值记录列表页面， 数据渲染
|
||||
业务： 会员充值记录
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/30 07:07
|
||||
-->
|
||||
<template>
|
||||
<view class="card">
|
||||
<view class="card-content" >
|
||||
<view class="card-content-title">
|
||||
<view class="card-content-title-left">
|
||||
<!-- <image :src="props.record.avatarUrl" /> -->
|
||||
<text>{{ props.record.storeName }}[{{ props.record.storeId }}]</text>
|
||||
</view>
|
||||
<!-- <view class="card-content-title-right">
|
||||
<text v-if="props.record.type == 1">下单奖励 </text>
|
||||
<text v-if="props.record.type == 2">消费退款 </text>
|
||||
<text>{{ cal.cert2Dollar(props.record.entryAmount) }}</text>
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="card-content-line"></view>
|
||||
<view class="card-content-body">
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">流水号</text>
|
||||
<text>{{ props.record.flowNo }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">顾客uid</text>
|
||||
<text class="card-content-body-row-text">{{ props.record.payUserId }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">变动类型</text>
|
||||
<text v-if="props.record.type == 1">下单奖励</text>
|
||||
<text v-if="props.record.type == 2">消费退款</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">变动前余额</text>
|
||||
<text>{{cal.cert2Dollar(props.record.beforeAmt) }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">变动金额</text>
|
||||
<text>{{ cal.cert2Dollar(props.record.changeAmt) }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">变动后余额</text>
|
||||
<text>{{ cal.cert2Dollar(props.record.afterAmt) }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">更新日期</text>
|
||||
<text>{{ props.record.updatedAt }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import datamap from '@/commons/utils/datamap.js'
|
||||
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: { type: Object, default: () => {} }, // 渲染对象
|
||||
})
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card {
|
||||
width: 690rpx;
|
||||
|
||||
margin: 30rpx auto;
|
||||
}
|
||||
.card-content {
|
||||
border-radius: 20rpx;
|
||||
background-color: $J-bg-ff;
|
||||
margin: 10rpx 0;
|
||||
}
|
||||
|
||||
.card-content-title {
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
|
||||
.card-content-title-left {
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
color: #000000ff;
|
||||
font-size: 30rpx;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
text {
|
||||
padding-left: 10rpx;
|
||||
}
|
||||
}
|
||||
.card-content-title-right {
|
||||
font-weight: 600;
|
||||
color: #000000ff;
|
||||
|
||||
text:first-child {
|
||||
font-size: 20rpx;
|
||||
}
|
||||
text:last-child {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card-content-line {
|
||||
border-bottom: 2rpx solid rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
.card-content-body {
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: space-evenly;
|
||||
box-sizing: border-box;
|
||||
|
||||
.card-content-body-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
opacity: 1;
|
||||
// padding-left: 50rpx;
|
||||
height: 60rpx;
|
||||
text:first-child {
|
||||
width: 150rpx;
|
||||
color: #999999ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
text-align: right;
|
||||
padding-right: 20rpx;
|
||||
}
|
||||
text:last-child {
|
||||
color: #000000ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.order {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.order-spot {
|
||||
width: 10rpx;
|
||||
height: 10rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.order-text {
|
||||
padding-left: 10rpx;
|
||||
color: #000000ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,169 @@
|
||||
<!--
|
||||
|
||||
充值规则列表页面， 数据渲染
|
||||
业务： 充值规则
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/30 07:07
|
||||
-->
|
||||
<template>
|
||||
<view class="card">
|
||||
<view class="card-content">
|
||||
<view class="card-content-left">
|
||||
<view class="rule">
|
||||
<view class="rule-amount">
|
||||
<text>{{props.record.storeName}}</text>
|
||||
<text class="rule-amount-recharge" v-if="props.record.packetType == 1">门店专享</text>
|
||||
<text class="rule-amount-recharge" v-if="props.record.packetType == 2">平台通用</text>
|
||||
</view>
|
||||
<view class="rule-amount">
|
||||
<text>折扣比例</text>
|
||||
<text class="rule-amount-give">{{props.record.marketScale}}折</text>
|
||||
</view>
|
||||
|
||||
<view class="rule-amount">
|
||||
<text>补贴比例</text>
|
||||
<text class="rule-amount-give">{{props.record.platScale}}折</text>
|
||||
</view>
|
||||
|
||||
<view class="rule-amount">
|
||||
<text>红包比例</text>
|
||||
<text class="rule-amount-give">{{props.record.userPerkScale*100}}%</text>
|
||||
</view>
|
||||
<view class="rule-amount">
|
||||
<text>红包有效期</text>
|
||||
<text class="rule-amount-give">{{props.record.expireNumber}}个月</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="rule-state">
|
||||
<view class="order-spot" :style="{ backgroundColor: props.record.state ? '#09BB07' : '#CB2972' }"></view>
|
||||
<text>{{ props.record.state ? '启用' : '禁用' }}</text>
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="card-content-right" @tap="editFunc(props.record.id)">
|
||||
<image src="/static/member/edit.svg" ></image>
|
||||
<!-- <view class="right-line"></view>
|
||||
<image src="/static/member/delete.svg" @tap="deleteFunc(props.record.ruleId)"></image> -->
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<JeepayPopupConfirm ref="jeepayPopupConfirmRef" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
import infoBox from '@/commons/utils/infoBox.js'
|
||||
import { reqLoad, API_URL_MEMBER_RECHARGE_RULES } from "@/http/apiManager.js"
|
||||
|
||||
const jeepayPopupConfirmRef = ref()
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: { type: Object, default: () => {} }, // 渲染对象
|
||||
})
|
||||
console.log(props,'propspropsprops')
|
||||
|
||||
const editFunc = (id) => {
|
||||
go.to("PAGES_RED_RULE_EDIT", { ruleId: id })
|
||||
}
|
||||
|
||||
const deleteFunc = (ruleId) => {
|
||||
jeepayPopupConfirmRef.value.open('确定删除规则？', { confirmColor: 'red' }).then(() => {
|
||||
return reqLoad.delById(API_URL_MEMBER_RECHARGE_RULES, ruleId).then(() => {
|
||||
infoBox.showSuccessToast("删除成功");
|
||||
emit.pageEmit(emit.ENAME_REF_RECHARGE_RULE_LIST) // 更新列表
|
||||
})
|
||||
}).catch(() => {
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card {
|
||||
width: 711rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.card-content {
|
||||
// height: 180rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-radius: 20rpx;
|
||||
background-color: $J-bg-ff;
|
||||
margin: 20rpx 0;
|
||||
padding: 20rpx 0;
|
||||
}
|
||||
.card-content-left {
|
||||
width: 590rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 40rpx;
|
||||
|
||||
.rule {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
|
||||
.rule-amount {
|
||||
color: #808080ff;
|
||||
font-size: 30rpx;
|
||||
padding: 8rpx 0;
|
||||
text{
|
||||
margin: 0 10px;
|
||||
}
|
||||
}
|
||||
.rule-amount-recharge {
|
||||
margin-left: 10px;
|
||||
color: #000000ff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.rule-amount-give {
|
||||
color: #3d8affff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.rule-state {
|
||||
color: #000000ff;
|
||||
font-size: 26rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.order-spot {
|
||||
width: 10rpx;
|
||||
height: 10rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
text {
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.card-content-right {
|
||||
width: 120rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
border-left: 2rpx solid rgba(0, 0, 0, 0.06);
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
.right-line {
|
||||
width: 100%;
|
||||
border-bottom: 2rpx solid rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
171
jeepay-ui-uapp-merchant/pageRed/list/render/RedUserRender.vue
Normal file
171
jeepay-ui-uapp-merchant/pageRed/list/render/RedUserRender.vue
Normal file
@@ -0,0 +1,171 @@
|
||||
<!--
|
||||
|
||||
会员充值记录列表页面， 数据渲染
|
||||
业务： 会员充值记录
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/30 07:07
|
||||
-->
|
||||
<template>
|
||||
<view class="card">
|
||||
<view class="card-content" >
|
||||
<view class="card-content-title">
|
||||
<view class="card-content-title-left">
|
||||
<!-- <image :src="props.record.avatarUrl" /> -->
|
||||
<text>{{ props.record.storeName }}[{{ props.record.storeId }}]</text>
|
||||
</view>
|
||||
<!-- <view class="card-content-title-right">
|
||||
<text v-if="props.record.type == 1">下单奖励 </text>
|
||||
<text v-if="props.record.type == 2">消费退款 </text>
|
||||
<text>{{ cal.cert2Dollar(props.record.entryAmount) }}</text>
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="card-content-line"></view>
|
||||
<view class="card-content-body">
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">顾客来源</text>
|
||||
<!-- <text>{{ props.record.flowNo }}</text> -->
|
||||
<text v-if="props.record.type == 'WECHAT'">微信 </text>
|
||||
<text v-if="props.record.type == 'ALIPAY'">支付宝 </text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">顾客uid</text>
|
||||
<text class="card-content-body-row-text">{{ props.record.payUserId }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">红包余额</text>
|
||||
<text>{{cal.cert2Dollar(props.record.balance) }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">最新一次下单时间</text>
|
||||
<text>{{ props.record.lastTransTime }}</text>
|
||||
</view>
|
||||
<view class="card-content-body-row">
|
||||
<text class="card-content-body-row-text">首次下单时间</text>
|
||||
<text>{{ props.record.createdAt }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import datamap from '@/commons/utils/datamap.js'
|
||||
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: { type: Object, default: () => {} }, // 渲染对象
|
||||
})
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card {
|
||||
width: 690rpx;
|
||||
|
||||
margin: 30rpx auto;
|
||||
}
|
||||
.card-content {
|
||||
border-radius: 20rpx;
|
||||
background-color: $J-bg-ff;
|
||||
margin: 10rpx 0;
|
||||
}
|
||||
|
||||
.card-content-title {
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
|
||||
.card-content-title-left {
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
color: #000000ff;
|
||||
font-size: 30rpx;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
text {
|
||||
padding-left: 10rpx;
|
||||
}
|
||||
}
|
||||
.card-content-title-right {
|
||||
font-weight: 600;
|
||||
color: #000000ff;
|
||||
|
||||
text:first-child {
|
||||
font-size: 20rpx;
|
||||
}
|
||||
text:last-child {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card-content-line {
|
||||
border-bottom: 2rpx solid rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
.card-content-body {
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: space-evenly;
|
||||
box-sizing: border-box;
|
||||
|
||||
.card-content-body-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
opacity: 1;
|
||||
// padding-left: 50rpx;
|
||||
height: 60rpx;
|
||||
text:first-child {
|
||||
width: 150rpx;
|
||||
color: #999999ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
text-align: right;
|
||||
padding-right: 20rpx;
|
||||
}
|
||||
text:last-child {
|
||||
color: #000000ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.order {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.order-spot {
|
||||
width: 10rpx;
|
||||
height: 10rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.order-text {
|
||||
padding-left: 10rpx;
|
||||
color: #000000ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
197
jeepay-ui-uapp-merchant/pageRed/list/render/SysUserRender.vue
Normal file
197
jeepay-ui-uapp-merchant/pageRed/list/render/SysUserRender.vue
Normal file
@@ -0,0 +1,197 @@
|
||||
<!--
|
||||
|
||||
订单列表页面， 数据渲染
|
||||
业务： 用户管理 迁移自 JFeftCard
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/30 07:07
|
||||
-->
|
||||
<template>
|
||||
<view class="card-wrapper">
|
||||
<view class="card-main" hover-class="touch-hover" :style="{ right: right + 'rpx' }">
|
||||
<view class="card-item" @tap="toDetails">
|
||||
<view class="img-wrapper" :class="{ 'open-state': props.record.state == 1, 'close-state': props.record.state == 0 }">
|
||||
<image :src="props.record.avatarUrl" mode="scaleToFill" />
|
||||
</view>
|
||||
<view class="card-info">
|
||||
<view class="info-text">
|
||||
<view class="text-main single-text-beyond">{{ props.record.realname }}</view>
|
||||
<JeepayTag :type="datamap.userType(props.record.userType).type">{{ datamap.userType(props.record.userType).text }}</JeepayTag>
|
||||
</view>
|
||||
<view class="info-phone">{{props.record.telphone}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="card-delete" hover-class="u-cell-delete" hover-stay-time="150" @tap="deleteStaff"> 删除 </view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import datamap from '@/commons/utils/datamap.js'
|
||||
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: { type: Object, default: () => {} }, // 渲染对象
|
||||
})
|
||||
|
||||
|
||||
// 删除确认弹窗
|
||||
const deleteStaff = (v) => {
|
||||
// jeepayPopupConfirmRef.value.open(`确认删除 ${v.name} 员工吗?`).then(() => {
|
||||
// console.log('确认')
|
||||
// });
|
||||
}
|
||||
|
||||
//前往员工详情
|
||||
const toDetails = () => {
|
||||
go.to('PAGES_USER_DETAIL', { sysUserId: props.record.sysUserId })
|
||||
}
|
||||
|
||||
// 该部分 为左滑右滑功能部分
|
||||
const right = ref(0)
|
||||
let startX = 0
|
||||
const touchStart = (e) => {
|
||||
startX = e.touches[0].clientX
|
||||
}
|
||||
const touchMove = (e) => {
|
||||
const endX = e.changedTouches[0].clientX
|
||||
const deviationX = startX - endX
|
||||
if (deviationX > 0) {
|
||||
leftTouch(deviationX)
|
||||
} else if (deviationX < 0) {
|
||||
rightTouch(deviationX)
|
||||
}
|
||||
}
|
||||
const touchEnd = (e) => {
|
||||
const endX = e.changedTouches[0].clientX
|
||||
const deviationX = startX - endX
|
||||
if (deviationX == 0) {
|
||||
emits('touchDown')
|
||||
}
|
||||
}
|
||||
const leftTouch = (x) => {
|
||||
if (x <= 50) return
|
||||
right.value += x
|
||||
if (right.value > 232) {
|
||||
right.value = 232
|
||||
}
|
||||
}
|
||||
const rightTouch = (x) => {
|
||||
if (right.value > 0) {
|
||||
right.value += x
|
||||
right.value = right.value > 0 ? 0 : right.value
|
||||
} else {
|
||||
right.value = 0
|
||||
}
|
||||
}
|
||||
// 左滑右滑 end
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card-wrapper {
|
||||
overflow: hidden;
|
||||
.card-main {
|
||||
position: relative;
|
||||
padding: 0 30rpx;
|
||||
height: 170rpx;
|
||||
background-color: #fff;
|
||||
transition: 0.2s ease-in;
|
||||
.card-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.img-wrapper {
|
||||
position: relative;
|
||||
flex-shrink: 0;
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
background-color: skyblue;
|
||||
border-radius: 50%;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.close-state::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
right: -10rpx;
|
||||
bottom: -5rpx;
|
||||
width: 25rpx;
|
||||
height: 25rpx;
|
||||
border: 6rpx solid #fff;
|
||||
border-radius: 50%;
|
||||
background-color: #d9d9d9;
|
||||
}
|
||||
.open-state::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
right: -10rpx;
|
||||
bottom: -5rpx;
|
||||
width: 25rpx;
|
||||
height: 25rpx;
|
||||
border: 6rpx solid #fff;
|
||||
border-radius: 50%;
|
||||
background-color: #168fff;
|
||||
}
|
||||
.card-info {
|
||||
margin-left: 30rpx;
|
||||
.info-text {
|
||||
display: flex;
|
||||
.text-main {
|
||||
max-width: 446rpx;
|
||||
font-size: 30rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
.info-state {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 30rpx;
|
||||
padding: 0 15rpx;
|
||||
height: 40rpx;
|
||||
font-size: 23rpx;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
white-space: nowrap;
|
||||
background: linear-gradient(270deg, rgba(61, 220, 68, 1) 0%, rgba(23, 187, 118, 1) 100%);
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
}
|
||||
.info-phone {
|
||||
margin-top: 16rpx;
|
||||
font-size: 25rpx;
|
||||
font-weight: 400;
|
||||
color: $J-color-t99;
|
||||
}
|
||||
}
|
||||
}
|
||||
.card-delete {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: -232rpx;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 232rpx;
|
||||
height: 170rpx;
|
||||
color: #fff;
|
||||
background-color: #ff5b4c;
|
||||
}
|
||||
}
|
||||
}
|
||||
.u-cell-hover {
|
||||
background-color: #f8f9fa;
|
||||
}
|
||||
.u-cell-delete {
|
||||
opacity: 0.5;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,64 @@
|
||||
<!--
|
||||
|
||||
订单列表页面， 数据渲染
|
||||
业务： 通知人管理
|
||||
|
||||
@author terrfly
|
||||
@site https://www.jeequan.com
|
||||
@date 2022/11/28 17:44
|
||||
-->
|
||||
<template>
|
||||
<view class="notice-main">
|
||||
<view class="notice-title">
|
||||
<view class="notice-name single-text-beyond">{{ props.record.nickname }}</view>
|
||||
<JeepayStateSwitch v-model:state="props.record.sendStatus" :showSwitchType="true" :updateStateFunc="updateStateFunc" />
|
||||
</view>
|
||||
<view class="notice-info">{{ props.record.wxOpenId }}</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from "vue"
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import datamap from '@/commons/utils/datamap.js'
|
||||
import { reqLoad, API_URL_WXMP_USER_LIST } from "@/http/apiManager.js"
|
||||
import infoBox from '@/commons/utils/infoBox.js'
|
||||
|
||||
|
||||
// 定义传入属性
|
||||
const props = defineProps({
|
||||
record: {type:Object, default: () => {}}, // 渲染对象
|
||||
})
|
||||
|
||||
function updateStateFunc (sendStatus) {
|
||||
return reqLoad.updateById(API_URL_WXMP_USER_LIST, props.record.userId, { sendStatus : sendStatus }).then(({bizData}) => {
|
||||
infoBox.showSuccessToast('更新成功')
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.notice-main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
padding: 0 40rpx;
|
||||
height: 175rpx;
|
||||
background-color: $J-bg-ff;
|
||||
.notice-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.notice-name {
|
||||
width: 480rpx;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
.notice-info {
|
||||
margin-top: 16rpx;
|
||||
font-size: 26rpx;
|
||||
color: $J-color-t99;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
315
jeepay-ui-uapp-merchant/pageRed/list/search.vue
Normal file
315
jeepay-ui-uapp-merchant/pageRed/list/search.vue
Normal file
@@ -0,0 +1,315 @@
|
||||
<template>
|
||||
<JeepayBackground>
|
||||
<view class="input-wrapper">
|
||||
<view class="input-main">
|
||||
<uni-easyinput class='jeepay-search' :inputBorder="false" :placeholder="vdata.pageObject.searchPlaceholder"
|
||||
v-model="vdata.searchVal" @focus="focus" @confirm="searchFunc">
|
||||
<template #prefixIcon><image src="@/static/iconImg/icon-search.svg" class="input-icon" @tap="vdata.searchVal=''" /></template>
|
||||
</uni-easyinput>
|
||||
<button type="text" @click="searchFunc()">搜索</button>
|
||||
<!-- <button v-show="!vdata.isSearch" type="text" @click="searchFunc">取消</button> -->
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<JeepayTableList ref="tableRef" :reqTableDataFunc="reqTableDataFunc" :searchData="vdata.searchData" :initData="false">
|
||||
<template #tableBody="{ record }">
|
||||
<PayOrderRender v-if="vdata.pageType == 'payOrder'" :record="record" />
|
||||
<MchAppRender v-if="vdata.pageType == 'mchApp'" :record="record" />
|
||||
<WxmpUserRender v-if="vdata.pageType == 'wxmpUser'" :record="record" />
|
||||
<MchApplymentRender v-if="vdata.pageType == 'mchApplyment'" :record="record" />
|
||||
<MchStoreRender v-if="vdata.pageType == 'mchStore'" :record="record" />
|
||||
<SysUserRender v-if="vdata.pageType == 'sysUser'" :record="record" />
|
||||
<AppConfigRender v-if="vdata.pageType == 'payPassage'" :record="record" :configAppId="vdata.pageOptions.appId" />
|
||||
<MemberRender v-if="vdata.pageType == 'member'" :record="record" />
|
||||
<MemberRechargeRecordRender v-if="vdata.pageType == 'memberRechargeRecord'" :record="record" />
|
||||
<MemberAccountHistoryRender v-if="vdata.pageType == 'memberAccountHistory'" :record="record" />
|
||||
|
||||
<!-- 设备的三个类型的搜索 -->
|
||||
<DeviceCommonsRender v-if="vdata.pageType == 'qrc'" type="qrc" :record="record" />
|
||||
<DeviceCommonsRender v-if="vdata.pageType == 'storeTerminal'" type="storeTerminal" :record="record" />
|
||||
<DeviceCommonsRender v-if="vdata.pageType == 'device'" type="device" :record="record" />
|
||||
<DeviceCommonsRender v-if="vdata.pageType == 'face'" type="face" :record="record" />
|
||||
<FaceCardRender v-if="vdata.pageType == 'faceImgAd'" v-bind="record" />
|
||||
|
||||
<!-- 数据渲染: 动态组件： 微信小程序不支持 -->
|
||||
<!-- <component ref="recordRenderComponentRef" :is="vdata.pageObject.component" :record="record" /> -->
|
||||
</template>
|
||||
</JeepayTableList>
|
||||
</JeepayBackground>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, onMounted, nextTick } from 'vue';
|
||||
import emit from '@/commons/utils/emit.js';
|
||||
import go from '@/commons/utils/go.js';
|
||||
import {
|
||||
reqLoad,
|
||||
API_URL_PAY_ORDER_LIST,
|
||||
API_URL_MCH_APP_LIST,
|
||||
API_URL_WXMP_USER_LIST,
|
||||
API_URL_MCH_APPLYMENT_LIST,
|
||||
API_URL_MCH_STORE_LIST,
|
||||
API_URL_SYS_USER_LIST,
|
||||
API_URL_PAY_PASSAGE_LIST,
|
||||
API_URL_SYS_CODE_LIST,
|
||||
API_URL_SYS_DEVICE_LIST,
|
||||
API_URL_SYS_TERMINALS,
|
||||
API_URI_PAY_AD_LIST,
|
||||
API_URL_MEMBERS,
|
||||
API_URL_MEMBER_RECHARGE_RECORDS,
|
||||
API_URL_MEMBER_ACCOUNT_HISTORY
|
||||
} from '@/http/apiManager.js';
|
||||
import { onLoad, onUnload, onReachBottom } from '@dcloudio/uni-app';
|
||||
import PayOrderRender from './render/PayOrderRender.vue';
|
||||
import MchAppRender from './render/MchAppRender.vue';
|
||||
import WxmpUserRender from './render/WxmpUserRender.vue';
|
||||
import MchApplymentRender from './render/MchApplymentRender.vue';
|
||||
import MchStoreRender from './render/MchStoreRender.vue';
|
||||
import SysUserRender from './render/SysUserRender.vue';
|
||||
import AppConfigRender from './render/AppConfigRender.vue';
|
||||
import DeviceCommonsRender from './render/DeviceCommonsRender.vue';
|
||||
import FaceCardRender from './render/FaceCardRender.vue';
|
||||
import MemberRender from './render/MemberRender.vue';
|
||||
import MemberRechargeRecordRender from './render/MemberRechargeRecordRender.vue';
|
||||
import MemberAccountHistoryRender from './render/MemberAccountHistoryRender.vue';
|
||||
|
||||
onReachBottom(() => {});
|
||||
|
||||
const tableRef = ref();
|
||||
const recordRenderComponentRef = ref(); // 数据渲染组件
|
||||
|
||||
// 定义所有的页面类型
|
||||
const pageTypeMap = {
|
||||
payOrder: {
|
||||
// 支付订单列表
|
||||
component: PayOrderRender, // 渲染组件
|
||||
searchUrl: API_URL_PAY_ORDER_LIST,
|
||||
searchField: 'unionOrderId', // 搜索字段
|
||||
searchPlaceholder: '支付订单号、商户单号' // 显示名称
|
||||
},
|
||||
|
||||
mchApp: {
|
||||
// 商户应用
|
||||
component: MchAppRender, // 渲染组件
|
||||
searchUrl: API_URL_MCH_APP_LIST,
|
||||
searchField: 'unionSearchId', // 搜索字段
|
||||
searchPlaceholder: '应用APPID、名称' // 显示名称
|
||||
},
|
||||
|
||||
wxmpUser: {
|
||||
// 通知人管理
|
||||
component: WxmpUserRender, // 渲染组件
|
||||
searchUrl: API_URL_WXMP_USER_LIST,
|
||||
searchField: 'nickname', // 搜索字段
|
||||
searchPlaceholder: '昵称' // 显示名称
|
||||
},
|
||||
|
||||
mchApplyment: {
|
||||
// 进件
|
||||
component: MchApplymentRender, // 渲染组件
|
||||
searchUrl: API_URL_MCH_APPLYMENT_LIST,
|
||||
searchField: 'unionSearchId', // 搜索字段
|
||||
searchPlaceholder: '进件单号' // 显示名称
|
||||
},
|
||||
|
||||
mchStore: {
|
||||
// 门店
|
||||
component: MchStoreRender, // 渲染组件
|
||||
searchUrl: API_URL_MCH_STORE_LIST,
|
||||
searchField: 'unionStoreInfo', // 搜索字段
|
||||
searchPlaceholder: '门店名称、ID' // 显示名称
|
||||
},
|
||||
|
||||
sysUser: {
|
||||
// 用户管理
|
||||
component: SysUserRender, // 渲染组件
|
||||
searchUrl: API_URL_SYS_USER_LIST,
|
||||
searchField: 'realname', // 搜索字段
|
||||
searchPlaceholder: '姓名' // 显示名称
|
||||
},
|
||||
|
||||
payPassage: {
|
||||
// 支付通道配置
|
||||
component: AppConfigRender, // 渲染组件
|
||||
searchUrl: API_URL_PAY_PASSAGE_LIST,
|
||||
searchField: 'wayCode', // 搜索字段
|
||||
searchPlaceholder: '支付方式代码' // 显示名称
|
||||
},
|
||||
|
||||
qrc: {
|
||||
searchUrl: API_URL_SYS_CODE_LIST,
|
||||
searchField: 'appSearchData',
|
||||
searchPlaceholder: '搜索码牌名称，编号'
|
||||
},
|
||||
|
||||
device: {
|
||||
searchUrl: API_URL_SYS_DEVICE_LIST,
|
||||
searchField: 'appSearchData',
|
||||
searchPlaceholder: '搜索设备名称、编号'
|
||||
},
|
||||
|
||||
storeTerminal: {
|
||||
searchUrl: API_URL_SYS_TERMINALS,
|
||||
searchField: 'trmName',
|
||||
searchPlaceholder: '搜索辅助终端名称'
|
||||
},
|
||||
face: {
|
||||
searchUrl: API_URL_SYS_DEVICE_LIST,
|
||||
searchField: 'appSearchData',
|
||||
searchPlaceholder: '搜索设备名称、编号'
|
||||
},
|
||||
faceImgAd:{
|
||||
searchUrl: API_URI_PAY_AD_LIST,
|
||||
searchField: 'title',
|
||||
searchPlaceholder: '搜索广告标题'
|
||||
},
|
||||
// 会员管理
|
||||
member: {
|
||||
component: MemberRender, // 渲染组件
|
||||
searchUrl: API_URL_MEMBERS,
|
||||
searchField: 'unionQueryParam',
|
||||
searchPlaceholder: '搜索手机号、会员名称'
|
||||
},
|
||||
// 会员充值记录
|
||||
memberRechargeRecord: {
|
||||
component: MemberRechargeRecordRender, // 渲染组件
|
||||
searchUrl: API_URL_MEMBER_RECHARGE_RECORDS,
|
||||
searchField: 'unionQueryParam',
|
||||
searchPlaceholder: '搜索订单号、手机号、会员名称'
|
||||
},
|
||||
// 会员账户流水
|
||||
memberAccountHistory: {
|
||||
component: MemberAccountHistoryRender, // 渲染组件
|
||||
searchUrl: API_URL_MEMBER_ACCOUNT_HISTORY,
|
||||
searchField: 'unionQueryParam',
|
||||
searchPlaceholder: '搜索充值单号、手机号、会员名称'
|
||||
}
|
||||
};
|
||||
|
||||
onLoad(option => {
|
||||
vdata.pageOptions = option;
|
||||
vdata.pageType = option.type;
|
||||
vdata.pageObject = pageTypeMap[option.type];
|
||||
// 特殊处理
|
||||
if (vdata.pageType == 'payPassage') {
|
||||
vdata.searchData.appId = option.appId;
|
||||
}
|
||||
|
||||
// 特殊处理
|
||||
if (vdata.pageType == 'device') {
|
||||
vdata.searchData.deviceType = option.deviceType;
|
||||
}
|
||||
|
||||
// 特殊处理
|
||||
if (vdata.pageType == 'sysUser') { // 不查询普通用户。
|
||||
vdata.searchData.isNotHasType2 = 1;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// 监听 更新事件
|
||||
onUnload(() => uni.$off(emit.ENAME_REF_SEARCH_PAGE));
|
||||
uni.$on(emit.ENAME_REF_SEARCH_PAGE, function(data) {
|
||||
searchFunc();
|
||||
});
|
||||
|
||||
const vdata = reactive({
|
||||
pageOptions: {}, // 页面参数
|
||||
|
||||
pageType: '', // 页面类型
|
||||
|
||||
pageObject: {}, // 页面对象
|
||||
|
||||
searchVal: '', // 搜索值
|
||||
|
||||
searchData: {} ,// 搜索内容
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
});
|
||||
|
||||
// 请求
|
||||
function reqTableDataFunc(params) {
|
||||
|
||||
return reqLoad.list(vdata.pageObject.searchUrl, params);
|
||||
}
|
||||
|
||||
// 点击搜索事件
|
||||
async function searchFunc(val) {
|
||||
if(!vdata.searchVal.trim()) return;
|
||||
|
||||
vdata.searchData[vdata.pageObject.searchField] = vdata.searchVal;
|
||||
tableRef.value.refTable(true); // 刷新列表页
|
||||
|
||||
}
|
||||
|
||||
const focus = () => {
|
||||
vdata.isSearch = false
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.input-wrapper {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
padding-top: 22rpx;
|
||||
height: 110rpx;
|
||||
background-color: $J-bg-ff;
|
||||
.input-main {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 70rpx;
|
||||
image {
|
||||
padding: 22rpx;
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
}
|
||||
input {
|
||||
flex: 1;
|
||||
font-size: 27rpx;
|
||||
}
|
||||
::v-deep uni-button {
|
||||
font-size: 32rpx;
|
||||
color: rgba(29,121,253,1);
|
||||
background: rgba(255,255,255,1);
|
||||
}
|
||||
::v-deep.uni-easyinput {
|
||||
.uni-easyinput__content {
|
||||
background-color: $J-bg-f5 !important;
|
||||
border-radius: $J-b-r12;
|
||||
.uni-easyinput__content-input {
|
||||
padding-left: 0 !important;
|
||||
.uni-input-input {
|
||||
border-radius: $J-b-r12 !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
}
|
||||
.uni-input-placeholder {
|
||||
font-size: 27rpx;
|
||||
}
|
||||
.uni-icons {
|
||||
color: rgba(230,230,230,1) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.input-icon{
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
.search-button{
|
||||
position: absolute;
|
||||
right: 0;
|
||||
background-color: transparent !important;
|
||||
color: transparent !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
139
jeepay-ui-uapp-merchant/pageRed/red/accountHistory/detail.vue
Normal file
139
jeepay-ui-uapp-merchant/pageRed/red/accountHistory/detail.vue
Normal file
@@ -0,0 +1,139 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<view class="mbr-info">
|
||||
<image :src="vdata.record.avatarUrl" />
|
||||
<text class="mbr-info-name">{{ vdata.record.mbrName }}</text>
|
||||
<text class="mbr-info-amount">{{ vdata.record.changeAmount > 0 ? '+'+cal.cert2Dollar(vdata.record.changeAmount) : cal.cert2Dollar(vdata.record.changeAmount) }}</text>
|
||||
</view>
|
||||
<view class="account-line"></view>
|
||||
<view class="account-history">
|
||||
<view class="account-history-item"><text>业务类型</text>
|
||||
<text>{{ vdata.record.bizType==1?'支付充值':vdata.record.bizType==2?'现金充值':vdata.record.bizType==3?'会员消费':vdata.record.bizType==4?'消费退款':vdata.record.bizType==5?'人工调账':'其他' }}</text>
|
||||
</view>
|
||||
<view class="account-history-item"><text>流水ID</text><text>{{ vdata.record.hid }}</text></view>
|
||||
<view class="account-history-item"><text>会员ID</text><text>{{ vdata.record.mbrId }}</text></view>
|
||||
<view class="account-history-item"><text>会员手机号</text><text>{{ vdata.record.mbrTel }}</text></view>
|
||||
<view class="account-history-item"><text>变动前余额</text><text>￥{{ cal.cert2Dollar(vdata.record.beforeAmount) }}</text></view>
|
||||
<view class="account-history-item"><text>变动金额</text><text>￥{{ cal.cert2Dollar(vdata.record.changeAmount) }}</text></view>
|
||||
<view class="account-history-item"><text>变动后余额</text><text>￥{{ cal.cert2Dollar(vdata.record.afterAmount) }}</text></view>
|
||||
<view v-if="vdata.record.relaBizOrderId && vdata.record.bizType == 1" class="account-history-item">
|
||||
<text>充值订单号</text>
|
||||
<text>{{ vdata.record.relaBizOrderId }}
|
||||
<text class="info-copy" @tap="copyInfo(vdata.record.relaBizOrderId)">复制</text>
|
||||
</text>
|
||||
</view>
|
||||
<view class="account-history-item"><text>变动时间</text><text>{{ vdata.record.createdAt }}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import { onLoad, onUnload } from '@dcloudio/uni-app'
|
||||
import { reqLoad, API_URL_MEMBER_ACCOUNT_HISTORY } from '@/http/apiManager.js'
|
||||
import infoBox from '@/commons/utils/infoBox.js';
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
import ent from '@/commons/utils/ent.js'
|
||||
|
||||
onLoad((options) => {
|
||||
refData(options.hid)
|
||||
})
|
||||
|
||||
const vdata = reactive({
|
||||
record : { }
|
||||
})
|
||||
|
||||
// 监听 更新事件
|
||||
onUnload(() => uni.$off(emit.ENAME_REF_MEMBER_ACCOUNT_HISTORY_DETAIL))
|
||||
uni.$on(emit.ENAME_REF_MEMBER_ACCOUNT_HISTORY_DETAIL, function(data){
|
||||
refData(vdata.record.hid)
|
||||
})
|
||||
|
||||
function refData(hid){
|
||||
reqLoad.getById(API_URL_MEMBER_ACCOUNT_HISTORY, hid).then(({bizData}) => {
|
||||
vdata.record = bizData
|
||||
})
|
||||
}
|
||||
|
||||
const copyInfo = (val) => {
|
||||
uni.setClipboardData({ data: val}).then(() => {
|
||||
infoBox.showSuccessToast('复制成功')
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
width: 630rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.mbr-info {
|
||||
height: 376rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.mbr-info-name {
|
||||
padding-top: 10rpx;
|
||||
color: #828282ff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.mbr-info-amount {
|
||||
padding-top: 10rpx;
|
||||
color: #000000ff;
|
||||
font-size: 50rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
.account-line {
|
||||
border-bottom: 1rpx solid #0000001a;
|
||||
}
|
||||
.account-history {
|
||||
padding-top: 60rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
|
||||
.account-history-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
opacity: 1;
|
||||
padding: 13rpx 0 12rpx;
|
||||
|
||||
text:first-child {
|
||||
width: 180rpx;
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
text:nth-child(2) {
|
||||
width: 450rpx;
|
||||
color: #000000;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
word-break: break-all;
|
||||
|
||||
.info-copy {
|
||||
padding-left: 20rpx;
|
||||
opacity: 1;
|
||||
color: #2d6dccff;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
113
jeepay-ui-uapp-merchant/pageRed/red/accountHistory/index.vue
Normal file
113
jeepay-ui-uapp-merchant/pageRed/red/accountHistory/index.vue
Normal file
@@ -0,0 +1,113 @@
|
||||
<template>
|
||||
<view class="page-wrapper">
|
||||
<JeepayCustomNavbar title="顾客红包" backCtrl="back" />
|
||||
|
||||
<!-- 搜索 -->
|
||||
<JSearchTitle place="搜索" @click="go.toSearchPage('redAccountHistory')">
|
||||
<template #right>
|
||||
<JeepaySearchSelect v-model:bizType="vdata.searchData.type" :list="vdata.bizTypeList" title="按业务类型筛选" @change="refTable"/>
|
||||
</template>
|
||||
</JSearchTitle>
|
||||
|
||||
|
||||
<JeepayTableList ref="jeepayTableListRef" :searchData="vdata.searchData" :reqTableDataFunc="reqTableDataFunc">
|
||||
<template #tableBody="{ record }">
|
||||
<RedAccountHistoryRender :record="record" />
|
||||
</template>
|
||||
</JeepayTableList>
|
||||
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<script setup>
|
||||
import { nextTick, reactive, ref } from "vue"
|
||||
import { onReachBottom, onShow, onUnload } from '@dcloudio/uni-app'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
import { reqLoad, API_URL_MCH_REF_PACKET_INFO_LIST } from "@/http/apiManager.js"
|
||||
import RedAccountHistoryRender from '@/pageRed/list/render/RedAccountHistoryRender.vue'
|
||||
|
||||
const jeepayTableListRef = ref()
|
||||
|
||||
const vdata = reactive({
|
||||
searchData: { type: '' },
|
||||
bizTypeList: [
|
||||
{ label: '全部类型', value: '' },
|
||||
{ label: '微信', value: 'WECHAT' },
|
||||
{ label: '支付宝', value: 'ALIPAY' },
|
||||
]
|
||||
})
|
||||
|
||||
onReachBottom(() => { })
|
||||
|
||||
// // 监听 更新事件
|
||||
onUnload(() => uni.$off(emit.ENAME_REF_MEMBER_ACCOUNT_HISTORY_LIST))
|
||||
uni.$on(emit.API_URL_MCH_REF_PACKET_INFO_LIST, function(data){
|
||||
jeepayTableListRef.value.refTable(true)
|
||||
})
|
||||
|
||||
function refTable (e) {
|
||||
jeepayTableListRef.value.refTable(true)
|
||||
}
|
||||
|
||||
// 请求
|
||||
function reqTableDataFunc (params) {
|
||||
return reqLoad.list(API_URL_MCH_REF_PACKET_INFO_LIST, params)
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.sta-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
height: 110rpx;
|
||||
background-color: $J-bg-ff;
|
||||
.input-main {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 70rpx;
|
||||
background-color: $J-bg-f5;
|
||||
border-radius: $J-b-r12;
|
||||
color: rgba(0, 0, 0, 0.35);
|
||||
font-size: 27rpx;
|
||||
font-weight: 400;
|
||||
image {
|
||||
padding: 22rpx;
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
}
|
||||
}
|
||||
.icon-more {
|
||||
margin-left: 30rpx;
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
}
|
||||
.footer-wrapper {
|
||||
height: 170rpx;
|
||||
background-color: transparent;
|
||||
.footer-button {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 30rpx;
|
||||
button {
|
||||
height: 110rpx;
|
||||
font-size: 33rpx;
|
||||
font-weight: 500;
|
||||
color: $J-color-tff;
|
||||
border-radius: 20rpx;
|
||||
background: $jeepay-bg-primary;
|
||||
}
|
||||
.hover-button {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
480
jeepay-ui-uapp-merchant/pageRed/red/index.vue
Normal file
480
jeepay-ui-uapp-merchant/pageRed/red/index.vue
Normal file
@@ -0,0 +1,480 @@
|
||||
<template>
|
||||
<JeepayBackground :bgColorStyle="{ background: '#f7f7f7' }">
|
||||
<JeepayCustomNavbar title="营销红包" backCtrl="back" textColor="#fff"
|
||||
bgDefaultColor="linear-gradient(270deg, rgb(35, 143, 252) 0%, rgb(26, 102, 255) 100%)" />
|
||||
<view class="header-info">
|
||||
<view class="member-info">
|
||||
<view class="info-main">
|
||||
<text class="num">{{ vdata.mbrTotalCount }}</text>
|
||||
<text class="sub-title">红包总数</text>
|
||||
</view>
|
||||
<view class="info-main">
|
||||
<view class="num">{{ cal.cert2Dollar(vdata.mbrTotalBalance) }}<text class="unit">元</text></view>
|
||||
<text class="sub-title">红包总余额</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="nav-list-wrapper">
|
||||
<block v-for="(v, i) in navList" :key="i">
|
||||
<view class="nav-item" @tap="toPage(v.pageUrl)">
|
||||
<image :src="v.icon"></image>
|
||||
<text>{{ v.title }}</text>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<view class="stat-card">
|
||||
<view class="time-wrapper">
|
||||
<block v-for="(v, i) in timeList" :key="i">
|
||||
<view class="time-item" @tap="changeTime(v.value)"
|
||||
:class="{ 'time-selected': v.value == vdata.selected }">{{
|
||||
v.label }}</view>
|
||||
</block>
|
||||
</view>
|
||||
<view v-show="vdata.selected == 'custom'">
|
||||
<view class="time-selection time-custom">
|
||||
<image src="/static/iconImg/custom-time-icon.svg" mode="scaleToFill" />
|
||||
<view class="selection-main" @tap="startTimeRef.show()">{{ vdata.startTime || '请选择开始时间' }} </view>
|
||||
<view>---</view>
|
||||
<view class="selection-main" @tap="endTimeRef.show()">{{ vdata.endTime || '请选择结束时间' }}</view>
|
||||
<image src="/static/iconImg/icon-nav-left.svg" style="transform: rotate(-90deg);" mode="scaleToFill" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="member-consume">
|
||||
<text class="num">{{ cal.cert2Dollar(Math.abs(vdata.mbrCount.changeAmount)) }}</text>
|
||||
<text class="sub-title">会员消费金额 (元)</text>
|
||||
</view>
|
||||
<view class="stat-card-info">
|
||||
<view class="stat-item">
|
||||
<view class="stat-num">{{ cal.cert2Dollar(vdata.rechargeRecordCount.entryAmount) }}</view>
|
||||
<view class="stat-title">充值入账 (元)</view>
|
||||
</view>
|
||||
<view class="stat-item">
|
||||
<view class="stat-num">{{ cal.cert2Dollar(vdata.rechargeRecordCount.giveAmount) }}</view>
|
||||
<view class="stat-title">充值赠送 (元)</view>
|
||||
</view>
|
||||
<view class="stat-item">
|
||||
<view class="stat-num">{{ cal.cert2Dollar(vdata.rechargeRecordCount.payAmount) }}</view>
|
||||
<view class="stat-title">充值支付 (元)</view>
|
||||
</view>
|
||||
<view class="stat-item">
|
||||
<view class="stat-num">{{ cal.cert2Dollar(Math.abs(vdata.accountHistoryCount.changeAmount)) }}</view>
|
||||
<view class="stat-title">余额变动 (元)</view>
|
||||
</view>
|
||||
<view class="stat-item">
|
||||
<view class="stat-num">{{ vdata.accountHistoryCount.countNum }}</view>
|
||||
<view class="stat-title">余额变动条数</view>
|
||||
</view>
|
||||
<view class="stat-item">
|
||||
<view class="stat-num">{{ vdata.mbrCount.changeCount }}</view>
|
||||
<view class="stat-title">红包消费笔数</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</JeepayBackground>
|
||||
<view v-show="vdata.selected == 'custom'">
|
||||
<xp-picker ref="startTimeRef" mode="ymd" @confirm="customTime($event, 'startTime')" />
|
||||
<xp-picker ref="endTimeRef" mode="ymd" @confirm="customTime($event, 'endTime')" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, onMounted, nextTick } from 'vue'
|
||||
import { req, API_URL_MEMBERS, API_URL_MEMBER_RECHARGE_RECORDS, API_URL_MEMBER_ACCOUNT_HISTORY, $findOrEditMemberConfig } from '@/http/apiManager.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import dayjs from 'dayjs'
|
||||
import infoBox from '@/commons/utils/infoBox.js'
|
||||
import { onPullDownRefresh, onShow } from '@dcloudio/uni-app'
|
||||
const startTimeRef = ref()
|
||||
const endTimeRef = ref()
|
||||
const vdata = reactive({
|
||||
mbrTotalCount: '', // 会员总数，不随时间条件变化
|
||||
mbrTotalBalance: '', // 会员总余额，不随时间条件变化
|
||||
mbrCount: {}, // 会员统计
|
||||
accountHistoryCount: {}, // 流水统计
|
||||
rechargeRecordCount: {}, // 充值统计
|
||||
selected: 'today',
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
memberConfig: [] //会员配置项
|
||||
})
|
||||
|
||||
const toPage = (url) => {
|
||||
go.to(url)
|
||||
}
|
||||
|
||||
onShow(() => {
|
||||
vdata.selected = 'today'
|
||||
getMbrCount()
|
||||
getMbrStats(vdata.selected)
|
||||
})
|
||||
|
||||
// 导航列表
|
||||
const navList = [
|
||||
{
|
||||
title: '顾客管理',
|
||||
icon: '/static/indexImg/icon-member.svg',
|
||||
pageUrl: 'PAGES_RED_CUSTOMER_LIST',
|
||||
entId: 'ENT_MCH_RED_CUSTOMER_LIST'
|
||||
},
|
||||
{
|
||||
title: '顾客红包',
|
||||
icon: '/static/member/account-history.svg',
|
||||
pageUrl: 'PAGES_RED_CUSTOMER_HISTORY',
|
||||
entId: 'ENT_MCH_RED_CUSTOMER_RED'
|
||||
},
|
||||
{
|
||||
title: '红包记录',
|
||||
icon: '/static/member/recharge-record.svg',
|
||||
pageUrl: 'PAGES_MCH_RED_LIST',
|
||||
entId: 'ENT_MCH_RED_LIST'
|
||||
},
|
||||
{
|
||||
title: '红包规则',
|
||||
icon: '/static/member/recharge-rule.svg',
|
||||
pageUrl: 'PAGES_RED_RULE',
|
||||
entId: 'ENT_RED_RECHARGE_RULE'
|
||||
},
|
||||
]
|
||||
const timeList = [
|
||||
{ label: '今天', value: 'today' },
|
||||
{ label: '昨天', value: 'yesterday' },
|
||||
{ label: '近30天', value: 'near2now_30' },
|
||||
{ label: '自定义', value: 'custom' }
|
||||
]
|
||||
// 下拉刷新
|
||||
onPullDownRefresh(() => {
|
||||
getMbrCount()
|
||||
changeTime(vdata.selected)
|
||||
})
|
||||
|
||||
function getMbrCount () {
|
||||
// 请求会员统计，不随时间变化
|
||||
req.list(API_URL_MEMBERS + '/count', undefined).then(({ bizData }) => {
|
||||
uni.stopPullDownRefresh()
|
||||
vdata.mbrTotalCount = bizData.memberNum
|
||||
vdata.mbrTotalBalance = bizData.balance
|
||||
}).catch((err) => uni.stopPullDownRefresh())
|
||||
}
|
||||
|
||||
function getMbrStats (queryDate) {
|
||||
const reqParams = {}
|
||||
if (queryDate) {
|
||||
reqParams.queryDateRange = queryDate
|
||||
}
|
||||
|
||||
// 请求会员统计
|
||||
req.list(API_URL_MEMBERS + '/count', reqParams).then(({ bizData }) => {
|
||||
vdata.mbrCount = bizData
|
||||
})
|
||||
|
||||
// 请求记录统计
|
||||
req.list(API_URL_MEMBER_RECHARGE_RECORDS + '/count', Object.assign({ state: 2 }, reqParams)).then(({ bizData }) => {
|
||||
vdata.rechargeRecordCount = bizData
|
||||
})
|
||||
|
||||
// 请求会员流水统计
|
||||
req.list(API_URL_MEMBER_ACCOUNT_HISTORY + '/count', reqParams).then(({ bizData }) => {
|
||||
vdata.accountHistoryCount = bizData
|
||||
})
|
||||
}
|
||||
|
||||
// 切换日期选项，当选自定义时，赋予默认时间
|
||||
function changeTime (e) {
|
||||
if (e != 'custom') {
|
||||
vdata.selected = e
|
||||
getMbrStats(e)
|
||||
} else {
|
||||
if (vdata.selected == 'today') {
|
||||
vdata.startTime = dayjs().format('YYYY-MM-DD')
|
||||
vdata.endTime = dayjs().format('YYYY-MM-DD')
|
||||
|
||||
} else if (vdata.selected == 'yesterday') {
|
||||
vdata.startTime = dayjs().subtract(1, 'day').format('YYYY-MM-DD')
|
||||
vdata.endTime = dayjs().subtract(1, 'day').format('YYYY-MM-DD')
|
||||
|
||||
} else if (vdata.selected == 'near2now_30') {
|
||||
vdata.startTime = dayjs().subtract(30, 'day').format('YYYY-MM-DD')
|
||||
vdata.endTime = dayjs().format('YYYY-MM-DD')
|
||||
}
|
||||
|
||||
vdata.selected = e
|
||||
}
|
||||
}
|
||||
|
||||
function customTime ({ value }, type) {
|
||||
if ((type == 'startTime' && dayjs(value).isAfter(dayjs(vdata.endTime)))
|
||||
|| (type == 'endTime' && (dayjs(vdata.startTime).isAfter(dayjs(value)) || dayjs(value).isAfter(dayjs())))) {
|
||||
return infoBox.showToast('时间选择有误')
|
||||
}
|
||||
|
||||
vdata[type] = value
|
||||
|
||||
const queryDateRange = `customDateTime_
|
||||
${dayjs(vdata.startTime).startOf('date').format('YYYY-MM-DD HH:mm:ss')}_
|
||||
${dayjs(vdata.endTime).endOf('date').format('YYYY-MM-DD HH:mm:ss')}`
|
||||
|
||||
getMbrStats(queryDateRange)
|
||||
}
|
||||
//移动端自定义提示语
|
||||
const mebConfig = {
|
||||
memberCustomAmountState: {
|
||||
title: '是否开启自定义金额充值',
|
||||
tips: '是否修改自定义充值金额状态',
|
||||
weight: 1
|
||||
},
|
||||
memberPayState: {
|
||||
title: '是否开启会员支付',
|
||||
tips: '是否修改会员支付状态',
|
||||
weight: 0
|
||||
},
|
||||
mbrMaxBalance: {
|
||||
title: '会员最大储值余额（单位元）',
|
||||
tips: '是否修改会员支付状态',
|
||||
weight: 2,
|
||||
maxAmount: ''
|
||||
}
|
||||
}
|
||||
// 获取会员支付配置项
|
||||
const findOrEditMemberConfig = (data, mode, uri) => {
|
||||
$findOrEditMemberConfig(data, mode, uri).then(({ bizData }) => {
|
||||
if (mode) return infoBox.showToast('修改成功')
|
||||
//不需要会员模块
|
||||
const index = bizData.findIndex(v => v.configKey == 'memberModelState')
|
||||
if (index != '-1') {
|
||||
bizData.splice(index, 1)
|
||||
}
|
||||
bizData.forEach(v => {
|
||||
v.phoneTips = mebConfig[v.configKey] || {}
|
||||
})
|
||||
bizData.sort((a, b) => a.phoneTips.weight - b.phoneTips.weight)
|
||||
Object.assign(vdata.memberConfig, bizData)
|
||||
findMemberMaxAmount()
|
||||
})
|
||||
}
|
||||
findOrEditMemberConfig({ groupKey: 'memberConfig' })
|
||||
function changeState (e, v) {
|
||||
v.configVal = e
|
||||
findOrEditMemberConfig({ configData: vdata.memberConfig }, 'PUT', '/memberConfig')
|
||||
}
|
||||
//查询 会员最大储值金额
|
||||
function findMemberMaxAmount () {
|
||||
$findOrEditMemberConfig(undefined, undefined, '/mbrMaxBalance').then(({ bizData }) => {
|
||||
vdata.memberConfig.find(v => v.configKey == 'mbrMaxBalance').phoneTips.maxAmount = bizData
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.time-item {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.header-info {
|
||||
height: 290rpx;
|
||||
background: linear-gradient(270deg, rgb(35, 143, 252) 0%, rgb(26, 102, 255) 100%);
|
||||
border: 1rpx solid transparent;
|
||||
border-radius: 0 0 32rpx 32rpx;
|
||||
|
||||
.member-info {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 50rpx;
|
||||
|
||||
.info-main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 335rpx;
|
||||
height: 106rpx;
|
||||
|
||||
.num {
|
||||
margin-bottom: 10rpx;
|
||||
color: #ffffff;
|
||||
font-size: 50rpx;
|
||||
font-weight: 500;
|
||||
|
||||
.unit {
|
||||
margin-left: 10rpx;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
font-size: 23rpx;
|
||||
}
|
||||
}
|
||||
|
||||
view:nth-child(1) {
|
||||
border-right: 1rpx solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
.nav-list-wrapper {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 50rpx auto 40rpx;
|
||||
width: 680rpx;
|
||||
height: 170rpx;
|
||||
border-radius: 32rpx;
|
||||
background-color: #fff;
|
||||
|
||||
view {
|
||||
width: 170rpx;
|
||||
height: 170rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
margin-bottom: 10rpx;
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
|
||||
text {
|
||||
color: rgba(63, 63, 63, 1);
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.stat-card {
|
||||
margin: 40rpx auto;
|
||||
margin-top: 120rpx;
|
||||
width: 680rpx;
|
||||
min-height: 656rpx;
|
||||
border-radius: 32rpx;
|
||||
background-color: #fff;
|
||||
border: .1rpx solid transparent;
|
||||
|
||||
.time-wrapper {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 30rpx auto;
|
||||
width: 620rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 20rpx;
|
||||
background: linear-gradient(270deg, rgba(35, 143, 252, 0.1) 0%, rgba(26, 102, 255, 0.1) 100%);
|
||||
|
||||
.time-item {
|
||||
width: 153.5rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 20rpx;
|
||||
color: rgb(89, 134, 179);
|
||||
}
|
||||
|
||||
.time-selected {
|
||||
background: linear-gradient(270deg, rgb(35, 143, 252) 0%, rgb(26, 102, 255) 100%);
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.time-selection {
|
||||
height: 100rpx;
|
||||
white-space: nowrap;
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.selection-main {
|
||||
height: auto;
|
||||
margin: 0 10rpx 0 20rpx;
|
||||
font-size: 30rpx;
|
||||
color: rgb(0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.time-custom {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 60rpx;
|
||||
}
|
||||
|
||||
.member-consume {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding-bottom: 50rpx;
|
||||
box-shadow: 0 50rpx 70rpx -60rpx rgba(107, 130, 153, 0.2);
|
||||
|
||||
.num {
|
||||
margin-top: 50rpx;
|
||||
color: rgb(41, 128, 253);
|
||||
font-size: 60rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
margin-top: 10rpx;
|
||||
color: rgb(166, 166, 166);
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.stat-card-info {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
padding: 25rpx;
|
||||
|
||||
.stat-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 25rpx 0;
|
||||
width: 210rpx;
|
||||
height: 82rpx;
|
||||
|
||||
.stat-num {
|
||||
margin-bottom: 10rpx;
|
||||
color: rgb(0, 0, 0);
|
||||
font-size: 30rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.stat-title {
|
||||
color: rgb(166, 166, 166);
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.switch-wrapper {
|
||||
margin: 40rpx auto 0;
|
||||
width: 680rpx;
|
||||
height: 330rpx;
|
||||
border-radius: 32rpx;
|
||||
background: #ffffffff;
|
||||
|
||||
.switch-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 10rpx 0 30rpx;
|
||||
height: 110rpx;
|
||||
}
|
||||
|
||||
.switch-item:nth-child(2) {
|
||||
border-bottom: 1rpx solid rgba(0, 0, 0, 0.06);
|
||||
border-top: 1rpx solid rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
}
|
||||
|
||||
.max-amount {
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,108 @@
|
||||
<template>
|
||||
<uni-popup ref="popup" type="center" mask-background-color="rgba(0,0,0,.5)">
|
||||
<view class="psw-wrapper">
|
||||
<view class="psw-top">
|
||||
<view class="close-wrapper">
|
||||
<view class="psw-close" @tap="close">
|
||||
<image src="/static/iconImg/icon-x.svg"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="psw-title">请输入支付密码</view>
|
||||
<view class="sub-tips">会员调账</view>
|
||||
<view class="amount">{{ vdata.amount }}</view>
|
||||
</view>
|
||||
<view class="psw-input">
|
||||
<JPasswordInput ref="refPswInput" margin="0 20px" @inputChange="inputChange" />
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted } from "vue"
|
||||
import infoBox from '@/commons/utils/infoBox.js';
|
||||
import { $memberManual } from "@/http/apiManager"
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import { Base64 } from "js-base64";
|
||||
const refPswInput = ref(null)
|
||||
const popup = ref(null)
|
||||
const vdata = reactive({})
|
||||
const open = (val) => {
|
||||
val.addOrRedUce
|
||||
vdata.amount = val.addOrRedUce == 'add' ? '+' + val.num : '-' + val.num
|
||||
vdata.memberId = val.mbrId
|
||||
popup.value.open()
|
||||
}
|
||||
const close = () => popup.value.close()
|
||||
|
||||
const inputChange = (e) => {
|
||||
if (e.length >= 6) return manual(e)
|
||||
}
|
||||
const manual = (pswd) => {
|
||||
$memberManual({ memberId: vdata.memberId, changeAmount: vdata.amount, currentPassword: Base64.encode(pswd) }).then(res => {
|
||||
infoBox.showToast('调账成功').then(r => {
|
||||
close()
|
||||
emit.pageEmit(emit.ENAME_REF_MEMBER_LIST) // 更新列表
|
||||
go.back(1, emit.ENAME_REF_MEMBER_DETAIL) // 返回详情 && 更新详情
|
||||
})
|
||||
}).catch(err => {
|
||||
refPswInput.value.clearInput()
|
||||
})
|
||||
}
|
||||
defineExpose({ open })
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.psw-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
justify-content: space-between;
|
||||
width: 650rpx;
|
||||
height: 496rpx;
|
||||
border-radius: 32rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.psw-title {
|
||||
text-align: center;
|
||||
color: #000000ff;
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.close-wrapper {
|
||||
.psw-close {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 106rpx;
|
||||
height: 106rpx;
|
||||
|
||||
image {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.psw-input {
|
||||
margin-bottom: 50rpx;
|
||||
width: 650rpx;
|
||||
}
|
||||
|
||||
.sub-tips {
|
||||
margin: 30rpx 0 20rpx 0;
|
||||
color: #808080ff;
|
||||
font-size: 30rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.amount {
|
||||
text-align: center;
|
||||
color: #000000ff;
|
||||
font-size: 50rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
180
jeepay-ui-uapp-merchant/pageRed/red/member/detail.vue
Normal file
180
jeepay-ui-uapp-merchant/pageRed/red/member/detail.vue
Normal file
@@ -0,0 +1,180 @@
|
||||
<template>
|
||||
<JeepayBackground :bgColorStyle="{}">
|
||||
|
||||
<JeepayCustomNavbar textColor="#fff"
|
||||
bgDefaultColor="linear-gradient(270deg, rgba(72, 192, 255, 1) 0%, rgba(51, 157, 255, 1) 100%)" title="会员详情"
|
||||
backCtrl="back" />
|
||||
<JeepayTableListItem viewClass="list-item-by-detail" :logo="vdata.record.avatarUrl" :title="vdata.record.mbrName"
|
||||
:subtitle="vdata.record.mbrTel" :moreBtnList="list" :logoStyle="{ borderRadius: '50%' }" />
|
||||
|
||||
<!-- 账户金额 -->
|
||||
<JeepayCard :viewStyle="{ marginTop: '50rpx' }">
|
||||
<view class="pay-wrapper">
|
||||
<view>
|
||||
<JeepayDescviewItem title="账户余额 (元)" />
|
||||
<view class="pay-amount">{{ (vdata.record.balance / 100).toFixed(2) }}</view>
|
||||
</view>
|
||||
<view class="pay-shift" @tap="toManual">调账
|
||||
<image src="/static/member/member-arrow.svg"></image>
|
||||
</view>
|
||||
</view>
|
||||
</JeepayCard>
|
||||
<JeepayCard viewStyle="margin-top: 50rpx" editText="编辑信息"
|
||||
@editTap="go.to('PAGES_MEMBER_EDIT', { mbrId: vdata.record.mbrId })">
|
||||
<JeepayDescview>
|
||||
<JeepayDescviewItem title="会员编号" :desc="vdata.record.mbrId" />
|
||||
<JeepayDescviewItem title="会员备注" :desc="vdata.record.remark ? vdata.record.remark : '-'" />
|
||||
<JeepayDescviewItem title="创建时间" :desc="vdata.record.createdAt" />
|
||||
</JeepayDescview>
|
||||
</JeepayCard>
|
||||
|
||||
<JeepayCard viewStyle="margin-top: 40rpx">
|
||||
<JeepayTableListItem v-if="ent.has('ENT_MEMBER_EDIT')" title="会员状态" subtitle="状态禁用后，该会员将无法使用">
|
||||
<template #titleRight>
|
||||
<JeepayStateSwitch v-model:state="vdata.record.state" :showSwitchType="true"
|
||||
:updateStateFunc="updateStateFunc" />
|
||||
</template>
|
||||
</JeepayTableListItem>
|
||||
|
||||
</JeepayCard>
|
||||
|
||||
<JSinglePopup ref="single" :list="list" activeColor="#FF5B4C" />
|
||||
<JeepayPopupConfirm ref="jeepayPopupConfirmRef" />
|
||||
</JeepayBackground>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import { onLoad, onUnload } from '@dcloudio/uni-app'
|
||||
import { reqLoad, API_URL_MEMBERS } from '@/http/apiManager.js'
|
||||
import infoBox from '@/commons/utils/infoBox.js';
|
||||
import go from '@/commons/utils/go.js'
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
import ent from '@/commons/utils/ent.js'
|
||||
|
||||
const single = ref()
|
||||
const jeepayPopupConfirmRef = ref()
|
||||
|
||||
const list = reactive([
|
||||
{ label: '调账', value: 'delete', fun: toManual },
|
||||
])
|
||||
|
||||
onLoad((options) => {
|
||||
refData(options.mbrId)
|
||||
})
|
||||
|
||||
const vdata = reactive({
|
||||
record: {}
|
||||
})
|
||||
|
||||
// 监听 更新事件
|
||||
onUnload(() => uni.$off(emit.ENAME_REF_MEMBER_DETAIL))
|
||||
uni.$on(emit.ENAME_REF_MEMBER_DETAIL, function (data) {
|
||||
refData(vdata.record.mbrId)
|
||||
})
|
||||
|
||||
function refData (mbrId) {
|
||||
reqLoad.getById(API_URL_MEMBERS, mbrId).then(({ bizData }) => {
|
||||
vdata.record = bizData
|
||||
})
|
||||
}
|
||||
|
||||
function updateStateFunc (state) {
|
||||
return reqLoad.updateById(API_URL_MEMBERS, vdata.record.mbrId, { state: state }).then(() => {
|
||||
emit.pageEmit(emit.ENAME_REF_MEMBER_LIST)
|
||||
infoBox.showSuccessToast("修改成功");
|
||||
})
|
||||
}
|
||||
|
||||
function toManual () {
|
||||
go.to('PAGES_MEMBER_RECHARGE_MEMBERMANUAL', { mbrId: vdata.record.mbrId })
|
||||
}
|
||||
|
||||
function deleteFunc () {
|
||||
return reqLoad.delById(API_URL_MEMBERS, vdata.record.mbrId).then(() => {
|
||||
infoBox.showSuccessToast("删除成功");
|
||||
go.back(1, emit.ENAME_REF_MEMBER_LIST) // 返回页面 && 更新
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.sex-info-text {
|
||||
image {
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.sta-info {
|
||||
display: flex;
|
||||
margin-top: 50rpx;
|
||||
padding: 0 50rpx;
|
||||
|
||||
.sta-photo {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 50%;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.info-main {
|
||||
flex: 1;
|
||||
margin-left: 30rpx;
|
||||
color: #fff;
|
||||
|
||||
.info-name {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-size: 33rpx;
|
||||
font-weight: 400;
|
||||
|
||||
image {
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.info-phone {
|
||||
margin-top: 16rpx;
|
||||
color: rgba(251, 252, 253, 0.7);
|
||||
font-size: 25rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pay-wrapper {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.pay-amount {
|
||||
margin: 40rpx;
|
||||
color: #000000ff;
|
||||
font-size: 50rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.pay-shift {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #2980fdff;
|
||||
font-size: 33rpx;
|
||||
|
||||
image {
|
||||
margin-right: 40rpx;
|
||||
width: 44rpx;
|
||||
height: 44rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
129
jeepay-ui-uapp-merchant/pageRed/red/member/edit.vue
Normal file
129
jeepay-ui-uapp-merchant/pageRed/red/member/edit.vue
Normal file
@@ -0,0 +1,129 @@
|
||||
<template>
|
||||
<JeepayBackground>
|
||||
<view class="page-wrapper jeepay-edit-form">
|
||||
<JeepayCustomNavbar :title="vdata.mbrId ? '修改会员信息' : '创建会员' " backCtrl="back" />
|
||||
<uni-forms ref="formRef" :rules="rules" :model="vdata.formData" :label-width="140">
|
||||
|
||||
<uni-forms-item required label="会员名称" name="mbrName">
|
||||
<uni-easyinput v-model="vdata.formData.mbrName" placeholder="请输入会员名称" :inputBorder="false"></uni-easyinput>
|
||||
</uni-forms-item>
|
||||
|
||||
<uni-forms-item required label="手机号" name="mbrTel">
|
||||
<text v-if="vdata.mbrId">{{ vdata.formData.mbrTel }}</text>
|
||||
<uni-easyinput v-else v-model="vdata.formData.mbrTel" placeholder="请输入手机号" :inputBorder="false"></uni-easyinput>
|
||||
</uni-forms-item>
|
||||
|
||||
<JeepayTableListItem v-if="vdata.mbrId" title="状态" subtitle="状态禁用后，会员将无法支付">
|
||||
<template #titleRight>
|
||||
<JeepayStateSwitch v-model:state="vdata.formData.state" :showSwitchType="true" :confirm='false' />
|
||||
</template>
|
||||
</JeepayTableListItem>
|
||||
|
||||
<uni-forms-item required label="备注" name="remark">
|
||||
<uni-easyinput v-model="vdata.formData.remark" placeholder="请输入备注" :inputBorder="false"></uni-easyinput>
|
||||
</uni-forms-item>
|
||||
|
||||
</uni-forms>
|
||||
|
||||
<view class="confirm-wrapper">
|
||||
<view class="confirm-button flex-center" hover-class="touch-button" @tap="confirmFunc"> {{ vdata.mbrId ? '确认修改' : '确认创建' }}</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</JeepayBackground>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { reqLoad, API_URL_MEMBERS } from '@/http/apiManager.js'
|
||||
import infoBox from '@/commons/utils/infoBox.js';
|
||||
import go from '@/commons/utils/go.js'
|
||||
import formUtil from '@/commons/utils/formUtil.js'
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
|
||||
const formRef = ref()
|
||||
|
||||
onLoad((options) => {
|
||||
|
||||
// 修改页面
|
||||
if(options.mbrId){
|
||||
vdata.mbrId = options.mbrId
|
||||
reqLoad.getById(API_URL_MEMBERS, vdata.mbrId).then(({bizData}) => {
|
||||
vdata.formData = bizData
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
|
||||
const rules = {
|
||||
mbrName: {
|
||||
rules:[ formUtil.rules.requiredInput() ],
|
||||
},
|
||||
mbrTel: {
|
||||
rules:[ formUtil.rules.requiredInput(), formUtil.rules.patternRule('联系人电话', formUtil.regexp.mobile) ],
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
const vdata = reactive({
|
||||
|
||||
mbrId: null, // 新建 or 修改
|
||||
|
||||
// 表单数据
|
||||
formData: {
|
||||
state: 1
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
function confirmFunc(){
|
||||
|
||||
formUtil.validate(formRef.value).then(() => {
|
||||
return reqLoad.addOrUpdate(vdata.mbrId, API_URL_MEMBERS, vdata.formData)
|
||||
})
|
||||
.then(( {bizData} ) => {
|
||||
emit.pageEmit(emit.ENAME_REF_MEMBER_LIST) // 更新列表
|
||||
go.back(1, emit.ENAME_REF_MEMBER_DETAIL) // 返回详情 && 更新详情
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
input {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
.f-label {
|
||||
width: 240rpx;
|
||||
}
|
||||
.selected-sex {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
margin-top: 45rpx;
|
||||
margin-bottom: 10rpx;
|
||||
font-size: 32rpx;
|
||||
color: #b3b3b3;
|
||||
image {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
margin-top: -40rpx;
|
||||
}
|
||||
.selected-box {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
.confirm-wrapper {
|
||||
padding: 50rpx 30rpx;
|
||||
.confirm-button {
|
||||
height: 110rpx;
|
||||
color: #fff;
|
||||
border-radius: 20rpx;
|
||||
background: $jeepay-bg-primary;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
116
jeepay-ui-uapp-merchant/pageRed/red/member/member.vue
Normal file
116
jeepay-ui-uapp-merchant/pageRed/red/member/member.vue
Normal file
@@ -0,0 +1,116 @@
|
||||
<template>
|
||||
<view class="page-wrapper">
|
||||
<JeepayCustomNavbar title="顾客管理" backCtrl="back" />
|
||||
<view class="sta-input" @tap="go.toSearchPage('member')">
|
||||
<view class="input-main">
|
||||
<image src="/static/iconImg/icon-search.svg" mode="scaleToFill" />
|
||||
搜索会员名称、手机号
|
||||
</view>
|
||||
<!-- <image class="icon-more" src="/static/iconImg/icon-more.svg" mode="scaleToFill" /> -->
|
||||
</view>
|
||||
|
||||
|
||||
<JeepayTableList ref="jeepayTableListRef" :reqTableDataFunc="reqTableDataFunc">
|
||||
<template #tableBody="{ record }">
|
||||
<RedUserRender :record="record" />
|
||||
</template>
|
||||
</JeepayTableList>
|
||||
<!--
|
||||
<view class="footer-wrapper">
|
||||
<view class="footer-button footer-button-style">
|
||||
<button hover-class="hover-button" hover-stay-time="150" class="flex-center" @tap="createMember">创建会员</button>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
|
||||
<JeepayPopupConfirm ref="jeepayPopupConfirmRef" />
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<script setup>
|
||||
import { nextTick, reactive, ref } from "vue"
|
||||
import { onReachBottom, onShow, onUnload } from '@dcloudio/uni-app'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
import { reqLoad, API_URL_MCH_REF_PACKET_USER_LIST } from "@/http/apiManager.js"
|
||||
import RedUserRender from '@/pageRed/list/render/RedUserRender.vue'
|
||||
|
||||
const jeepayTableListRef = ref()
|
||||
const jeepayPopupConfirmRef = ref()
|
||||
|
||||
onReachBottom(() => { })
|
||||
|
||||
// // 监听 更新事件
|
||||
onUnload(() => uni.$off(emit.API_URL_MCH_REF_PACKET_USER_LIST))
|
||||
uni.$on(emit.API_URL_MCH_REF_PACKET_USER_LIST, function(data){
|
||||
jeepayTableListRef.value.refTable(true)
|
||||
})
|
||||
|
||||
// 请求
|
||||
function reqTableDataFunc (params) {
|
||||
return reqLoad.list(API_URL_MCH_REF_PACKET_USER_LIST, params)
|
||||
}
|
||||
|
||||
|
||||
// 创建会员
|
||||
const createMember = () => {
|
||||
go.to("PAGES_MEMBER_EDIT")
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.sta-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
height: 110rpx;
|
||||
background-color: $J-bg-ff;
|
||||
.input-main {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 70rpx;
|
||||
background-color: $J-bg-f5;
|
||||
border-radius: $J-b-r12;
|
||||
color: rgba(0, 0, 0, 0.35);
|
||||
font-size: 27rpx;
|
||||
font-weight: 400;
|
||||
image {
|
||||
padding: 22rpx;
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
}
|
||||
}
|
||||
.icon-more {
|
||||
margin-left: 30rpx;
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
}
|
||||
.footer-wrapper {
|
||||
height: 170rpx;
|
||||
background-color: transparent;
|
||||
.footer-button {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 30rpx;
|
||||
button {
|
||||
height: 110rpx;
|
||||
font-size: 33rpx;
|
||||
font-weight: 500;
|
||||
color: $J-color-tff;
|
||||
border-radius: 20rpx;
|
||||
background: $jeepay-bg-primary;
|
||||
}
|
||||
.hover-button {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
195
jeepay-ui-uapp-merchant/pageRed/red/member/memberManual.vue
Normal file
195
jeepay-ui-uapp-merchant/pageRed/red/member/memberManual.vue
Normal file
@@ -0,0 +1,195 @@
|
||||
<template>
|
||||
<view class="page-wrapper">
|
||||
<view class="member-header">
|
||||
<view class="left">
|
||||
<view class="top-title">会员当前余额 (元)</view>
|
||||
<view class="member-amount">{{ (vdata.balance / 100).toFixed(2) }}</view>
|
||||
</view>
|
||||
<image :src="vdata.avatarUrl" class="member-photo"></image>
|
||||
</view>
|
||||
<view class="m-wrapper" @tap="openAddOrRed">
|
||||
<view class="left">
|
||||
<view class="sub-title">调账方式</view>
|
||||
<view class="m-type">{{ vdata.addOrRedUce == 'add' ? '加款' : '减款' }} </view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<image src="/static/iconImg/icon-arrow-right.svg" class="member-photo"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="m-wrapper m-amout">
|
||||
<view class="left">
|
||||
<view class="sub-title">调账金额</view>
|
||||
<input class="m-input" type="digit" v-model="vdata.num" placeholder="请输入调账金额" @input="inputChange">
|
||||
</view>
|
||||
<view class="right">
|
||||
元
|
||||
</view>
|
||||
</view>
|
||||
<view class="ba-wrapper">
|
||||
<view class="sub-title">调账后金额</view>
|
||||
<view class="m-balance">￥{{ (vdata.manualAmount / 100).toFixed(2) }}</view>
|
||||
</view>
|
||||
<view class="but-wrapper">
|
||||
<Button @tap="openManual">确认调账</Button>
|
||||
</view>
|
||||
</view>
|
||||
<ConfirmManual ref="refManual" />
|
||||
<JSinglePopup :list="list" ref="refSingle" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive } from "vue"
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import ConfirmManual from "./conponents/ConfirmManual.vue"
|
||||
import { $memberManual, reqLoad, API_URL_MEMBERS } from "@/http/apiManager"
|
||||
import infoBox from '@/commons/utils/infoBox.js';
|
||||
onLoad((options) => {
|
||||
getMemberInfos(options.mbrId)
|
||||
})
|
||||
const vdata = reactive({})
|
||||
const refSingle = ref(null)
|
||||
const refManual = ref(null)
|
||||
const list = [
|
||||
{
|
||||
label: '加款', value: 'add', fun: () => {
|
||||
vdata.addOrRedUce = 'add'
|
||||
if (vdata.num) return vdata.manualAmount = (vdata.balance * 1 + vdata.num * 100)// 隐式转换后 在进行加法运算
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '减款', value: 'reduce', fun: () => {
|
||||
vdata.addOrRedUce = 'reduce'
|
||||
if (vdata.num) return vdata.manualAmount = (vdata.balance - vdata.num * 100)
|
||||
}
|
||||
},
|
||||
]
|
||||
const styles = {
|
||||
backgroundColor: 'transparent',
|
||||
color: '#000',
|
||||
fontSize: '32rpx',
|
||||
}
|
||||
function getMemberInfos (mbrId) {
|
||||
reqLoad.getById(API_URL_MEMBERS, mbrId).then(({ bizData }) => {
|
||||
Object.assign(vdata, bizData)
|
||||
vdata.manualAmount = bizData.balance
|
||||
vdata.addOrRedUce = 'add' //赋值初始值 加款
|
||||
})
|
||||
}
|
||||
const openAddOrRed = () => {
|
||||
refSingle.value.open()
|
||||
}
|
||||
const inputChange = (e) => {
|
||||
if (vdata.addOrRedUce == 'add') {
|
||||
vdata.manualAmount = (vdata.balance * 1 + vdata.num * 100)// 隐式转换后 在进行加法运算
|
||||
return
|
||||
}
|
||||
return vdata.manualAmount = (vdata.balance - vdata.num * 100)
|
||||
}
|
||||
const REG_AMOUNT = /^([0-9]{1}|^[1-9]{1}\d{1,15})(\.\d{1,2})?$/
|
||||
const openManual = () => {
|
||||
if (vdata.num <= 0) return infoBox.showToast('调账金额 不能为零')
|
||||
if (!REG_AMOUNT.test(vdata.num)) return infoBox.showToast('请输入正数金额 保留两位小数')
|
||||
refManual.value.open(vdata)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page-wrapper {
|
||||
background-color: #fff !important;
|
||||
min-height: 100vh;
|
||||
|
||||
.sub-title {
|
||||
color: #4c4c4cff;
|
||||
font-size: 30rpx;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.member-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 35rpx;
|
||||
padding-bottom: 50rpx;
|
||||
border-bottom: 1rpx solid #0000000f;
|
||||
|
||||
.top-title {
|
||||
color: #808080ff;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.member-amount {
|
||||
margin-top: 20rpx;
|
||||
color: #000000ff;
|
||||
font-size: 50rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.m-wrapper {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin: 0 auto;
|
||||
width: 680rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 32rpx;
|
||||
opacity: 1;
|
||||
background: #f7f7f7ff;
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
margin-left: 40rpx;
|
||||
|
||||
.m-type {
|
||||
margin-left: 78rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
image {
|
||||
width: 108rpx;
|
||||
height: 120rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.m-amout {
|
||||
margin-top: 30rpx;
|
||||
|
||||
.m-input {
|
||||
margin-left: 78rpx;
|
||||
}
|
||||
|
||||
.right {
|
||||
margin-right: 40rpx;
|
||||
color: #00000080;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.ba-wrapper {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 50rpx auto;
|
||||
width: 600rpx;
|
||||
|
||||
.m-balance {
|
||||
color: #000000ff;
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.but-wrapper {
|
||||
margin: 105rpx auto;
|
||||
width: 400rpx;
|
||||
}
|
||||
</style>
|
||||
114
jeepay-ui-uapp-merchant/pageRed/red/rechargeRecord/index.vue
Normal file
114
jeepay-ui-uapp-merchant/pageRed/red/rechargeRecord/index.vue
Normal file
@@ -0,0 +1,114 @@
|
||||
<template>
|
||||
<view class="page-wrapper">
|
||||
<JeepayCustomNavbar title="红包记录" backCtrl="back" />
|
||||
|
||||
<!-- 搜索 -->
|
||||
<JSearchTitle place="搜索流水号、店铺ID" @click="go.toSearchPage('redRechargeRecord')">
|
||||
<template #right>
|
||||
<JeepaySearchSelect v-model:bizType="vdata.searchData.type" :list="vdata.searchParamsList" title="按变动类型筛选" @change="refTable"/>
|
||||
</template>
|
||||
</JSearchTitle>
|
||||
|
||||
<!-- 数据列表 -->
|
||||
<JeepayTableList ref="jeepayTableListRef" :searchData="vdata.searchData" :reqTableDataFunc="reqTableDataFunc">
|
||||
<template #tableBody="{ record }">
|
||||
<RedRechargeRecordRender :record="record" />
|
||||
</template>
|
||||
</JeepayTableList>
|
||||
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<script setup>
|
||||
import { nextTick, reactive, ref } from "vue"
|
||||
import { onReachBottom, onShow, onUnload } from '@dcloudio/uni-app'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
import { reqLoad, API_URL_MCH_REF_PACKET_CHANGE } from "@/http/apiManager.js"
|
||||
import RedRechargeRecordRender from '@/pageRed/list/render/RedRechargeRecordRender.vue'
|
||||
|
||||
const jeepayTableListRef = ref()
|
||||
|
||||
onReachBottom(() => { })
|
||||
|
||||
const vdata = reactive({
|
||||
searchData: { type: '' },
|
||||
searchParamsList: [
|
||||
{ label: '全部类型', value: '' },
|
||||
{ label: '下单奖励', value: '1' },
|
||||
{ label: '消费退款', value: '2' },
|
||||
]
|
||||
})
|
||||
|
||||
// // 监听 更新事件
|
||||
onUnload(() => uni.$off(emit.ENT_REDPACKET_CHANGE_LIST))
|
||||
uni.$on(emit.ENT_REDPACKET_CHANGE_LIST, function(data){
|
||||
jeepayTableListRef.value.refTable(true)
|
||||
})
|
||||
|
||||
function refTable (e) {
|
||||
jeepayTableListRef.value.refTable(true)
|
||||
}
|
||||
|
||||
// 请求
|
||||
function reqTableDataFunc (params) {
|
||||
return reqLoad.list(API_URL_MCH_REF_PACKET_CHANGE, params)
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.sta-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
height: 110rpx;
|
||||
background-color: $J-bg-ff;
|
||||
.input-main {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 70rpx;
|
||||
background-color: $J-bg-f5;
|
||||
border-radius: $J-b-r12;
|
||||
color: rgba(0, 0, 0, 0.35);
|
||||
font-size: 27rpx;
|
||||
font-weight: 400;
|
||||
image {
|
||||
padding: 22rpx;
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
}
|
||||
}
|
||||
.icon-more {
|
||||
margin-left: 30rpx;
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
}
|
||||
.footer-wrapper {
|
||||
height: 170rpx;
|
||||
background-color: transparent;
|
||||
.footer-button {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 30rpx;
|
||||
button {
|
||||
height: 110rpx;
|
||||
font-size: 33rpx;
|
||||
font-weight: 500;
|
||||
color: $J-color-tff;
|
||||
border-radius: 20rpx;
|
||||
background: $jeepay-bg-primary;
|
||||
}
|
||||
.hover-button {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
411
jeepay-ui-uapp-merchant/pageRed/red/rechargeRule/edit.vue
Normal file
411
jeepay-ui-uapp-merchant/pageRed/red/rechargeRule/edit.vue
Normal file
@@ -0,0 +1,411 @@
|
||||
<template>
|
||||
<JeepayBackground>
|
||||
<view class="page-wrapper jeepay-edit-form">
|
||||
<JeepayCustomNavbar :title="vdata.ruleId ? '修改红包规则' : '创建红包规则' " backCtrl="back" />
|
||||
<view class="hb_mian">
|
||||
<uni-forms ref="formRef" :rules="rules" :model="vdata.formData" :label-width="130">
|
||||
|
||||
<uni-forms-item required label="红包类型" name="packetType">
|
||||
<JeepayRadioPopupView label="请选择红包类型" v-model:value="vdata.formData.packetType"
|
||||
:list="[{ label: '门店专享', value: 1}]">
|
||||
</JeepayRadioPopupView>
|
||||
</uni-forms-item>
|
||||
|
||||
<uni-forms-item required label="营销折扣比例" name="marketing">
|
||||
<JeepayRadioPopupView label="请选择营销折扣比例" v-model:value="vdata.formData.marketing"
|
||||
:list="vdata.marketingList" @change="getMarketingList">
|
||||
</JeepayRadioPopupView>
|
||||
</uni-forms-item>
|
||||
|
||||
<uni-forms-item required label="平台补贴比例" name="marketScale">
|
||||
<uni-easyinput v-model="vdata.formData.marketScale" class="p-box" :disabled="true"
|
||||
placeholder="请选择营销折扣比例" :inputBorder="false"></uni-easyinput>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item required label="顾客获得红包比例" name="userPerkScale">
|
||||
<uni-easyinput v-model="vdata.formData.userPerkScale" class="p-box" :disabled="true"
|
||||
placeholder="请选择营销折扣比例" :inputBorder="false"></uni-easyinput>
|
||||
</uni-forms-item>
|
||||
|
||||
<uni-forms-item required label="领取红包后有效期" name="expireNumber">
|
||||
<JeepayRadioPopupView label="请选择领取红包后有效期" v-model:value="vdata.formData.expireNumber"
|
||||
:list="vdata.receiveList">
|
||||
</JeepayRadioPopupView>
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- <JeepayTableListItem title="将规则配置到门店" class="configurationBtn">
|
||||
<template #titleRight>
|
||||
<JeepayStateSwitch v-model:state="vdata.formData.state" :showSwitchType="true"
|
||||
:confirm='false' />
|
||||
</template>
|
||||
</JeepayTableListItem> -->
|
||||
|
||||
<uni-forms-item required label="将规则配置到门店" name="receivered">
|
||||
<JeepayRadioPopupView label="请选择配置到门店" v-model:value="vdata.formData.configType"
|
||||
:list="[{ label: '配置到所有门店', value: 1},{ label: '配置到指定门店', value: 2}]"
|
||||
@change="getStoreList">
|
||||
</JeepayRadioPopupView>
|
||||
<!-- <view class="store-name" @tap="selectedStore"></view> -->
|
||||
</uni-forms-item>
|
||||
|
||||
|
||||
|
||||
<JeepayTableListItem v-show="false" title="状态" subtitle="状态禁用后，规则将无法使用" class="configurationBtn">
|
||||
<template #titleRight>
|
||||
<JeepayStateSwitch v-model:state="vdata.formData.state" :showSwitchType="true"
|
||||
:confirm='false' />
|
||||
</template>
|
||||
</JeepayTableListItem>
|
||||
|
||||
|
||||
</uni-forms>
|
||||
</view>
|
||||
<view class="confirm-wrapper" style="position: fixed;bottom: 40rpx;width: 92%;">
|
||||
<view class="confirm-button flex-center" hover-class="touch-button" @tap="confirmFunc">
|
||||
{{ vdata.ruleId ? '确认修改' : '确认创建' }}</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</JeepayBackground>
|
||||
|
||||
<JeepayBizinfoSelect @confirmData="confirmData" :params="vdata.params" :isShowAllBiz="false" :isCheckbox="vdata.isCheckbox" :configMode="red" ref="jeepayPopupListSelect" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
reactive,
|
||||
ref
|
||||
} from 'vue'
|
||||
import {
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app'
|
||||
import {
|
||||
reqLoad,
|
||||
API_URL_MCH_REF_PACKET_RULE_QUERY,
|
||||
API_URL_MCH_REF_PACKET_RULE_EDIT,
|
||||
API_URL_MCH_REF_PACKET_RULE_LIST,
|
||||
API_URL_MCH_REF_PACKET_RULE_ADD
|
||||
} from '@/http/apiManager.js';
|
||||
import infoBox from '@/commons/utils/infoBox.js';
|
||||
import go from '@/commons/utils/go.js'
|
||||
import formUtil from '@/commons/utils/formUtil.js'
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
|
||||
const formRef = ref()
|
||||
const jeepayPopupListSelect = ref(null)
|
||||
|
||||
|
||||
|
||||
const vdata = reactive({
|
||||
// receiveList:["1","2","3","4","5","6"],
|
||||
receiveList: [{
|
||||
label: '1个月',
|
||||
value: 1
|
||||
}, {
|
||||
label: '2个月',
|
||||
value: 2
|
||||
}, {
|
||||
label: '3个月',
|
||||
value: 3
|
||||
}, {
|
||||
label: '4个月',
|
||||
value: 4
|
||||
}, {
|
||||
label: '5个月',
|
||||
value: 5
|
||||
}, {
|
||||
label: '6个月',
|
||||
value: 6
|
||||
}],
|
||||
marketingList: [{
|
||||
label: '98折',
|
||||
value: '0'
|
||||
}, {
|
||||
label: '95折',
|
||||
value: '1'
|
||||
}, {
|
||||
label: '9折',
|
||||
value: '2'
|
||||
}, {
|
||||
label: '85折',
|
||||
value: '3'
|
||||
}, {
|
||||
label: '8折',
|
||||
value: '4'
|
||||
}],
|
||||
platformList: ['97', '93', '85', '8', '7'],
|
||||
userList: ['4', '10', '20', '30', '50'],
|
||||
ruleId: null, // 新建 or 修改
|
||||
|
||||
// 表单数据
|
||||
formData: {
|
||||
state: 1,
|
||||
storeIdList:[],
|
||||
},
|
||||
confirmFormData:{},
|
||||
isCheckbox:false,
|
||||
params:null,
|
||||
})
|
||||
|
||||
onLoad((options) => {
|
||||
console.log(options,'options')
|
||||
// 修改页面
|
||||
if (options.ruleId) {
|
||||
vdata.ruleId = options.ruleId
|
||||
console.log(vdata.ruleId,'vdata.ruleId')
|
||||
reqLoad.getById(API_URL_MCH_REF_PACKET_RULE_QUERY, vdata.ruleId).then(({
|
||||
bizData
|
||||
}) => {
|
||||
console.log(bizData);
|
||||
vdata.formData = bizData
|
||||
// vdata.formData.marketScale = bizData.platScale+"折"
|
||||
let marketScale = bizData.marketScale+"折"
|
||||
console.log(marketScale);
|
||||
vdata.marketingList.map((item)=>{
|
||||
console.log(item.label);
|
||||
if(item.label==marketScale){
|
||||
vdata.formData.marketing = item.value
|
||||
}
|
||||
})
|
||||
vdata.formData.marketScale = bizData.platScale+"折"
|
||||
vdata.formData.storeIdList=[]
|
||||
if(bizData.storeId){
|
||||
vdata.formData.configType= 2
|
||||
// vdata.params={
|
||||
// bizType:"mchApp",
|
||||
// storeId:bizData.storeId,
|
||||
// }
|
||||
}else{
|
||||
vdata.formData.configType= 1
|
||||
}
|
||||
vdata.formData.storeIdList.push(bizData.storeId)
|
||||
vdata.formData.platScale = bizData.platScale+"折"
|
||||
vdata.formData.userPerkScale =Number(bizData.userPerkScale)*100+"%"
|
||||
vdata.formData.rechargeAmount = cal.cert2Dollar(vdata.formData.rechargeAmount)
|
||||
vdata.formData.giveAmount = cal.cert2Dollar(vdata.formData.giveAmount)
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
|
||||
const rules = {
|
||||
rechargeAmount: {
|
||||
rules: [formUtil.rules.requiredInput('充值金额')]
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function confirmData(data){
|
||||
vdata.formData.storeIdList=[]
|
||||
if(data){
|
||||
data.map((item=>{
|
||||
vdata.formData.storeIdList.push(item.storeId)
|
||||
}))
|
||||
}
|
||||
console.log(vdata.formData);
|
||||
}
|
||||
|
||||
function confirmFunc() {
|
||||
console.log(vdata.formData);
|
||||
vdata.confirmFormData={
|
||||
configType:vdata.formData.configType,
|
||||
expireNumber:vdata.formData.expireNumber,
|
||||
marketScale:vdata.formData.marketScale,
|
||||
packetType:vdata.formData.packetType,
|
||||
platScale:vdata.formData.platScale,
|
||||
state:vdata.formData.state,
|
||||
storeIdList:vdata.formData.storeIdList,
|
||||
userPerkScale:vdata.formData.userPerkScale
|
||||
}
|
||||
console.log(vdata.confirmFormData);
|
||||
console.log(vdata.formData.marketing);
|
||||
//处理最后一个字
|
||||
// if(vdata.confirmFormData.marketScale){
|
||||
// vdata.confirmFormData.marketScale= Number(vdata.confirmFormData.marketScale.substring(0,vdata.confirmFormData.marketScale.length - 1))
|
||||
// }else{
|
||||
// vdata.confirmFormData.marketScale=''
|
||||
// }
|
||||
vdata.confirmFormData.marketScale =vdata.marketingList[vdata.formData.marketing].label
|
||||
vdata.confirmFormData.marketScale=Number(vdata.confirmFormData.marketScale.substring(0,vdata.confirmFormData.marketScale.length-1))
|
||||
if(vdata.confirmFormData.userPerkScale){
|
||||
vdata.confirmFormData.userPerkScale= Number(vdata.confirmFormData.userPerkScale.substring(0,vdata.confirmFormData.userPerkScale.length - 1)/100)
|
||||
}else{
|
||||
vdata.confirmFormData.userPerkScale=''
|
||||
}
|
||||
|
||||
|
||||
if(typeof vdata.confirmFormData.platScale ==="string"){
|
||||
vdata.confirmFormData.platScale=Number(vdata.confirmFormData.platScale.substring(0,vdata.confirmFormData.platScale.length - 1))
|
||||
}
|
||||
|
||||
// if(vdata.confirmFormData.platScale){
|
||||
// vdata.confirmFormData.platScale=Number(vdata.confirmFormData.platScale.substring(0,vdata.confirmFormData.platScale.length - 1))
|
||||
// }
|
||||
|
||||
vdata.marketingList.map((item)=>{
|
||||
if(item.value==vdata.confirmFormData.marketing){
|
||||
vdata.confirmFormData.marketScale=Number(item.label.substring(0,item.label.length - 1))
|
||||
}
|
||||
})
|
||||
delete vdata.confirmFormData.marketing;
|
||||
|
||||
|
||||
if(vdata.confirmFormData.configType===1){
|
||||
vdata.confirmFormData.storeIdList=[]
|
||||
}
|
||||
|
||||
if(!vdata.confirmFormData.packetType){
|
||||
return infoBox.showToast('请选择红包类型')
|
||||
}
|
||||
if(!vdata.confirmFormData.marketScale){
|
||||
return infoBox.showToast('请设置营销折扣比例')
|
||||
}
|
||||
if(!vdata.confirmFormData.expireNumber){
|
||||
return infoBox.showToast('请选择红包有效期')
|
||||
}
|
||||
if(!vdata.confirmFormData.configType){
|
||||
return infoBox.showToast('请选择规则配置')
|
||||
}
|
||||
// if (vdata.formData.rechargeAmount <= 0) return infoBox.showToast('充值金额 不能小于0')
|
||||
// const REG_AMOUNT = /^([0-9]{1}|^[1-9]{1}\d{1,15})(\.\d{1,2})?$/
|
||||
// if (!REG_AMOUNT.test(vdata.formData.rechargeAmount)) {
|
||||
// return infoBox.showToast('请输入正确的充值金额，最多两位小数')
|
||||
// }
|
||||
// if (vdata.formData.giveAmount && !REG_AMOUNT.test(vdata.formData.giveAmount)) {
|
||||
// return infoBox.showToast('请输入正确的赠送金额，不能小于0 最多保留两位小数')
|
||||
// }
|
||||
|
||||
formUtil.validate(formRef.value).then(() => {
|
||||
if(vdata.ruleId){
|
||||
vdata.confirmFormData.id = vdata.ruleId;
|
||||
return reqLoad.addOrUpdate( false, API_URL_MCH_REF_PACKET_RULE_EDIT, vdata.confirmFormData)
|
||||
}else{
|
||||
return reqLoad.addOrUpdate(false,API_URL_MCH_REF_PACKET_RULE_ADD,vdata.confirmFormData)
|
||||
}
|
||||
|
||||
})
|
||||
.then(({
|
||||
bizData
|
||||
}) => {
|
||||
go.back(1, emit.ENAME_REF_RECHARGE_RULE_LIST) // 返回页面 && 更新
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
function getMarketingList(value) {
|
||||
console.log(value, 'value');
|
||||
vdata.formData.marketScale = vdata.platformList[value]+'折'
|
||||
vdata.formData.userPerkScale = vdata.userList[value] + "%"
|
||||
vdata.formData.platScale=Number(vdata.platformList[value])
|
||||
console.log(vdata.formData.platScale);
|
||||
}
|
||||
const selectedStore = (e) => {
|
||||
console.log(e);
|
||||
jeepayPopupListSelect.value.open(vdata.store).then((selected) => {
|
||||
if (selected) {
|
||||
vdata.store = selected
|
||||
refTableFunc()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function getStoreList(e) {
|
||||
if(e===2){
|
||||
vdata.isCheckbox=true
|
||||
console.log(vdata.isCheckbox,'vdata.isCheckboxvdata.isCheckboxvdata.isCheckbox');
|
||||
}
|
||||
selectedStore()
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
input {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.f-label {
|
||||
width: 240rpx;
|
||||
}
|
||||
|
||||
.selected-sex {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
margin-top: 45rpx;
|
||||
margin-bottom: 10rpx;
|
||||
font-size: 32rpx;
|
||||
color: #b3b3b3;
|
||||
|
||||
image {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
margin-top: -40rpx;
|
||||
}
|
||||
|
||||
.selected-box {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
.confirm-wrapper {
|
||||
padding: 50rpx 30rpx;
|
||||
|
||||
.confirm-button {
|
||||
height: 110rpx;
|
||||
color: #fff;
|
||||
border-radius: 20rpx;
|
||||
background: $jeepay-bg-primary;
|
||||
}
|
||||
}
|
||||
|
||||
.p-box .uni-input-input {
|
||||
padding: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
.hb_mian{
|
||||
flex:1;
|
||||
padding: 20rpx;
|
||||
.uni-forms{
|
||||
border-radius: 20rpx;
|
||||
background: #fff;
|
||||
.uni-forms-item{
|
||||
background: none;
|
||||
padding:0 20rpx;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
.uni-forms-item__label{
|
||||
font-size: 28rpx !important;
|
||||
font-weight: 900;
|
||||
color: #000;
|
||||
text-indent: 0;
|
||||
}
|
||||
.selected-radio{
|
||||
font-size: 28rpx !important;
|
||||
}
|
||||
.uni-forms-item__content{
|
||||
font-size: 32rpx !important;
|
||||
}
|
||||
.uni-easyinput__placeholder-class{
|
||||
font-size: 28rpx !important;
|
||||
color: #b3b3b3;
|
||||
background: #fff;
|
||||
padding-right:0 !important;
|
||||
}
|
||||
.uni-easyinput__content-input{
|
||||
background: #fff !important;
|
||||
}
|
||||
}
|
||||
.configurationBtn{
|
||||
.list-item{
|
||||
padding: 0 20rpx !important;
|
||||
margin-top: 20rpx !important;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
108
jeepay-ui-uapp-merchant/pageRed/red/rechargeRule/index.vue
Normal file
108
jeepay-ui-uapp-merchant/pageRed/red/rechargeRule/index.vue
Normal file
@@ -0,0 +1,108 @@
|
||||
<template>
|
||||
<view class="page-wrapper">
|
||||
<JeepayCustomNavbar title="红包规则" backCtrl="back" />
|
||||
|
||||
<JeepayTableList ref="jeepayTableListRef" :reqTableDataFunc="reqTableDataFunc">
|
||||
<template #tableBody="{ record }">
|
||||
<RedRechargeRuleRender :record="record" />
|
||||
</template>
|
||||
</JeepayTableList>
|
||||
|
||||
<view class="footer-wrapper">
|
||||
<view class="footer-button footer-button-style">
|
||||
<button hover-class="hover-button" hover-stay-time="150" class="flex-center" @tap="create">创建红包规则</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<JeepayPopupConfirm ref="jeepayPopupConfirmRef" />
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<script setup>
|
||||
import { nextTick, reactive, ref } from "vue"
|
||||
import { onReachBottom, onShow, onUnload } from '@dcloudio/uni-app'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
import { reqLoad, API_URL_MCH_REF_PACKET_RULE_LIST } from "@/http/apiManager.js"
|
||||
import RedRechargeRuleRender from '@/pageRed/list/render/RedRechargeRuleRender.vue'
|
||||
|
||||
const jeepayTableListRef = ref()
|
||||
const jeepayPopupConfirmRef = ref()
|
||||
|
||||
onReachBottom(() => { })
|
||||
|
||||
// // 监听 更新事件
|
||||
onUnload(() => uni.$off(emit.ENAME_REF_RECHARGE_RULE_LIST))
|
||||
uni.$on(emit.ENAME_REF_RECHARGE_RULE_LIST, function(data){
|
||||
jeepayTableListRef.value.refTable(true)
|
||||
})
|
||||
|
||||
// 请求
|
||||
function reqTableDataFunc (params) {
|
||||
return reqLoad.list(API_URL_MCH_REF_PACKET_RULE_LIST, params)
|
||||
}
|
||||
|
||||
|
||||
// 创建充值规则
|
||||
const create = () => {
|
||||
go.to("PAGES_RED_RULE_EDIT")
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.sta-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
height: 110rpx;
|
||||
background-color: $J-bg-ff;
|
||||
.input-main {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 70rpx;
|
||||
background-color: $J-bg-f5;
|
||||
border-radius: $J-b-r12;
|
||||
color: rgba(0, 0, 0, 0.35);
|
||||
font-size: 27rpx;
|
||||
font-weight: 400;
|
||||
image {
|
||||
padding: 22rpx;
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
}
|
||||
}
|
||||
.icon-more {
|
||||
margin-left: 30rpx;
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
}
|
||||
.footer-wrapper {
|
||||
height: 170rpx;
|
||||
background-color: transparent;
|
||||
.footer-button {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 30rpx;
|
||||
button {
|
||||
height: 110rpx;
|
||||
font-size: 33rpx;
|
||||
font-weight: 500;
|
||||
color: $J-color-tff;
|
||||
border-radius: 20rpx;
|
||||
background: $jeepay-bg-primary;
|
||||
}
|
||||
.hover-button {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user