2 changed files with 276 additions and 0 deletions
@ -0,0 +1,264 @@ |
|||
<template> |
|||
<div class="main-content12"> |
|||
<!-- page content --> |
|||
<div class="site-setting-wrap min-flex-right"> |
|||
<div class="siteMessage flex-common" id="siteMessage1"> |
|||
<h3>支付客服</h3> |
|||
<el-form> |
|||
<div class="flex-wrap"> |
|||
<div class="flex-left" style="max-width:100%"> |
|||
<div class="beforeNotice"> |
|||
<h4 class="flex"> |
|||
<span>支付即服务免开发版</span> |
|||
<p class="flex"> |
|||
<a :href="payinfo.weixin_pay_kefu_setting_url" class="flex" target="_blank"><img src="@/assets/site/form_linkActive.svg" alt="">前往微信商户平台</a> |
|||
</p> |
|||
</h4> |
|||
|
|||
<p class="mt12 flex gray">用户在支付完成后，可通过相关微信支付凭证下方入口找到商家的服务人员名片，添加服务人员为好友。</p> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</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"><img src="@/assets/register/weixin.svg" alt="">微信收款</h3> |
|||
<!-- :active-value="1" :inactive-value="0"（关闭） 加冒号表示数字格式 --> |
|||
<!-- active-value="1" inactive-value="0"（关闭） 不加冒号表示字符串 --> |
|||
<!-- 传入的modelvalue 为数字 0 或者 1 --> |
|||
<GuipSwitch :modelValue="payStatus" :active-value="1" :inactive-value="0" @change="updatePayStatus(payinfo)" activeText="开启1" inactiveText="关闭1"></GuipSwitch> |
|||
<GuipSwitch :modelValue="payStatus" active-value="1" inactive-value="0" @change="updatePayStatus(payinfo)" activeText="开启" inactiveText="关闭"></GuipSwitch> |
|||
</div> |
|||
<p class="ml-23 flex gray">{{ payinfo.account }}</p> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</el-form> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
</template> |
|||
<script> |
|||
// import GuipInput from '@/components/GuipInput.vue'; |
|||
import store from '@/store'; |
|||
import { mapState } from 'vuex'; |
|||
import GuipSwitch from '@/components/GuipSwitch.vue'; |
|||
// import GuipInput from '@/components/GuipInput.vue'; |
|||
// import GuipTextarea from '@/components/GuipTextarea.vue'; |
|||
// import GuipRadio from '@/components/GuipRadio.vue'; |
|||
// import CustomDropdown from '@/components/CustomDropdown.vue'; |
|||
// import GuipButton from '@/components/GuipButton.vue'; |
|||
// import GroupFormBtns from '@/components/GroupFormBtns.vue'; |
|||
// import {setHighActive} from '@/utils/common'; |
|||
|
|||
// 收款方式 |
|||
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, |
|||
// GuipFormItem, |
|||
// GuipInput, |
|||
// GuipTextarea, |
|||
// CustomDropdown, |
|||
// GuipButton, |
|||
// GroupFormBtns |
|||
|
|||
}, |
|||
data() { |
|||
return { |
|||
// AUTH |
|||
token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE3NTAwNTM3MjQsIm5iZiI6MTc1MDA1MzcyNCwiZXhwIjoxNzUyNjQ1NzI0LCJ1c2VyIjoic3VidXNlciIsImxvZ2luX3R5cGUiOjAsImFpZCI6IjEifQ.xyIqBLelB-k6jCifgRevBJTyg_Qrm6m1e4OcHhOpepU', |
|||
payinfo: [], |
|||
payType: -1, |
|||
payStatus: -1, |
|||
// 收款方式 |
|||
payTypeTaoBao: PAY_TYPE_TAOBAO, |
|||
payTypeWeixin: PAY_TYPE_WEIXIN, |
|||
payTypeAlipay: PAY_TYPE_ALIPAY, |
|||
payTypeJingdong: PAY_TYPE_JINGDONG, |
|||
payTypePdd: PAY_TYPE_PDD, |
|||
confirmText: '保存', |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapState(['pageTitle']) // 从Vuex映射showSidebar状态到组件的计算属性中 |
|||
}, |
|||
created() { |
|||
store.commit('SET_CUSTOMIZE', true); |
|||
store.commit('SET_SLIDER_MENU', 'paySettingData'); |
|||
}, |
|||
mounted() { |
|||
store.commit('SET_PAGETITLE', '支付授权'); |
|||
|
|||
this.getPayment(); |
|||
}, |
|||
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 |
|||
console.log(this.payinfo.status, 'payinfo') |
|||
this.payType = response.data.type |
|||
this.payStatus = Number(response.data.status) |
|||
console.log(this.payStatus, 'payStatus') |
|||
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') |
|||
}) |
|||
}, |
|||
updatePayStatus(row) { |
|||
this.$http('POST', '/agentnew/ajax_update_pay_status', { |
|||
payid: this.$route.query.payid, |
|||
status: row.status==1 ? 0 : 1, |
|||
}, { |
|||
headers: { |
|||
'Auth': this.token |
|||
} |
|||
}).then(response => { |
|||
this.$nextTick(() => { |
|||
if (response.status) { |
|||
this.$Message.success(response.info); |
|||
this.closePayTipDialogVisible = false; |
|||
this.getPayment() |
|||
} else { |
|||
this.$Message.error(response.info); |
|||
} |
|||
}) |
|||
}).catch(error => { |
|||
console.error(error, 'error') |
|||
}) |
|||
}, |
|||
cancle() { |
|||
this.getPayment(); |
|||
} |
|||
} |
|||
} |
|||
</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%; |
|||
} |
|||
|
|||
</style> |
|||
Loading…
Reference in new issue