2026-08-20 20:10:20 +08:00
|
|
|
|
<template>
|
|
|
|
|
|
<view v-if="user && currentModule" class="page-shell portal-page">
|
2026-08-26 16:50:25 +08:00
|
|
|
|
<PortalHeader :title="$t('module.title')" :user="user" />
|
2026-08-20 20:10:20 +08:00
|
|
|
|
<view class="portal-content">
|
2026-08-26 16:50:25 +08:00
|
|
|
|
<view class="module-hero" :class="`module-hero-${currentModule.key}`"><view class="module-hero-icon">{{ currentModule.icon }}</view><view class="module-hero-copy"><text class="module-hero-title">{{ $t(currentModule.nameKey) }}</text><text class="module-hero-desc">{{ $t(currentModule.descriptionKey) }}</text></view><text class="module-hero-count">{{ $t('module.availability', { available: availableCount, total: currentModule.operations.length }) }}</text></view>
|
|
|
|
|
|
<view class="section-heading"><text class="group-title">{{ $t('module.functions') }}</text><text class="section-heading-hint">{{ $t('module.hint') }}</text></view>
|
|
|
|
|
|
<view class="operation-list"><button v-for="operation in currentModule.operations" :key="operation.name" class="operation-item" :class="{ 'operation-item-disabled': !operation.available }" :disabled="!operation.available" @tap="openOperation(operation)"><view class="operation-icon">{{ operation.icon }}</view><view class="operation-info"><text class="operation-name">{{ $t(operation.nameKey) }}</text><text class="operation-desc">{{ $t(operation.descriptionKey) }}</text></view><text v-if="operation.available" class="operation-ready">{{ $t('common.available') }}</text><text v-else class="operation-locked">{{ $t('common.unavailable') }}</text><text v-if="operation.available" class="operation-arrow">›</text></button></view>
|
|
|
|
|
|
<view class="module-empty-note">{{ $t('module.onlyReceiving') }}</view>
|
2026-08-20 20:10:20 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
import PortalHeader from '@/components/PortalHeader.vue'
|
|
|
|
|
|
import { MODULES } from '@/data/overseas-workbench.js'
|
|
|
|
|
|
import { session, requireSession } from '@/stores/session.js'
|
|
|
|
|
|
export default {
|
|
|
|
|
|
components: { PortalHeader },
|
|
|
|
|
|
data() { return { user: session.currentUser, moduleKey: 'inbound' } },
|
2026-08-26 16:50:25 +08:00
|
|
|
|
computed: {
|
|
|
|
|
|
currentModule() { return MODULES.find((module) => module.key === this.moduleKey) || MODULES[0] },
|
|
|
|
|
|
availableCount() { return this.currentModule.operations.filter((operation) => operation.available).length }
|
|
|
|
|
|
},
|
2026-08-20 20:10:20 +08:00
|
|
|
|
onLoad(options) { this.moduleKey = options.key || 'inbound' },
|
|
|
|
|
|
onShow() { if (!requireSession()) return; this.user = session.currentUser },
|
|
|
|
|
|
methods: {
|
2026-08-26 16:50:25 +08:00
|
|
|
|
openOperation(operation) { if (operation.available) uni.navigateTo({ url: `/pages/operation/operation?module=${this.moduleKey}&op=${operation.key}` }) }
|
2026-08-20 20:10:20 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
</script>
|
