From 269472ce6822871f5509d26efeeb4e7f99c605ca Mon Sep 17 00:00:00 2001
From: WindowBird <13870814+windows-bird@user.noreply.gitee.com>
Date: Thu, 14 Aug 2025 17:28:33 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B4=BB=E5=8A=A8=E6=8A=A5=E5=90=8D=E9=9D=99?=
=?UTF-8?q?=E6=80=81=E7=95=8C=E9=9D=A22.0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
pages/activity/application.vue | 171 ++++++++++++++++++++++++++++++---
1 file changed, 157 insertions(+), 14 deletions(-)
diff --git a/pages/activity/application.vue b/pages/activity/application.vue
index 30413e8..6d9f001 100644
--- a/pages/activity/application.vue
+++ b/pages/activity/application.vue
@@ -7,36 +7,56 @@
选择活动日期
- A
- B
- C
+
+ {{ date.label }}
+
选择活动时段
- A
- B
- C
+
+ {{ time.label }}
+
参与活动人数
- 1人
- 2人
- 自定义
+
+ {{ number.label }}
+
姓名
-
+
联系号码
-
+
- 100
- 提交报名
+ {{ getSelectedDateLabel() }} {{ getSelectedNumberLabel() }}
+ 提交报名
@@ -61,12 +81,113 @@ export default {
MonkEnum,
monkList: [],
searchName: "",
+
+ // 选择项数据
+ dateOptions: [
+ { label: "06月27日", value: "06-27" },
+ { label: "06月28日", value: "06-28" },
+ { label: "06月29日", value: "06-29" },
+ ],
+ timeOptions: [
+ { label: "08:00-12:00", value: "08-12" },
+ { label: "13:00-18:00", value: "13-18" },
+ ],
+ numberOptions: [
+ { label: "1人", value: "1" },
+ { label: "2人", value: "2" },
+ { label: "自定义", value: "custom" },
+ ],
+
+ // 选中的值
+ selectedDate: "06-27",
+ selectedTime: "08-12",
+ selectedNumber: "1",
+
+ // 表单数据
+ formData: {
+ name: "",
+ phone: "",
+ },
+
+ // 价格计算
+ price: 100,
};
},
onLoad() {
this.fetchMonkList();
},
methods: {
+ // 选择日期
+ selectDate(value) {
+ this.selectedDate = value;
+ },
+
+ // 选择时段
+ selectTime(value) {
+ this.selectedTime = value;
+ },
+
+ // 选择人数
+ selectNumber(value) {
+ this.selectedNumber = value;
+ // 根据人数计算价格
+ if (value === "1") {
+ this.price = 100;
+ } else if (value === "2") {
+ this.price = 180;
+ } else {
+ this.price = 100; // 自定义价格，可以根据需要调整
+ }
+ },
+
+ // 提交报名
+ submitApplication() {
+ if (!this.formData.name.trim()) {
+ uni.showToast({
+ title: "请输入姓名",
+ icon: "none",
+ });
+ return;
+ }
+
+ if (!this.formData.phone.trim()) {
+ uni.showToast({
+ title: "请输入手机号",
+ icon: "none",
+ });
+ return;
+ }
+
+ // 这里可以添加提交逻辑
+ console.log("提交数据:", {
+ date: this.selectedDate,
+ time: this.selectedTime,
+ number: this.selectedNumber,
+ ...this.formData,
+ });
+
+ uni.showToast({
+ title: "提交成功",
+ icon: "success",
+ });
+ },
+
+ // 获取选中的日期标签
+ getSelectedDateLabel() {
+ const selectedDate = this.dateOptions.find(
+ (date) => date.value === this.selectedDate,
+ );
+ return selectedDate ? selectedDate.label : "";
+ },
+
+ // 获取选中的人数标签
+ getSelectedNumberLabel() {
+ const selectedNumber = this.numberOptions.find(
+ (number) => number.value === this.selectedNumber,
+ );
+ return selectedNumber ? selectedNumber.label : "";
+ },
+
async fetchMonkList() {
try {
const res = await getMonkList({ name: this.searchName });
@@ -134,6 +255,12 @@ export default {
font-weight: 700;
font-size: 28rpx;
color: #c7a26d;
+ transition: all 0.3s ease;
+
+ &.selected {
+ background: #a24242;
+ color: #ffffff;
+ }
}
.scroll-view-item_time {
@@ -148,11 +275,16 @@ export default {
font-weight: 700;
font-size: 30rpx;
color: #c7a26d;
+ transition: all 0.3s ease;
+
+ &.selected {
+ background: #a24242;
+ color: #ffffff;
+ }
}
.scroll-view-item_number {
text-align: center;
-
line-height: 64rpx;
display: inline-block;
width: 170rpx;
@@ -164,6 +296,11 @@ export default {
font-weight: 400;
font-size: 32rpx;
color: #c7a26d;
+ transition: all 0.3s ease;
+
+ &.selected {
+ color: #695347;
+ }
}
}
}
@@ -224,6 +361,12 @@ export default {
line-height: 72rpx;
text-align: center;
margin-right: 10rpx;
+ transition: all 0.3s ease;
+
+ &:active {
+ background: #8a3636;
+ transform: scale(0.98);
+ }
}
}
}