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.
444 lines
16 KiB
444 lines
16 KiB
<template>
|
|
<div>
|
|
<PromptText text='操作提示：设置价格并保存，即添加服务' :type="2" class="mr12 ml12"/>
|
|
|
|
<div class="main-content12">
|
|
<!-- page content -->
|
|
<div class="flex-common" v-for="(ver_row) in serviceAddList" :key="ver_row.name">
|
|
<h3>{{ver_row.name}}</h3>
|
|
<div class="service-setting-area" :class="row.status == 1 ? 'service-setting-open' : ''" v-for="(row) in ver_row.list" :key="row.type" :id="'section_'+row.type">
|
|
<el-form class="el-row demo-ruleForm" ref="formRef">
|
|
<div class="flex flex-between mb24 line40 service-title">
|
|
<div class="service-title-left">
|
|
<span class="service-title-name">{{row.type_name}}</span>
|
|
<span v-if="row.status == 1" class="service-title-status">已开启</span>
|
|
<span v-if="row.status == 1" class="service-title-close">关闭服务</span>
|
|
</div>
|
|
<div class="service-title-right" v-if="row.base_set">
|
|
<el-checkbox v-model="row.has_base_price" @change="toggleSetBasePrice(row)">设置起售价格</el-checkbox>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex mb24 line40" v-if="row.supply_price_warning">
|
|
<div class="service-info-item">
|
|
<span class="mr12">供货价格</span>
|
|
<span>{{row.supply_price}} {{row.supply_price_warning}}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex mb24 line40">
|
|
<div class="service-info-item mr50" v-if="!row.supply_price_warning">
|
|
<span class="mr12">供货价格</span>
|
|
<span>{{row.supply_price}}</span>
|
|
</div>
|
|
|
|
<div class="service-info-item mr50" v-if="row.set_units">
|
|
<GuipRadio label="计费方式" v-model="row.unit" :options="row.set_units" @change="methodChange()"/>
|
|
</div>
|
|
|
|
<div class="service-info-item">
|
|
<template v-if="row.price_set_label == '售价管理'">
|
|
<GuipInput v-model="row.price" :label="row.price_set_label" ref="GuipInput" width="150px" unit="元"></GuipInput>
|
|
</template>
|
|
<template v-else>
|
|
<GuipInput v-model="row.unit_piece" :label="row.price_set_label" ref="GuipInput" width="150px" unit="件"></GuipInput>
|
|
</template>
|
|
|
|
<template v-if="row.unit == 0">
|
|
<span class="slash">/</span>
|
|
<GuipInput v-model="row.unit_num" ref="GuipInput" width="150px" unit="字符"></GuipInput>
|
|
</template>
|
|
<template v-if="row.unit == 1">
|
|
<span class="slash">/</span>
|
|
<span>篇</span>
|
|
</template>
|
|
<template v-if="row.unit == 2">
|
|
<span class="slash">/</span>
|
|
<span>页</span>
|
|
</template>
|
|
<!-- <div>对应电商商品件数，这样在电商平台进行促销也不影响提交论文</div>-->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex mb24 line40" v-if="row.has_base_price">
|
|
<div class="service-info-item" v-if="row.price_set_label == '售价管理'">
|
|
<GuipInput v-model="row.b_unit_num" label="起售价格" ref="GuipInput" width="180px" unit="字符内"></GuipInput>
|
|
<span class="ml12 mr12">用户需支付</span>
|
|
<GuipInput v-model="row.b_unit_price" ref="GuipInput" width="180px" unit="元"></GuipInput>
|
|
<span class="service-base-remark ml12">备注：超过设定字符，按照正常售价收取</span>
|
|
</div>
|
|
<div class="service-info-item" v-else>
|
|
<GuipInput v-model="row.b_unit_num" label="起售价格" ref="GuipInput" width="180px" unit="字符内"></GuipInput>
|
|
<span class="ml12 mr12">用户需支付</span>
|
|
<GuipInput v-model="row.b_unit_piece" ref="GuipInput" width="180px" unit="件"></GuipInput>
|
|
<span class="service-base-remark ml12">备注：超过设定字符，按照正常售价收取</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex mb24 line40" v-if="row.enable_bind">
|
|
<GuipButton @click="bindGoods(row.type)" class="bind-button" type="ignore" :btnstyle="{width:'148px',height:'40px',background:'#F2F3F5','border-radius':'4px'}">
|
|
<div class="bgImg"></div>
|
|
<span>关联商品</span>
|
|
</GuipButton>
|
|
</div>
|
|
|
|
<div class="flex flex-between service-opt">
|
|
<GuipButton type="ignore" @click="reset(row)">重置</GuipButton>
|
|
<GuipButton type="primary" @click="save(row)" size="medium">保存</GuipButton>
|
|
</div>
|
|
</el-form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<component :is="bindComponent" ref="dynamicComponent" @handleBind="handleBind"
|
|
:uid="bindData.uid" :type="bindData.type" :pati="bindData.pati" :pageCode="bindData.pageCode"/>
|
|
|
|
<div class="register-btns">
|
|
<GuipButton type="primary" :btnstyle="{ width: '144px', height: '46px' }" @click="jumpStep">添加完成</GuipButton>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import store from '@/store';
|
|
import { mapState } from 'vuex';
|
|
import GuipRadio from "@/components/GuipRadio.vue";
|
|
import GuipInput from "@/components/GuipInput.vue";
|
|
import GuipButton from "@/components/GuipButton.vue";
|
|
import PromptText from "@/components/PromptText.vue";
|
|
import bindGoods from "@/components/bindGoods.vue";
|
|
export default {
|
|
name: 'siteAddFinally',
|
|
props: [''],
|
|
components: {
|
|
bindGoods,
|
|
PromptText,
|
|
GuipButton,
|
|
GuipInput,
|
|
GuipRadio
|
|
},
|
|
data() {
|
|
return {
|
|
// AUTH
|
|
token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE3NTAwNTM3MjQsIm5iZiI6MTc1MDA1MzcyNCwiZXhwIjoxNzUyNjQ1NzI0LCJ1c2VyIjoic3VidXNlciIsImxvZ2luX3R5cGUiOjAsImFpZCI6IjEifQ.xyIqBLelB-k6jCifgRevBJTyg_Qrm6m1e4OcHhOpepU',
|
|
siteInfo:{},
|
|
serviceAddList: [],
|
|
menuList:{},
|
|
siteAddUrl: '/agent/siteAdd',
|
|
showBind:false,
|
|
bindComponent:'',
|
|
bindData: {
|
|
uid: 0,
|
|
type: 0,
|
|
pati: '',
|
|
pageCode: '',
|
|
},
|
|
}
|
|
},
|
|
computed: {
|
|
...mapState(['pageTitle']) // 从Vuex映射showSidebar状态到组件的计算属性中
|
|
},
|
|
created() {
|
|
if (!this.$route.query.uid) {
|
|
this.$message.error('非法请求');
|
|
this.$router.push('/agent/siteAdd')
|
|
}
|
|
this.initPddSdk2(this.$route.query.uid)
|
|
console.log('wwww')
|
|
},
|
|
mounted() {
|
|
store.commit('SET_PAGETITLE', '添加服务');
|
|
|
|
this.getAddServiceList();
|
|
this.getServiceAdd();
|
|
},
|
|
methods: {
|
|
bindGoods(type){
|
|
this.bindData.uid = this.siteInfo.uid
|
|
this.bindData.type = type
|
|
// if(this.siteInfo.sale_channel == 3){
|
|
// const initData = this.initPddSdk2(this.$route.query.uid)
|
|
// this.bindData.type = initData.pageCode
|
|
// this.bindData.type = initData.pati
|
|
// }
|
|
// this.bindComponent = 'bindGoods'
|
|
},
|
|
async getPddPageCode(uid){
|
|
console.log('aaa')
|
|
const that = this
|
|
that.$http('POST', '/agentnew/ajax_get_pdd_page_code', {
|
|
uid: uid,
|
|
}, {
|
|
headers: {
|
|
'Auth': this.token
|
|
}
|
|
}).then(response => {
|
|
console.log(response.data,'bbb')
|
|
that.bindData.pageCode = response.data
|
|
return response.data
|
|
}).catch(error => {
|
|
console.error(error, 'error')
|
|
})
|
|
},
|
|
async loadPddSk(pageCode){
|
|
console.log('ccc',pageCode)
|
|
const script = document.createElement('script');
|
|
script.src = 'https://pfile.pddpic.com/galerie-go/open_sdk/pc.202102201613.js';
|
|
script.onload = () => {
|
|
window.PDD_OPEN_init({
|
|
code: pageCode
|
|
// 对于获取 code 接口或未登录态，可不传：PDD_OPEN_init({}, function () { ... })
|
|
}).then(function () {
|
|
console.log('ddd')
|
|
// 初始化已完成
|
|
window.PDD_OPEN_getPati().then(
|
|
function (pati) {
|
|
console.log(pati)
|
|
// 使用 pati
|
|
}).catch(error => console.log(error))
|
|
})
|
|
};
|
|
script.onerror = () => {
|
|
console.log('errpr')
|
|
console.error('拼多多 SDK 加载失败');
|
|
};
|
|
document.head.appendChild(script);
|
|
},
|
|
async initPddSdk2(uid) {
|
|
const that = this
|
|
try {
|
|
const pageCode = await that.getPddPageCode(uid)
|
|
// await that.loadPddSk(pageCode)
|
|
console.log(pageCode,'eee')
|
|
// console.log(that.bindData.pageCode,'bbb')
|
|
// that.bindData.pati = await that.loadPddSk(that.bindData.pageCode)
|
|
// console.log('aaa')
|
|
|
|
} catch (e) {
|
|
console.log(e)
|
|
}
|
|
},
|
|
handleBind(data){
|
|
this.bindComponent = ''
|
|
console.log(data)
|
|
},
|
|
getAddServiceList(){
|
|
const that = this
|
|
that.siteInfo = []
|
|
this.$http('POST', '/agentnew/ajax_get_add_service_list', {
|
|
uid: this.$route.query.uid,
|
|
prodid: that.$route.query.prodid,
|
|
}, {
|
|
headers: {
|
|
'Auth': this.token
|
|
}
|
|
}).then(response => {
|
|
this.$nextTick(() => {
|
|
this.menuList = response.data
|
|
store.commit('SET_SECOND_MENU', response.data);
|
|
})
|
|
}).catch(error => {
|
|
console.error(error, 'error')
|
|
})
|
|
},
|
|
// 获取站点信息
|
|
getServiceAdd() {
|
|
const that = this
|
|
this.$http('POST', '/agentnew/ajax_get_service_addinfo', {
|
|
uid: this.$route.query.uid,
|
|
prodid: that.$route.query.prodid,
|
|
}, {
|
|
headers: {
|
|
'Auth': this.token
|
|
}
|
|
}).then(response => {
|
|
this.$nextTick(() => {
|
|
that.siteInfo = response.data.siteinfo
|
|
that.serviceAddList = response.data.service_add_list
|
|
store.commit('SET_BREADRIGHTTEXT', that.siteInfo.short_name);
|
|
})
|
|
}).catch(error => {
|
|
console.error(error, 'error')
|
|
})
|
|
},
|
|
toggleSetBasePrice(row) {
|
|
row.has_base_price = row.has_base_price == true ? false : true;
|
|
},
|
|
methodChange() {
|
|
},
|
|
reset(row) {
|
|
row.price = ''
|
|
row.unit_num = ''
|
|
row.unit_piece = ''
|
|
row.b_unit_num = ''
|
|
row.b_unit_price = ''
|
|
row.b_unit_piece = ''
|
|
},
|
|
save(row) {
|
|
console.log(row)
|
|
const that = this
|
|
this.$http('POST', "/agentnew/ajax_set_service_price", {
|
|
uid: that.uid,
|
|
type: row.type,
|
|
unit: row.unit,
|
|
unit_num: row.unit_num,
|
|
unit_price: row.price,
|
|
unit_piece: row.unit_piece,
|
|
b_unit_num: row.b_unit_num,
|
|
b_unit_price: row.b_unit_price,
|
|
b_unit_piece: row.b_unit_piece,
|
|
}, {
|
|
headers: {
|
|
'Auth': this.token
|
|
}
|
|
}).then(response => {
|
|
if (response.status) {
|
|
that.$message.success('保存成功');
|
|
return true;
|
|
}
|
|
that.$message.error(response.info);
|
|
}).catch(error => {
|
|
console.error(error, 'error')
|
|
})
|
|
},
|
|
jumpStep(){
|
|
this.$router.push(this.siteAddUrl + '?uid=' + this.uid)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.line40{
|
|
line-height: 40px;
|
|
}
|
|
.ml12 {
|
|
margin-left: 12px;
|
|
}
|
|
|
|
.mr12 {
|
|
margin-right: 12px;
|
|
}
|
|
|
|
.mr50 {
|
|
margin-right: 50px;
|
|
}
|
|
|
|
.slash{
|
|
margin: 0 6px;
|
|
}
|
|
|
|
.warning-text {
|
|
margin: 0 12px;
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 8px 13px;
|
|
align-self: stretch;
|
|
z-index: 1;
|
|
border-radius: 4px;
|
|
background: #FEFCE8;
|
|
border: 1px solid rgba(255, 140, 0, 0.3);
|
|
|
|
.warning-icon {
|
|
width: 16px;
|
|
height: 16px;;
|
|
margin-right: 8px;
|
|
}
|
|
|
|
span {
|
|
color: #1E2226;
|
|
letter-spacing: 0.08em;
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
|
|
.service-setting-open {
|
|
background: #F2FBED !important;
|
|
}
|
|
|
|
.service-setting-area {
|
|
padding: 24px;
|
|
background: #F6F7FA;
|
|
margin-bottom: 12px;
|
|
letter-spacing: 0.08em;
|
|
|
|
.el-form-item {
|
|
margin: 0;
|
|
}
|
|
|
|
.el-checkbox {
|
|
color: #1E2226;
|
|
}
|
|
|
|
.service-title {
|
|
|
|
.service-title-left .service-title-name {
|
|
color: #1E2226;
|
|
margin-right: 24px;
|
|
}
|
|
|
|
.service-title-left .service-title-status {
|
|
border-radius: 4px;
|
|
border: 1px solid rgba(0, 194, 97, 0.6);
|
|
color: #0DAF49;
|
|
padding: 2px 10px 2px 32px;
|
|
background-image: url(@/assets/site/open_success.svg);
|
|
background-repeat: no-repeat;
|
|
background-position: 10px 50%;
|
|
background-size: 16px 16px;
|
|
margin-right: 12px;
|
|
}
|
|
|
|
.service-title-left .service-title-close {
|
|
color: #8A9099;
|
|
background-image: url(@/assets/site/form_close.svg);
|
|
background-repeat: no-repeat;
|
|
background-position: 0 50%;
|
|
background-size: 16px 16px;
|
|
padding: 2px 10px 2px 22px;
|
|
}
|
|
}
|
|
|
|
.service-info-item {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.el-radio-group{
|
|
margin: 0;
|
|
}
|
|
}
|
|
|
|
.service-base-remark {
|
|
font-size: 12px;
|
|
color: #8A9099;
|
|
}
|
|
|
|
.service-opt {
|
|
justify-content: right;
|
|
}
|
|
}
|
|
|
|
.register-btns {
|
|
position: fixed;
|
|
left: 0;
|
|
bottom: 0;
|
|
width: 100%;
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: center;
|
|
background: #FFFFFF;
|
|
padding: 16px 0px;
|
|
/* 蓝色阴影_常规 */
|
|
box-shadow: 0px 4px 16px 0px rgba(17, 55, 143, 0.12);
|
|
z-index: 999;
|
|
button:nth-child(1) {
|
|
margin-right: 56px;
|
|
}
|
|
}
|
|
|
|
.bgImg{
|
|
width: 20px;
|
|
height: 16px;
|
|
margin-right: 6px;
|
|
background-image: url(@/assets/site/shop_bag.svg);
|
|
}
|
|
</style>
|