<template>
|
|
<view class="page">
|
|
<navbar :title="pageTitle" />
|
|
|
|
<view class="content">
|
|
<!-- 用户/泵司抢单大厅 -->
|
|
<user-hall v-if="Number(role) === 0" ref="us"></user-hall>
|
|
|
|
<!-- 企业订单管理 -->
|
|
<enterprise-hall v-if="Number(role) === 1" ref="eh"></enterprise-hall>
|
|
|
|
<!-- 员工订单大厅 -->
|
|
<staff-hall v-if="Number(role) === 2" ref="ss"></staff-hall>
|
|
|
|
<!-- 区域管理员订单 -->
|
|
<region-hall v-if="Number(role) === 3" ref="rh"></region-hall>
|
|
</view>
|
|
|
|
<tabber select="order" />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import navbar from '@/components/base/navbar.vue'
|
|
import tabber from '@/components/base/tabbar.vue'
|
|
import UserHall from '@/components/user/hall.vue'
|
|
import StaffHall from '@/components/staff/hall.vue'
|
|
import EnterpriseHall from '@/components/enterprise/hall.vue'
|
|
import RegionHall from '@/components/region/hall.vue'
|
|
import { mapState, mapGetters, mapMutations } from 'vuex'
|
|
|
|
export default {
|
|
components: {
|
|
navbar,
|
|
tabber,
|
|
UserHall,
|
|
StaffHall,
|
|
EnterpriseHall,
|
|
RegionHall
|
|
},
|
|
data() {
|
|
return {
|
|
}
|
|
},
|
|
computed: {
|
|
...mapState(['role']),
|
|
...mapGetters(['currentRoleText']),
|
|
pageTitle() {
|
|
const roleNum = Number(this.role);
|
|
if (roleNum === 0) {
|
|
return '抢单大厅';
|
|
} else if (roleNum === 1) {
|
|
return '企业订单';
|
|
} else if (roleNum === 2) {
|
|
return '员工订单';
|
|
} else if (roleNum === 3) {
|
|
return '区域订单';
|
|
} else {
|
|
return '订单';
|
|
}
|
|
}
|
|
},
|
|
onShow() {
|
|
// 初始化角色
|
|
this.initRole();
|
|
|
|
// 设置导航栏标题
|
|
uni.setNavigationBarTitle({ title: this.pageTitle });
|
|
|
|
// 监听角色变更事件
|
|
uni.$on('roleChanged', this.handleRoleChange);
|
|
|
|
// 刷新对应的组件数据
|
|
this.refreshCurrentComponent();
|
|
},
|
|
onHide() {
|
|
// 移除事件监听
|
|
uni.$off('roleChanged', this.handleRoleChange);
|
|
},
|
|
methods: {
|
|
...mapMutations(['initRole']),
|
|
// 处理角色变更
|
|
handleRoleChange(newRole) {
|
|
console.log('订单页面收到角色变更:', newRole);
|
|
// 更新导航栏标题
|
|
uni.setNavigationBarTitle({ title: this.pageTitle });
|
|
// 刷新对应组件
|
|
this.$nextTick(() => {
|
|
this.refreshCurrentComponent();
|
|
});
|
|
},
|
|
// 刷新当前角色对应的组件
|
|
refreshCurrentComponent() {
|
|
this.$nextTick(() => {
|
|
try {
|
|
const roleNum = Number(this.role);
|
|
if (roleNum === 0) {
|
|
this.$refs.us && this.$refs.us.loadPage && this.$refs.us.loadPage();
|
|
} else if (roleNum === 1) {
|
|
this.$refs.eh && this.$refs.eh.loadPage && this.$refs.eh.loadPage();
|
|
} else if (roleNum === 2) {
|
|
this.$refs.ss && this.$refs.ss.loadPage && this.$refs.ss.loadPage();
|
|
} else if (roleNum === 3) {
|
|
this.$refs.rh && this.$refs.rh.loadPage && this.$refs.rh.loadPage();
|
|
}
|
|
} catch (e) {
|
|
console.log('组件方法调用失败:', e);
|
|
}
|
|
});
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.page {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100vh;
|
|
background-color: #f5f5f5;
|
|
}
|
|
|
|
.content {
|
|
flex: 1;
|
|
overflow: hidden;
|
|
padding-bottom: 120rpx; /* 为底部tabbar留出空间 */
|
|
}
|
|
</style>
|