61 lines
1.5 KiB
Vue
61 lines
1.5 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from "vue";
|
|
|
|
/**
|
|
* import type
|
|
*/
|
|
import type { ItemsTeb } from "@/modules/04_system/interface/index/Main";
|
|
|
|
/**
|
|
* import components
|
|
*/
|
|
import Card from "@/modules/04_system/components/cardBackupRestore.vue";
|
|
|
|
/**
|
|
* ตัวแปร
|
|
*/
|
|
const tab = ref<string>("backup");
|
|
const tabItems = ref<ItemsTeb[]>([
|
|
{ name: "backup", label: "Backup & Restore", icon: "mdi-database" },
|
|
]);
|
|
</script>
|
|
|
|
<template>
|
|
<div class="row items-center">
|
|
<div class="toptitle text-dark row items-center q-py-xs">ตั้งค่าระบบ</div>
|
|
</div>
|
|
<q-card flast bordered>
|
|
<q-tabs
|
|
v-model="tab"
|
|
dense
|
|
align="left"
|
|
inline-label
|
|
class="bg-white text-grey"
|
|
active-color="primary"
|
|
indicator-color="primary"
|
|
>
|
|
<div v-for="item in tabItems">
|
|
<q-tab :name="item.name" :label="item.label" :icon="item.icon" />
|
|
</div>
|
|
</q-tabs>
|
|
<q-separator />
|
|
<q-tab-panels v-model="tab" animated class="shadow-2 rounded-borders">
|
|
<q-tab-panel name="backup">
|
|
<q-card-section class="q-pa-none">
|
|
<div class="text-h6">ข้อมูลสำรอง</div>
|
|
</q-card-section>
|
|
|
|
<Card :tab="tab" />
|
|
</q-tab-panel>
|
|
|
|
<q-tab-panel name="restore">
|
|
<q-card-section class="q-pa-none">
|
|
<div class="text-h6">คืนค่า</div>
|
|
</q-card-section>
|
|
<Card :tab="tab" />
|
|
</q-tab-panel>
|
|
</q-tab-panels>
|
|
</q-card>
|
|
</template>
|
|
|
|
<style scoped></style>
|