处理弹窗展示备注

This commit is contained in:
2026-01-12 22:10:31 +08:00
parent 6c320f9bf8
commit 913afc07c1
5 changed files with 126 additions and 33 deletions

View File

@@ -13,7 +13,7 @@
<view class="room-grid-card">
<view class="grid-item-content">
<view class="room-name">{{room.room_name}}</view>
<view class="room-info">
<view class="room-info" @click="onShowInfoPopup(room)">
<view class="room-id" v-if="room.tel">尾号: {{room.tel}}</view>
<view class="remark" v-if="room.remarks">备注: {{room.remarks}}</view>
</view>
@@ -62,7 +62,22 @@
</nut-button>
</view>
</view>
</nut-popup>
</nut-popup>
<!-- 弹出 -->
<nut-popup :custom-style="{ height: '50%' }" v-model:visible="visibleInfoPopup" position="bottom"
safe-area-inset-bottom :close-on-click-overlay="true" @close="onCloseInfoPopup">
<view>
<view class="title">{{tempRoom?.room_name}} </view>
<view class="room-info">
<view class="room-id" v-if="tempRoom?.tel">尾号: {{tempRoom.tel}}</view>
<view class="remark" v-if="tempRoom?.remarks">备注: {{tempRoom.remarks}}</view>
</view>
</view>
</nut-popup>
</view>
</template>
@@ -116,7 +131,21 @@
return {
'background-color': backgroundColor,
};
}
}
const visibleInfoPopup = ref(false)
const onShowInfoPopup = (room) => {
console.log("----", room);
Object.assign(tempRoom, room)
visibleInfoPopup.value = true
}
const onCloseInfoPopup = () => {
Object.assign(tempRoom, {})
visibleInfoPopup.value = false
console.log("关闭");
};
const visiblePopup = ref(false)
const tempRoom = reactive({})
const onBooking = (room) => {
@@ -134,7 +163,9 @@
})
visiblePopup.value = false
console.log("关闭");
};
};
const getRooms = () => {
console.log("房间");
@@ -288,5 +319,22 @@
font-size: 28rpx;
font-weight: 400;
text-align: center;
}
.room-info {
text-align: left;
padding: 20rpx 20rpx;
color: #666;
width: 100%;
// min-height: 160rpx;
box-sizing: border-box;
.room-id {
font-size: 28rpx;
}
.remark {
font-size: 26rpx;
}
}
</style>

File diff suppressed because one or more lines are too long

View File

