对接银行卡接口

src/pages/store/room-manage.vue

@@ -5,122 +5,6 @@
     }
 }</route>
 
-<script lang="ts" setup>
-import { router } from '@/utils/tools'
-
-const OSS = inject('OSS')
-const navbarHeight = inject('navbarHeight')
-
-// 房间状态枚举
-enum RoomStatus {
-    AVAILABLE = 'available', // 空闲中 - 绿色
-    CLEANING = 'cleaning', // 待打扫 - 蓝色/橙色
-    MAINTENANCE = 'maintenance', // 维护中 - 红色
-    IN_USE = 'in_use', // 使用中 - 蓝色
-}
-
-// 房间状态配置
-const statusConfig = {
-    [RoomStatus.AVAILABLE]: {
-        text: '空闲中',
-        color: '#4C9F44', // 绿色
-    },
-    [RoomStatus.CLEANING]: {
-        text: '待打扫',
-        color: '#F29747', // 蓝色
-    },
-    [RoomStatus.MAINTENANCE]: {
-        text: '维护中',
-        color: '#F65353', // 红色
-    },
-    [RoomStatus.IN_USE]: {
-        text: '使用中',
-        color: '#1890FF', // 蓝色
-    },
-}
-
-// Mock 房间数据
-const roomList = ref([
-    {
-        id: 1,
-        name: '对月',
-        type: '榻榻米',
-        image: `${OSS}images/room1.jpg`, // Mock图片，实际需要替换
-        status: RoomStatus.AVAILABLE,
-    },
-    {
-        id: 2,
-        name: '听雨',
-        type: '榻榻米',
-        image: `${OSS}images/room2.jpg`,
-        status: RoomStatus.CLEANING,
-    },
-    {
-        id: 3,
-        name: '观星',
-        type: '榻榻米',
-        image: `${OSS}images/room3.jpg`,
-        status: RoomStatus.MAINTENANCE,
-    },
-    {
-        id: 4,
-        name: '品茶',
-        type: '榻榻米',
-        image: `${OSS}images/room4.jpg`,
-        status: RoomStatus.CLEANING,
-    },
-    {
-        id: 5,
-        name: '静心',
-        type: '榻榻米',
-        image: `${OSS}images/room5.jpg`,
-        status: RoomStatus.IN_USE,
-    },
-])
-
-const RoomManage = {
-    /**
-     * 点击房间卡片
-     */
-    handleClickRoom: (room: any) => {
-        router.navigateTo(`/bundle/tea-room/detail?id=${room.id}`)
-    },
-
-    /**
-     * 点击编辑房间图片
-     */
-    handleEditImage: (room: any, event: any) => {
-        // event.stopPropagation()
-        // TODO: 实现编辑房间图片功能
-        console.log('编辑房间图片:', room.id)
-        router.navigateTo(`/pages/store/room-detail?id=${room.id}`)
-    },
-
-    /**
-     * 点击更多选项
-     */
-    handleMore: () => {
-        // TODO: 实现更多选项功能
-        console.log('更多选项')
-    },
-
-    /**
-     * 点击目标图标
-     */
-    handleTarget: () => {
-        // TODO: 实现目标功能
-        console.log('目标功能')
-    },
-}
-
-/**
- * 获取状态配置
- */
-function getStatusConfig(status: RoomStatus) {
-    return statusConfig[status] || statusConfig[RoomStatus.AVAILABLE]
-}
-</script>
-
 <template>
     <view>
         <!-- 导航栏 -->
@@ -174,6 +58,122 @@ function getStatusConfig(status: RoomStatus) {
     </view>
 </template>
 
+<script lang="ts" setup>
+    import { router } from '@/utils/tools'
+
+    const OSS = inject('OSS')
+    const navbarHeight = inject('navbarHeight')
+
+    // 房间状态枚举
+    enum RoomStatus {
+        AVAILABLE = 'available', // 空闲中 - 绿色
+        CLEANING = 'cleaning', // 待打扫 - 蓝色/橙色
+        MAINTENANCE = 'maintenance', // 维护中 - 红色
+        IN_USE = 'in_use', // 使用中 - 蓝色
+    }
+
+    // 房间状态配置
+    const statusConfig = {
+        [RoomStatus.AVAILABLE]: {
+            text: '空闲中',
+            color: '#4C9F44', // 绿色
+        },
+        [RoomStatus.CLEANING]: {
+            text: '待打扫',
+            color: '#F29747', // 蓝色
+        },
+        [RoomStatus.MAINTENANCE]: {
+            text: '维护中',
+            color: '#F65353', // 红色
+        },
+        [RoomStatus.IN_USE]: {
+            text: '使用中',
+            color: '#1890FF', // 蓝色
+        },
+    }
+
+    // Mock 房间数据
+    const roomList = ref([
+        {
+            id: 1,
+            name: '对月',
+            type: '榻榻米',
+            image: `${OSS}images/room1.jpg`, // Mock图片，实际需要替换
+            status: RoomStatus.AVAILABLE,
+        },
+        {
+            id: 2,
+            name: '听雨',
+            type: '榻榻米',
+            image: `${OSS}images/room2.jpg`,
+            status: RoomStatus.CLEANING,
+        },
+        {
+            id: 3,
+            name: '观星',
+            type: '榻榻米',
+            image: `${OSS}images/room3.jpg`,
+            status: RoomStatus.MAINTENANCE,
+        },
+        {
+            id: 4,
+            name: '品茶',
+            type: '榻榻米',
+            image: `${OSS}images/room4.jpg`,
+            status: RoomStatus.CLEANING,
+        },
+        {
+            id: 5,
+            name: '静心',
+            type: '榻榻米',
+            image: `${OSS}images/room5.jpg`,
+            status: RoomStatus.IN_USE,
+        },
+    ])
+
+    const RoomManage = {
+        /**
+         * 点击房间卡片
+         */
+        handleClickRoom: (room: any) => {
+            router.navigateTo(`/bundle/tea-room/detail?id=${room.id}`)
+        },
+
+        /**
+         * 点击编辑房间图片
+         */
+        handleEditImage: (room: any, event: any) => {
+            // event.stopPropagation()
+            // TODO: 实现编辑房间图片功能
+            console.log('编辑房间图片:', room.id)
+            router.navigateTo(`/pages/store/room-detail?id=${room.id}`)
+        },
+
+        /**
+         * 点击更多选项
+         */
+        handleMore: () => {
+            // TODO: 实现更多选项功能
+            console.log('更多选项')
+        },
+
+        /**
+         * 点击目标图标
+         */
+        handleTarget: () => {
+            // TODO: 实现目标功能
+            console.log('目标功能')
+        },
+    }
+
+    /**
+     * 获取状态配置
+     */
+    function getStatusConfig(status: RoomStatus) {
+        return statusConfig[status] || statusConfig[RoomStatus.AVAILABLE]
+    }
+</script>
+
 <style lang="scss">
 page {
     background: #f6f7f8;