feat: add new components for unit, division and installation

Add list and entry-form components for unit, division and installation modules
This commit is contained in:
Khafid Prayoga
2025-08-28 12:13:36 +07:00
parent 6ad99d45f2
commit 71dfd6545c
9 changed files with 495 additions and 0 deletions
+57
View File
@@ -0,0 +1,57 @@
<script setup lang="ts">
// #region Props & Emits
const props = defineProps<{
id: string
code: string
name: string
parentId: string
}>()
const emit = defineEmits<{
(e: 'update', value: string): void
}>()
// #endregion
// #region State & Computed
// =============================
const count = ref(0)
const double = computed(() => count.value * 2)
// #endregion
// #region Lifecycle Hooks
onMounted(() => {
// init code
fetchData()
})
// #endregion
// #region Functions
async function fetchData() {
console.log('fetched')
}
// #endregion region
// #region Utilities & event handlers
function increment() {
count.value++
}
// #endregion
// #region Watchers
watch(count, (newVal, oldVal) => {
console.log('count changed:', oldVal, '->', newVal)
})
// #endregion
</script>
<template>
<div>
<p>Count: {{ count }}</p>
<p>Double: {{ double }}</p>
<button @click="increment">+1</button>
</div>
</template>
<style scoped>
/* component style */
</style>
+54
View File
@@ -0,0 +1,54 @@
<script setup lang="ts">
// #region Props & Emits
const props = defineProps<{
title: string
}>()
const emit = defineEmits<{
(e: 'update', value: string): void
}>()
// #endregion
// #region State & Computed
// =============================
const count = ref(0)
const double = computed(() => count.value * 2)
// #endregion
// #region Lifecycle Hooks
onMounted(() => {
// init code
fetchData()
})
// #endregion
// #region Functions
async function fetchData() {
console.log('fetched')
}
// #endregion region
// #region Utilities & event handlers
function increment() {
count.value++
}
// #endregion
// #region Watchers
watch(count, (newVal, oldVal) => {
console.log('count changed:', oldVal, '->', newVal)
})
// #endregion
</script>
<template>
<div>
<p>Count: {{ count }}</p>
<p>Double: {{ double }}</p>
<button @click="increment">+1</button>
</div>
</template>
<style scoped>
/* component style */
</style>
@@ -0,0 +1,57 @@
<script setup lang="ts">
// #region Props & Emits
const props = defineProps<{
id: string
code: string
name: string
encounterClassCode: string
}>()
const emit = defineEmits<{
(e: 'update', value: string): void
}>()
// #endregion
// #region State & Computed
// =============================
const count = ref(0)
const double = computed(() => count.value * 2)
// #endregion
// #region Lifecycle Hooks
onMounted(() => {
// init code
fetchData()
})
// #endregion
// #region Functions
async function fetchData() {
console.log('fetched')
}
// #endregion region
// #region Utilities & event handlers
function increment() {
count.value++
}
// #endregion
// #region Watchers
watch(count, (newVal, oldVal) => {
console.log('count changed:', oldVal, '->', newVal)
})
// #endregion
</script>
<template>
<div>
<p>Count: {{ count }}</p>
<p>Double: {{ double }}</p>
<button @click="increment">+1</button>
</div>
</template>
<style scoped>
/* component style */
</style>
+54
View File
@@ -0,0 +1,54 @@
<script setup lang="ts">
// #region Props & Emits
const props = defineProps<{
title: string
}>()
const emit = defineEmits<{
(e: 'update', value: string): void
}>()
// #endregion
// #region State & Computed
// =============================
const count = ref(0)
const double = computed(() => count.value * 2)
// #endregion
// #region Lifecycle Hooks
onMounted(() => {
// init code
fetchData()
})
// #endregion
// #region Functions
async function fetchData() {
console.log('fetched')
}
// #endregion region
// #region Utilities & event handlers
function increment() {
count.value++
}
// #endregion
// #region Watchers
watch(count, (newVal, oldVal) => {
console.log('count changed:', oldVal, '->', newVal)
})
// #endregion
</script>
<template>
<div>
<p>Count: {{ count }}</p>
<p>Double: {{ double }}</p>
<button @click="increment">+1</button>
</div>
</template>
<style scoped>
/* component style */
</style>
+57
View File
@@ -0,0 +1,57 @@
<script setup lang="ts">
// #region Props & Emits
const props = defineProps<{
id: string
code: string
name: string
installationId: string
}>()
const emit = defineEmits<{
(e: 'update', value: string): void
}>()
// #endregion
// #region State & Computed
// =============================
const count = ref(0)
const double = computed(() => count.value * 2)
// #endregion
// #region Lifecycle Hooks
onMounted(() => {
// init code
fetchData()
})
// #endregion
// #region Functions
async function fetchData() {
console.log('fetched')
}
// #endregion region
// #region Utilities & event handlers
function increment() {
count.value++
}
// #endregion
// #region Watchers
watch(count, (newVal, oldVal) => {
console.log('count changed:', oldVal, '->', newVal)
})
// #endregion
</script>
<template>
<div>
<p>Count: {{ count }}</p>
<p>Double: {{ double }}</p>
<button @click="increment">+1</button>
</div>
</template>
<style scoped>
/* component style */
</style>
+54
View File
@@ -0,0 +1,54 @@
<script setup lang="ts">
// #region Props & Emits
const props = defineProps<{
title: string
}>()
const emit = defineEmits<{
(e: 'update', value: string): void
}>()
// #endregion
// #region State & Computed
// =============================
const count = ref(0)
const double = computed(() => count.value * 2)
// #endregion
// #region Lifecycle Hooks
onMounted(() => {
// init code
fetchData()
})
// #endregion
// #region Functions
async function fetchData() {
console.log('fetched')
}
// #endregion region
// #region Utilities & event handlers
function increment() {
count.value++
}
// #endregion
// #region Watchers
watch(count, (newVal, oldVal) => {
console.log('count changed:', oldVal, '->', newVal)
})
// #endregion
</script>
<template>
<div>
<p>Count: {{ count }}</p>
<p>Double: {{ double }}</p>
<button @click="increment">+1</button>
</div>
</template>
<style scoped>
/* component style */
</style>
+54
View File
@@ -0,0 +1,54 @@
<script setup lang="ts">
// #region Props & Emits
const props = defineProps<{
title: string
}>()
const emit = defineEmits<{
(e: 'update', value: string): void
}>()
// #endregion
// #region State & Computed
// =============================
const count = ref(0)
const double = computed(() => count.value * 2)
// #endregion
// #region Lifecycle Hooks
onMounted(() => {
// init code
fetchData()
})
// #endregion
// #region Functions
async function fetchData() {
console.log('fetched')
}
// #endregion region
// #region Utilities & event handlers
function increment() {
count.value++
}
// #endregion
// #region Watchers
watch(count, (newVal, oldVal) => {
console.log('count changed:', oldVal, '->', newVal)
})
// #endregion
</script>
<template>
<div>
<p>Count: {{ count }}</p>
<p>Double: {{ double }}</p>
<button @click="increment">+1</button>
</div>
</template>
<style scoped>
/* component style */
</style>
+54
View File
@@ -0,0 +1,54 @@
<script setup lang="ts">
// #region Props & Emits
const props = defineProps<{
title: string
}>()
const emit = defineEmits<{
(e: 'update', value: string): void
}>()
// #endregion
// #region State & Computed
// =============================
const count = ref(0)
const double = computed(() => count.value * 2)
// #endregion
// #region Lifecycle Hooks
onMounted(() => {
// init code
fetchData()
})
// #endregion
// #region Functions
async function fetchData() {
console.log('fetched')
}
// #endregion region
// #region Utilities & event handlers
function increment() {
count.value++
}
// #endregion
// #region Watchers
watch(count, (newVal, oldVal) => {
console.log('count changed:', oldVal, '->', newVal)
})
// #endregion
</script>
<template>
<div>
<p>Count: {{ count }}</p>
<p>Double: {{ double }}</p>
<button @click="increment">+1</button>
</div>
</template>
<style scoped>
/* component style */
</style>
+54
View File
@@ -0,0 +1,54 @@
<script setup lang="ts">
// #region Props & Emits
const props = defineProps<{
title: string
}>()
const emit = defineEmits<{
(e: 'update', value: string): void
}>()
// #endregion
// #region State & Computed
// =============================
const count = ref(0)
const double = computed(() => count.value * 2)
// #endregion
// #region Lifecycle Hooks
onMounted(() => {
// init code
fetchData()
})
// #endregion
// #region Functions
async function fetchData() {
console.log('fetched')
}
// #endregion region
// #region Utilities & event handlers
function increment() {
count.value++
}
// #endregion
// #region Watchers
watch(count, (newVal, oldVal) => {
console.log('count changed:', oldVal, '->', newVal)
})
// #endregion
</script>
<template>
<div>
<p>Count: {{ count }}</p>
<p>Double: {{ double }}</p>
<button @click="increment">+1</button>
</div>
</template>
<style scoped>
/* component style */
</style>