@@ -48,10 +48,21 @@ const _sfc_main = {
"background-color": backgroundColor
};
};
const visibleInfoPopup = common_vendor.ref(false);
const onShowInfoPopup = (room) => {
common_vendor.index.__f__("log", "at pages/index/index.vue:138", "----", room);
Object.assign(tempRoom, room);
visibleInfoPopup.value = true;
};
const onCloseInfoPopup = () => {
Object.assign(tempRoom, {});
visibleInfoPopup.value = false;
common_vendor.index.__f__("log", "at pages/index/index.vue:145", "关闭");
};
const visiblePopup = common_vendor.ref(false);
const tempRoom = common_vendor.reactive({});
const onBooking = (room) => {
common_vendor.index.__f__("log", "at pages/index/index.vue:123", "----", room);
common_vendor.index.__f__("log", "at pages/index/index.vue:152", "----", room);
Object.assign(tempRoom, room);
form.room_id = room.id;
visiblePopup.value = true;
@@ -64,18 +75,18 @@ const _sfc_main = {
remarks: ""
});
visiblePopup.value = false;
common_vendor.index.__f__("log", "at pages/index/index.vue:136", "关闭");
common_vendor.index.__f__("log", "at pages/index/index.vue:165", "关闭");
};
const getRooms = () => {
common_vendor.index.__f__("log", "at pages/index/index.vue:140", "房间");
common_vendor.index.__f__("log", "at pages/index/index.vue:171", "房间");
api_index.fetchRooms().then((res) => {
common_vendor.index.__f__("log", "at pages/index/index.vue:142", res);
common_vendor.index.__f__("log", "at pages/index/index.vue:173", res);
rooms.value = res;
});
};
const onSubmit = () => {
api_index.fetchBooking(form).then((res) => {
common_vendor.index.__f__("log", "at pages/index/index.vue:150", res);
common_vendor.index.__f__("log", "at pages/index/index.vue:181", res);
common_vendor.index.showToast({
icon: "none",
title: "预约成功"
@@ -88,7 +99,7 @@ const _sfc_main = {
api_index.fetchUnBooking({
id: room.id
}).then((res) => {
common_vendor.index.__f__("log", "at pages/index/index.vue:164", res);
common_vendor.index.__f__("log", "at pages/index/index.vue:195", res);
common_vendor.index.showToast({
icon: "none",
title: "取消预约成功"
@@ -97,18 +108,18 @@ const _sfc_main = {
});
};
const init = () => {
common_vendor.index.__f__("log", "at pages/index/index.vue:174", "init");
common_vendor.index.__f__("log", "at pages/index/index.vue:205", "init");
getRooms();
};
common_vendor.onShow(() => {
common_vendor.index.__f__("log", "at pages/index/index.vue:179", "onshow---");
common_vendor.index.__f__("log", "at pages/index/index.vue:210", "onshow---");
getRooms();
});
common_vendor.onMounted(() => {
init();
});
return (_ctx, _cache) => {
return {
return common_vendor.e({
a: common_vendor.o(($event) => common_vendor.unref(utils_helper.navigateTo)("/pages/index/goodsOrderAdd")),
b: common_vendor.p({
type: "primary",
@@ -126,48 +137,49 @@ const _sfc_main = {
}, room.remarks ? {
e: common_vendor.t(room.remarks)
} : {}, {
f: room.status === 1
f: common_vendor.o(($event) => onShowInfoPopup(room), index),
g: room.status === 1
}, room.status === 1 ? {
g: common_vendor.o(($event) => onBooking(room), index),
h: "1cf27b2a-1-" + i0,
i: common_vendor.p({
h: common_vendor.o(($event) => onBooking(room), index),
i: "1cf27b2a-1-" + i0,
j: common_vendor.p({
size: "small",
type: "primary",
shape: "square"
})
} : room.status === 2 ? {
k: common_vendor.o(($event) => onUnBooking(room), index),
l: "1cf27b2a-2-" + i0,
m: common_vendor.p({
l: common_vendor.o(($event) => onUnBooking(room), index),
m: "1cf27b2a-2-" + i0,
n: common_vendor.p({
size: "small",
type: "warning",
plain: true,
shape: "square"
})
} : {}, {
j: room.status === 2,
n: room.status === 3
k: room.status === 2,
o: room.status === 3
}, room.status === 3 ? {
o: common_vendor.o(($event) => common_vendor.unref(utils_helper.navigateTo)(`/pages/index/orderEdit?roomId=${room.id}`), index),
p: "1cf27b2a-3-" + i0,
q: common_vendor.p({
p: common_vendor.o(($event) => common_vendor.unref(utils_helper.navigateTo)(`/pages/index/orderEdit?roomId=${room.id}`), index),
q: "1cf27b2a-3-" + i0,
r: common_vendor.p({
size: "small",
type: "info",
plain: true,
shape: "square"
})
} : {
r: common_vendor.o(($event) => common_vendor.unref(utils_helper.navigateTo)(`/pages/index/orderAdd?roomId=${room.id}`), index),
s: "1cf27b2a-4-" + i0,
t: common_vendor.p({
s: common_vendor.o(($event) => common_vendor.unref(utils_helper.navigateTo)(`/pages/index/orderAdd?roomId=${room.id}`), index),
t: "1cf27b2a-4-" + i0,
v: common_vendor.p({
size: "small",
type: "success",
plain: true,
shape: "square"
})
}, {
v: index,
w: common_vendor.s(getRoomStyle(room.status))
w: index,
x: common_vendor.s(getRoomStyle(room.status))
});
}),
e: common_vendor.t(tempRoom == null ? void 0 : tempRoom.room_name),
@@ -203,8 +215,28 @@ const _sfc_main = {
["safe-area-inset-bottom"]: true,
["close-on-click-overlay"]: true,
visible: visiblePopup.value
}),
q: common_vendor.t(tempRoom == null ? void 0 : tempRoom.room_name),
r: tempRoom == null ? void 0 : tempRoom.tel
}, (tempRoom == null ? void 0 : tempRoom.tel) ? {
s: common_vendor.t(tempRoom.tel)
} : {}, {
t: tempRoom == null ? void 0 : tempRoom.remarks
}, (tempRoom == null ? void 0 : tempRoom.remarks) ? {
v: common_vendor.t(tempRoom.remarks)
} : {}, {
w: common_vendor.o(onCloseInfoPopup),
x: common_vendor.o(($event) => visibleInfoPopup.value = $event),
y: common_vendor.p({
["custom-style"]: {
height: "50%"
},
position: "bottom",
["safe-area-inset-bottom"]: true,
["close-on-click-overlay"]: true,
visible: visibleInfoPopup.value
})
};
});
};
}
};

View File

@@ -1 +1 @@
<view class="page-content data-v-1cf27b2a"><view class="data-v-1cf27b2a" style="{{'z-index:10000;position:sticky' + ';' + c}}"><view class="top-bar data-v-1cf27b2a"><nut-button wx:if="{{b}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclick="{{a}}" u-i="1cf27b2a-0" bind:__l="__l" u-p="{{b}}"> 新增商品订单 </nut-button></view></view><view class="room-grid data-v-1cf27b2a"><view wx:for="{{d}}" wx:for-item="room" wx:key="v" class="room-grid-item data-v-1cf27b2a" style="{{room.w}}"><view class="room-grid-card data-v-1cf27b2a"><view class="grid-item-content data-v-1cf27b2a"><view class="room-name data-v-1cf27b2a">{{room.a}}</view><view class="room-info data-v-1cf27b2a"><view wx:if="{{room.b}}" class="room-id data-v-1cf27b2a">尾号: {{room.c}}</view><view wx:if="{{room.d}}" class="remark data-v-1cf27b2a">备注: {{room.e}}</view></view><view class="room-buttons data-v-1cf27b2a"><view wx:if="{{room.f}}" class="data-v-1cf27b2a"><nut-button wx:if="{{room.i}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclick="{{room.g}}" u-i="{{room.h}}" bind:__l="__l" u-p="{{room.i}}">预约</nut-button></view><view wx:elif="{{room.j}}" class="data-v-1cf27b2a"><nut-button wx:if="{{room.m}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclick="{{room.k}}" u-i="{{room.l}}" bind:__l="__l" u-p="{{room.m}}">取消预约</nut-button></view><view wx:if="{{room.n}}" class="data-v-1cf27b2a"><nut-button wx:if="{{room.q}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclick="{{room.o}}" u-i="{{room.p}}" bind:__l="__l" u-p="{{room.q}}">详情</nut-button></view><view wx:else class="data-v-1cf27b2a"><nut-button wx:if="{{room.t}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclick="{{room.r}}" u-i="{{room.s}}" bind:__l="__l" u-p="{{room.t}}">开台</nut-button></view></view></view></view></view></view><nut-popup wx:if="{{p}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclose="{{n}}" u-i="1cf27b2a-5" bind:__l="__l" bindupdateVisible="{{o}}" u-p="{{p}}"><view class="data-v-1cf27b2a"><view class="title data-v-1cf27b2a">{{e}}</view><nut-form class="data-v-1cf27b2a" u-s="{{['d']}}" u-i="1cf27b2a-6,1cf27b2a-5" bind:__l="__l"><nut-form-item wx:if="{{h}}" class="data-v-1cf27b2a" u-s="{{['d']}}" u-i="1cf27b2a-7,1cf27b2a-6" bind:__l="__l" u-p="{{h}}"><nut-input wx:if="{{g}}" class="data-v-1cf27b2a" u-i="1cf27b2a-8,1cf27b2a-7" bind:__l="__l" bindupdateModelValue="{{f}}" u-p="{{g}}"></nut-input></nut-form-item><nut-form-item wx:if="{{k}}" class="data-v-1cf27b2a" u-s="{{['d']}}" u-i="1cf27b2a-9,1cf27b2a-6" bind:__l="__l" u-p="{{k}}"><nut-textarea wx:if="{{j}}" class="data-v-1cf27b2a" u-i="1cf27b2a-10,1cf27b2a-9" bind:__l="__l" bindupdateModelValue="{{i}}" u-p="{{j}}"></nut-textarea></nut-form-item></nut-form><view class="data-v-1cf27b2a" style="padding:0rpx 80rpx"><nut-button wx:if="{{m}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclick="{{l}}" u-i="1cf27b2a-11,1cf27b2a-5" bind:__l="__l" u-p="{{m}}"> 预约 </nut-button></view></view></nut-popup></view>
<view class="page-content data-v-1cf27b2a"><view class="data-v-1cf27b2a" style="{{'z-index:10000;position:sticky' + ';' + c}}"><view class="top-bar data-v-1cf27b2a"><nut-button wx:if="{{b}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclick="{{a}}" u-i="1cf27b2a-0" bind:__l="__l" u-p="{{b}}"> 新增商品订单 </nut-button></view></view><view class="room-grid data-v-1cf27b2a"><view wx:for="{{d}}" wx:for-item="room" wx:key="w" class="room-grid-item data-v-1cf27b2a" style="{{room.x}}"><view class="room-grid-card data-v-1cf27b2a"><view class="grid-item-content data-v-1cf27b2a"><view class="room-name data-v-1cf27b2a">{{room.a}}</view><view class="room-info data-v-1cf27b2a" bindtap="{{room.f}}"><view wx:if="{{room.b}}" class="room-id data-v-1cf27b2a">尾号: {{room.c}}</view><view wx:if="{{room.d}}" class="remark data-v-1cf27b2a">备注: {{room.e}}</view></view><view class="room-buttons data-v-1cf27b2a"><view wx:if="{{room.g}}" class="data-v-1cf27b2a"><nut-button wx:if="{{room.j}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclick="{{room.h}}" u-i="{{room.i}}" bind:__l="__l" u-p="{{room.j}}">预约</nut-button></view><view wx:elif="{{room.k}}" class="data-v-1cf27b2a"><nut-button wx:if="{{room.n}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclick="{{room.l}}" u-i="{{room.m}}" bind:__l="__l" u-p="{{room.n}}">取消预约</nut-button></view><view wx:if="{{room.o}}" class="data-v-1cf27b2a"><nut-button wx:if="{{room.r}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclick="{{room.p}}" u-i="{{room.q}}" bind:__l="__l" u-p="{{room.r}}">详情</nut-button></view><view wx:else class="data-v-1cf27b2a"><nut-button wx:if="{{room.v}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclick="{{room.s}}" u-i="{{room.t}}" bind:__l="__l" u-p="{{room.v}}">开台</nut-button></view></view></view></view></view></view><nut-popup wx:if="{{p}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclose="{{n}}" u-i="1cf27b2a-5" bind:__l="__l" bindupdateVisible="{{o}}" u-p="{{p}}"><view class="data-v-1cf27b2a"><view class="title data-v-1cf27b2a">{{e}}</view><nut-form class="data-v-1cf27b2a" u-s="{{['d']}}" u-i="1cf27b2a-6,1cf27b2a-5" bind:__l="__l"><nut-form-item wx:if="{{h}}" class="data-v-1cf27b2a" u-s="{{['d']}}" u-i="1cf27b2a-7,1cf27b2a-6" bind:__l="__l" u-p="{{h}}"><nut-input wx:if="{{g}}" class="data-v-1cf27b2a" u-i="1cf27b2a-8,1cf27b2a-7" bind:__l="__l" bindupdateModelValue="{{f}}" u-p="{{g}}"></nut-input></nut-form-item><nut-form-item wx:if="{{k}}" class="data-v-1cf27b2a" u-s="{{['d']}}" u-i="1cf27b2a-9,1cf27b2a-6" bind:__l="__l" u-p="{{k}}"><nut-textarea wx:if="{{j}}" class="data-v-1cf27b2a" u-i="1cf27b2a-10,1cf27b2a-9" bind:__l="__l" bindupdateModelValue="{{i}}" u-p="{{j}}"></nut-textarea></nut-form-item></nut-form><view class="data-v-1cf27b2a" style="padding:0rpx 80rpx"><nut-button wx:if="{{m}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclick="{{l}}" u-i="1cf27b2a-11,1cf27b2a-5" bind:__l="__l" u-p="{{m}}"> 预约 </nut-button></view></view></nut-popup><nut-popup wx:if="{{y}}" class="data-v-1cf27b2a" u-s="{{['d']}}" bindclose="{{w}}" u-i="1cf27b2a-12" bind:__l="__l" bindupdateVisible="{{x}}" u-p="{{y}}"><view class="data-v-1cf27b2a"><view class="title data-v-1cf27b2a">{{q}}</view><view class="room-info data-v-1cf27b2a"><view wx:if="{{r}}" class="room-id data-v-1cf27b2a">尾号: {{s}}</view><view wx:if="{{t}}" class="remark data-v-1cf27b2a">备注: {{v}}</view></view></view></nut-popup></view>

View File

@@ -130,4 +130,17 @@
font-size: 28rpx;
font-weight: 400;
text-align: center;
}
.room-info.data-v-1cf27b2a {
text-align: left;
padding: 20rpx 20rpx;
color: #666;
width: 100%;
box-sizing: border-box;
}
.room-info .room-id.data-v-1cf27b2a {
font-size: 28rpx;
}
.room-info .remark.data-v-1cf27b2a {
font-size: 26rpx;
}