79 lines
2.1 KiB
Vue
79 lines
2.1 KiB
Vue
<template>
|
|
<div class="layout-padding">
|
|
<div class="layout-padding-auto layout-padding-view flex flex-col">
|
|
<el-tabs v-model="state.currentTab" class="demo-tabs" @tab-click="tabClick">
|
|
<el-tab-pane v-for="(v) in data.tabs" :key="v.name" :label="v.label" :name="v.name" />
|
|
</el-tabs>
|
|
<div class="flex-1 overflow-y-scroll px-8">
|
|
<div class="w-full" v-if="state.currentTab === 'CANTEEN'">
|
|
</div>
|
|
|
|
<div class="w-full" v-if="state.currentTab === 'SHOP'">
|
|
</div>
|
|
|
|
<div class="w-full" v-if="state.currentTab === 'SERVICE'">
|
|
</div>
|
|
|
|
<div class="w-full" v-if="state.currentTab === 'NUTRITION'">
|
|
<NutritionSetting ref="nutritionSettingRef" />
|
|
</div>
|
|
|
|
<div class="h-20" />
|
|
</div>
|
|
<div class="flex justify-center">
|
|
<el-button type="primary" @click="onSubmit">保存配置</el-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts" name="deviceLog">
|
|
const NutritionSetting = defineAsyncComponent(() => import("./components/nutrition-setting.vue"));
|
|
|
|
const data = {
|
|
tabs: [
|
|
{
|
|
label: "智慧食堂",
|
|
name: "CANTEEN",
|
|
},
|
|
{
|
|
label: "智慧超市",
|
|
name: "SHOP",
|
|
},
|
|
{
|
|
label: "智慧服务",
|
|
name: "SERVICE",
|
|
},
|
|
{
|
|
label: "营养分析",
|
|
name: "NUTRITION",
|
|
},
|
|
]
|
|
}
|
|
|
|
const nutritionSettingRef = ref()
|
|
|
|
const state = reactive<any>({
|
|
currentTab: data.tabs[0].name,
|
|
})
|
|
|
|
function tabClick(e: any) {
|
|
console.log("tabClick", e);
|
|
}
|
|
|
|
function onSubmit() {
|
|
if (state.currentTab == "CANTEEN") {
|
|
return
|
|
}
|
|
if (state.currentTab == "SHOP") {
|
|
return
|
|
}
|
|
if (state.currentTab == "SERVICE") {
|
|
return
|
|
}
|
|
if (state.currentTab == "NUTRITION") {
|
|
nutritionSettingRef.value.onSubmit()
|
|
return
|
|
}
|
|
}
|
|
</script> |