hflllll
5 months ago
10 changed files with 462 additions and 154 deletions
Split View
Diff Options
-
+13 -1api/model/order.js
-
+0 -59mixins/order.js
-
+7 -0pages.json
-
+1 -1pages/index/cart.vue
-
+19 -1pages/index/center.vue
-
+2 -2pages/index/index.vue
-
+379 -0pages/index/orderManage.vue
-
+27 -23pages_order/components/order/placeOrder.vue
-
+13 -2pages_order/order/afterSale.vue
-
+1 -65pages_order/product/productDetail.vue
+ 13
- 1
api/model/order.js
View File
+ 0
- 59
mixins/order.js
View File
+ 7
- 0
pages.json
View File
+ 1
- 1
pages/index/cart.vue
View File
+ 19
- 1
pages/index/center.vue
View File
+ 2
- 2
pages/index/index.vue
View File
+ 379
- 0
pages/index/orderManage.vue
View File
| @ -0,0 +1,379 @@ | |||
| <template> | |||
| <view class="page"> | |||
| <!-- 导航栏 --> | |||
| <navbar title="订单管理" bgColor="#019245" color="#fff" /> | |||
| <!-- 搜索框 --> | |||
| <view style="background-color: #fff; padding: 12rpx 20rpx 0rpx; "> | |||
| <uv-search placeholder="搜索商品名" v-model="keyword" :showAction="false" actionText="" height="80rpx" animation | |||
| bgColor="#F5F5F5" inputAlign="center" color="#000" placeholderColor="#979797" searchIconSize="50rpx" | |||
| @search="handleSearch" @clickIcon="handleSearch" /> | |||
| </view> | |||
| <!-- 订单筛选 --> | |||
| <view class="tabs"> | |||
| <uv-tabs :list="tabs" :activeStyle="{ color: '#019245'}" lineColor="#019245" :scrollable="false" | |||
| :inactiveStyle="{color: 'black'}" lineHeight="6rpx" lineWidth="55rpx" :current="status" | |||
| @click="clickTabs" /> | |||
| </view> | |||
| <!-- 批量操作区域 --> | |||
| <view class="batch-actions" v-if="leaderOrderList.length > 0"> | |||
| <checkbox-group @change="handleCheckAllChange"> | |||
| <label class="checkbox-all"> | |||
| <checkbox :checked="isAllChecked" color="#019245" /> | |||
| <text>全选</text> | |||
| </label> | |||
| </checkbox-group> | |||
| <view class="batch-btns"> | |||
| <button class="batch-btn" @tap="handleBatchAction('出餐')" v-if="status === 0">批量出餐</button> | |||
| <button class="batch-btn" @tap="handleBatchAction('取餐')" v-if="status === 1">批量待取餐</button> | |||
| <button class="batch-btn" @tap="handleBatchAction('完成')" v-if="status === 2">批量完成</button> | |||
| </view> | |||
| </view> | |||
| <!-- 团餐列表 --> | |||
| <view class="group-meal-list"> | |||
| <view class="meal-item" v-for="(meal, index) in leaderOrderList" :key="meal.id"> | |||
| <view class="meal-checkbox"> | |||
| <checkbox :checked="checkedOrders.includes(meal.id)" :value="meal.id" color="#019245" @tap.stop="toggleCheckOrder(meal.id)" /> | |||
| </view> | |||
| <view class="meal-content" @tap="viewOrder(meal)"> | |||
| <view class="meal-name">{{ meal.title }}</view> | |||
| <view class="meal-price">本单佣金合计: <text class="price-value">¥{{ (meal.commission || 0).toFixed(2) || 0.00 }}</text> | |||
| </view> | |||
| </view> | |||
| <view class="meal-action"> | |||
| <button class="action-btn" @tap.stop="handleSingleAction(meal, '出餐')" v-if="status === 0">出餐</button> | |||
| <button class="action-btn" @tap.stop="handleSingleAction(meal, '取餐')" v-if="status === 2">取餐</button> | |||
| <button class="action-btn" @tap.stop="handleSingleAction(meal, '完成')" v-if="status === 2">完成</button> | |||
| <button class="order-btn" @tap.stop="viewOrder(meal)">查看</button> | |||
| </view> | |||
| </view> | |||
| <view style="margin-top: 200rpx; min-width: 700rpx;"> | |||
| <uv-empty mode="order" v-if="leaderOrderList.length == 0" /> | |||
| </view> | |||
| </view> | |||
| <tabber select="order" /> | |||
| </view> | |||
| </template> | |||
| <script> | |||
| import mixinsList from '@/mixins/list.js' | |||
| import tabber from '@/components/base/tabbar.vue' | |||
| export default { | |||
| mixins: [mixinsList], | |||
| components: { | |||
| tabber | |||
| }, | |||
| data() { | |||
| return { | |||
| keyword: '', | |||
| title: '', | |||
| tabs: [ | |||
| { name: '待出餐' }, | |||
| { name: '已出餐' }, | |||
| { name: '待取餐' }, | |||
| { name: '已完成' } | |||
| ], | |||
| status: 0, | |||
| leaderOrderList: [], | |||
| mixinsListApi: 'managerOrderList', | |||
| mixinsListKey: 'leaderOrderList', | |||
| checkedOrders: [], // 已选择的订单ID | |||
| isAllChecked: false | |||
| } | |||
| }, | |||
| onLoad(args) { | |||
| // 检查是否有tabIndex参数，如果有则自动切换到对应tab | |||
| if (args.tabIndex !== undefined) { | |||
| const index = parseInt(args.tabIndex) | |||
| if (!isNaN(index) && index >= 0 && index < this.tabs.length) { | |||
| this.status = index | |||
| } | |||
| } | |||
| }, | |||
| methods: { | |||
| handleSearch() { | |||
| this.title = this.keyword | |||
| this.getData() | |||
| this.keyword = '' | |||
| this.title = '' | |||
| }, | |||
| beforeGetData() { | |||
| const params = { | |||
| status: this.status, | |||
| title: this.title || '' | |||
| } | |||
| return params | |||
| }, | |||
| //点击tab栏 | |||
| clickTabs({ index }) { | |||
| this.status = index | |||
| this.getData() | |||
| this.checkedOrders = [] // 切换标签时清空选择 | |||
| this.isAllChecked = false | |||
| }, | |||
| // 查看团餐订单 | |||
| viewOrder(meal) { | |||
| this.$utils.navigateTo({ | |||
| url: '/pages_order/order/groupMealDetail?id=' + meal.id | |||
| }) | |||
| }, | |||
| // 切换选择订单 | |||
| toggleCheckOrder(id) { | |||
| const index = this.checkedOrders.indexOf(id) | |||
| if (index === -1) { | |||
| this.checkedOrders.push(id) | |||
| } else { | |||
| this.checkedOrders.splice(index, 1) | |||
| } | |||
| // 更新全选状态 | |||
| this.isAllChecked = this.checkedOrders.length === this.leaderOrderList.length | |||
| }, | |||
| // 处理全选/取消全选 | |||
| handleCheckAllChange(e) { | |||
| this.isAllChecked = !this.isAllChecked | |||
| if (this.isAllChecked) { | |||
| this.checkedOrders = this.leaderOrderList.map(item => item.id) | |||
| } else { | |||
| this.checkedOrders = [] | |||
| } | |||
| }, | |||
| // 处理单个订单操作 | |||
| handleSingleAction(meal, action) { | |||
| const actionMap = { | |||
| '出餐': { | |||
| status: 1, | |||
| confirmText: '确定将该订单标记为已出餐吗？', | |||
| successText: '已出餐' | |||
| }, | |||
| '取餐': { | |||
| status: 2, | |||
| confirmText: '确定将该订单标记为待取餐吗？', | |||
| successText: '待取餐' | |||
| }, | |||
| '完成': { | |||
| status: 3, | |||
| confirmText: '确定将该订单标记为已完成吗？', | |||
| successText: '已完成' | |||
| } | |||
| } | |||
| const currentAction = actionMap[action] | |||
| uni.showModal({ | |||
| title: '提示', | |||
| content: currentAction.confirmText, | |||
| confirmColor: '#019245', | |||
| success: (res) => { | |||
| if (res.confirm) { | |||
| // 使用统一的updateOrders接口处理单个订单 | |||
| uni.showLoading({ | |||
| title: '处理中...' | |||
| }) | |||
| this.$api('updateOrders', { | |||
| orderIds: meal.id, // 单个订单直接传ID | |||
| status: currentAction.status | |||
| }, res => { | |||
| uni.hideLoading() | |||
| if (res.code === 200) { | |||
| uni.showToast({ | |||
| title: currentAction.successText, | |||
| icon: 'success' | |||
| }) | |||
| this.getData() | |||
| } else { | |||
| uni.showToast({ | |||
| title: '操作失败', | |||
| icon: 'none' | |||
| }) | |||
| } | |||
| }) | |||
| } | |||
| } | |||
| }) | |||
| }, | |||
| // 处理批量操作 | |||
| handleBatchAction(action) { | |||
| if (this.checkedOrders.length === 0) { | |||
| uni.showToast({ | |||
| title: '请先选择订单', | |||
| icon: 'none' | |||
| }) | |||
| return | |||
| } | |||
| const actionMap = { | |||
| '出餐': { | |||
| status: 1, | |||
| confirmText: `确定将选中的${this.checkedOrders.length}个订单标记为已出餐吗？`, | |||
| successText: '批量操作成功' | |||
| }, | |||
| '取餐': { | |||
| status: 2, | |||
| confirmText: `确定将选中的${this.checkedOrders.length}个订单标记为待取餐餐吗？`, | |||
| successText: '批量操作成功' | |||
| }, | |||
| '完成': { | |||
| status: 3, | |||
| confirmText: `确定将选中的${this.checkedOrders.length}个订单标记为已完成吗？`, | |||
| successText: '批量操作成功' | |||
| } | |||
| } | |||
| const currentAction = actionMap[action] | |||
| uni.showModal({ | |||
| title: '批量操作', | |||
| content: currentAction.confirmText, | |||
| confirmColor: '#019245', | |||
| success: (res) => { | |||
| if (res.confirm) { | |||
| // 显示加载中 | |||
| uni.showLoading({ | |||
| title: '处理中...' | |||
| }) | |||
| // 使用分号分隔多个订单ID | |||
| const orderIds = this.checkedOrders.join(';') | |||
| this.$api('updateOrders', { | |||
| orderIds: orderIds, | |||
| status: currentAction.status | |||
| }, res => { | |||
| uni.hideLoading() | |||
| if (res.code === 200) { | |||
| uni.showToast({ | |||
| title: currentAction.successText, | |||
| icon: 'success' | |||
| }) | |||
| this.checkedOrders = [] | |||
| this.isAllChecked = false | |||
| this.getData() | |||
| } else { | |||
| uni.showToast({ | |||
| title: '操作失败', | |||
| icon: 'none' | |||
| }) | |||
| } | |||
| }) | |||
| } | |||
| } | |||
| }) | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style scoped lang="scss"> | |||
| .page {} | |||
| .tabs { | |||
| background: #fff; | |||
| padding-bottom: 4rpx; | |||
| } | |||
| /* 批量操作区域 */ | |||
| .batch-actions { | |||
| display: flex; | |||
| justify-content: space-between; | |||
| align-items: center; | |||
| background-color: #fff; | |||
| padding: 20rpx; | |||
| margin-bottom: 10rpx; | |||
| border-bottom: 1px solid #f5f5f5; | |||
| } | |||
| .checkbox-all { | |||
| display: flex; | |||
| align-items: center; | |||
| font-size: 28rpx; | |||
| } | |||
| .batch-btns { | |||
| display: flex; | |||
| gap: 20rpx; | |||
| } | |||
| .batch-btn { | |||
| background-color: $uni-color; | |||
| color: #fff; | |||
| font-size: 26rpx; | |||
| padding: 10rpx 30rpx; | |||
| border-radius: 30rpx; | |||
| line-height: 1.5; | |||
| margin: 0; | |||
| } | |||
| /* 团餐列表样式 */ | |||
| .group-meal-list { | |||
| padding: 20rpx; | |||
| } | |||
| .meal-item { | |||
| display: flex; | |||
| align-items: center; | |||
| padding: 30rpx 20rpx; | |||
| background-color: #fff; | |||
| margin-bottom: 20rpx; | |||
| border-radius: 10rpx; | |||
| } | |||
| .meal-checkbox { | |||
| margin-right: 20rpx; | |||
| } | |||
| .meal-content { | |||
| flex: 1; | |||
| } | |||
| .meal-name { | |||
| font-size: 32rpx; | |||
| font-weight: 500; | |||
| margin-bottom: 10rpx; | |||
| } | |||
| .meal-price { | |||
| font-size: 28rpx; | |||
| color: $uni-color; | |||
| background-color: #ECFEF4; | |||
| padding: 10rpx 20rpx; | |||
| border-radius: 10rpx; | |||
| display: inline-block; | |||
| } | |||
| .price-value { | |||
| margin-left: 10rpx; | |||
| font-weight: 500; | |||
| } | |||
| .meal-action { | |||
| display: flex; | |||
| gap: 15rpx; | |||
| margin-left: 20rpx; | |||
| } | |||
| .action-btn { | |||
| background-color: #f0f0f0; | |||
| color: #333; | |||
| font-size: 26rpx; | |||
| padding: 10rpx 25rpx; | |||
| border-radius: 30rpx; | |||
| line-height: 1.5; | |||
| margin: 0; | |||
| } | |||
| .order-btn { | |||
| background-color: $uni-color; | |||
| color: #fff; | |||
| font-size: 26rpx; | |||
| padding: 10rpx 25rpx; | |||
| border-radius: 30rpx; | |||
| line-height: 1.5; | |||
| margin: 0; | |||
| } | |||
| </style> | |||