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.
858 lines
32 KiB
858 lines
32 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 class="mb12">管理证书</h3>
|
|
<div class="beforeNotice">
|
|
<span class="flex"> <img src="@/assets/site/siteSemInfo_Icon.svg" alt="" style="margin-right: 5px;"> API证书获取：
|
|
<a href="https://pay.weixin.qq.com/" class="flex" target="_blank"><img style="margin-right: 5px;"
|
|
src="@/assets/site/form_linkActive.svg" alt="">前往微信商户平台</a>> 账户中心 > API安全，申请API证书。
|
|
</span>
|
|
</div>
|
|
<el-form>
|
|
<div class="flex-wrap">
|
|
<div class="flex-left">
|
|
<div class="uploadwrap">
|
|
<label class="flex upload-title">上传 apiclient_cert.pem 证书<img class="ml-4"
|
|
src="@/assets/require.svg" /></label>
|
|
<el-upload class="upload-demo" :on-change="handleAvatarChange" action="#" :multiple="false"
|
|
:limit="Number(1)" ref="avatorUpload"
|
|
:auto-upload="false">
|
|
<GuipButton class="upload-button" slot="trigger" type="ignore" :btnstyle="{ width: '118px' }">
|
|
<i class="bgImg"></i>选择文件</GuipButton>
|
|
</el-upload>
|
|
<p class="uploaded" v-if="payinfo.cert_uploaded">已上传</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex-line"></div>
|
|
<div class="flex-right">
|
|
<div class="uploadwrap">
|
|
<label class="flex upload-title">上传 apiclient_key.pem 证书<img class="ml-4" src="@/assets/require.svg" /></label>
|
|
<el-upload class="upload-demo" :on-change="handleAvatarChange1" action="#" :multiple="false"
|
|
:limit="Number(1)" ref="avatorUpload"
|
|
:auto-upload="false">
|
|
<GuipButton class="upload-button" slot="trigger" type="ignore" :btnstyle="{ width: '118px' }">
|
|
<i class="bgImg"></i>选择文件</GuipButton>
|
|
|
|
</el-upload>
|
|
<p class="uploaded" v-if="payinfo.key_uploaded">已上传</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<GroupFormBtns @cancel="cancleUpdateSiteInfo()" @confirm="saveCert" />
|
|
</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="setting">
|
|
<div class="flex justify-content-space-between">
|
|
<h4 class="flex">功能开关</h4>
|
|
|
|
<!-- :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> -->
|
|
<PromptText text="前期准备事项" :type="1" class="beforeNotice mt20">
|
|
<template #next_desc>
|
|
<p class="flex">
|
|
<a href="https://pay.weixin.qq.com/" class="flex" target="_blank"><img
|
|
src="@/assets/site/form_linkActive.svg" alt="">前往微信商户平台</a>
|
|
</p>
|
|
</template>
|
|
<template #desc>
|
|
<p class="mt12 flex">
|
|
1.开通分账功能：微信商户平台 > 产品中心 > 我的产品，支付扩展工具中开通分账产品。
|
|
</p>
|
|
<p class="mt10 flex">
|
|
2.分账接收设置：登录商户平台 > 交易中心 > 分账接收设置 > 分账回退设置，开启分账回退。
|
|
</p>
|
|
</template>
|
|
</PromptText>
|
|
<div class="semBidWrap">
|
|
<div class="baidu-wrap bidWrap">
|
|
|
|
<div class="bidwrap-item">
|
|
<h3 class="flex">分账开关<GuipSwitch :modelValue="payinfo.profit_share_status"
|
|
:active-value="1" :inactive-value="0"
|
|
@change="updateProfitShareStatus(payinfo)"></GuipSwitch>
|
|
</h3>
|
|
<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="payinfo.apiv3">
|
|
<span :class="'yesSet'">已设置</span>
|
|
<GuipButton type="system" :btnstyle="{ width: '126px', height: '38px' }"
|
|
@click="showDialog('cert')">管理设置</GuipButton>
|
|
</div>
|
|
<div class="flex" v-else>
|
|
<span :class="'notSet'">未设置</span>
|
|
<GuipButton type="primary"
|
|
:btnstyle="{ width: '126px', height: '38px' }"
|
|
@click="showDialog('cert')">立即设置</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="system" :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="system" :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="dialogVisibleCert" title="配置商户证书" :show-close-button="false"
|
|
:show-cancel-button="true" cancelText="取消" confirmText="确定" @confirm="saveCert()"
|
|
@cancel="handleCancelConfig" @dialogVisibleChange="dialogVisibleChange">
|
|
<div class="config-offline-wrap">
|
|
<el-form>
|
|
<p class="mb24">微信商户平台> 账户中心 > API安全，申请API证书。</p>
|
|
<!-- accept=".jpg,.png" -->
|
|
<div class="uploadwrap">
|
|
<label class="flex upload-title">1. apiclient_cert.pem 证书<img class="ml-4"
|
|
src="@/assets/require.svg" /></label>
|
|
<el-upload class="upload-demo" :on-change="handleAvatarChange" action="#" :multiple="false"
|
|
:limit="Number(1)" ref="avatorUpload"
|
|
:auto-upload="false">
|
|
<GuipButton class="upload-button" slot="trigger" type="ignore" :btnstyle="{ width: '118px' }">
|
|
<i class="bgImg"></i>选择文件</GuipButton>
|
|
</el-upload>
|
|
|
|
</div>
|
|
<div class="uploadwrap mt-18">
|
|
<label class="flex upload-title">2. apiclient_key.pem 证书<img class="ml-4" src="@/assets/require.svg" /></label>
|
|
<el-upload class="upload-demo" :on-change="handleAvatarChange1" action="#" :multiple="false"
|
|
:limit="Number(1)" ref="avatorUpload"
|
|
:auto-upload="false">
|
|
<GuipButton class="upload-button" slot="trigger" type="ignore" :btnstyle="{ width: '118px' }">
|
|
<i class="bgImg"></i>选择文件</GuipButton>
|
|
|
|
</el-upload>
|
|
</div>
|
|
</el-form>
|
|
</div>
|
|
</GuipDialog>
|
|
|
|
<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(profitShareInfo)" @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" placeholder="请输入分账接收方名称" />
|
|
<GuipInput ref="GuipInput" column="column" required label="2.接收方账号" desc="商户号"
|
|
v-model="profitShareInfo.receiver_account" placeholder="请输入分账接收方账号" />
|
|
|
|
<GuipSelect v-model="profitShareInfo.relation_type" column="column" clearable label="3.接收方关系"
|
|
:default-value="profitShareInfo.relation_type" :options="profitShareReceiversRelationType"
|
|
valueKey="key" labelKey="val" placeholder="请选择分账接收方关系"
|
|
@change="profitShareReceiversRelationTypeChange(profitShareInfo)" />
|
|
<GuipInput v-if="this.showCustomInput" ref="GuipInput" column="column" required label="自定义接收方关系"
|
|
desc="最多10个字" v-model="profitShareInfo.custom_relation" placeholder="请输入自定义接收方关系" />
|
|
</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'
|
|
import PromptText from '@/components/PromptText.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,
|
|
PromptText,
|
|
},
|
|
data() {
|
|
return {
|
|
// AUTH
|
|
token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE3NTAwNTM3MjQsIm5iZiI6MTc1MDA1MzcyNCwiZXhwIjoxNzUyNjQ1NzI0LCJ1c2VyIjoic3VidXNlciIsImxvZ2luX3R5cGUiOjAsImFpZCI6IjEifQ.xyIqBLelB-k6jCifgRevBJTyg_Qrm6m1e4OcHhOpepU',
|
|
payid: '',
|
|
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: '保存',
|
|
formData:new FormData(),
|
|
fileList: [],
|
|
|
|
profitShareTab: 'profit_share_setting',
|
|
dialogVisibleApiv3: false,
|
|
dialogVisibleProfitShare: false,
|
|
dialogVisibleCert: false,
|
|
|
|
profitShareInfo: {
|
|
'receiver_name': '',
|
|
},
|
|
profitShareReceiversRelationType: [],
|
|
showCustomInput: false,
|
|
|
|
uploadParams: {
|
|
},
|
|
uploadHeaders: {
|
|
'Auth': this.token
|
|
},
|
|
}
|
|
},
|
|
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();
|
|
this.payid = this.$route.query.payid;
|
|
this.formData.set('payid', this.payid)
|
|
// for(let [key,value] of this.formData){
|
|
// console.log(key,value,'=====key');
|
|
// }
|
|
},
|
|
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.payinfo.profit_share_status = Number(response.data.profit_share_status)
|
|
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 && response.data.receivers.length > 0) {
|
|
this.profitShareInfo = response.data.receivers[0]
|
|
console.log(this.profitShareInfo)
|
|
}
|
|
})
|
|
}).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')
|
|
})
|
|
},
|
|
updateProfitShareStatus(row) {
|
|
this.$http('POST', '/agentnew/ajax_update_profit_share_status', {
|
|
pid: this.$route.query.payid,
|
|
profit_share_status: row.profit_share_status == 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;
|
|
this.dialogVisibleCert = false;
|
|
} else if (type == 'profit_share_receivers') {
|
|
this.dialogVisibleProfitShare = true;
|
|
this.dialogVisibleApiv3 = false;
|
|
this.dialogVisibleCert = false;
|
|
} else if (type == 'cert') {
|
|
this.dialogVisibleCert = true;
|
|
this.dialogVisibleApiv3 = false;
|
|
this.dialogVisibleProfitShare = false;
|
|
}
|
|
},
|
|
// 确认按钮事件
|
|
saveCert() {
|
|
// for(let [key,value] of this.formData){
|
|
// console.log(key,value,'=====key');
|
|
// }
|
|
this.$http('POST', '/agentnew/upload_pay_cert',
|
|
this.formData
|
|
, {
|
|
headers: {
|
|
'Auth': this.token,
|
|
'Content-Type':'multipart/form-data'
|
|
}
|
|
}).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.dialogVisibleCert = 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;
|
|
},
|
|
saveProfitShareReceivers(row) {
|
|
this.$http('POST', '/agentnew/ajax_add_profit_share_receivers', {
|
|
pid: this.$route.query.payid,
|
|
rname: row.receiver_name,
|
|
raccount: row.receiver_account,
|
|
rtype: row.relation_type,
|
|
custom_relation: row.custom_relation
|
|
}, {
|
|
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;
|
|
this.dialogVisibleProfitShare = false;
|
|
this.dialogVisibleCert = false;
|
|
},
|
|
dialogVisibleChange(data) {
|
|
console.log(data, 'data098908090');
|
|
},
|
|
profitShareReceiversRelationTypeChange(row) {
|
|
console.log(row.relation_type, 'relation_type');
|
|
if (row.relation_type == 'CUSTOM') {
|
|
this.showCustomInput = true;
|
|
} else {
|
|
this.showCustomInput = false;
|
|
}
|
|
},
|
|
handleAvatarChange(file, fileList) {
|
|
console.log(file, fileList)
|
|
let fileObj = file.raw
|
|
this.formData.set('apiclient_cert', fileObj)
|
|
},
|
|
handleAvatarChange1(file, fileList) {
|
|
console.log(file, fileList)
|
|
let fileObj = file.raw
|
|
this.formData.set('apiclient_key', fileObj)
|
|
}
|
|
}
|
|
}
|
|
</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;
|
|
align-items: center;
|
|
}
|
|
.upload-demo{
|
|
margin-top: 12px;
|
|
}
|
|
|
|
.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: 5px;
|
|
margin-right: 5px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.upload-button {
|
|
border-radius: 4px;
|
|
background: #F2F3F5;
|
|
box-sizing: border-box;
|
|
border: 1px solid #BABDC2;
|
|
|
|
.bgImg {
|
|
width: 20px;
|
|
height: 16px;
|
|
margin-right: 6px;
|
|
background-image: url(@/assets/site/uploadIcon.svg);
|
|
}
|
|
|
|
&:hover {
|
|
.bgImg {
|
|
background-image: url(@/assets/site/uploadIcon_light.svg);
|
|
}
|
|
}
|
|
}
|
|
|
|
.upload-title {
|
|
font-size: 14px;
|
|
font-weight: normal;
|
|
line-height: normal;
|
|
letter-spacing: 0.08em;
|
|
color: #23242B;
|
|
}
|
|
|
|
.uploaded {
|
|
color: #606266;
|
|
font-size: 12px;
|
|
margin-top:10px;
|
|
}
|
|
|
|
.setting {
|
|
|
|
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;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|