WindowBird/buddhism
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

二维码样式修改1.0,我的预约页面修改

Browse Source
This commit is contained in:
WindowBird 2025-08-27 12:02:17 +08:00
parent 9c7181ea2e
commit a485c3cd80
2 changed files with 42 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
components/qrcode-modal/qrcode-modal.vue
View File

@ -1,5 +1,5 @@
<template>
<view v-if="visible" class="qrcode-modal-overlay" @click="handleOverlayClick">
<view v-if="visible" class="qrcode-modal-overlay" @click="handleClose">
<view class="qrcode-modal" @click.stop>
<view class="modal-content">
<view class="qrcode-container">
@ -16,6 +16,7 @@
</view>
</view>
</view>
<view class="close" @click="handleClose">X</view>
</view>
</template>
@ -42,13 +43,10 @@ export default {
type: String,
default: "",
},
title: {
type: String,
default: "核销验证码",
},
description: {
type: String,
default: "此二维码可直接检票",
default: "此二维码 可直接检票",
},
},
data() {
@ -63,10 +61,6 @@ export default {
},
methods: {
handleOverlayClick() {
this.handleClose();
},
handleClose() {
this.$emit("close");
},
@ -75,6 +69,18 @@ export default {
</script>
<style lang="scss" scoped>
.close {
margin-top: 30rpx;
width: 80rpx;
height: 80rpx;
font-size: 60rpx;
line-height: 80rpx;
text-align: center;
color: #fff;
border-radius: 999rpx;
border: white solid 1px;
}
.qrcode-modal-overlay {
position: fixed;
top: 0;
@ -86,6 +92,8 @@ export default {
align-items: center;
justify-content: center;
z-index: 9999;
flex-direction: column;
}
.qrcode-modal {

58
pages/personalCenter/myAppointment.vue
View File

@ -60,10 +60,7 @@
<!-- 操作按钮 -->
<view class="card-actions">
<!-- 只有待核销状态才显示出示码券按钮 -->
<view
v-if="Number(item.state) === 1 || Number(item.state) === 2"
class="action-btn"
></view>
<view v-if="Number(item.state) === 1" class="action-btn"></view>
<view
v-if="Number(item.state) === 1"
class="action-btn secondary"
@ -86,14 +83,14 @@
<text class="btn-text">取消预约</text>
</view>
<!-- 已核销状态显示完成提示 -->
<view v-if="Number(item.state) === 2" class="action-btn completed">
<image
class="btn-icon"
mode="aspectFit"
src="https://api.ccttiot.com/image-1755237410755.png"
/>
<text class="btn-text">已完成</text>
</view>
<!-- <view v-if="Number(item.state) === 2" class="action-btn completed">-->
<!-- <image-->
<!-- class="btn-icon"-->
<!-- mode="aspectFit"-->
<!-- src="https://api.ccttiot.com/image-1755237410755.png"-->
<!-- />-->
<!-- <text class="btn-text">已完成</text>-->
<!-- </view>-->
<!-- &lt;!&ndash; 取消预约状态显示已取消提示 &ndash;&gt;-->
<!-- <view v-if="Number(item.state) === 3" class="action-btn canceled">-->
<!-- <image-->
@ -366,34 +363,39 @@ export default {
display: flex;
background: #fff;
padding: 8rpx;
&.first-child {
border-right: 2px solid #c7a26d;
}
}
.tab-item {
flex: 1;
height: 80rpx;
height: 116rpx;
display: flex;
align-items: center;
justify-content: center;
border-radius: 12rpx;
transition: all 0.3s ease;
.tab-text {
font-size: 32rpx;
color: #808080;
font-weight: 400;
}
&.active {
background: #c7a26d;
//background: #c7a26d;
.tab-text {
color: #fff;
color: #c7a26d;
font-weight: 500;
height: 116rpx;
line-height: 116rpx;
border-bottom: 2px solid #c7a26d;
}
}
}
.tab-text {
font-size: 32rpx;
color: #695347;
font-weight: 400;
}
// 预约列表
.appointment-list {
width: 650rpx;
@ -434,18 +436,6 @@ export default {
&.status-pending {
background: #fef3e0; // 待核销 - 橙色
}
&.status-verified {
background: #00b894; // 已核销 - 绿色
}
&.status-canceled {
background: #000000; // 取消预约 - 灰色
}
&.status-default {
background: #74b9ff; // 默认 - 蓝色
}
}
.status-text {