From bfd8dc3f400f8ef09620106ca8a1874e9bbc98b8 Mon Sep 17 00:00:00 2001 From: wangyx <2838268875@qq.com> Date: Thu, 21 Aug 2025 17:54:39 +0800 Subject: [PATCH] =?UTF-8?q?=E5=85=B1=E4=BA=AB=E7=A9=BA=E9=97=B4=E4=BC=98?= =?UTF-8?q?=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- api/index.js | 4 + images/mine/s3.png | Bin 0 -> 653 bytes pages/mine/mine.wxml | 2 +- subpages/images/icon01.png | Bin 0 -> 1156 bytes subpages/images/icon02.png | Bin 0 -> 653 bytes subpages/mine/mySpace/mySpace.js | 39 ++-------- subpages/mine/mySpace/mySpace.wxml | 12 +-- subpages/space/list/list.js | 2 +- subpages/space/list/list.wxml | 20 ++--- subpages/space/list/list.wxss | 2 +- subpages/space/reserve/reserve.js | 110 +++++++++++++++++----------- subpages/space/reserve/reserve.wxml | 1 + subpages/space/reserve/reserve.wxss | 46 +++++++++--- 13 files changed, 138 insertions(+), 100 deletions(-) create mode 100644 images/mine/s3.png create mode 100644 subpages/images/icon01.png create mode 100644 subpages/images/icon02.png diff --git a/api/index.js b/api/index.js index e327d30..e5bf3d2 100644 --- a/api/index.js +++ b/api/index.js @@ -83,3 +83,7 @@ export function spacePage(pamars) { export function spaceInfo(pamars) { return fly.get(`/bys/mzShareSpace/detail`, pamars); } +// 根据共享空间和日期查询可预约时间段; +export function queryAppointTime(pamars) { + return fly.get(`/bys/mzShareSpace/queryAppointTime`, pamars); +} diff --git a/images/mine/s3.png b/images/mine/s3.png new file mode 100644 index 0000000000000000000000000000000000000000..d983785bcdaf208870142ba3fc6ab0073e338e3c GIT binary patch literal 653 zcmV;80&@L{P)Px%M@d9MR9HvtmqBO~K@^7Ho1_#99ts`=dn{5=pXq8AT^LeM1hbYl~UCcB&Lrd?s@vWK1b z{~!OG*_lNM_`rbkK?vxzLt%npf?gBwTJN|9xy)S#fGGex;MJ_Tp1zS{3&k=0k)5tB zAm7Z-0n)6$V1KD0-V`zYRy&WjfTy2j4@Udg=bpmth*y=`zdDxr-pZ>jAeZ?`0D8I` zfB?XSmMV4xII(FY31MM300}8sjHMrhfZe9uRf3bx^F!4L-L=+7x5jSj2;fPztY+3u zWWKm+F*oN&tcfCa<(>89W^NV;=iHceJcr1hJ2#Y)fpu;;a z-&BEJSkEDEiP!ObvM4QTkI!XUCWm>*b6W>n)S`; zn4lZ6Ud;Kw025}OBawBS1!f?q#IlxIskQjr>wAOcAIiGk4+Mm8TVemuN-Vk6IEyEw zaghKP0{~b8qDvy4e%y3fs2zDPjbWwWIszQsBhXi@Qn^z&e(mEw*R4GQa - {{item.label}} + {{item.label}} diff --git a/subpages/images/icon01.png b/subpages/images/icon01.png new file mode 100644 index 0000000000000000000000000000000000000000..7fcc05839b33897f9bc6908a59ae992a1154e7c9 GIT binary patch literal 1156 zcmV-~1bh35P)Px(K1oDDR9HvVnSW?gR}{y;=Owl&^+%z$vC`U&rYWUXs0@{wZu@&1*a;g$WPeQk zLy<8RRJMr>L2yMFW6Z&R;9uJq3@ZC`|LB^!IEIW=o0@8|w%8^XX=|)8&3kv;i|O*( z``)|nwS?~e6T&^`+)vKA=iGB|2p&gWG}>hly#~f!0Z|yhW&rD6n0o@?As9=7=x>d& zYZH-3pO>Y`jZ)3^>mkzhLz<@TV~o|i(IujB!!UkiKHs;GIy>*G>M8-&#$rJ&pFhih z!>WeueO8MxzHnbP*-C==+`Ud zHLF#)Hzy;JBR2E$sbDnP3t*2cuXq=}l8QvSW$Mxpml&?VC52o9Sck02H!Up!?1P~p{Qmf{H%Oux=JT}_ zO3(t}azeX57(`Dfgn}^xz(>Qw_$8h81X-Nf!X`fX+`n!Qs~IGRi%&(tyb**&>?cLRy81o%T~B>(|U!{ydiyk1qMsv_jB zPEX_gL;^X3?@+a&0k2Z9zyDJ(c1}fQgWr#z+uG2vcCCu|5}ChdXR&W^5E)%p(~-sl?nI-nn%PQ}gpGcCK&_4uY{(JL#7L0RgwUyj;boqs-Xz z=h!fqA{?x%!#rcA?`@TpQoVF8hj(w^ z#?aiHH6zgs2h_osCX?b}?P+SlI-gGf>{!3vBo@zP@J2koke%h427@sH$p`;_t)l}k z1p+3$8?&=QZaSaG;ban7tHdEPYypd{@&viFbEj#co(B(bacs;sN*^~i;=_9L?I0A3 zsU^w_K-&-(R+j-@o}9$#d-rSszi4j8d$qMD85e*e#EwbAt;+zP>N+}a-b5;wlS1;O z`g8ks5$fXM0x+RmW~%&t3@r*VUvxB^#ar<>9xW;xb!BDfZEr{8qW#Bpnqx6MQLBZb z%qSIVD?k|}hx={YHq={`C1pTfs8x?TJHP^D_rQS2cJ4VVI5!>?M;%vCX%=LAaPh{w zpUsN>#yw~^RQBLPv%n3hv|COdbUZ$a1XMz7YPVDx)=~qS8deczhfBIjh*iDV6pMkE zD66rgPx%M@d9MR9HvtmqBO~K@^7Ho1_#99ts`=dn{5=pXq8AT^LeM1hbYl~UCcB&Lrd?s@vWK1b z{~!OG*_lNM_`rbkK?vxzLt%npf?gBwTJN|9xy)S#fGGex;MJ_Tp1zS{3&k=0k)5tB zAm7Z-0n)6$V1KD0-V`zYRy&WjfTy2j4@Udg=bpmth*y=`zdDxr-pZ>jAeZ?`0D8I` zfB?XSmMV4xII(FY31MM300}8sjHMrhfZe9uRf3bx^F!4L-L=+7x5jSj2;fPztY+3u zWWKm+F*oN&tcfCa<(>89W^NV;=iHceJcr1hJ2#Y)fpu;;a z-&BEJSkEDEiP!ObvM4QTkI!XUCWm>*b6W>n)S`; zn4lZ6Ud;Kw025}OBawBS1!f?q#IlxIskQjr>wAOcAIiGk4+Mm8TVemuN-Vk6IEyEw zaghKP0{~b8qDvy4e%y3fs2zDPjbWwWIszQsBhXi@Qn^z&e(mEw*R4GQa { return { ...item, - // 格式化预约日期和时间 + // 格式化预约日期和时间（保留展示所需字段） appointmentDate: item.appointmentDate || "", appointTime: item.appointTime || "", - // 添加状态显示 - statusText: this.getStatusText(item), - statusColor: this.getStatusColor(item) + statusColor: this.getColorByStatus(item.currentStatus) }; }); @@ -151,32 +149,9 @@ Page({ }); }, - // 获取状态文本 - getStatusText(item) { - // 根据实际业务逻辑判断状态 - const now = new Date(); - const appointmentDate = new Date(item.appointmentDate); - - if (appointmentDate > now) { - return '已预约'; - } else if (appointmentDate.toDateString() === now.toDateString()) { - return '使用中'; - } else { - return '已完成'; - } - }, - - // 获取状态颜色 - getStatusColor(item) { - const now = new Date(); - const appointmentDate = new Date(item.appointmentDate); - - if (appointmentDate > now) { - return '#17C4C4'; // 已预约 - 青色 - } else if (appointmentDate.toDateString() === now.toDateString()) { - return '#FA9E0A'; // 使用中 - 橙色 - } else { - return '#999'; // 已完成 - 灰色 - } - }, + getColorByStatus(status) { + if (status === 1) return '#17C4C4'; + if (status === 2) return '#FA9E0A'; + return '#999'; + } }); \ No newline at end of file diff --git a/subpages/mine/mySpace/mySpace.wxml b/subpages/mine/mySpace/mySpace.wxml index 56f4863..b1731e1 100644 --- a/subpages/mine/mySpace/mySpace.wxml +++ b/subpages/mine/mySpace/mySpace.wxml @@ -2,15 +2,16 @@ - {{item.apartmentName}} + + + {{item.apartmentName}} + - - {{item.name}} - + {{item.name}} {{item.address}} @@ -18,12 +19,11 @@ {{item.appointmentDate}} {{item.appointTime}} - {{item.statusText}} + {{item.currentStatus==1?'已预约':item.currentStatus==2?'使用中':item.currentStatus==3?'已完成':''}} - 加载中... diff --git a/subpages/space/list/list.js b/subpages/space/list/list.js index 13ac693..a6449cf 100644 --- a/subpages/space/list/list.js +++ b/subpages/space/list/list.js @@ -60,7 +60,7 @@ Page({ onShareAppMessage() {}, toReserve(e) { wx.navigateTo({ - url: `/subpages/space/reserve/reserve?id=${e.currentTarget.dataset.item.id}&roomName=${e.currentTarget.dataset.item.name}&openDate=${e.currentTarget.dataset.item.appointmentWeekText}&openTimeText=${e.currentTarget.dataset.item.appointmentTimeText}&imgUrls=${e.currentTarget.dataset.item.imgUrls}`, + url: `/subpages/space/reserve/reserve?id=${e.currentTarget.dataset.item.id}&roomName=${e.currentTarget.dataset.item.name}&openDate=${e.currentTarget.dataset.item.appointmentWeekText}&openTimeText=${e.currentTarget.dataset.item.appointmentTimeText}&imgUrls=${e.currentTarget.dataset.item.imgUrls[0]}&address=${e.currentTarget.dataset.item.address}`, }); }, getList(isRefresh = false) { diff --git a/subpages/space/list/list.wxml b/subpages/space/list/list.wxml index b8c4d98..0d7af11 100644 --- a/subpages/space/list/list.wxml +++ b/subpages/space/list/list.wxml @@ -1,15 +1,19 @@ + + + + {{item.address}} + + + - - - {{item.name}} - + + + {{item.name}} {{item.appointmentWeekText}} {{item.appointmentTimeText}} {{item.inDate}} 至 {{item.outDate}} @@ -20,12 +24,11 @@ - + 预约 - @@ -33,5 +36,4 @@ - \ No newline at end of file diff --git a/subpages/space/list/list.wxss b/subpages/space/list/list.wxss index 9afccee..430af8b 100644 --- a/subpages/space/list/list.wxss +++ b/subpages/space/list/list.wxss @@ -1,6 +1,6 @@ /* subpages/space/list/list.wxss */ .card{ - height:280rpx ; + height:370rpx ; } .name { font-size: 32rpx; diff --git a/subpages/space/reserve/reserve.js b/subpages/space/reserve/reserve.js index 6b1604b..c5a758c 100644 --- a/subpages/space/reserve/reserve.js +++ b/subpages/space/reserve/reserve.js @@ -1,12 +1,12 @@ // subpages/space/reserve/reserve.js -import { appointment, spaceInfo } from "../../../api/index"; +import { appointment, spaceInfo, queryAppointTime } from "../../../api/index"; Page({ /** * 页面的初始数据 */ data: { - bannerUrl: 'https://img.yzcdn.cn/vant/cat.jpeg', + bannerUrl: '', roomName: '第一会议室', openDate: '周一至周五', openTimeText: '上午09:00-下午18:00', @@ -18,7 +18,8 @@ Page({ chosenText: '', spaceDetail: null, appointDates: [], - appointmentTimes: [] + appointmentTimes: [], + address: '', }, /** @@ -32,6 +33,7 @@ Page({ openDate: options.openDate, openTimeText: options.openTimeText, bannerUrl: options.imgUrls, + address: options.address, }); this.getDetail(); // 获取详情后会自动初始化日期和时间段 }, @@ -78,7 +80,7 @@ Page({ this.setData({ spaceDetail: res.data, appointDates: res.data.appointDates || [], - appointmentTimes: res.data.appointmentTimes || [] + appointmentTimes: [] }); // 根据接口数据初始化日期和时间段 this.initDatesFromAPI(); @@ -86,7 +88,7 @@ Page({ } }).catch(err => { wx.showToast({ - title: err.msg || '获取详情失败', + title: err.msg , icon: 'none' }); }) @@ -115,12 +117,20 @@ Page({ initDatesFromAPI() { const { appointDates } = this.data; if (!appointDates || appointDates.length === 0) { - this.initDates(); // 如果没有接口数据，使用默认逻辑 + // 删除默认逻辑：当无可预约日期时，直接清空并返回 + this.setData({ + dateList: [], + selectedDateIndex: 0, + timeSlots: [], + rangeStartIndex: -1, + rangeEndIndex: -1, + chosenText: '' + }); return; } const today = new Date().toISOString().split('T')[0]; // 今天的日期 YYYY-MM-DD - const dates = appointDates.map((item, index) => { + const dates = appointDates.map((item) => { const date = new Date(item.appointDate); const isToday = item.appointDate === today; return { @@ -145,60 +155,46 @@ Page({ dateList: dates, selectedDateIndex: defaultIndex, }); - }, - initTimeSlots() { - const ranges = [ - ['09:00', '09:30'], ['09:30', '10:00'], ['10:00', '10:30'], ['10:30', '11:00'], - ['11:00', '11:30'], ['11:30', '12:00'], ['12:00', '12:30'], ['12:30', '13:00'], - ['13:00', '13:30'], ['13:30', '14:00'], ['14:00', '14:30'], ['14:30', '15:00'], - ['15:00', '15:30'], ['15:30', '16:00'], ['16:00', '16:30'], ['16:30', '17:00'], - ['17:00', '17:30'], ['17:30', '18:00'], ['18:00', '18:30'], ['18:30', '19:00'], - ]; - const slots = ranges.map((r, idx) => ({ - id: `${r[0]}-${r[1]}`, - start: r[0], - end: r[1], - status: idx < 3 ? 'disabled' : 'available' - })); - this.setData({ timeSlots: slots, rangeStartIndex: -1, rangeEndIndex: -1, chosenText: '' }); + // 初始化默认日期的时间段（调用后端 queryAppointTime） + const defaultDate = dates[defaultIndex] && dates[defaultIndex].date; + if (defaultDate) { + this.fetchTimeSlotsForDate(defaultDate); + } }, - // 根据接口数据初始化时间段 + + + // 根据接口数据初始化时间段（新的数据结构：时间段挂在 appointDates 每个日期项内） initTimeSlotsFromAPI() { - const { appointmentTimes } = this.data; + const { appointDates, selectedDateIndex } = this.data; + if (!appointDates || appointDates.length === 0) return; + const dateItem = appointDates[selectedDateIndex] || {}; + const appointmentTimes = dateItem.appointmentTimes || dateItem.times || []; if (!appointmentTimes || appointmentTimes.length === 0) { - this.initTimeSlots(); // 如果没有接口数据，使用默认逻辑 + this.setData({ timeSlots: [], rangeStartIndex: -1, rangeEndIndex: -1, chosenText: '' }); return; } - const slots = appointmentTimes.map((item, index) => { - // 解析时间段，例如 "09:00至09:29" -> start: "09:00", end: "09:29" - const timeMatch = item.appointmentTime.match(/(\d{2}:\d{2})至(\d{2}:\d{2})/); + const slots = appointmentTimes.map((item) => { + const timeMatch = (item.appointmentTime || '').match(/(\d{2}:\d{2})至(\d{2}:\d{2})/); let start = '00:00'; let end = '00:30'; - if (timeMatch) { start = timeMatch[1]; end = timeMatch[2]; } - return { id: item.id, - apiId: item.id, // 保存接口返回的ID - start: start, - end: end, + apiId: item.id, + start, + end, timeText: item.appointmentTime, status: item.canAppoint ? 'available' : 'disabled' }; }); - this.setData({ - timeSlots: slots, - rangeStartIndex: -1, - rangeEndIndex: -1, - chosenText: '' - }); + this.setData({ timeSlots: slots, rangeStartIndex: -1, rangeEndIndex: -1, chosenText: '' }); }, selectDate(e) { @@ -215,7 +211,8 @@ Page({ } this.setData({ selectedDateIndex: index }); - this.initTimeSlotsFromAPI(); // 使用接口数据初始化时间段 + // 每次选择都请求后端查询当日可预约时间段 + this.fetchTimeSlotsForDate(selectedDate.date); }, toggleSlot(e) { @@ -334,5 +331,36 @@ Page({ icon: 'none' }); }); + }, + + // 根据日期查询可预约时间段 + fetchTimeSlotsForDate(date) { + const { id } = this.data; + if (!id || !date) return; + queryAppointTime({ id, currentDate: date }) + .then((res) => { + if (res.code === 200 && Array.isArray(res.data)) { + const { appointDates, selectedDateIndex } = this.data; + const dateItem = appointDates[selectedDateIndex] || {}; + dateItem.appointmentTimes = res.data; // 将查询到的时间段更新到 appointDates 的对应日期项中 + appointDates[selectedDateIndex] = dateItem; + this.setData({ + appointDates, // 更新 appointDates 数组 + appointmentTimes: [], // 清空独立的 appointmentTimes + }); + this.initTimeSlotsFromAPI(); // 重新初始化时间段 + } else { + wx.showToast({ + title: res.msg || "获取时间段失败", + icon: "none", + }); + } + }) + .catch((err) => { + wx.showToast({ + title: err.msg || "获取时间段失败", + icon: "none", + }); + }); } }) \ No newline at end of file diff --git a/subpages/space/reserve/reserve.wxml b/subpages/space/reserve/reserve.wxml index 00ec3ee..7e15b60 100644 --- a/subpages/space/reserve/reserve.wxml +++ b/subpages/space/reserve/reserve.wxml @@ -5,6 +5,7 @@ diff --git a/subpages/space/reserve/reserve.wxss b/subpages/space/reserve/reserve.wxss index 932ac8b..7b423ef 100644 --- a/subpages/space/reserve/reserve.wxss +++ b/subpages/space/reserve/reserve.wxss @@ -3,22 +3,27 @@ background: #f8f8f8; min-height: 100vh; } + .banner { position: relative; } + .banner-overlay { padding: 20rpx; background: #fff; } + .room-name { font-size: 32rpx; font-weight: 600; } + .open-time { margin-top: 8rpx; font-size: 26rpx; color: #BFBFBF; } + .section { margin: 0 18rpx; margin-top: 12rpx; @@ -27,27 +32,32 @@ border-radius: 20rpx; } -.section-row{ + +.section-row { display: flex; align-items: center; justify-content: space-between; } + .section-title { font-size: 32rpx; font-weight: 600; margin-bottom: 16rpx; margin-left: 10rpx; } -.range-switch{ + +.range-switch { display: flex; align-items: center; color: #666; font-size: 26rpx; } + .date-strip { white-space: nowrap; padding-bottom: 12rpx; } + .date-item { display: inline-flex; flex-direction: column; @@ -59,9 +69,11 @@ color: #666; margin-right: 16rpx; } + .date-item .date-label { font-size: 26rpx; } + .date-item .date-day { margin-top: 8rpx; width: 56rpx; @@ -70,62 +82,78 @@ text-align: center; border-radius: 50%; } + .date-item.active { /* background: #e6fffb; */ color: #13c2c2; } + .date-item.active .date-day { background: #13c2c2; color: #fff; } + .date-item.disabled { color: #bfbfbf; opacity: 0.5; } + .date-item.disabled .date-day { background: #f0f0f0; color: #bfbfbf; } + .slot-grid { - display: flex; - flex-wrap: wrap; + display: grid; + grid-template-columns: repeat(4, 1fr); + grid-column-gap: 16rpx; + grid-row-gap: 16rpx; margin-top: 12rpx; } + .slot { - width: calc(25% - 16rpx); - margin-right: 16rpx; - margin-top: 16rpx; + width: 100%; + margin: 0; + box-sizing: border-box; border-radius: 16rpx; padding: 12rpx 0; text-align: center; background: #f7f8fa; color: #000; - border:1px solid rgba(111, 195, 160, 1); + border: 1px solid rgba(111, 195, 160, 1); + } + .slot:nth-child(4n) { margin-right: 0; } + .slot .slot-line { font-size: 28rpx; } + .slot .slot-sep { font-size: 24rpx; color: inherit; } + .slot.disabled { background: #ededed; color: #bfbfbf; border: none; } + .slot.selected { background: #13c2c2; color: #fff; } -.chosen{ + +.chosen { margin-top: 20rpx; color: #13c2c2; font-size: 26rpx; } + .footer { padding: 24rpx; } \ No newline at end of file