6 changed files with 667 additions and 14 deletions
After Width: | Height: | Size: 3.4 KiB |
After Width: | Height: | Size: 2.1 KiB |
@ -0,0 +1,213 @@ |
|||||
|
<template> |
||||
|
<GuipDialog :dialogVisible="dialogVisible" :showFooterButton="showFooterButton" |
||||
|
title="搜索商品" @confirm="handleConfirm" @cancel="handleCancel" @close="handleCancel"> |
||||
|
<div class="domain-wrap"> |
||||
|
<el-form class="el-row demo-ruleForm" ref="formRef"> |
||||
|
<div class="flex flex-between"> |
||||
|
<GuipInput width="420px" v-model="keywords"> |
||||
|
<GuipToolTip slot="suffix"> |
||||
|
<img src="@/assets/site/input_search.svg"/> |
||||
|
</GuipToolTip> |
||||
|
</GuipInput> |
||||
|
<GuipButton type="primary" @click="handleSearch()">搜索</GuipButton> |
||||
|
</div> |
||||
|
|
||||
|
<div class="goods-list"> |
||||
|
<div class="goods-item" v-for="(row) in list" :key="row.num_iid"> |
||||
|
<img src="@/assets/site/kefuTem.png" alt=""> |
||||
|
<div class="goods-info"> |
||||
|
<p>{{row.title}}</p> |
||||
|
<p>¥{{row.price}}</p> |
||||
|
<GuipSelect v-if="row.skus" v-model="row.skuid" width="200px" placeholder="选择SKU" :options="row.skus" @change="handleSelectSku(row)"/> |
||||
|
<div v-else style="height: 40px"></div> |
||||
|
</div> |
||||
|
<el-checkbox v-model="row.selected" @change="handleSelectGood(row)"></el-checkbox> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
</GuipDialog> |
||||
|
</template> |
||||
|
<script> |
||||
|
|
||||
|
import GuipDialog from "@/components/GuipDialog.vue"; |
||||
|
import GuipToolTip from "@/components/GuipToolTip.vue"; |
||||
|
import GuipInput from "@/components/GuipInput.vue"; |
||||
|
import GuipButton from "@/components/GuipButton.vue"; |
||||
|
import GuipSelect from "@/components/GuipSelect.vue"; |
||||
|
|
||||
|
export default { |
||||
|
name: '', |
||||
|
props:['uid','type','isPdd'], |
||||
|
components: { |
||||
|
GuipSelect, |
||||
|
GuipButton, |
||||
|
GuipInput, |
||||
|
GuipToolTip, |
||||
|
GuipDialog |
||||
|
}, |
||||
|
data(){ |
||||
|
return { |
||||
|
dialogVisible: true, |
||||
|
showFooterButton: false, |
||||
|
keywords: '', |
||||
|
pati: '', |
||||
|
pageCode: '', |
||||
|
list: [], |
||||
|
empty_text: '', |
||||
|
bindData: {} |
||||
|
} |
||||
|
}, |
||||
|
mounted() { |
||||
|
if(this.isPdd) this.initPddSdk() |
||||
|
}, |
||||
|
methods:{ |
||||
|
handleConfirm(){ |
||||
|
this.dialogVisible = false; |
||||
|
}, |
||||
|
handleCancel(){ |
||||
|
this.dialogVisible = false; |
||||
|
this.$emit('handleBind', this.bindData) |
||||
|
}, |
||||
|
handleSearch(){ |
||||
|
const that = this |
||||
|
this.$http('POST', '/agentnew/ajax_get_goods_list', { |
||||
|
uid: that.uid, |
||||
|
type: that.type, |
||||
|
keywords: that.keywords, |
||||
|
pdd_pati: that.pdd_pati, |
||||
|
pdd_pagecode: that.pdd_pagecode, |
||||
|
}, { |
||||
|
headers: { |
||||
|
'Auth': this.token |
||||
|
} |
||||
|
}).then(response => { |
||||
|
if(response.status){ |
||||
|
if(response.data.length>0){ |
||||
|
response.data.forEach((item) => { |
||||
|
item.skuid = '' |
||||
|
item.selected = false |
||||
|
if(item.skus){ |
||||
|
Object.entries(item.skus).forEach(([key, val]) => { |
||||
|
item.skus[key] = `${val.title} ¥${val.price}`; |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
that.$nextTick(() => { |
||||
|
that.list = response.data |
||||
|
that.showFooterButton = true |
||||
|
}) |
||||
|
} else { |
||||
|
that.empty_text = '未查询到相关商品' |
||||
|
} |
||||
|
return true |
||||
|
} |
||||
|
that.empty_text = response.info |
||||
|
}).catch(error => { |
||||
|
console.error(error, 'error') |
||||
|
}) |
||||
|
}, |
||||
|
handleSelectGood(row){ |
||||
|
if(row.selected) { |
||||
|
if(row.skus && !row.skuid) { |
||||
|
this.$nextTick(() => { |
||||
|
row.selected = false; |
||||
|
}); |
||||
|
this.$message.warning('请选择SKU'); |
||||
|
return false |
||||
|
} |
||||
|
this.bindData[row.num_iid] = row.skuid |
||||
|
}else{ |
||||
|
this.$delete(this.bindData, row.num_iid); |
||||
|
} |
||||
|
}, |
||||
|
handleSelectSku(row){ |
||||
|
if(row.selected) { |
||||
|
this.bindData[row.num_iid] = row.skuid |
||||
|
} |
||||
|
}, |
||||
|
async getPddPageCode(){ |
||||
|
const that = this |
||||
|
this.$http('POST', '/agentnew/ajax_get_pdd_page_code', { |
||||
|
uid: that.uid, |
||||
|
}, { |
||||
|
headers: { |
||||
|
'Auth': this.token |
||||
|
} |
||||
|
}).then(response => { |
||||
|
return response.data |
||||
|
}).catch(error => { |
||||
|
console.error(error, 'error') |
||||
|
}) |
||||
|
}, |
||||
|
async initPddSdk() { |
||||
|
const that = this |
||||
|
this.pageCode = await this.getPddPageCode() |
||||
|
|
||||
|
const script = document.createElement('script'); |
||||
|
script.src = 'https://pfile.pddpic.com/galerie-go/open_sdk/pc.202102201613.js'; |
||||
|
script.onload = () => { |
||||
|
if (typeof window.PDD_OPEN_init === 'function') { |
||||
|
window.PDD_OPEN_init({ |
||||
|
code: that.pageCode |
||||
|
// 对于获取 code 接口或未登录态,可不传 code:PDD_OPEN_init({}, function () { ... }) |
||||
|
}, function () { |
||||
|
// 初始化已完成 |
||||
|
window.PDD_OPEN_getPati().then(function (pati) { |
||||
|
that.pati = pati |
||||
|
}).catch(error => console.log(error)) |
||||
|
}); |
||||
|
} else { |
||||
|
console.error('PDD_OPEN_init 不存在,SDK 未正确加载'); |
||||
|
} |
||||
|
}; |
||||
|
script.onerror = () => { |
||||
|
console.error('拼多多 SDK 加载失败'); |
||||
|
}; |
||||
|
document.head.appendChild(script); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style lang="scss"> |
||||
|
.el-form-item{ |
||||
|
margin: 0; |
||||
|
} |
||||
|
.el-dialog{ |
||||
|
min-height: 0; |
||||
|
} |
||||
|
|
||||
|
.goods-list{ |
||||
|
max-height: 400px; |
||||
|
overflow-y: scroll; |
||||
|
.goods-item{ |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: space-between; |
||||
|
border-radius: 8px; |
||||
|
background: #FAFAFA; |
||||
|
padding: 16px; |
||||
|
margin-top: 16px; |
||||
|
letter-spacing: 0.08em; |
||||
|
|
||||
|
img{ |
||||
|
width: 80px; |
||||
|
height: 80px; |
||||
|
} |
||||
|
|
||||
|
.goods-info{ |
||||
|
width: 100%; |
||||
|
margin: 0 22px; |
||||
|
|
||||
|
p{ |
||||
|
font-size: 14px; |
||||
|
color: #1E2226; |
||||
|
} |
||||
|
p:nth-child(2){ |
||||
|
margin: 12px 0; |
||||
|
color: #626573; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
@ -0,0 +1,444 @@ |
|||||
|
<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> |
Loading…
Reference in new issue