zq
2 months ago
15 changed files with 720 additions and 17 deletions
|
After Width: | Height: | Size: 4.4 KiB |
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 4.0 KiB |
|
After Width: | Height: | Size: 4.5 KiB |
@ -0,0 +1,38 @@ |
|||||
|
|
||||
|
|
||||
|
<template> |
||||
|
<div class="btns-wrap flex"> |
||||
|
<GuipButton type="normal" size="medium" @click="cancelClick">取消</GuipButton> |
||||
|
<GuipButton type="primary" size="medium" @click="confirmClick">保存</GuipButton> |
||||
|
</div> |
||||
|
</template> |
||||
|
<script> |
||||
|
import GuipButton from '@/components/GuipButton.vue'; |
||||
|
|
||||
|
export default { |
||||
|
name: '', |
||||
|
props: [''], |
||||
|
components: { |
||||
|
GuipButton |
||||
|
}, |
||||
|
data(){ |
||||
|
return{ |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
methods:{ |
||||
|
cancelClick(){ |
||||
|
this.$emit('cancel') |
||||
|
}, |
||||
|
confirmClick(){ |
||||
|
this.$emit('confirm') |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style scoped lang="scss"> |
||||
|
.btns-wrap{ |
||||
|
margin-top: 24px; |
||||
|
justify-content: flex-end; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,202 @@ |
|||||
|
<template> |
||||
|
<aside class="sidebar"> |
||||
|
<ul> |
||||
|
<li v-for="item in menuList" :key="item.path" > |
||||
|
<div :class="[$route.path == item.path ? 'active ceshi' : '', 'flex']" @click="gotoPath(item.path)"> |
||||
|
<img v-if="$route.path == item.path" :src="item.imgActive" alt=""> |
||||
|
<img v-else :src="item.img" alt=""> |
||||
|
{{ item.name }} |
||||
|
</div> |
||||
|
<p :class="[$route.path != item.path ? 'not-point':'','flex']" v-for="item1 in item.list" :key="item1.name">{{ item1.name }}</p> |
||||
|
|
||||
|
</li> |
||||
|
</ul> |
||||
|
</aside> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: 'Sidebar', |
||||
|
props: { |
||||
|
menuItems: { |
||||
|
type: Array, |
||||
|
required: true |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
menuList: [ |
||||
|
{ |
||||
|
name: '基本设置', |
||||
|
path: '/siteSetting/siteBaseSetting', |
||||
|
img: require('@/assets/site/sitebase.svg'), |
||||
|
imgActive: require('@/assets/site/sitebase_active.svg'), |
||||
|
list: [ |
||||
|
{ |
||||
|
name: '站点信息', |
||||
|
desc: '' |
||||
|
}, |
||||
|
{ |
||||
|
name: '域名设置', |
||||
|
desc: '' |
||||
|
}, |
||||
|
{ |
||||
|
name: '收款方式', |
||||
|
desc: '' |
||||
|
}, |
||||
|
] |
||||
|
}, |
||||
|
{ |
||||
|
name: '个性化设置', |
||||
|
path: '/siteSetting/sitePersonalization', |
||||
|
img: require('@/assets/site/gexinghua.svg'), |
||||
|
imgActive: require('@/assets/site/sitebase_active.svg'), |
||||
|
list: [ |
||||
|
{ |
||||
|
name: '网页模板', |
||||
|
desc: '' |
||||
|
}, |
||||
|
{ |
||||
|
name: '客服设置', |
||||
|
desc: '' |
||||
|
}, |
||||
|
{ |
||||
|
name: '功能显隐', |
||||
|
desc: '' |
||||
|
}, |
||||
|
{ |
||||
|
name: '安全提交', |
||||
|
desc: '' |
||||
|
}, |
||||
|
{ |
||||
|
name: '初始订单数', |
||||
|
desc: '' |
||||
|
}, |
||||
|
] |
||||
|
}, |
||||
|
{ |
||||
|
name: '移动端设置', |
||||
|
path: '/siteSetting/siteH5', |
||||
|
img: require('@/assets/site/siteh5.svg'), |
||||
|
imgActive: require('@/assets/site/sitebase_active.svg'), |
||||
|
list: [ |
||||
|
{ |
||||
|
name: '微信H5', |
||||
|
desc: '' |
||||
|
}, |
||||
|
{ |
||||
|
name: '小程序', |
||||
|
desc: '' |
||||
|
}, |
||||
|
] |
||||
|
}, |
||||
|
{ |
||||
|
name: '营销推广', |
||||
|
path: '/siteSetting/siteSem', |
||||
|
img: require('@/assets/site/sitesem.svg'), |
||||
|
imgActive: require('@/assets/site/sitebase_active.svg'), |
||||
|
list: [ |
||||
|
{ |
||||
|
name: 'SEO设置', |
||||
|
desc: '' |
||||
|
}, |
||||
|
{ |
||||
|
name: 'SEM设置', |
||||
|
desc: '' |
||||
|
}, |
||||
|
{ |
||||
|
name: '访问统计', |
||||
|
desc: '' |
||||
|
}, |
||||
|
] |
||||
|
} |
||||
|
] |
||||
|
} |
||||
|
}, |
||||
|
mounted() { |
||||
|
console.log(this.$route.path, '---'); |
||||
|
}, |
||||
|
methods: { |
||||
|
gotoPath(path) { |
||||
|
this.$router.push(path) |
||||
|
}, |
||||
|
activeArea(type){ |
||||
|
console.log(type); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped lang="scss"> |
||||
|
.sidebar { |
||||
|
width: 158px; |
||||
|
padding: 21px; |
||||
|
box-sizing: border-box; |
||||
|
background: #FFFFFF; |
||||
|
box-shadow: 0px 0px 11px 2px rgba(147, 147, 147, 0.11); |
||||
|
} |
||||
|
.ceshi{ |
||||
|
animation: fadeInOut 2s infinite; |
||||
|
} |
||||
|
ul { |
||||
|
list-style: none; |
||||
|
padding: 0; |
||||
|
} |
||||
|
.not-point{ |
||||
|
pointer-events: none; /* 阻止鼠标事件 */ |
||||
|
opacity: 0.5; /* 可选，降低透明度以视觉上表示不可用 */ |
||||
|
cursor: not-allowed; /* 改变鼠标光标样式，表示不可用 */ |
||||
|
} |
||||
|
|
||||
|
li { |
||||
|
margin-bottom: 10px; |
||||
|
|
||||
|
div { |
||||
|
letter-spacing: 0.08em; |
||||
|
color: #1E2226; |
||||
|
margin: 11px 0; |
||||
|
cursor: pointer; |
||||
|
img{ |
||||
|
margin-right: 6px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
p { |
||||
|
margin: 9px 0; |
||||
|
letter-spacing: 0.08em; |
||||
|
line-height: 18px; |
||||
|
color: #8A9099; |
||||
|
cursor: pointer; |
||||
|
&:hover{ |
||||
|
color: #006AFF; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
/* { |
||||
|
display: block; |
||||
|
padding: 8px 12px; |
||||
|
text-decoration: none; |
||||
|
color: #333; |
||||
|
border-radius: 4px; |
||||
|
} */ |
||||
|
/* |
||||
|
:hover { |
||||
|
background: #e0e0e0; |
||||
|
} */ |
||||
|
|
||||
|
.active { |
||||
|
font-weight: bold; |
||||
|
letter-spacing: 0.08em; |
||||
|
color: #006AFF; |
||||
|
} |
||||
|
.item-active{ |
||||
|
color: #006AFF; |
||||
|
} |
||||
|
|
||||
|
/* |
||||
|
.exact-active { |
||||
|
background: #1976d2; |
||||
|
color: white; |
||||
|
} */ |
||||
|
</style> |
||||
@ -0,0 +1,315 @@ |
|||||
|
<template> |
||||
|
<div class="site-setting-wrap min-flex"> |
||||
|
<div class="siteMessage1 flex-common"> |
||||
|
<h3>站点信息</h3> |
||||
|
<el-form :model="siteForm" :rules="siteFormrules" ref="formRef"> |
||||
|
<div class="flex-wrap"> |
||||
|
<div class="flex-left"> |
||||
|
<GuipInput ref="GuipInput" column="column" label="站点简称" :maxlength="10" :showWordLimit="true" |
||||
|
desc="这是是右侧文案" v-model="siteForm.site_alias" prop="site_alias" |
||||
|
placeholder="仅自己区分站点销售渠道，客户看不到" /> |
||||
|
<GuipInput ref="GuipInput" column="column" label="公司名称" desc="在站点首页底部“关于我们”展示" |
||||
|
v-model="siteForm.company_name" prop="company_name" placeholder="非必填" /> |
||||
|
</div> |
||||
|
<div class="flex-line"></div> |
||||
|
<div class="flex-right"> |
||||
|
<GuipInput ref="GuipInput" column="column" label="公司地址" desc="在站点首页底部“关于我们”展示" |
||||
|
v-model="siteForm.company_address" prop="company_address" placeholder="非必填" /> |
||||
|
<GuipInput ref="GuipInput" column="column" label="公司电话" desc="在站点首页底部“关于我们”展示" |
||||
|
v-model="siteForm.company_phone" prop="company_phone" placeholder="非必填" /> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-form> |
||||
|
<GroupFormBtns @cancel="cancelClick" @confirm="confirmClick('siteForm')" /> |
||||
|
|
||||
|
</div> |
||||
|
<div class="siteMessage2 flex-common"> |
||||
|
<h3>站点信息</h3> |
||||
|
<el-form :model="siteForm1" :rules="siteFormrules1" ref="formRef"> |
||||
|
<div class="flex-wrap"> |
||||
|
<div class="flex-left"> |
||||
|
<GuipFormItem column="column" class="mb24" label="域名来源" required="true"> |
||||
|
<GuipRadio slot="formDom" v-model="siteForm1.domain_source" :options="domain_source" |
||||
|
prop="domain_source" @change="domain_radioChange" /> |
||||
|
</GuipFormItem> |
||||
|
</div> |
||||
|
<div class="flex-line"></div> |
||||
|
<div class="flex-right"> |
||||
|
<GuipFormItem column="column" label="域名设置" required="true"> |
||||
|
<GuipInput slot="formDom" v-model="siteForm1.domain_set" placeholder="仅支持数字、字母"> |
||||
|
<span slot="appendshow">.chachongz.com</span> |
||||
|
</GuipInput> |
||||
|
</GuipFormItem> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-form> |
||||
|
<GroupFormBtns @cancel="cancelClick" @confirm="confirmClick('siteForm1')" /> |
||||
|
|
||||
|
</div> |
||||
|
<div class="siteMessage3 flex-common"> |
||||
|
<h3>店铺收款</h3> |
||||
|
<el-form :model="siteForm2" ref="formRef"> |
||||
|
<div class="flex-wrap"> |
||||
|
<div class="flex-left"> |
||||
|
<GuipFormItem column="column" class="mb24"> |
||||
|
<div slot="formLeft" class="form-top-icon"> |
||||
|
<img src="@/assets/register/weixin.svg" style="width: 26px;height: 26px;" |
||||
|
alt=""><span>微信收款</span> |
||||
|
</div> |
||||
|
<CustomDropdown slot="formDom" v-model="siteForm1.weixin_pay" :options="options_weixin" |
||||
|
@change="changeSelectWeixin" placeholder="请选择" :options_null="options_weixin_null" |
||||
|
@changeNormal="changeNormalWeixin"> |
||||
|
<!-- 自定义触发按钮 --> |
||||
|
<template #trigger> |
||||
|
<span v-if="selectedItemWeixin" |
||||
|
style="color: #1E2226;font-family: Microsoft YaHei UI;">{{ |
||||
|
select_placeholder_weixin ? select_placeholder_weixin : |
||||
|
selectedItemWeixin.desc }}</span> |
||||
|
<span v-else>请选择</span> |
||||
|
</template> |
||||
|
<template #normal> |
||||
|
<div class="flex flex-between noraml-jump"> |
||||
|
<div class="left"> |
||||
|
<b>绑定新微信收款</b> |
||||
|
<p class="one">需要使用您公司的微信支付</p> |
||||
|
<p>需在微信商户平台-产品中心开通Native支付</p> |
||||
|
</div> |
||||
|
<div class="right"> |
||||
|
<GuipButton type="primary" size="medium">前往绑定</GuipButton> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<!-- 自定义下拉选项 --> |
||||
|
<template #item="{ item }"> |
||||
|
<div class="flex-between"> |
||||
|
<div class="left"> |
||||
|
<p class="one">{{ item.label }}</p> |
||||
|
<p>{{ item.desc }}</p> |
||||
|
</div> |
||||
|
<div class="right"> |
||||
|
<img v-if="selectedItem.value == item.value" |
||||
|
src="../assets/register/drop-selected.svg" alt=""> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
</CustomDropdown> |
||||
|
</GuipFormItem> |
||||
|
<GuipFormItem column="column"> |
||||
|
<div slot="formLeft" class="form-top-icon"> |
||||
|
<img src="@/assets/register/zhifubao.svg" style="width: 26px;height: 26px;" |
||||
|
alt=""><span>支付宝收款</span> |
||||
|
</div> |
||||
|
<!-- <GuipSelect slot="formDom" v-model="siteForm2.zhifubao_pay" prop="zhifubao_pay" |
||||
|
:options="options_zhifubao" placeholder="未绑定支付宝收款" /> --> |
||||
|
<CustomDropdown slot="formDom" v-model="siteForm1.zhifubao_pay" :options="options_weixin" |
||||
|
@change="changeSelectWeixin" placeholder="请选择" :options_null="options_weixin_null" |
||||
|
@changeNormal="changeNormalWeixin"> |
||||
|
<!-- 自定义触发按钮 --> |
||||
|
<template #trigger> |
||||
|
<span v-if="selectedItemWeixin" |
||||
|
style="color: #1E2226;font-family: Microsoft YaHei UI;">{{ |
||||
|
select_placeholder_weixin ? select_placeholder_weixin : |
||||
|
selectedItemWeixin.desc }}</span> |
||||
|
<span v-else>请选择</span> |
||||
|
</template> |
||||
|
<template #normal> |
||||
|
<div class="flex flex-between noraml-jump"> |
||||
|
<div class="left"> |
||||
|
<b>绑定新支付宝收款</b> |
||||
|
<p class="one">需要使用您公司的支付宝支付</p> |
||||
|
<p>需在支付宝商户平台-产品中心开通Native支付</p> |
||||
|
</div> |
||||
|
<div class="right"> |
||||
|
<GuipButton type="primary" size="medium">前往绑定</GuipButton> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<!-- 自定义下拉选项 --> |
||||
|
<template #item="{ item }"> |
||||
|
<div class="flex-between"> |
||||
|
<div class="left"> |
||||
|
<p class="one">{{ item.label }}</p> |
||||
|
<p>{{ item.desc }}</p> |
||||
|
</div> |
||||
|
<div class="right"> |
||||
|
<img v-if="selectedItem.value == item.value" |
||||
|
src="../assets/register/drop-selected.svg" alt=""> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
</CustomDropdown> |
||||
|
</GuipFormItem> |
||||
|
</div> |
||||
|
<div class="flex-line"></div> |
||||
|
<div class="flex-right"> |
||||
|
<!-- <div>{{ input1 }}</div> --> |
||||
|
<div class="addStore flex"> |
||||
|
<img src="@/assets/addIcon.svg" alt="">添加其他收款方式 |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-form> |
||||
|
<GroupFormBtns @cancel="cancelClick" @confirm="confirmClick('siteForm2')" /> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
<script> |
||||
|
// import GuipInput from '@/components/GuipInput.vue'; |
||||
|
import store from '../store'; |
||||
|
import { mapState } from 'vuex'; |
||||
|
import GuipFormItem from '@/components/GuipFormItem.vue'; |
||||
|
import GuipInput from '@/components/GuipInput.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'; |
||||
|
|
||||
|
export default { |
||||
|
// 站点设置 |
||||
|
name: '', |
||||
|
props: [''], |
||||
|
components: { |
||||
|
GuipRadio, |
||||
|
GuipFormItem, |
||||
|
GuipInput, |
||||
|
CustomDropdown, |
||||
|
GuipButton, |
||||
|
GroupFormBtns |
||||
|
|
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
siteForm: { |
||||
|
company_name: '', |
||||
|
company_address: '', |
||||
|
company_phone: '', |
||||
|
site_alias: '', |
||||
|
}, |
||||
|
siteFormrules: { |
||||
|
site_alias: [ |
||||
|
{ required: true, message: '请输入站点简称', trigger: 'blur' } |
||||
|
] |
||||
|
}, |
||||
|
siteForm1: { |
||||
|
domain_set: '', |
||||
|
domain_source: '平台免费域名', |
||||
|
}, |
||||
|
siteForm2: { |
||||
|
zhifubao_pay: '', |
||||
|
weixin_pay: '', |
||||
|
}, |
||||
|
siteFormrules1: { |
||||
|
domain_source: [ |
||||
|
{ required: true, message: '请输入站点简称', trigger: 'blur' } |
||||
|
] |
||||
|
}, |
||||
|
domain_source: [ |
||||
|
{ label: '平台免费域名', value: '平台免费域名', selectedLabel: "平台免费域名" }, |
||||
|
{ label: '我自己有域名', value: '我自己有域名', selectedLabel: "我自己有域名" }, |
||||
|
], |
||||
|
options_weixin_null: { |
||||
|
label: '暂无收款账号', |
||||
|
value: '暂时没有收款账号，我想稍后配置', |
||||
|
desc: '暂无收款账号，稍后配置' |
||||
|
}, |
||||
|
select_placeholder_weixin: '暂无收款账号，稍后配置', |
||||
|
selectedItemWeixin: {},//微信收款方式 |
||||
|
options_weixin: [], |
||||
|
options_zhifubao: [], |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
...mapState(['pageTitle']) // 从Vuex映射showSidebar状态到组件的计算属性中 |
||||
|
}, |
||||
|
mounted() { |
||||
|
store.commit('SET_PAGETITLE', '基本设置'); |
||||
|
}, |
||||
|
methods: { |
||||
|
changeNormalWeixin() { |
||||
|
|
||||
|
}, |
||||
|
changeSelectWeixin(item, flag) { |
||||
|
if (flag) { |
||||
|
this.select_placeholder_weixin = this.options_weixin_null.desc; |
||||
|
return |
||||
|
} |
||||
|
this.selectedItem = { ...item }; |
||||
|
console.log(this.selectedItem, 'this.selectedItem===='); |
||||
|
}, |
||||
|
// 销售渠道 |
||||
|
domain_radioChange(type) { |
||||
|
console.log(type, '--'); |
||||
|
}, |
||||
|
onSwitchChange(data) { |
||||
|
console.log(data, '---'); |
||||
|
}, |
||||
|
submitForm(form) { |
||||
|
console.log(form, '-----'); |
||||
|
this.$refs.formRef.validate((valid) => { |
||||
|
console.log(this.form, '======formxinxi'); |
||||
|
if (valid) { |
||||
|
alert('提交成功!'); |
||||
|
} else { |
||||
|
return false; |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
cancelClick() { |
||||
|
console.log('quxiao'); |
||||
|
}, |
||||
|
confirmClick(type) { |
||||
|
console.log(type, '确认'); |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style lang="scss"> |
||||
|
.addStore { |
||||
|
margin-top: 12px; |
||||
|
border-radius: 4px; |
||||
|
opacity: 1; |
||||
|
/* text/text_white_2 */ |
||||
|
border: 1px dashed #BABDC2; |
||||
|
padding: 15px 20px; |
||||
|
color: #626573; |
||||
|
justify-content: center; |
||||
|
|
||||
|
img { |
||||
|
margin-right: 12px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.site-setting-wrap{ |
||||
|
width: 100%; |
||||
|
} |
||||
|
.siteMessage2{ |
||||
|
margin: 12px 0; |
||||
|
} |
||||
|
.domain-wrap { |
||||
|
.domain-item { |
||||
|
margin-bottom: 10px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.domain-item p:last-child { |
||||
|
padding-left: 23px; |
||||
|
color: #8A9099; |
||||
|
} |
||||
|
|
||||
|
p { |
||||
|
text-align: left; |
||||
|
line-height: 18px; |
||||
|
margin-bottom: 8px; |
||||
|
} |
||||
|
|
||||
|
.domain-box { |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
justify-content: flex-start; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,52 @@ |
|||||
|
<template> |
||||
|
<div class="page-title-wrap min-flex"> |
||||
|
</div> |
||||
|
</template> |
||||
|
<script> |
||||
|
// import GuipInput from '@/components/GuipInput.vue'; |
||||
|
import { mapState } from 'vuex'; |
||||
|
export default { |
||||
|
// 站点设置 |
||||
|
name: '', |
||||
|
props: [''], |
||||
|
components: { |
||||
|
// GuipInput, |
||||
|
|
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
...mapState(['pageTitle']) // 从Vuex映射showSidebar状态到组件的计算属性中 |
||||
|
}, |
||||
|
methods: { |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style lang="scss"> |
||||
|
.page-title-wrap { |
||||
|
width: 100%; |
||||
|
height: 72px; |
||||
|
/* 自动布局 */ |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
padding: 24px 12px; |
||||
|
box-sizing: border-box; |
||||
|
|
||||
|
b { |
||||
|
/* headline/haeadline_3_bold */ |
||||
|
font-family: Microsoft YaHei UI; |
||||
|
font-size: 18px; |
||||
|
font-weight: bold; |
||||
|
line-height: 24px; |
||||
|
letter-spacing: 0.06em; |
||||
|
font-variation-settings: "opsz" auto; |
||||
|
/* text/text_1 */ |
||||
|
color: #1E2226; |
||||
|
display: inline-block; |
||||
|
text-align: left; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,59 @@ |
|||||
|
<template> |
||||
|
<div class="siteSetting-wrap"> |
||||
|
<SetLeftMenu :menu-items="menuItems" /> |
||||
|
|
||||
|
<!-- 主内容区域 --> |
||||
|
<main class="main-content"> |
||||
|
<!-- 面包屑 位置 --> |
||||
|
|
||||
|
<PageTitle /> |
||||
|
|
||||
|
<router-view></router-view> |
||||
|
<Footer></Footer> |
||||
|
</main> |
||||
|
</div> |
||||
|
</template> |
||||
|
<script> |
||||
|
// import SiteBaseSetting from './SiteBaseSetting.vue'; |
||||
|
import PageTitle from '@/components/PageTitle.vue'; |
||||
|
import Footer from '@/components/Footer.vue'; |
||||
|
import SetLeftMenu from '@/components/SetLeftMenu.vue' |
||||
|
export default { |
||||
|
// 站点设置 |
||||
|
name: '', |
||||
|
props: [''], |
||||
|
components: { |
||||
|
PageTitle, |
||||
|
Footer, |
||||
|
SetLeftMenu, |
||||
|
// SiteBaseSetting |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
menuItems: [ |
||||
|
{ title: '页面1', path: '/siteSetting/siteBaseSetting' }, |
||||
|
{ title: '页面2', path: '/siteSetting/sitePersonalization' }, |
||||
|
{ title: '页面3', path: 'page3' } |
||||
|
] |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style scoped lang="scss"> |
||||
|
.siteSetting-wrap { |
||||
|
display: flex; |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
// .sidebar { |
||||
|
// width: 250px; |
||||
|
// background: #f5f5f5; |
||||
|
// padding: 20px; |
||||
|
// } |
||||
|
|
||||
|
.main-content { |
||||
|
flex: 1; |
||||
|
padding: 12px; |
||||
|
overflow-y: auto; |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue