diff --git a/miniprogram/app.json b/miniprogram/app.json index b873c2a..ed25533 100644 --- a/miniprogram/app.json +++ b/miniprogram/app.json @@ -1,8 +1,24 @@ { "pages": [ "pages/index/index", + "pages/list/list", + "pages/settings/settings", "pages/logs/logs" ], + "tabBar": { + "custom": true, + "list": [ + { + "pagePath": "pages/index/index" + }, + { + "pagePath": "pages/list/list" + }, + { + "pagePath": "pages/settings/settings" + } + ] + }, "componentFramework": "glass-easel", "lazyCodeLoading": "requiredComponents" } \ No newline at end of file diff --git a/miniprogram/pages/index/index.json b/miniprogram/pages/index/index.json index ecb1e82..1cae94b 100644 --- a/miniprogram/pages/index/index.json +++ b/miniprogram/pages/index/index.json @@ -1,9 +1,14 @@ { "usingComponents": { "t-button": "tdesign-miniprogram/button/button", + "t-navbar": "tdesign-miniprogram/navbar/navbar", + "t-input": "tdesign-miniprogram/input/input", + "t-cell": "tdesign-miniprogram/cell/cell", + "t-cell-group": "tdesign-miniprogram/cell-group/cell-group", + "t-checkbox": "tdesign-miniprogram/checkbox/checkbox", + "t-icon": "tdesign-miniprogram/icon/icon", "t-tab-bar": "tdesign-miniprogram/tab-bar/tab-bar", - "t-tab-bar-item": "tdesign-miniprogram/tab-bar-item/tab-bar-item", - "t-navbar": "tdesign-miniprogram/navbar/navbar" + "t-tab-bar-item": "tdesign-miniprogram/tab-bar-item/tab-bar-item" }, "navigationStyle": "custom" } \ No newline at end of file diff --git a/miniprogram/pages/index/index.ts b/miniprogram/pages/index/index.ts index c7aaf97..57c971d 100644 --- a/miniprogram/pages/index/index.ts +++ b/miniprogram/pages/index/index.ts @@ -1,54 +1,23 @@ -// index.ts -// 获取应用实例 -const app = getApp() -const defaultAvatarUrl = 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0' - +// pages/index/index.ts Component({ data: { - motto: 'Hello World', - userInfo: { - avatarUrl: defaultAvatarUrl, - nickName: '', - }, - hasUserInfo: false, - canIUseGetUserProfile: wx.canIUse('getUserProfile'), - canIUseNicknameComp: wx.canIUse('input.type.nickname'), + activeTab: 'home', // For tab bar }, methods: { - // 事件处理函数 - bindViewTap() { - wx.navigateTo({ - url: '../logs/logs', - }) + onTabChange(e: any) { + const targetPage = e.detail.value; + if (targetPage === 'list') { + wx.switchTab({ url: '/pages/list/list' }); + } else if (targetPage === 'settings') { + wx.switchTab({ url: '/pages/settings/settings' }); + } + // No need to navigate if already on 'home' }, - onChooseAvatar(e: any) { - const { avatarUrl } = e.detail - const { nickName } = this.data.userInfo - this.setData({ - "userInfo.avatarUrl": avatarUrl, - hasUserInfo: nickName && avatarUrl && avatarUrl !== defaultAvatarUrl, - }) - }, - onInputChange(e: any) { - const nickName = e.detail.value - const { avatarUrl } = this.data.userInfo - this.setData({ - "userInfo.nickName": nickName, - hasUserInfo: nickName && avatarUrl && avatarUrl !== defaultAvatarUrl, - }) - }, - getUserProfile() { - // 推荐使用wx.getUserProfile获取用户信息,开发者每次通过该接口获取用户个人信息均需用户确认,开发者妥善保管用户快速填写的头像昵称,避免重复弹窗 - wx.getUserProfile({ - desc: '展示用户信息', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写 - success: (res) => { - console.log(res) - this.setData({ - userInfo: res.userInfo, - hasUserInfo: true - }) - } - }) + goToTasks() { + wx.switchTab({ url: '/pages/list/list' }); }, + goToSettings() { + wx.switchTab({ url: '/pages/settings/settings' }); + } }, -}) +}); diff --git a/miniprogram/pages/index/index.wxml b/miniprogram/pages/index/index.wxml index a984c3d..6e6e46c 100644 --- a/miniprogram/pages/index/index.wxml +++ b/miniprogram/pages/index/index.wxml @@ -1,56 +1,29 @@ - - - - + + + - - - - - 按钮 - - - - 昵称 - - - - - - 请使用2.10.4及以上版本基础库 - - - - {{userInfo.nickName}} - - - - {{motto}} - + + + 欢迎回来! + 今天有什么计划?让我们开始吧。 - - - - - - 首页 - - - 应用 - - - 聊天 - - - 我的 - + + + + 查看我的任务 + + + + 打开设置 + + + + + + + 首页 + 任务 + 设置 diff --git a/miniprogram/pages/index/index.wxss b/miniprogram/pages/index/index.wxss index 1ebed4b..9298653 100644 --- a/miniprogram/pages/index/index.wxss +++ b/miniprogram/pages/index/index.wxss @@ -1,62 +1,83 @@ /**index.wxss**/ page { - height: 100vh; display: flex; flex-direction: column; -} -.scrollarea { - flex: 1; - overflow-y: hidden; + height: 100vh; + background-color: #f8f9fa; /* Lighter, cleaner background */ + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; } -.userinfo { +.container { + display: flex; + flex-direction: column; + flex: 1; + padding: 20rpx; + box-sizing: border-box; + padding-bottom: 120rpx; /* Add padding for the fixed tab bar */ +} + +.t-navbar { + margin-bottom: 20rpx; +} + +.hero-section { display: flex; flex-direction: column; align-items: center; - color: #aaa; - width: 80%; + text-align: center; + padding: 60rpx 20rpx; + background-color: #ffffff; + border-radius: 24rpx; + box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.05); + margin-bottom: 40rpx; } -.userinfo-avatar { - overflow: hidden; - width: 128rpx; - height: 128rpx; - margin: 20rpx; - border-radius: 50%; +.hero-image { + width: 300rpx; /* Adjust as needed */ + height: 200rpx; /* Adjust as needed */ + margin-bottom: 30rpx; } -.usermotto { - margin-top: 200px; +.hero-title { + font-size: 48rpx; + font-weight: bold; + color: #333; + margin-bottom: 10rpx; } -.avatar-wrapper { - padding: 0; - width: 56px !important; - border-radius: 8px; - margin-top: 40px; - margin-bottom: 40px; +.hero-subtitle { + font-size: 28rpx; + color: #666; + line-height: 1.6; } -.avatar { - display: block; - width: 56px; - height: 56px; -} - -.nickname-wrapper { +.quick-actions { display: flex; - width: 100%; - padding: 16px; - box-sizing: border-box; - border-top: .5px solid rgba(0, 0, 0, 0.1); - border-bottom: .5px solid rgba(0, 0, 0, 0.1); - color: black; + flex-direction: column; + gap: 20rpx; /* Adds space between buttons */ + margin-bottom: 40rpx; } -.nickname-label { - width: 105px; +.action-button .t-button { + width: 100%; /* Make button take full width if block attribute isn't enough */ } -.nickname-input { - flex: 1; +.action-button .t-icon { + margin-right: 10rpx; } + +.footer-space { + height: 100rpx; /* Space at the bottom before tab bar, if content is scrollable */ +} + +.custom-tab-bar { + position: fixed; + bottom: 0; + left: 0; + right: 0; + z-index: 1000; /* Ensure it's on top */ + background-color: #ffffff; /* Ensure tab bar has a background */ + box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.05); +} + +/** Removed old userinfo and motto styles as per the change description **/ diff --git a/miniprogram/pages/list/list.json b/miniprogram/pages/list/list.json new file mode 100644 index 0000000..589b8af --- /dev/null +++ b/miniprogram/pages/list/list.json @@ -0,0 +1,16 @@ +{ + "usingComponents": { + "t-button": "tdesign-miniprogram/button/button", + "t-navbar": "tdesign-miniprogram/navbar/navbar", + "t-input": "tdesign-miniprogram/input/input", + "t-cell": "tdesign-miniprogram/cell/cell", + "t-cell-group": "tdesign-miniprogram/cell-group/cell-group", + "t-checkbox": "tdesign-miniprogram/checkbox/checkbox", + "t-icon": "tdesign-miniprogram/icon/icon", + "t-tab-bar": "tdesign-miniprogram/tab-bar/tab-bar", + "t-tab-bar-item": "tdesign-miniprogram/tab-bar-item/tab-bar-item" + }, + "navigationStyle": "custom", + "navigationBarTitleText": "任务列表" +} + diff --git a/miniprogram/pages/list/list.ts b/miniprogram/pages/list/list.ts new file mode 100644 index 0000000..2bd057f --- /dev/null +++ b/miniprogram/pages/list/list.ts @@ -0,0 +1,62 @@ +// pages/list/list.ts +interface ITodo { + text: string; + completed: boolean; +} + +Component({ + data: { + newTodoText: '', + todos: [] as ITodo[], + activeTab: 'list', // For tab bar + }, + methods: { + onNewTodoInput(e: any) { + this.setData({ + newTodoText: e.detail.value, + }); + }, + addTodo() { + const { newTodoText, todos } = this.data; + if (newTodoText.trim() === '') { + return; + } + const newTodos = [...todos, { text: newTodoText, completed: false }]; + this.setData({ + todos: newTodos, + newTodoText: '', + }); + }, + toggleTodo(e: any) { + const index = e.currentTarget.dataset.index; + const { todos } = this.data; + const newTodos = todos.map((todo, i) => { + if (i === index) { + return { ...todo, completed: !todo.completed }; + } + return todo; + }); + this.setData({ + todos: newTodos, + }); + }, + removeTodo(e: any) { + const index = e.currentTarget.dataset.index; + const { todos } = this.data; + const newTodos = todos.filter((_, i) => i !== index); + this.setData({ + todos: newTodos, + }); + }, + onTabChange(e: any) { + const targetPage = e.detail.value; + if (targetPage === 'home') { + wx.switchTab({ url: '/pages/index/index' }); + } else if (targetPage === 'settings') { + wx.switchTab({ url: '/pages/settings/settings' }); + } + // No need to navigate if already on 'list' + }, + }, +}); + diff --git a/miniprogram/pages/list/list.wxml b/miniprogram/pages/list/list.wxml new file mode 100644 index 0000000..74b642f --- /dev/null +++ b/miniprogram/pages/list/list.wxml @@ -0,0 +1,47 @@ + + + + + + + + + + + + + + + 太棒了!没有待办事项 + + + + + + + {{item.text}} + + + + + + + + + 首页 + 任务 + 设置 + + + diff --git a/miniprogram/pages/list/list.wxss b/miniprogram/pages/list/list.wxss new file mode 100644 index 0000000..e47543c --- /dev/null +++ b/miniprogram/pages/list/list.wxss @@ -0,0 +1,115 @@ +/* pages/list/list.wxss */ +page { + display: flex; + flex-direction: column; + height: 100vh; + background-color: #f4f4f4; + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; +} + +.container { + display: flex; + flex-direction: column; + flex: 1; + padding: 20rpx; + box-sizing: border-box; + padding-bottom: 120rpx; /* Space for tab bar */ +} + +.add-todo-section { + display: flex; + align-items: center; + margin-bottom: 30rpx; + background-color: #fff; + border-radius: 16rpx; + padding: 10rpx; + box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08); +} + +.add-todo-input { + flex: 1; + margin-right: 20rpx; +} + +.add-todo-input .t-input__control { + font-size: 30rpx; +} + +.add-todo-button { + min-width: auto; +} + +.todo-list-scroll { + flex: 1; + background-color: #fff; + border-radius: 16rpx; + box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08); + overflow-y: auto; +} + +.todo-item-left { + display: flex; + align-items: center; + width: 100%; +} + +.todo-item-content { + display: flex; + align-items: center; + flex-grow: 1; +} + +.todo-text { + margin-left: 20rpx; + font-size: 30rpx; + color: #333; + flex-grow: 1; + word-break: break-all; +} + +.todo-text.completed { + text-decoration: line-through; + color: #aaa; +} + +.empty-state { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 80rpx; + color: #999; + text-align: center; +} + +.empty-state .t-icon { + margin-bottom: 20rpx; + color: #0052d9; +} + +.empty-state text { + font-size: 28rpx; +} + +.t-navbar { + margin-bottom: 20rpx; +} + +.todo-list .t-cell { + padding-top: 24rpx; + padding-bottom: 24rpx; +} + +.todo-list .t-cell .t-icon[name="delete"] { + font-size: 40rpx; + padding-left: 20rpx; +} + +.custom-tab-bar { + position: fixed; + bottom: 0; + left: 0; + right: 0; + z-index: 1000; /* Ensure it's on top */ +} + diff --git a/miniprogram/pages/settings/settings.json b/miniprogram/pages/settings/settings.json new file mode 100644 index 0000000..50a6f6e --- /dev/null +++ b/miniprogram/pages/settings/settings.json @@ -0,0 +1,11 @@ +{ + "usingComponents": { + "t-navbar": "tdesign-miniprogram/navbar/navbar", + "t-tab-bar": "tdesign-miniprogram/tab-bar/tab-bar", + "t-tab-bar-item": "tdesign-miniprogram/tab-bar-item/tab-bar-item", + "t-icon": "tdesign-miniprogram/icon/icon" + }, + "navigationStyle": "custom", + "navigationBarTitleText": "设置" +} + diff --git a/miniprogram/pages/settings/settings.ts b/miniprogram/pages/settings/settings.ts new file mode 100644 index 0000000..28068b3 --- /dev/null +++ b/miniprogram/pages/settings/settings.ts @@ -0,0 +1,18 @@ +// pages/settings/settings.ts +Component({ + data: { + activeTab: 'settings', // For tab bar + }, + methods: { + onTabChange(e: any) { + const targetPage = e.detail.value; + if (targetPage === 'home') { + wx.switchTab({ url: '/pages/index/index' }); + } else if (targetPage === 'list') { + wx.switchTab({ url: '/pages/list/list' }); + } + // No need to navigate if already on 'settings' + }, + }, +}); + diff --git a/miniprogram/pages/settings/settings.wxml b/miniprogram/pages/settings/settings.wxml new file mode 100644 index 0000000..9d571a0 --- /dev/null +++ b/miniprogram/pages/settings/settings.wxml @@ -0,0 +1,14 @@ + + + + + + 设置页面,敬请期待! + + + 首页 + 任务 + 设置 + + + diff --git a/miniprogram/pages/settings/settings.wxss b/miniprogram/pages/settings/settings.wxss new file mode 100644 index 0000000..54bc8f3 --- /dev/null +++ b/miniprogram/pages/settings/settings.wxss @@ -0,0 +1,39 @@ +/* pages/settings/settings.wxss */ +page { + display: flex; + flex-direction: column; + height: 100vh; + background-color: #f4f4f4; +} + +.container { + display: flex; + flex-direction: column; + flex: 1; + padding-bottom: 120rpx; /* Space for tab bar */ +} + +.content { + flex: 1; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 40rpx; + text-align: center; + color: #555; +} + +.content .t-icon { + margin-bottom: 20rpx; + color: #0052d9; +} + +.custom-tab-bar { + position: fixed; + bottom: 0; + left: 0; + right: 0; + z-index: 1000; +} + diff --git a/package.json b/package.json index c2104be..a966bb9 100644 --- a/package.json +++ b/package.json @@ -8,8 +8,5 @@ "license": "", "dependencies": { "tdesign-miniprogram": "^1.9.4" - }, - "devDependencies": { - "miniprogram-api-typings": "^2.8.3-1" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9954ee7..f9d5daa 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -11,21 +11,12 @@ importers: tdesign-miniprogram: specifier: ^1.9.4 version: 1.9.4 - devDependencies: - miniprogram-api-typings: - specifier: ^2.8.3-1 - version: 2.12.0 packages: - miniprogram-api-typings@2.12.0: - resolution: {integrity: sha512-ibvbqeslVFur0IAvTxLMvsbtvVcMo6gwvOnj0YZHV7aeDLu091VQRrETT2QuiG9P6aZWRcxeNGJChRKVPCp9VQ==} - tdesign-miniprogram@1.9.4: resolution: {integrity: sha512-dc/V53tTmmrHGzrXclBK56h06nq3vo7GQgBTgiVtlAU5Mp/R/a50axswUKf7W3311rKb8Cuj3F3c45kmkBVPRQ==} snapshots: - miniprogram-api-typings@2.12.0: {} - tdesign-miniprogram@1.9.4: {}