微信提现信息优化
This commit is contained in:
Binary file not shown.
|
After Width: | Height: | Size: 115 KiB |
@@ -2,6 +2,7 @@
|
|||||||
import { ref, watch } from 'vue'
|
import { ref, watch } from 'vue'
|
||||||
import { ElMessage } from 'element-plus'
|
import { ElMessage } from 'element-plus'
|
||||||
import { Upload, Delete, Loading } from '@element-plus/icons-vue'
|
import { Upload, Delete, Loading } from '@element-plus/icons-vue'
|
||||||
|
import wechatReceiveQrExample from '@/assets/wechat-receive-qr-example.png'
|
||||||
|
|
||||||
import {
|
import {
|
||||||
createPaymentAccount,
|
createPaymentAccount,
|
||||||
@@ -195,9 +196,21 @@ function removeImage(index: number) {
|
|||||||
</el-form-item>
|
</el-form-item>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<el-form-item label="凭证截图">
|
<el-form-item :label="form.account_type === 'wechat' ? '收款二维码' : '凭证截图'">
|
||||||
|
<div v-if="form.account_type === 'wechat'" class="wechat-qr-tip">
|
||||||
|
<div>
|
||||||
|
<strong>微信收款二维码上传提醒</strong>
|
||||||
|
<p>请在微信收款码页面点击保存收款码,上传保存后的二维码图片。</p>
|
||||||
|
<p>不要上传收款码截图、聊天截图或带页面背景的整屏截图。</p>
|
||||||
|
</div>
|
||||||
|
<img :src="wechatReceiveQrExample" alt="微信收款二维码示例" />
|
||||||
|
</div>
|
||||||
<div style="font-size: 12px; color: #999; margin-bottom: 8px">
|
<div style="font-size: 12px; color: #999; margin-bottom: 8px">
|
||||||
可上传收款码截图等凭证(可选,最多3张)
|
{{
|
||||||
|
form.account_type === 'wechat'
|
||||||
|
? '请上传保存后的微信收款二维码图片(可选,最多3张)'
|
||||||
|
: '可上传收款码截图等凭证(可选,最多3张)'
|
||||||
|
}}
|
||||||
</div>
|
</div>
|
||||||
<div class="certificate-upload">
|
<div class="certificate-upload">
|
||||||
<div v-for="(url, index) in form.certificate_urls" :key="url" class="certificate-item">
|
<div v-for="(url, index) in form.certificate_urls" :key="url" class="certificate-item">
|
||||||
@@ -271,6 +284,41 @@ function removeImage(index: number) {
|
|||||||
gap: 12px;
|
gap: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.wechat-qr-tip {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: minmax(0, 1fr) 128px;
|
||||||
|
gap: 12px;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
border: 1px solid #fed7aa;
|
||||||
|
border-radius: 8px;
|
||||||
|
background: #fff7ed;
|
||||||
|
padding: 12px;
|
||||||
|
color: #92400e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wechat-qr-tip strong {
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 6px;
|
||||||
|
color: #c2410c;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wechat-qr-tip p {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wechat-qr-tip img {
|
||||||
|
display: block;
|
||||||
|
width: 128px;
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid #fde6c8;
|
||||||
|
background: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
.certificate-item {
|
.certificate-item {
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 100px;
|
width: 100px;
|
||||||
|
|||||||
@@ -18,6 +18,7 @@ import { uploadFile } from '@/shared/api/files'
|
|||||||
import { readError } from '@/shared/utils/error'
|
import { readError } from '@/shared/utils/error'
|
||||||
import { formatCent, formatMoney, yuanToCent } from '@/shared/utils/money'
|
import { formatCent, formatMoney, yuanToCent } from '@/shared/utils/money'
|
||||||
import { formatDateMinute } from '@/shared/utils/time'
|
import { formatDateMinute } from '@/shared/utils/time'
|
||||||
|
import wechatReceiveQrExample from '@/assets/wechat-receive-qr-example.png'
|
||||||
|
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
|
||||||
@@ -461,9 +462,20 @@ function statusType(status: string): 'primary' | 'success' | 'danger' | 'warning
|
|||||||
账户名必须与实名认证姓名一致;提现将转账到该收款账号,请确认账号信息准确。
|
账户名必须与实名认证姓名一致;提现将转账到该收款账号,请确认账号信息准确。
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div v-if="accountForm.account_type === 'wechat'" class="wechat-qr-tip">
|
||||||
|
<div>
|
||||||
|
<strong>微信收款二维码上传提醒</strong>
|
||||||
|
<p>请在微信收款码页面点击保存收款码,上传保存后的二维码图片。</p>
|
||||||
|
<p>不要上传收款码截图、聊天截图或带页面背景的整屏截图。</p>
|
||||||
|
</div>
|
||||||
|
<img :src="wechatReceiveQrExample" alt="微信收款二维码示例" />
|
||||||
|
</div>
|
||||||
|
|
||||||
<section class="certificate-section">
|
<section class="certificate-section">
|
||||||
<div class="certificate-title">
|
<div class="certificate-title">
|
||||||
<span>收款码/凭证截图</span>
|
<span>{{
|
||||||
|
accountForm.account_type === 'wechat' ? '微信收款二维码' : '收款码/凭证截图'
|
||||||
|
}}</span>
|
||||||
<small>最多3张</small>
|
<small>最多3张</small>
|
||||||
</div>
|
</div>
|
||||||
<div class="certificate-grid">
|
<div class="certificate-grid">
|
||||||
@@ -807,6 +819,40 @@ function statusType(status: string): 'primary' | 'success' | 'danger' | 'warning
|
|||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.wechat-qr-tip {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: minmax(0, 1fr) 108px;
|
||||||
|
gap: 10px;
|
||||||
|
align-items: center;
|
||||||
|
margin: 12px 0;
|
||||||
|
padding: 10px;
|
||||||
|
border: 1px solid #fed7aa;
|
||||||
|
border-radius: 10px;
|
||||||
|
background: #fff7ed;
|
||||||
|
color: #92400e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wechat-qr-tip strong {
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
color: #c2410c;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wechat-qr-tip p {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 1.55;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wechat-qr-tip img {
|
||||||
|
display: block;
|
||||||
|
width: 108px;
|
||||||
|
border: 1px solid #fde6c8;
|
||||||
|
border-radius: 8px;
|
||||||
|
background: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
.certificate-section {
|
.certificate-section {
|
||||||
margin: 14px 0;
|
margin: 14px 0;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user