feat: add SingleRecord component for student maintenance with CRUD functionality

This commit is contained in:
skytek_xinliang
2026-03-30 11:03:01 +08:00
parent 00a7150757
commit 20b093ff73
22 changed files with 51 additions and 51 deletions
@@ -304,7 +304,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { mdiContentSave, mdiDelete, mdiMagnify, mdiRestore } from '@mdi/js' import { mdiContentSave, mdiDelete, mdiMagnify, mdiRestore } from '@mdi/js'
import { useEditableStudentGrid } from '@/composables/maintenance/useEditableStudentGrid' import { useEditableStudentGrid } from '@/composables/maint/useEditableStudentGrid'
const { const {
departments, departments,
@@ -65,7 +65,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import type { SaveSummaryItem } from '@/composables/maintenance/useStudentMaintenanceForm' import type { SaveSummaryItem } from '@/composables/maint/useStudentMaintenanceForm'
import { computed } from 'vue' import { computed } from 'vue'
import CommonConfirmDialog from './CommonConfirmDialog.vue' import CommonConfirmDialog from './CommonConfirmDialog.vue'
@@ -103,7 +103,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import type { StudentFormState } from '@/composables/maintenance/useStudentMaintenanceForm' import type { StudentFormState } from '@/composables/maint/useStudentMaintenanceForm'
import { toRef } from 'vue' import { toRef } from 'vue'
interface GradeOption { interface GradeOption {
+5 -5
View File
@@ -22,31 +22,31 @@ export const routes: RouteRecordRaw[] = [
{ {
path: '/single-record-maintenance', path: '/single-record-maintenance',
name: 'single-record-maintenance', name: 'single-record-maintenance',
component: () => import('@/views/maint/SingleRecordMnt.vue'), component: () => import('@/views/maint/SingleRecord.vue'),
meta: { layout: 'default' }, meta: { layout: 'default' },
}, },
{ {
path: '/master-detail-maintenance', path: '/master-detail-maintenance',
name: 'master-detail-maintenance-a', name: 'master-detail-maintenance-a',
component: () => import('@/views/maint/MasterDetailMnt.vue'), component: () => import('@/views/maint/MasterDetailA.vue'),
meta: { layout: 'default' }, meta: { layout: 'default' },
}, },
{ {
path: '/master-detail-maintenance-b', path: '/master-detail-maintenance-b',
name: 'master-detail-maintenance-b', name: 'master-detail-maintenance-b',
component: () => import('@/views/maint/MasterDetailMntB.vue'), component: () => import('@/views/maint/MasterDetailB.vue'),
meta: { layout: 'default' }, meta: { layout: 'default' },
}, },
{ {
path: '/master-detail-maintenance-c', path: '/master-detail-maintenance-c',
name: 'master-detail-maintenance-c', name: 'master-detail-maintenance-c',
component: () => import('@/views/maint/MasterDetailMntC.vue'), component: () => import('@/views/maint/MasterDetailC.vue'),
meta: { layout: 'default' }, meta: { layout: 'default' },
}, },
{ {
path: '/editable-grid-maintenance', path: '/editable-grid-maintenance',
name: 'editable-grid-maintenance', name: 'editable-grid-maintenance',
component: () => import('@/views/maint/EditableGridMnt.vue'), component: () => import('@/views/maint/EditableGrid.vue'),
meta: { layout: 'default' }, meta: { layout: 'default' },
}, },
{ {
@@ -3,5 +3,5 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import EditableStudentGrid from '@/components/maintenance/EditableStudentGrid.vue' import EditableStudentGrid from '@/components/maint/EditableStudentGrid.vue'
</script> </script>
@@ -1,5 +1,5 @@
<template> <template>
<mnt-page-cards <page-maint
:search-panel-open="searchPanelOpen" :search-panel-open="searchPanelOpen"
:title="`主從資料維護示範A`" :title="`主從資料維護示範A`"
@create="openAddDialog" @create="openAddDialog"
@@ -170,7 +170,7 @@
</template> </template>
</v-data-table> </v-data-table>
</template> </template>
</mnt-page-cards> </page-maint>
<!-- 主從式維護視窗 --> <!-- 主從式維護視窗 -->
<!-- 說明包含主檔 (學生資料) 與明細檔 (學期成績) 的維護介面 --> <!-- 說明包含主檔 (學生資料) 與明細檔 (學期成績) 的維護介面 -->
@@ -380,15 +380,15 @@ import { mdiBroom, mdiDelete, mdiEye, mdiMagnify, mdiPencil } from '@mdi/js'
import { computed, nextTick, ref, watch } from 'vue' import { computed, nextTick, ref, watch } from 'vue'
import { useDisplay } from 'vuetify' import { useDisplay } from 'vuetify'
import MaintenanceCrudDialogs from '@/components/maintenance/MaintenanceCrudDialogs.vue' import MaintenanceCrudDialogs from '@/components/maint/MaintenanceCrudDialogs.vue'
import MaintenanceStudentFormFields from '@/components/maintenance/MaintenanceStudentFormFields.vue' import MaintenanceStudentFormFields from '@/components/maint/MaintenanceStudentFormFields.vue'
import MasterDetailSemesterList from '@/components/maintenance/master-detail/MasterDetailSemesterList.vue' import MasterDetailSemesterList from '@/components/maint/master-detail/SemesterList.vue'
import MasterDetailSemesterPanel from '@/components/maintenance/master-detail/MasterDetailSemesterPanel.vue' import MasterDetailSemesterPanel from '@/components/maint/master-detail/SemesterPanel.vue'
import MntDialogCard from '@/components/maintenance/MntDialogCard.vue' import MntDialogCard from '@/components/maint/MntDialogCard.vue'
import MntPageCards from '@/components/maintenance/MntPageCards.vue' import MntRecordNavToolbar from '@/components/maint/MntRecordNavToolbar.vue'
import MntRecordNavToolbar from '@/components/maintenance/MntRecordNavToolbar.vue' import PageMaint from '@/components/maint/PageMaint.vue'
import { useMaintenanceCrudFlow } from '@/composables/maintenance/useMaintenanceCrudFlow' import { useMaintenanceCrudFlow } from '@/composables/maint/useMaintenanceCrudFlow'
import { useStudentMaintenanceForm } from '@/composables/maintenance/useStudentMaintenanceForm' import { useStudentMaintenanceForm } from '@/composables/maint/useStudentMaintenanceForm'
import { type SemesterRecord, useSemesterStore } from '@/stores/semesters' import { type SemesterRecord, useSemesterStore } from '@/stores/semesters'
import { type StudentRecord, useStudentStore } from '@/stores/students' import { type StudentRecord, useStudentStore } from '@/stores/students'
@@ -1,5 +1,5 @@
<template> <template>
<mnt-page-cards <page-maint
:search-panel-open="searchPanelOpen" :search-panel-open="searchPanelOpen"
:title="`主從資料維護示範B`" :title="`主從資料維護示範B`"
@create="openAddDialog" @create="openAddDialog"
@@ -170,7 +170,7 @@
</template> </template>
</v-data-table> </v-data-table>
</template> </template>
</mnt-page-cards> </page-maint>
<!-- 主從式維護視窗 --> <!-- 主從式維護視窗 -->
<!-- 說明包含主檔 (學生資料) 與明細檔 (學期成績) 的維護介面 --> <!-- 說明包含主檔 (學生資料) 與明細檔 (學期成績) 的維護介面 -->
@@ -459,16 +459,16 @@ import { mdiBookPlus, mdiBroom, mdiDelete, mdiEye, mdiMagnify, mdiPencil } from
import { computed, nextTick, ref, watch } from 'vue' import { computed, nextTick, ref, watch } from 'vue'
import { useDisplay } from 'vuetify' import { useDisplay } from 'vuetify'
import CommonConfirmDialog from '@/components/maintenance/CommonConfirmDialog.vue' import CommonConfirmDialog from '@/components/maint/CommonConfirmDialog.vue'
import MaintenanceCrudDialogs from '@/components/maintenance/MaintenanceCrudDialogs.vue' import MaintenanceCrudDialogs from '@/components/maint/MaintenanceCrudDialogs.vue'
import MaintenanceStudentFormFields from '@/components/maintenance/MaintenanceStudentFormFields.vue' import MaintenanceStudentFormFields from '@/components/maint/MaintenanceStudentFormFields.vue'
import MasterDetailBSemesterMobilePanel from '@/components/maintenance/master-detail-b/MasterDetailBSemesterMobilePanel.vue' import MasterDetailBSemesterMobilePanel from '@/components/maint/master-detail/SemesterMobilePanel.vue'
import MasterDetailBSemesterSection from '@/components/maintenance/master-detail-b/MasterDetailBSemesterSection.vue' import MasterDetailBSemesterSection from '@/components/maint/master-detail/SemesterSection.vue'
import MntDialogCard from '@/components/maintenance/MntDialogCard.vue' import MntDialogCard from '@/components/maint/MntDialogCard.vue'
import MntPageCards from '@/components/maintenance/MntPageCards.vue' import MntRecordNavToolbar from '@/components/maint/MntRecordNavToolbar.vue'
import MntRecordNavToolbar from '@/components/maintenance/MntRecordNavToolbar.vue' import PageMaint from '@/components/maint/PageMaint.vue'
import { useMaintenanceCrudFlow } from '@/composables/maintenance/useMaintenanceCrudFlow' import { useMaintenanceCrudFlow } from '@/composables/maint/useMaintenanceCrudFlow'
import { useStudentMaintenanceForm } from '@/composables/maintenance/useStudentMaintenanceForm' import { useStudentMaintenanceForm } from '@/composables/maint/useStudentMaintenanceForm'
import { type CourseRecord, type SemesterRecord, useSemesterStore } from '@/stores/semesters' import { type CourseRecord, type SemesterRecord, useSemesterStore } from '@/stores/semesters'
import { type StudentRecord, useStudentStore } from '@/stores/students' import { type StudentRecord, useStudentStore } from '@/stores/students'
@@ -1,5 +1,5 @@
<template> <template>
<mnt-page-cards <page-maint
:search-panel-open="searchPanelOpen" :search-panel-open="searchPanelOpen"
:title="`主從資料維護示範C`" :title="`主從資料維護示範C`"
@create="openAddDialog" @create="openAddDialog"
@@ -170,7 +170,7 @@
</template> </template>
</v-data-table> </v-data-table>
</template> </template>
</mnt-page-cards> </page-maint>
<!-- 主從式維護視窗 --> <!-- 主從式維護視窗 -->
<!-- 說明包含主檔 (學生資料) 與明細檔 (學期成績) 的維護介面 --> <!-- 說明包含主檔 (學生資料) 與明細檔 (學期成績) 的維護介面 -->
@@ -446,15 +446,15 @@ import { mdiBroom, mdiDelete, mdiEye, mdiMagnify, mdiPencil, mdiSchool } from '@
import { computed, nextTick, ref, watch } from 'vue' import { computed, nextTick, ref, watch } from 'vue'
import { useDisplay } from 'vuetify' import { useDisplay } from 'vuetify'
import MaintenanceCrudDialogs from '@/components/maintenance/MaintenanceCrudDialogs.vue' import MaintenanceCrudDialogs from '@/components/maint/MaintenanceCrudDialogs.vue'
import MaintenanceStudentFormFields from '@/components/maintenance/MaintenanceStudentFormFields.vue' import MaintenanceStudentFormFields from '@/components/maint/MaintenanceStudentFormFields.vue'
import MasterDetailCCourseMobilePanel from '@/components/maintenance/master-detail-c/MasterDetailCCourseMobilePanel.vue' import MasterDetailCCourseMobilePanel from '@/components/maint/master-detail/CourseMobilePanel.vue'
import MasterDetailCCourseSection from '@/components/maintenance/master-detail-c/MasterDetailCCourseSection.vue' import MasterDetailCCourseSection from '@/components/maint/master-detail/CourseSection.vue'
import MntDialogCard from '@/components/maintenance/MntDialogCard.vue' import MntDialogCard from '@/components/maint/MntDialogCard.vue'
import MntPageCards from '@/components/maintenance/MntPageCards.vue' import MntRecordNavToolbar from '@/components/maint/MntRecordNavToolbar.vue'
import MntRecordNavToolbar from '@/components/maintenance/MntRecordNavToolbar.vue' import PageMaint from '@/components/maint/PageMaint.vue'
import { useMaintenanceCrudFlow } from '@/composables/maintenance/useMaintenanceCrudFlow' import { useMaintenanceCrudFlow } from '@/composables/maint/useMaintenanceCrudFlow'
import { useStudentMaintenanceForm } from '@/composables/maintenance/useStudentMaintenanceForm' import { useStudentMaintenanceForm } from '@/composables/maint/useStudentMaintenanceForm'
import { type CourseRecord, type SemesterRecord, useSemesterStore } from '@/stores/semesters' import { type CourseRecord, type SemesterRecord, useSemesterStore } from '@/stores/semesters'
import { type StudentRecord, useStudentStore } from '@/stores/students' import { type StudentRecord, useStudentStore } from '@/stores/students'
@@ -1,5 +1,5 @@
<template> <template>
<mnt-page-cards <page-maint
:search-panel-open="searchPanelOpen" :search-panel-open="searchPanelOpen"
:title="`單筆資料維護示範`" :title="`單筆資料維護示範`"
@create="openAddDialog" @create="openAddDialog"
@@ -174,7 +174,7 @@
</template> </template>
</v-data-table> </v-data-table>
</template> </template>
</mnt-page-cards> </page-maint>
<!-- 新增 / 編輯 / 檢視側邊欄 --> <!-- 新增 / 編輯 / 檢視側邊欄 -->
<teleport to="body"> <teleport to="body">
@@ -458,12 +458,12 @@
import { mdiBroom, mdiDelete, mdiEye, mdiMagnify, mdiPencil } from '@mdi/js' import { mdiBroom, mdiDelete, mdiEye, mdiMagnify, mdiPencil } from '@mdi/js'
import { computed, nextTick, ref, watch } from 'vue' import { computed, nextTick, ref, watch } from 'vue'
import { useDisplay } from 'vuetify' import { useDisplay } from 'vuetify'
import MaintenanceCrudDialogs from '@/components/maintenance/MaintenanceCrudDialogs.vue' import MaintenanceCrudDialogs from '@/components/maint/MaintenanceCrudDialogs.vue'
import MntDialogCard from '@/components/maintenance/MntDialogCard.vue' import MntDialogCard from '@/components/maint/MntDialogCard.vue'
import MntPageCards from '@/components/maintenance/MntPageCards.vue' import MntRecordNavToolbar from '@/components/maint/MntRecordNavToolbar.vue'
import MntRecordNavToolbar from '@/components/maintenance/MntRecordNavToolbar.vue' import PageMaint from '@/components/maint/PageMaint.vue'
import { useMaintenanceCrudFlow } from '@/composables/maintenance/useMaintenanceCrudFlow' import { useMaintenanceCrudFlow } from '@/composables/maint/useMaintenanceCrudFlow'
import { useStudentMaintenanceForm } from '@/composables/maintenance/useStudentMaintenanceForm' import { useStudentMaintenanceForm } from '@/composables/maint/useStudentMaintenanceForm'
import { type StudentRecord, useStudentStore } from '@/stores/students' import { type StudentRecord, useStudentStore } from '@/stores/students'
// /// // ///