peixue-dev/Archive/[一次性]快速派单页面分离修复-2026-02-26.md

3.9 KiB
Raw Permalink Blame History

快速派单页面分离修复

创建时间2026-02-26
问题:管理师首页的"快速派单"按钮跳转到 tabBar 的"快速预约"页面,导致功能混乱


问题描述

用户反馈:

  • 管理师首页点击"快速派单"按钮 → 跳转到底部导航栏的"快速预约"页面
  • 底部导航栏的"快速预约" → 应该显示家长端预约界面
  • 两个入口功能混淆,需要分离

解决方案

1. 创建独立的管理师派单页面

新建文件: peidu/uniapp/manager-package/pages/manager/quick-assign.vue

<template>
  <view class="container">
    <!-- 管理师派单界面 -->
    <ManagerBooking />
  </view>
</template>

<script>
import ManagerBooking from '@/pages/booking/components/ManagerBooking.vue'

export default {
  components: {
    ManagerBooking
  }
}
</script>

2. 修改管理师首页跳转逻辑

文件: peidu/uniapp/src/pages/index/components/ManagerHome.vue

修改前:

goQuickBooking() {
  uni.switchTab({ 
    url: '/pages/booking/quick-booking'
  })
}

修改后:

goQuickBooking() {
  // 跳转到管理师派单页面(独立页面)
  uni.navigateTo({ 
    url: '/manager-package/pages/manager/quick-assign'
  })
}

3. 恢复快速预约页面为家长端

文件: peidu/uniapp/src/pages/booking/quick-booking.vue

修改前: 根据角色显示不同组件(管理师、陪伴员、分销员等)

修改后: 只显示家长端预约界面

<template>
  <view class="container">
    <!-- 快速预约页面显示家长端预约界面 -->
    <!-- 游客模式可浏览点击预约时拦截登录 -->
    <ParentBooking :isGuestMode="!isLoggedIn" />
  </view>
</template>

4. 修复返回按钮路径

文件: peidu/uniapp/src/pages/booking/components/ManagerBooking.vue

修复:

goBack() {
  // 返回到管理师首页
  uni.switchTab({
    url: '/pages/index/index'  // 修复:之前是 '/pages/index'
  })
}

5. 标题居中显示

文件: peidu/uniapp/src/pages/booking/components/ManagerBooking.vue

修改样式:

.header {
  position: relative;  // 添加相对定位
  
  .back-button {
    position: absolute;  // 改为绝对定位
    left: 30rpx;
    z-index: 10;
    // 移除 margin-right: 20rpx
  }
  
  .header-content {
    flex: 1;
    text-align: center;  // 标题居中
  }
}

6. 注册新页面

文件: peidu/uniapp/pages.json

manager-package 分包中添加:

{
  "path": "pages/manager/quick-assign",
  "style": {
    "navigationBarTitleText": "快速派单",
    "navigationStyle": "custom"
  }
}

修改文件清单

  1. 新建:manager-package/pages/manager/quick-assign.vue
  2. 修改:src/pages/index/components/ManagerHome.vue
  3. 修改:src/pages/booking/quick-booking.vue
  4. 修改:src/pages/booking/components/ManagerBooking.vue
  5. 修改:pages.json

功能说明

管理师首页 → 快速派单

  • 点击"快速派单"按钮
  • 跳转到独立的派单页面(/manager-package/pages/manager/quick-assign
  • 显示管理师派单界面,包含:
    • 返回按钮(左上角)
    • 标题居中显示
    • 待派单统计
    • 待派单订单列表

底部导航栏 → 快速预约

  • 点击"快速预约" tab
  • 显示家长端预约界面
  • 游客可浏览,点击预约时拦截登录

测试步骤

  1. 以管理师身份登录
  2. 在首页点击"快速派单"按钮
  3. 验证跳转到独立的派单页面
  4. 验证标题居中显示
  5. 点击左上角返回按钮,验证返回首页
  6. 点击底部导航栏"快速预约"
  7. 验证显示家长端预约界面

完成状态

已完成所有修改
页面分离成功
返回按钮正常
标题居中显示


修复完成时间: 2026-02-26