<template>
|
<div class="stock-center">
|
<el-tabs v-model="activeTab" class="center-tabs">
|
<el-tab-pane label="实时库存" name="stock" />
|
<el-tab-pane label="库存变动明细" name="movement" />
|
<el-tab-pane label="库存盘点" name="taking" />
|
<el-tab-pane label="库存时间设置" name="setting" />
|
</el-tabs>
|
<div class="center-body">
|
<keep-alive>
|
<component :is="currentComponent" />
|
</keep-alive>
|
</div>
|
</div>
|
</template>
|
|
<script setup>
|
import { ref, computed } from "vue";
|
import StockRealTime from "../stockManagement/index.vue";
|
import StockMovement from "../stockMovement/index.vue";
|
import StockTaking from "../stockTaking/index.vue";
|
import StockTimeSetting from "../stockTimeSetting/index.vue";
|
|
defineOptions({
|
name: "库存管理",
|
});
|
|
const activeTab = ref("stock");
|
|
const tabMap = {
|
stock: StockRealTime,
|
movement: StockMovement,
|
taking: StockTaking,
|
setting: StockTimeSetting,
|
};
|
|
const currentComponent = computed(() => tabMap[activeTab.value] || StockRealTime);
|
</script>
|
|
<style scoped lang="scss">
|
.stock-center {
|
padding: 10px 12px;
|
}
|
.center-tabs {
|
margin-bottom: 6px;
|
}
|
/* 子页面自带的 app-container 会多一层内边距，这里去掉 */
|
.center-body :deep(.app-container) {
|
padding: 0;
|
}
|
</style>
|
