优化样式

This commit is contained in:
aixianling
2023-09-27 09:47:29 +08:00
parent 43c54fbeed
commit a2f2737741
3 changed files with 28 additions and 7 deletions

View File

@@ -12,10 +12,13 @@
<div class="c-f00 mt-16" v-text="`¥${pay.price}`"/>
</div>
</div>
<div v-if="search.module == '1' " class="payments mb-16">
<div v-else-if="search.module == '1' " class="payments mb-16">
<div class="card" v-for="pay in payments" :key="pay.id" :class="{active:pay.id==selected.id}"
@click="getQrcode(pay)">
<div class="c-f00 mt-16" v-text="`¥${pay.price}`"/>
<div class="mt-16 flex-base center">
<div class="c-f00 f-20 mr-4" v-text="`¥${pay.price}`"/>
<div class="c-999 through" v-text="`¥${pay.originPrice}`"/>
</div>
<div class="c-999 mt-16" v-text="`${pay.coin}金币`"/>
</div>
</div>
@@ -31,7 +34,8 @@
<div v-else class="qrcode c-666">请选择<br>项目</div>
<div class="c-999 ml-16">
<div class="flex-center mb-16">
应付金额<div class="c-f00" style="font-size: 20px;">{{ selected.price }}</div>
应付金额
<div class="c-f00" style="font-size: 20px;">{{ selected.price }}</div>
</div>
<div class="wechat flex-center">
微信扫码支付
@@ -40,8 +44,8 @@
</div>
</el-row>
<div class="bottom flex-center">
<el-button size="small">取消支付</el-button>
<el-button size="small">已扫码支付</el-button>
<el-button size="small" @click="$emit('cancel')">取消支付</el-button>
<el-button size="small" @click="$emit('ok')">已扫码支付</el-button>
</div>
</div>
</section>
@@ -66,7 +70,7 @@ export default {
}
},
computed: {
wechatLogo: v => require("../assets/wechat_logo.png")
wechatLogo: () => require("../assets/wechat_logo.png")
},
methods: {
getPayments() {
@@ -121,6 +125,7 @@ export default {
li {
list-style-type: circle;
margin-left: 32px;
}
}
@@ -133,7 +138,7 @@ export default {
user-select: none;
text-align: center;
border: 1px solid #ddd;
padding: 32px 64px;
padding: 32px 16px;
border-radius: 4px;
&.active {