133 lines
3.4 KiB
Vue
133 lines
3.4 KiB
Vue
<template>
|
||
<view class="subpackage-host">
|
||
<FurnitureReceptionImpl
|
||
v-if="implReady"
|
||
ref="furnitureReceptionImpl"
|
||
:incomingTab="incomingTab"
|
||
/>
|
||
<view v-else class="loading">
|
||
<text v-if="error">{{ error }}</text>
|
||
<text v-else>正在加载接待模块...</text>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
// 全端显式注册：微信小程序下仅用 componentPlaceholder 时，子组件实例不会出现在 this.$refs 上，导致无法 refresh。
|
||
import FurnitureReceptionImpl from '@/pages-subpackage/furniture_reception/furniture_reception-impl.vue';
|
||
|
||
export default {
|
||
components: {
|
||
FurnitureReceptionImpl
|
||
},
|
||
data() {
|
||
return {
|
||
implReady: false,
|
||
incomingTab: '',
|
||
error: ''
|
||
};
|
||
},
|
||
onLoad(options) {
|
||
// 与 storage 双通道：避免分包异步晚于 onShow 时漏掉目标 tab
|
||
const tab = options && options.tab;
|
||
if (tab && ['status', 'reception', 'tag'].includes(String(tab))) {
|
||
try {
|
||
uni.setStorageSync('workbench-reception-tab', String(tab));
|
||
} catch (e) {}
|
||
}
|
||
this.loadImpl();
|
||
},
|
||
onShow() {
|
||
// tabBar 的 switchTab 不稳定携带 query，因此从 storage 消费目标tab
|
||
try {
|
||
const allowed = ['status', 'reception', 'tag'];
|
||
const tab = (uni.getStorageSync('workbench-reception-tab') || '').toString();
|
||
if (allowed.includes(tab)) {
|
||
uni.removeStorageSync('workbench-reception-tab');
|
||
// 首次进入：loadImpl 往往在 onShow 的 $nextTick 之前就 implReady，若先 incomingTab='' 再 nextTick 赋回，
|
||
// 子组件首次挂载会拿到空 tab，且与宿主 refresh 竞态。
|
||
if (!this.implReady) {
|
||
this.incomingTab = tab;
|
||
} else {
|
||
// 页面已缓存再次显示：脉冲触发子组件 watcher
|
||
this.incomingTab = '';
|
||
this.$nextTick(() => {
|
||
this.incomingTab = tab;
|
||
});
|
||
}
|
||
}
|
||
} catch (e) {}
|
||
// 底部 tab 等场景下页面会被缓存，子组件 mounted 不会再次执行，需每次显示时拉取最新数据
|
||
this.refreshImplDataIfReady();
|
||
},
|
||
methods: {
|
||
loadSubPackagePagesSubpackage() {
|
||
return new Promise((resolve, reject) => {
|
||
if (!uni || !uni.loadSubPackage) {
|
||
resolve();
|
||
return;
|
||
}
|
||
uni.loadSubPackage({
|
||
name: 'pages-subpackage',
|
||
success: resolve,
|
||
fail: () => {
|
||
// 兼容部分平台参数名差异
|
||
uni.loadSubPackage({
|
||
root: 'pages-subpackage',
|
||
success: resolve,
|
||
fail: reject
|
||
});
|
||
}
|
||
});
|
||
});
|
||
},
|
||
async loadImpl() {
|
||
try {
|
||
await this.loadSubPackagePagesSubpackage();
|
||
this.implReady = true;
|
||
await this.$nextTick();
|
||
await this.$nextTick();
|
||
this.refreshImplDataIfReady();
|
||
} catch (e) {
|
||
console.error('[FurnitureReceptionHost] loadImpl failed:', e);
|
||
this.error = '接待模块加载失败，请重试';
|
||
}
|
||
},
|
||
refreshImplDataIfReady() {
|
||
if (!this.implReady) {
|
||
return;
|
||
}
|
||
const tryRefresh = (attempt) => {
|
||
this.$nextTick(() => {
|
||
const impl = this.$refs.furnitureReceptionImpl;
|
||
if (impl && typeof impl.refreshPageData === 'function') {
|
||
impl.refreshPageData();
|
||
return;
|
||
}
|
||
if (attempt < 3) {
|
||
setTimeout(() => tryRefresh(attempt + 1), 50);
|
||
}
|
||
});
|
||
};
|
||
tryRefresh(0);
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style>
|
||
.subpackage-host {
|
||
min-height: 100vh;
|
||
background-color: #F5F5F5;
|
||
}
|
||
|
||
.loading {
|
||
min-height: 100vh;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: #666;
|
||
font-size: 28rpx;
|
||
}
|
||
</style>
|