zq
4 months ago
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