
9 changed files with 313 additions and 75 deletions
After Width: | Height: | Size: 2.2 KiB |
After Width: | Height: | Size: 3.4 KiB |
After Width: | Height: | Size: 3.4 KiB |
After Width: | Height: | Size: 2.4 KiB |
@ -0,0 +1,62 @@ |
|||
<template> |
|||
<div class="domain-wrap"> |
|||
<p>设置自己的域名,需要做 2 步站外操作。如果暂时未准备好,或打算稍后设置,可以先选用平台免费域名,平台随时支持域名修改。 </p> |
|||
<div class="domain-box"> |
|||
<div class="domain-item"> |
|||
<p>1. 域名必须在阿里云完成 ICP 备案</p> |
|||
<p>备案网址:https://beian.aliyun.com</p> |
|||
</div> |
|||
<div class="domain-item"> |
|||
<p>2. 域名要解析到平台服务器上</p> |
|||
<p>备案网址:https://beian.aliyun.com</p> |
|||
</div> |
|||
<div class="domain-item"> |
|||
<p>3. 域名填写</p> |
|||
<el-input placeholder="填写完整域名" /> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
// import GuipInput from '@/components/GuipInput.vue'; |
|||
|
|||
export default { |
|||
name: '', |
|||
props: [''], |
|||
components: { |
|||
// GuipInput, |
|||
|
|||
}, |
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
}, |
|||
methods: { |
|||
onSwitchChange(data) { |
|||
console.log(data, '---'); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style lang="scss"> |
|||
.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,81 @@ |
|||
<template> |
|||
<div class="payment-wrap"> |
|||
|
|||
<div class="payment-item" v-for="item in paymentList" :key="item.name"> |
|||
<dl> |
|||
<dt> |
|||
<img v-if="item.type == '1'" src="@/assets/register/weixin_pay.png" alt=""> |
|||
<img v-if="item.type == '2'" src="@/assets/register/zhifubao_pay.png" alt=""> |
|||
<img v-if="item.type == '3'" src="@/assets/register/taobao_pay.png" alt=""> |
|||
<img v-if="item.type == '4'" src="@/assets/register/jingdong_pay.png" alt=""> |
|||
</dt> |
|||
<dd> |
|||
<p>{{ item.name }}</p> |
|||
<p>{{ item.num }}</p> |
|||
</dd> |
|||
</dl> |
|||
<GuipSwitch :modelValue="item.flag" activeText="开启" inactiveText="关闭" @change="onSwitchChange"> |
|||
</GuipSwitch> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
import GuipSwitch from '@/components/GuipSwitch.vue'; |
|||
|
|||
export default { |
|||
name: '', |
|||
props:['paymentList'], |
|||
components: { |
|||
GuipSwitch |
|||
}, |
|||
data(){ |
|||
return { |
|||
payImg:{ |
|||
'1':'weixin_pay.png', |
|||
'2':'zhifubao_pay.png', |
|||
'3':'taobao_pay.png', |
|||
'4':'jingdong_pay.png', |
|||
} |
|||
} |
|||
}, |
|||
methods:{ |
|||
onSwitchChange(data){ |
|||
console.log(data,'---'); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style lang="scss"> |
|||
.payment-wrap{ |
|||
.payment-item{ |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
dl{ |
|||
display: flex; |
|||
} |
|||
dt img{ |
|||
width: 32px; |
|||
height: 32px; |
|||
} |
|||
dd{ |
|||
margin-left: 12px; |
|||
p{ |
|||
font-size: 12px; |
|||
font-weight: normal; |
|||
line-height: 13px; |
|||
letter-spacing: 0.08em; |
|||
font-variation-settings: "opsz" auto; |
|||
text-align: left; |
|||
color: #8A9099; |
|||
} |
|||
} |
|||
dd p:first-child{ |
|||
font-size: 14px; |
|||
line-height: 18px; |
|||
margin-bottom: 6px; |
|||
color: #1E2226; |
|||
} |
|||
} |
|||
} |
|||
</style> |
Loading…
Reference in new issue