root/xl-root
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
多啦C梦
2025-03-17 15:47:56 +08:00
parent 9069edf952
commit 5b4a055d47
17 changed files with 783 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
src/pages/merchant/components/AddWithdrawalInformationModal.vue Normal file
View File

@@ -0,0 +1,81 @@
<script setup>
import {ref, reactive} from 'vue';
const visible = ref(false);
const state = reactive({
timer: null,
sendTimeout: 0,
});
const form = reactive({
name: null
});
const sendMessage = () => {
state.sendTimeout = 10;
state.timer = setInterval(() => {
state.sendTimeout--;
if (state.sendTimeout === 0) {
state.sendTimeout = 0;
clearInterval(state.timer);
}
}, 1000);
}
</script>
<template>
<a-button v-if="!$slots.default" @click="visible=true">添加提现信息</a-button>
<div v-else @click="visible=true">
<slot></slot>
</div>
<a-modal
title-align="start"
title="添加提现信息"
v-model:visible="visible">
<a-form>
<a-tabs type="rounded">
<a-tab-pane title="添加支付宝" key="1">
<a-form-item label="收款姓名">
<a-input v-model:model-value="form.name" placeholder="请输入收款人的姓名"></a-input>
</a-form-item>
<a-form-item label="支付宝账号">
<a-input v-model:model-value="form.name" placeholder="请输入支付宝账号"></a-input>
</a-form-item>
<a-form-item label="身份证号">
<a-input v-model:model-value="form.name" placeholder="请输入身份证号"></a-input>
</a-form-item>
<a-form-item label="手机号">
<a-input v-model:model-value="form.name" placeholder="请输入手机号"></a-input>
</a-form-item>
<a-form-item label="验证码">
<a-input v-model:model-value="form.name" placeholder="请输入验证码"></a-input>
<a-link
@click="sendMessage"
class="whitespace-nowrap ml-[16px]"
:hoverable="false">
{{ state.sendTimeout === 0 ? '获取验证码' : `请${state.sendTimeout}s后重试` }}
</a-link>
</a-form-item>
</a-tab-pane>
<a-tab-pane title="添加银行卡" key="2">
<a-form-item label="真实姓名">
<a-input v-model:model-value="form.name" placeholder="请输入真实姓名"></a-input>
</a-form-item>
<a-form-item label="身份证号">
<a-input v-model:model-value="form.name" placeholder="请输入身份证号"></a-input>
</a-form-item>
<a-form-item label="银行卡号">
<a-input v-model:model-value="form.name" placeholder="请输入银行卡号"></a-input>
</a-form-item>
<a-form-item label="手机号">
<a-input v-model:model-value="form.name" placeholder="请输入手机号"></a-input>
</a-form-item>
</a-tab-pane>
</a-tabs>
</a-form>
</a-modal>
</template>
<style scoped>
</style>

42
src/pages/merchant/components/LookWithdrawalInformationModal.vue Normal file
View File

@@ -0,0 +1,42 @@
<script setup>
import {ref} from "vue";
const visible = ref(false);
</script>
<template>
<a-button v-if="!$slots.default" @click="visible=true">立即提现</a-button>
<div v-else @click="visible=true">
<slot></slot>
</div>
<a-modal
ok-text="确认提现"
title-align="start"
title="核对提现信息"
v-model:visible="visible">
<a-form label-align="left">
<a-form-item label="姓名">
彭于晏
</a-form-item>
<a-form-item label="支付宝账号">
13505948653
</a-form-item>
<a-form-item label="提现金额">
335.14
</a-form-item>
</a-form>
<div class="info">手续费率为1%，由三方代账公司收取</div>
</a-modal>
</template>
<style lang="scss" scoped>
.info {
color: rgb(155, 159, 171);
font-size: 12px;
font-weight: 400;
line-height: 20px;
letter-spacing: 0;
text-align: left;
}
</style>

50
src/pages/merchant/pages/get-help/contact-customer-service.vue
View File

@@ -1,11 +1,59 @@
<script setup>
import {onMounted} from 'vue';
import UQRCode from 'uqrcodejs';
const CODE_CONTENT = 'https://www.baidu.com/';
onMounted(() => {
// 获取uQRCode实例
const qr = new UQRCode();
// 设置二维码内容
qr.data = CODE_CONTENT;
// 设置二维码大小，必须与canvas设置的宽高一致
qr.size = 160;
// 调用制作二维码方法
qr.make();
// 获取canvas元素
const canvas = document.getElementById("qrcode");
// 获取canvas上下文
const canvasContext = canvas.getContext("2d");
// 设置uQRCode实例的canvas上下文
qr.canvasContext = canvasContext;
// 调用绘制方法将二维码图案绘制到canvas上
qr.drawCanvas();
})
</script>
<template>
<!-- 联系客服 -->
<div class="flex justify-center items-center flex-grow">
<div class="flex flex-col items-center justify-center gap-[12px] rounded-[12px] bg-white py-[20px] px-[15px]">
<div class="title">微信扫码添加</div>
<div class="w-[160px] h-[160px]">
<canvas id="qrcode" width="160" height="160"></canvas>
</div>
<div class="info">请发送 [个人中心] 页面截图给客服</div>
<div class="info">再描述您的问题</div>
</div>
</div>
</template>
<style scoped>
<style lang="scss" scoped>
.title {
color: rgb(29, 33, 41);
font-size: 17px;
font-weight: 500;
line-height: 24px;
letter-spacing: 0;
text-align: center;
}
.info {
color: rgb(78, 89, 105);
font-size: 14px;
font-weight: 500;
line-height: 20px;
letter-spacing: 0;
text-align: center;
}
</style>

17
src/pages/merchant/pages/get-help/index.vue
View File

@@ -4,8 +4,23 @@
<template>
<!-- 获取帮助 -->
<div id="Item-View">
<transition name="fade">
<router-view></router-view>
</transition>
</div>
</template>
<style scoped>
<style lang="scss" scoped>
.fade-enter-active,
.fade-leave-active {
transition: opacity 0.5s;
position: relative;
}
.fade-enter-from,
.fade-leave-to {
opacity: 0;
position: absolute;
}
</style>

6
src/pages/merchant/pages/get-help/problem-teaching.vue
View File

@@ -1,5 +1,11 @@
<script setup>
import {onMounted} from "vue";
const URL_CONTENT = 'https://www.baidu.com/';
onMounted(() => {
window.open(URL_CONTENT);
});
</script>
<template>

79
src/pages/merchant/pages/my-wallet/components/Reflect.vue
View File

