You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
629 lines
22 KiB
629 lines
22 KiB
<template>
|
|
<div class="main-content12">
|
|
<!-- page content -->
|
|
<div class="site-setting-wrap min-flex-right">
|
|
<div class="siteMessage flex-common mt12" id="siteMessage1">
|
|
<h3>管理证书</h3>
|
|
<el-form>
|
|
<div class="flex-wrap">
|
|
<div class="flex-left">
|
|
<div class="uploadwrap">
|
|
<label class="flex">上传 apiclient_cert.pem 证书<img class="ml-4" src="@/assets/require.svg" /></label>
|
|
<el-upload class="flex mt12" accept=".jpg,.png" ref="upload" action="https://jsonplaceholder.typicode.com/posts/" :on-preview="handlePreview" :on-remove="handleRemove" :file-list="fileList" :auto-upload="false" :show-file-list="true">
|
|
|
|
<el-button class="flex" slot="trigger" size="small" type="primary">选取文件</el-button>
|
|
</el-upload>
|
|
<p class="avatar-desc">支持 jpg、png 格式，大小不超过 2MB </p>
|
|
</div>
|
|
</div>
|
|
<div class="flex-line"></div>
|
|
<div class="flex-right">
|
|
<p class="flex-left-desc">微信客服</p>
|
|
</div>
|
|
</div>
|
|
<GroupFormBtns @cancel="cancleUpdateSiteInfo()" @confirm="submitUpload" />
|
|
</el-form>
|
|
</div>
|
|
<div class="siteMessage flex-common mt-18" id="siteMessage2">
|
|
<h3>平台退款</h3>
|
|
<el-form>
|
|
<div class="flex-wrap">
|
|
<div class="flex-left">
|
|
<div class="beforeNotice">
|
|
<div class="flex justify-content-space-between">
|
|
<h3 class="flex gap8" style="margin: 0 0 0 0;">功能开关</h3>
|
|
|
|
<!-- :active-value="1" :inactive-value="0"（关闭） 加冒号表示数字格式 -->
|
|
<!-- active-value="1" inactive-value="0"（关闭） 不加冒号表示字符串 -->
|
|
<!-- 传入的modelvalue 为数字 0 或者 1 -->
|
|
<GuipSwitch :modelValue="payIsAutoRefund" :active-value="1" :inactive-value="0" @change="updatePayAutoRefund(payinfo)" activeText="开启" inactiveText="关闭"></GuipSwitch>
|
|
</div>
|
|
<p class="ml-23 flex gray">开启后，遇到退单的情况，平台尽量在联系您并同意的情况下操作退款</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-form>
|
|
</div>
|
|
<div class="siteMessage flex-common mt-18" id="siteMessage3">
|
|
<h3>分账管理</h3>
|
|
<el-form class="tcpr-wrap">
|
|
<el-tabs v-model="profitShareTab" @tab-click="handleClick">
|
|
<el-tab-pane label="分账设置" name="profit_share_setting">
|
|
<div class="beforeNotice">
|
|
<h4 class="flex"> <img src="@/assets/site/siteSemInfo_Icon.svg" alt=""> 前期准备事项</h4>
|
|
<a href="https://pay.weixin.qq.com/" class="flex" target="_blank"><img src="@/assets/site/form_linkActive.svg" alt="">前往微信商户平台</a>
|
|
|
|
<p class="mt12 flex">1.开通分账功能：微信商户平台 > 产品中心 > 我的产品，支付扩展工具中开通分账产品。</p>
|
|
<p class="mt10 flex">2.分账接收设置：登录商户平台 > 交易中心 > 分账接收设置 > 分账回退设置，开启分账回退。</p>
|
|
</div>
|
|
<div class="semBidWrap">
|
|
<div class="baidu-wrap bidWrap">
|
|
|
|
<div class="bidwrap-item">
|
|
<div class="biditemMast mb12 flex-between">
|
|
<div class="bidwrap-item-top flex">
|
|
<img class="bid-item-img" src="@/assets/site/step_1.png" alt="">
|
|
<div class="top-right column">
|
|
<b>配置商户证书</b>
|
|
<p>微信商户平台> 账户中心 > API安全，申请API证书。</p>
|
|
</div>
|
|
</div>
|
|
<!-- <div class="flex" v-if="siteInfo.bing_client_id&&siteInfo.bing_developer_token">
|
|
<span :class="'yesSet'">已设置</span>
|
|
<GuipButton type="normal" :btnstyle="{ width: '126px', height: '38px' }"
|
|
@click="manageDialog('configAppInfo')">管理设置</GuipButton>
|
|
</div>
|
|
<div class="flex" v-else>
|
|
<span :class="'notSet'">未设置</span>
|
|
<GuipButton type="normal" :btnstyle="{ width: '126px', height: '38px' }"
|
|
@click="manageDialog('configAppInfo')">立即设置</GuipButton>
|
|
</div> -->
|
|
</div>
|
|
<div class="biditemMast mb12 flex-between">
|
|
<div class="bidwrap-item-top flex">
|
|
<img class="bid-item-img" src="@/assets/site/step_2.png" alt="">
|
|
<div class="top-right column">
|
|
<b>设置 APIv3 密钥</b>
|
|
<p class="flex">请在微信商户平台的"账户中心 > API安全"中设置APIv3秘钥。</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex" v-if="payinfo.apiv3">
|
|
<span :class="'yesSet'">已设置</span>
|
|
<GuipButton type="primary" :btnstyle="{ width: '126px', height: '38px' }"
|
|
@click="showDialog('apiv3')">管理设置</GuipButton>
|
|
</div>
|
|
<div class="flex" v-else>
|
|
<span :class="'notSet'">未设置</span>
|
|
<GuipButton type="primary" :btnstyle="{ width: '126px', height: '38px' }"
|
|
@click="showDialog('apiv3')">立即设置</GuipButton>
|
|
</div>
|
|
</div>
|
|
<div class="biditemMast mb12 flex-between">
|
|
<div class="bidwrap-item-top flex">
|
|
<img class="bid-item-img" src="@/assets/site/step_3.png" alt="">
|
|
<div class="top-right column">
|
|
<b>添加分账接收方</b>
|
|
<p>接收方比例：30%（当前仅支持给一个商户分账，最大30%） </p>
|
|
</div>
|
|
</div>
|
|
<div class="flex" v-if="profitShareInfo.receiver_name">
|
|
<span :class="'yesSet'">已设置</span>
|
|
<GuipButton type="primary" :btnstyle="{ width: '126px', height: '38px' }"
|
|
@click="showDialog('profit_share_receivers')">立即设置</GuipButton>
|
|
</div>
|
|
<div class="flex" v-else>
|
|
<span :class="'notSet'">未设置</span>
|
|
<GuipButton type="primary" :btnstyle="{ width: '126px', height: '38px' }"
|
|
@click="showDialog('profit_share_receivers')">立即设置</GuipButton>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="分账记录" name="profit_share_list">分账记录</el-tab-pane>
|
|
</el-tabs>
|
|
</el-form>
|
|
</div>
|
|
</div>
|
|
<GuipDialog type="normal" :dialogVisible="dialogVisibleApiv3" title="配置应用信息" :show-close-button="false"
|
|
:show-cancel-button="true" cancelText="取消" confirmText="确定" @confirm="saveApiv3(payinfo)"
|
|
@cancel="handleCancelConfig" @dialogVisibleChange="dialogVisibleChange">
|
|
<div class="config-offline-wrap">
|
|
<el-form>
|
|
<p class="flex mb-24">请在微信商户平台的"账户中心 > API安全"中设置APIv3秘钥。</p>
|
|
<GuipInput ref="GuipInput" v-model="payinfo.apiv3" placeholder="请输入APIv3秘钥" />
|
|
</el-form>
|
|
</div>
|
|
</GuipDialog>
|
|
<GuipDialog type="normal" :dialogVisible="dialogVisibleProfitShare" title="添加分账接收方" :show-close-button="false"
|
|
:show-cancel-button="true" cancelText="取消" confirmText="确定" @confirm="saveProfitShareReceivers(payinfo)"
|
|
@cancel="handleCancelConfig" @dialogVisibleChange="dialogVisibleChange">
|
|
<div class="config-offline-wrap">
|
|
<el-form>
|
|
<p class="flex mb-24">接收方比例：30%（当前仅支持给一个商户分账，最大30%） </p>
|
|
<GuipInput ref="GuipInput" column="column" required label="1.接收方名称" desc="商户全称，小微商户或个体户，填开户人姓名"
|
|
v-model="profitShareInfo.receiver_name" prop="receiver_name" placeholder="请输入分账接收方名称" />
|
|
<GuipInput ref="GuipInput" column="column" required label="2.接收方账号" desc="商户号"
|
|
v-model="profitShareInfo.receiver_account" prop="receiver_account" placeholder="请输入分账接收方账号" />
|
|
<GuipSelect v-model="profitShareInfo.relation_type" clearable label="3.接收方关系" :default-value="profitShareInfo.relation_type"
|
|
prop="card" :options="profitShareReceiversRelationType" valueKey="id1" labelKey="id2" />
|
|
</el-form>
|
|
</div>
|
|
</GuipDialog>
|
|
</div>
|
|
|
|
</template>
|
|
<script>
|
|
import store from '@/store';
|
|
import { mapState } from 'vuex';
|
|
import GuipSwitch from '@/components/GuipSwitch.vue';
|
|
import GroupFormBtns from '@/components/GroupFormBtns.vue'
|
|
import GuipButton from '@/components/GuipButton.vue'
|
|
import GuipDialog from '@/components/GuipDialog.vue'
|
|
import GuipInput from '@/components/GuipInput.vue'
|
|
import GuipSelect from '@/components/GuipSelect.vue'
|
|
|
|
// 收款方式
|
|
const PAY_TYPE_TAOBAO = 0; // 淘宝
|
|
const PAY_TYPE_WEIXIN = 2; // 微信
|
|
const PAY_TYPE_ALIPAY = 3; // 支付宝
|
|
const PAY_TYPE_JINGDONG = 4; // 京东
|
|
const PAY_TYPE_PDD = 11; // 拼多多
|
|
|
|
export default {
|
|
// 收款方式设置
|
|
name: '',
|
|
props: [''],
|
|
components: {
|
|
GuipSwitch,
|
|
GroupFormBtns,
|
|
GuipButton,
|
|
GuipDialog,
|
|
GuipInput,
|
|
GuipSelect,
|
|
},
|
|
data() {
|
|
return {
|
|
// AUTH
|
|
token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE3NTAwNTM3MjQsIm5iZiI6MTc1MDA1MzcyNCwiZXhwIjoxNzUyNjQ1NzI0LCJ1c2VyIjoic3VidXNlciIsImxvZ2luX3R5cGUiOjAsImFpZCI6IjEifQ.xyIqBLelB-k6jCifgRevBJTyg_Qrm6m1e4OcHhOpepU',
|
|
payinfo: [],
|
|
payType: -1,
|
|
payIsAutoRefund: -1,
|
|
paySvg: '',
|
|
// 收款方式
|
|
payTypeTaoBao: PAY_TYPE_TAOBAO,
|
|
payTypeWeixin: PAY_TYPE_WEIXIN,
|
|
payTypeAlipay: PAY_TYPE_ALIPAY,
|
|
payTypeJingdong: PAY_TYPE_JINGDONG,
|
|
payTypePdd: PAY_TYPE_PDD,
|
|
confirmText: '保存',
|
|
|
|
fileList: [],
|
|
|
|
profitShareTab: 'profit_share_setting',
|
|
dialogVisibleApiv3: false,
|
|
dialogVisibleProfitShare: false,
|
|
|
|
profitShareInfo: [],
|
|
profitShareReceiversRelationType: [],
|
|
}
|
|
},
|
|
computed: {
|
|
...mapState(['pageTitle']) // 从Vuex映射showSidebar状态到组件的计算属性中
|
|
},
|
|
created() {
|
|
store.commit('SET_CUSTOMIZE', true);
|
|
store.commit('SET_SLIDER_MENU', 'paySettingData');
|
|
},
|
|
mounted() {
|
|
store.commit('SET_PAGETITLE', '支付授权');
|
|
|
|
this.getPayment();
|
|
this.getProfitShareInfo();
|
|
},
|
|
methods: {
|
|
getPayment() {
|
|
this.$http('POST', '/agentnew/ajax_get_payinfo', {
|
|
payid: this.$route.query.payid,
|
|
},{
|
|
headers:{
|
|
'Auth': this.token
|
|
}
|
|
}).then(response => {
|
|
this.$nextTick(() => {
|
|
this.payinfo = response.data
|
|
this.payType = response.data.type
|
|
this.payIsAutoRefund = Number(response.data.is_auto_refund)
|
|
this.paySvg = require('@/assets/pay/pay_'+this.payType+'.svg')
|
|
if (this.payType == PAY_TYPE_TAOBAO || this.payType == PAY_TYPE_JINGDONG) {
|
|
this.confirmText = '去授权';
|
|
} else if (this.payType == PAY_TYPE_PDD) {
|
|
this.confirmText = '同步授权';
|
|
}
|
|
})
|
|
}).catch(error => {
|
|
console.error(error, 'error')
|
|
})
|
|
},
|
|
getProfitShareInfo() {
|
|
this.$http('POST', '/agentnew/ajax_get_profit_share_info', {
|
|
pid: this.$route.query.payid,
|
|
},{
|
|
headers:{
|
|
'Auth': this.token
|
|
}
|
|
}).then(response => {
|
|
this.$nextTick(() => {
|
|
this.profitShareReceiversRelationType = response.data.receivers_relation_type
|
|
if (response.status) {
|
|
this.profitShareStatus = response.data
|
|
|
|
}
|
|
})
|
|
}).catch(error => {
|
|
console.error(error, 'error')
|
|
})
|
|
},
|
|
updatePayAutoRefund(row) {
|
|
this.$http('POST', '/agentnew/ajax_setting_auto_refund', {
|
|
payid: this.$route.query.payid,
|
|
status: row.is_auto_refund==1 ? 0 : 1,
|
|
}, {
|
|
headers: {
|
|
'Auth': this.token
|
|
}
|
|
}).then(response => {
|
|
this.$nextTick(() => {
|
|
if (response.status) {
|
|
this.$Message.success(response.info);
|
|
this.getPayment()
|
|
} else {
|
|
this.$Message.error(response.info);
|
|
}
|
|
})
|
|
}).catch(error => {
|
|
console.error(error, 'error')
|
|
})
|
|
},
|
|
cancle() {
|
|
this.getPayment();
|
|
},
|
|
submitUpload() {
|
|
this.$refs.upload.submit();
|
|
},
|
|
handleRemove(file, fileList) {
|
|
console.log(file, fileList);
|
|
},
|
|
handlePreview(file) {
|
|
console.log(file);
|
|
},
|
|
handleClick(tab, event) {
|
|
console.log(tab, event);
|
|
},
|
|
showDialog(type) {
|
|
if (type == 'apiv3') {
|
|
this.dialogVisibleApiv3 = true;
|
|
this.dialogVisibleProfitShare = false;
|
|
} else if (type == 'profit_share_receivers') {
|
|
this.dialogVisibleProfitShare = true;
|
|
this.dialogVisibleApiv3 = false;
|
|
}
|
|
},
|
|
// 确认按钮事件
|
|
saveApiv3(row) {
|
|
this.$http('POST', '/agentnew/ajax_save_apiv3', {
|
|
pid: this.$route.query.payid,
|
|
apiv3: row.apiv3
|
|
}, {
|
|
headers: {
|
|
'Auth': this.token
|
|
}
|
|
}).then(response => {
|
|
this.$nextTick(() => {
|
|
if (response.status) {
|
|
this.$Message.success(response.info);
|
|
} else {
|
|
this.$Message.error(response.info);
|
|
}
|
|
})
|
|
}).catch(error => {
|
|
console.error(error, 'error')
|
|
})
|
|
|
|
this.dialogVisibleApiv3 = false;
|
|
},
|
|
// 取消按钮事件
|
|
handleCancelConfig() {
|
|
this.dialogVisibleApiv3 = false;
|
|
},
|
|
dialogVisibleChange(data) {
|
|
console.log(data, 'data098908090');
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
a {
|
|
text-decoration: none;
|
|
color: #006AFF;
|
|
}
|
|
|
|
.gray {
|
|
color: #626573 !important;
|
|
}
|
|
|
|
.mt-18 {
|
|
margin-top: 18px;
|
|
}
|
|
.ml-23 {
|
|
margin-left: 23px;
|
|
}
|
|
|
|
.justify-content-space-between {
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.beforeNotice {
|
|
|
|
h4 {
|
|
margin: 0;
|
|
gap: 8px;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
margin-bottom: 18px;
|
|
text-align: left;
|
|
box-sizing: border-box;
|
|
padding: 20px 14px;
|
|
border-radius: 4px;
|
|
/* middle/middle_grey_0 */
|
|
background: #FAFAFA;
|
|
|
|
div {
|
|
margin-top: 2px;
|
|
padding-left: 23px;
|
|
|
|
p {
|
|
color: #8A9099;
|
|
}
|
|
|
|
}
|
|
|
|
p {
|
|
color: #1E2226;
|
|
|
|
i {
|
|
font-style: normal;
|
|
}
|
|
|
|
&:last-child {
|
|
display: flex;
|
|
align-items: stretch;
|
|
|
|
b {
|
|
font-weight: normal;
|
|
color: #8A9099;
|
|
display: inline-flex;
|
|
|
|
img {
|
|
margin-left: 4px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
a {
|
|
text-decoration: none;
|
|
color: #006AFF;
|
|
margin-right: 10px;
|
|
|
|
img {
|
|
margin-left: 5px;
|
|
margin-right: 5px;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.siteMessage {
|
|
border-radius: 4px;
|
|
transition: all .5s;
|
|
border: 1px solid transparent;
|
|
}
|
|
|
|
.siteMessage h3 {
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
line-height: normal;
|
|
letter-spacing: 0.08em;
|
|
color: #1E2226;
|
|
}
|
|
|
|
.site-setting-wrap {
|
|
width: 100%;
|
|
}
|
|
|
|
|
|
.upload-wrap {
|
|
display: grid;
|
|
justify-items: start;
|
|
}
|
|
|
|
.uploadwrap {
|
|
text-align: left;
|
|
}
|
|
|
|
lable {
|
|
font-size: 14px;
|
|
font-weight: normal;
|
|
line-height: normal;
|
|
letter-spacing: 0.08em;
|
|
color: #1E2226;
|
|
}
|
|
.ml-4 {
|
|
margin-left: 4px;
|
|
}
|
|
.mb-24 {
|
|
margin-bottom: 24px;
|
|
}
|
|
.mb-30 {
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.tcpr-wrap {
|
|
.bidwrap-item {
|
|
padding: 0 !important;
|
|
background: transparent !important;
|
|
|
|
.biditemMast {
|
|
background: #fff;
|
|
padding: 24px 16px;
|
|
}
|
|
}
|
|
|
|
.semBidWrap {
|
|
padding-bottom: 24rpx;
|
|
}
|
|
}
|
|
.semBidWrap {
|
|
background: #FAFAFA;
|
|
padding: 18px 14px;
|
|
box-sizing: border-box;
|
|
|
|
.el-form-item {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.close-bid {
|
|
color: #626573;
|
|
font-size: 14px;
|
|
font-weight: normal;
|
|
transition: all .3s;
|
|
|
|
&:hover {
|
|
opacity: 0.7;
|
|
}
|
|
|
|
img {
|
|
width: 16px;
|
|
height: 16px;
|
|
margin-left: 6px;
|
|
}
|
|
}
|
|
|
|
|
|
.bidWrap {
|
|
.bidwrap-item {
|
|
padding: 24px 16px;
|
|
box-sizing: border-box;
|
|
border-radius: 8px;
|
|
background: #FFFFFF;
|
|
|
|
|
|
.bid-item-img {
|
|
width: 32px;
|
|
height: 32px;
|
|
margin-right: 22px;
|
|
}
|
|
|
|
.bidwrap-item-top {
|
|
.top-right {
|
|
p {
|
|
margin-top: 10px;
|
|
}
|
|
|
|
a {
|
|
text-decoration: none;
|
|
color: #006AFF;
|
|
|
|
img {
|
|
margin-right: 10px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.bidwrap-item-bot {
|
|
padding-left: 54px;
|
|
justify-content: flex-end;
|
|
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
}
|
|
.notSet,
|
|
.yesSet {
|
|
margin-right: 12px;
|
|
color: #FF4D4F;
|
|
}
|
|
|
|
.yesSet {
|
|
color: #00C261;
|
|
}
|
|
|
|
|
|
.beforeNotice {
|
|
h4 {
|
|
margin: 0;
|
|
gap: 8px;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
margin-bottom: 18px;
|
|
text-align: left;
|
|
box-sizing: border-box;
|
|
padding: 20px 14px;
|
|
border-radius: 4px;
|
|
/* middle/middle_blue_1 */
|
|
background: #F2F7FF;
|
|
/* middle/middle_blue_3 */
|
|
border: 1px solid #BFDAFF;
|
|
|
|
div {
|
|
margin-top: 2px;
|
|
padding-left: 23px;
|
|
|
|
p {
|
|
color: #8A9099;
|
|
}
|
|
|
|
}
|
|
|
|
p {
|
|
color: #1E2226;
|
|
|
|
i {
|
|
font-style: normal;
|
|
}
|
|
|
|
&:last-child {
|
|
display: flex;
|
|
align-items: stretch;
|
|
|
|
b {
|
|
font-weight: normal;
|
|
color: #8A9099;
|
|
display: inline-flex;
|
|
|
|
img {
|
|
margin-left: 4px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
a {
|
|
text-decoration: none;
|
|
color: #006AFF;
|
|
margin-right: 10px;
|
|
|
|
img {
|
|
margin-left: 12px;
|
|
margin-right: 12px;
|
|
}
|
|
}
|
|
}
|
|
</style>
|