@@ -1,5 +1,8 @@
<script setup>
import AddWithdrawalInformationModal from "../../../components/AddWithdrawalInformationModal.vue";
import openWithdrawalStatus from "./openWithdrawalStatus.js";
import LookWithdrawalInformationModal from "../../../components/LookWithdrawalInformationModal.vue";
</script>
<template>
@@ -10,9 +13,85 @@
<div>3.提现账户：最多可设置6个提现账户，超出请删除再进行添加</div>
<div>4.提示：如果填写的提现账户信息不正确，提现将无法成功</div>
</div>
<a-form
class="ml-[100px]"
:auto-label-width="true">
<a-form-item label="提现账户">
<a-radio-group>
<div class="grid grid-cols-2 gap-[18px]">
<a-radio value="1">
<div class="flex items-center">
<div class="input-card flex w-[306px] items-center">
<img class="w-[15px] h-[15px] object-cover test" :src="'123'" alt=""/>
<div class="ml-[14px]">支付宝</div>
<div class="ml-[12px]">157****7061</div>
<icon-edit class="ml-auto cursor-pointer"/>
</div>
<icon-delete class="ml-[8px]"/>
</div>
</a-radio>
<a-radio value="2">
<div class="flex items-center">
<div class="input-card flex w-[306px] items-center">
<img class="w-[15px] h-[15px] object-cover test" :src="'123'" alt=""/>
<div class="ml-[14px]">支付宝</div>
<div class="ml-[12px]">157****7061</div>
<icon-edit class="ml-auto cursor-pointer"/>
</div>
<icon-delete class="ml-[8px]"/>
</div>
</a-radio>
<a-radio value="3">
<div class="flex items-center">
<div class="input-card flex w-[306px] items-center">
<img class="w-[15px] h-[15px] object-cover test" :src="'123'" alt=""/>
<div class="ml-[14px]">支付宝</div>
<div class="ml-[12px]">157****7061</div>
<icon-edit class="ml-auto cursor-pointer"/>
</div>
<icon-delete class="ml-[8px]"/>
</div>
</a-radio>
<AddWithdrawalInformationModal>
<div
class="input-card flex w-[306px] items-center ml-[28px] cursor-pointer hover:!bg-[var(--color-neutral-2)] duration-500 gap-[10px] justify-center">
<icon-plus/>
添加提现信息
</div>
</AddWithdrawalInformationModal>
</div>
</a-radio-group>
</a-form-item>
<a-form-item label="提现金额">
<div class="max-w-[768px] flex gap-[20px] items-center">
<a-input-number :placeholder="`最多可提现${388.88}元`"></a-input-number>
<a-link :hoverable="false" class="whitespace-nowrap">全部提现</a-link>
</div>
</a-form-item>
<a-form-item class="mt-[40px]">
<a-button type="primary" @click="openWithdrawalStatus">立即提现</a-button>
<LookWithdrawalInformationModal>
<a-button type="primary">立即提现</a-button>
</LookWithdrawalInformationModal>
</a-form-item>
</a-form>
</template>
<style lang="scss" scoped>
.input-card {
box-sizing: border-box;
border: 1px solid rgb(229, 230, 235);
border-radius: 2px;
background: rgb(247, 248, 250);
padding: 12px;
}
.info-card {
background: rgb(247, 248, 250);
padding: 12px 20px;

23
src/pages/merchant/pages/my-wallet/components/openWithdrawalStatus.js Normal file
View File

@@ -0,0 +1,23 @@
import {h} from 'vue';
import {Modal} from "@arco-design/web-vue";
import XSelect from "../../../../../components/XSelect/index.vue";
import Api from "../../../../../api/index.js";
const openWithdrawalStatus = () => {
Modal.warning({
title: '提现失败',
width: 600,
draggable: true,
hideCancel: false,
okText: '重新提现',
okButtonProps: {
status: 'danger',
},
content: h('div', [
h('div', {class: 'mb-[24px]'}, '请修改您的提现信息：确保所有信息都归属于同一个自然人。修改完后，在下方选择正确的提现信息，点击下方按钮，重新发起提现'),
h(XSelect, {api: Api.system.getSelect})
])
});
}
export default openWithdrawalStatus;

164
src/pages/merchant/pages/my-wallet/moving-account-details.vue
View File

@@ -1,5 +1,138 @@
<script setup>
import Filter from "../../../../components/Filter/index.vue";
import {computed, reactive} from "vue";
import useTableQuery from "../../../../hooks/useTableQuery.js";
import Api from "../../../../api/index.js";
const columns = [
{
title: '动账日期',
dataIndex: 'value'
},
{
title: '动账时间',
dataIndex: 'value'
},
{
title: '交易流水号',
dataIndex: 'value'
},
{
title: '动账渠道',
dataIndex: 'value'
},
{
title: '状态',
dataIndex: 'value'
},
{
title: '动账用途',
dataIndex: 'value'
},
{
title: '动账金额(元)',
dataIndex: 'value'
},
{
title: '付款人账户',
dataIndex: 'value'
},
{
title: '关联任务ID',
dataIndex: 'value'
},
{
title: '子任务ID',
dataIndex: 'value'
},
{
title: '钱包余额(元) ',
dataIndex: 'value'
},
{
title: '任务款余额(元)',
dataIndex: 'value'
},
{
title: '资产合计(元)',
dataIndex: 'value'
},
];
const FilterConfig = computed(() => [
{
key: 'wd',
type: 'select',
label: '动账渠道',
placeholder: '全部',
api: async () => ({
data: [
{
name: '选项一',
id: 1,
},
{
name: '选项二',
id: 2,
},
{
name: '选项三',
id: 3,
},
]
})
},
{
key: 'wd',
type: 'select',
label: '动账用途',
placeholder: '全部',
api: async () => ({
data: [
{
name: '选项一',
id: 1,
},
{
name: '选项二',
id: 2,
},
{
name: '选项三',
id: 3,
},
]
})
},
{
key: 'wd',
type: 'input',
label: '关联ID',
placeholder: '请输入任务ID',
},
{
key: 'wd',
type: 'datetime',
label: '动账日期',
placeholder: '全部',
},
]);
const vo = reactive({
page: '',
rows: [],
total: 0,
});
const po = reactive({
wd: null,
});
const {loading, pagination, initFetchData} = useTableQuery({
parameter: po,
api: Api.system.getData,
callback: (data) => {
Object.assign(vo, data);
console.log(vo);
}
});
</script>
<template>
@@ -10,11 +143,36 @@
</a-breadcrumb>
</div>
<a-card>
<div class="mock-card mb-[20px]">
<Filter
title="查询动账明细"
v-model:from="po"
:config="FilterConfig"
@search="initFetchData">
</Filter>
</div>
<a-card>
<div class="title">动账明细</div>
<a-table
@page-change="(e) => pagination.current = e"
:pagination="pagination"
:data="vo.rows"
:loading="loading"
class="flex-grow"
:columns="columns">
</a-table>
</a-card>
</template>
<style scoped>
<style lang="scss" scoped>
.title {
color: rgb(29, 33, 41);
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0;
margin-bottom: 20px;
}
</style>

104
src/pages/merchant/pages/personal-center/account-settings.vue
View File

@@ -1,9 +1,113 @@
<script setup>
import {reactive, ref} from "vue";
const activeKey = ref('1');
const form = reactive({
name: null
});
</script>
<template>
<!-- 账号设置 -->
<div class="mb-[20px]">
<a-breadcrumb
:routes="[{path: '/home/personal-center', label: '个人中心'}, {path: '/', label: '账号设置'},]">
</a-breadcrumb>
</div>
<div class="mock-card mb-[20px] py-[30px] flex items-center gap-[60px]">
<div class="w-[100px] h-[100px] test rounded-[50%]">
<img class="w-full h-full rounded-[50%] object-cover" src="" alt=""/>
</div>
<a-descriptions align="right">
<a-descriptions-item label="昵称" :span="2">
王力群ABCabc
<a-link :hoverable="false" class="ml-[20px]" @click="activeKey='1'">更改</a-link>
</a-descriptions-item>
<a-descriptions-item label="微信号" :span="2">
luoluo347
<a-link :hoverable="false" class="ml-[20px]" @click="activeKey='4'">更改</a-link>
</a-descriptions-item>
<a-descriptions-item label="手机绑定" :span="2">
15012312300
<a-link :hoverable="false" class="ml-[20px]" @click="activeKey='2'">更改</a-link>
</a-descriptions-item>
<a-descriptions-item label="ID" :span="2">
S1560
<a-link :hoverable="false" class="ml-[20px]">复制</a-link>
</a-descriptions-item>
<a-descriptions-item label="账号密码" :span="2">
********
<a-link :hoverable="false" class="ml-[20px]" @click="activeKey='3'">更改</a-link>
</a-descriptions-item>
<a-descriptions-item label="邀请码" :span="2">
734783
<a-link :hoverable="false" class="ml-[20px]">复制</a-link>
</a-descriptions-item>
</a-descriptions>
</div>
<a-card>
<a-form
:label-col-props="{span: 3}"
:wrapper-col-props="{span: 8, offset: 1}">
<a-tabs
v-model:active-key="activeKey"
type="rounded">
<a-tab-pane title="更改昵称" key="1">
<a-form-item label="新昵称">
<a-input v-model:model-value="form.name" placeholder="请输入新昵称"></a-input>
</a-form-item>
<a-form-item class="mt-[40px]">
<a-button type="primary">确认更改</a-button>
</a-form-item>
</a-tab-pane>
<a-tab-pane title="手机绑定" key="2">
<a-form-item label="原手机号">
<a-input v-model:model-value="form.name" placeholder="请输入原手机号"></a-input>
</a-form-item>
<a-form-item label="验证码">
<a-input v-model:model-value="form.name" placeholder="请输入验证码"></a-input>
</a-form-item>
<a-form-item label="新手机号">
<a-input v-model:model-value="form.name" placeholder="请输入新手机号"></a-input>
</a-form-item>
<a-form-item label="验证码">
<a-input v-model:model-value="form.name" placeholder="请输入验证码"></a-input>
</a-form-item>
<a-form-item class="mt-[40px]">
<a-button type="primary">确认更改</a-button>
</a-form-item>
</a-tab-pane>
<a-tab-pane title="账号密码" key="3">
<a-form-item label="手机号">
<a-input v-model:model-value="form.name" placeholder="请输入手机号"></a-input>
</a-form-item>
<a-form-item label="验证码">
<a-input v-model:model-value="form.name" placeholder="请输入验证码"></a-input>
</a-form-item>
<a-form-item label="新密码">
<a-input v-model:model-value="form.name" placeholder="请输入新密码"></a-input>
</a-form-item>
<a-form-item class="mt-[40px]">
<a-button type="primary">确认更改</a-button>
</a-form-item>
</a-tab-pane>
<a-tab-pane title="微信号" key="4">
<a-form-item label="微信号">
<a-input v-model:model-value="form.name" placeholder="请输入微信号"></a-input>
</a-form-item>
<a-form-item class="mt-[40px]">
<a-button type="primary">确认更改</a-button>
</a-form-item>
</a-tab-pane>
</a-tabs>
</a-form>
</a-card>
</template>
<style scoped>

81
src/pages/merchant/pages/personal-center/credit-score.vue
View File

@@ -1,11 +1,88 @@
<script setup>
import {reactive} from "vue";
import useTableQuery from "../../../../hooks/useTableQuery.js";
import Api from "../../../../api/index.js";
const columns = [
{
title: '处理ID',
dataIndex: 'value'
},
{
title: '处理时间',
dataIndex: 'value'
},
{
title: '处理结果',
dataIndex: 'value'
},
{
title: '处理原因',
dataIndex: 'value'
},
{
title: '申诉状态',
dataIndex: 'value'
},
{
title: '操作',
dataIndex: 'action',
width: 150,
align: 'center',
slotName: 'action',
},
];
const vo = reactive({
page: '',
rows: [],
total: 0,
});
const po = reactive({
wd: null,
});
const {loading, pagination, initFetchData} = useTableQuery({
parameter: po,
api: Api.system.getData,
callback: (data) => {
Object.assign(vo, data);
console.log(vo);
}
});
</script>
<template>
<!-- 信用分 -->
<div class="mb-[20px]">
<a-breadcrumb
:routes="[{path: '/home/personal-center', label: '个人中心'}, {path: '/', label: '信用分'},]">
</a-breadcrumb>
</div>
<a-card>
<div class="title">动账明细</div>
<a-table
@page-change="(e) => pagination.current = e"
:pagination="pagination"
:data="vo.rows"
:loading="loading"
class="flex-grow"
:columns="columns">
<template v-slot:action>
<a-link :hoverable="false" :disabled="false">联系专属客服申诉</a-link>
</template>
</a-table>
</a-card>
</template>
<style scoped>
<style lang="scss" scoped>
.title {
color: rgb(29, 33, 41);
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0;
margin-bottom: 20px;
}
</style>

17
src/pages/merchant/pages/personal-center/index.vue
View File

@@ -4,8 +4,23 @@
<template>
<!-- 个人中心 -->
<div id="Item-View">
<transition name="fade">
<router-view></router-view>
</transition>
</div>
</template>
<style scoped>
<style lang="scss" scoped>
.fade-enter-active,
.fade-leave-active {
transition: opacity 0.5s;
position: relative;
}
.fade-enter-from,
.fade-leave-to {
opacity: 0;
position: absolute;
}
</style>

62
src/pages/merchant/pages/task-center/reward-mission.vue
View File

@@ -72,40 +72,44 @@ const FilterConfig = computed(() => [
type: 'select',
label: '任务渠道',
placeholder: '全部',
options: [
{
label: '选项一',
value: 1,
},
{
label: '选项二',
value: 2,
},
{
label: '选项三',
value: 3,
},
]
api: async () => ({
data: [
{
name: '选项一',
id: 1,
},
{
name: '选项二',
id: 2,
},
{
name: '选项三',
id: 3,
},
]
})
},
{
key: 'wd',
type: 'select',
label: '任务状态',
placeholder: '全部',
options: [
{
label: '选项一',
value: 1,
},
{
label: '选项二',
value: 2,
},
{
label: '选项三',
value: 3,
},
]
api: async () => ({
data: [
{
name: '选项一',
id: 1,
},
{
name: '选项二',
id: 2,
},
{
name: '选项三',
id: 3,
},
]
})
},
{
key: 'wd',
@@ -155,7 +159,7 @@ const {loading, pagination, initFetchData} = useTableQuery({
<div class="mt-[20px] flex-grow">
<a-table
class="h-full"
class="h-full"
:columns="columns"
:data="vo.rows"
:loading="loading"