添加分类

src/views/music-library/music-sheet/component/music-list.tsx

@@ -2,7 +2,7 @@ import SaveForm from '@/components/save-form'
 import Pagination from '@/components/pagination'
 import {
   DataTableRowKey,
-  NButton,
+  NButton, NCascader,
   NDataTable,
   NFormItem,
   NIcon,
@@ -22,7 +22,7 @@ import {
   musicSheetRemove,
   musicSheetImg,
   musicSheetStatusList,
-  musicTagPage
+  musicTagPage, musicSheetCategoriesQueryTree
 } from '../../api'
 import MusicOperation from '../modal/music-operation'
 import { subjectPage } from '@/views/system-manage/api'
@@ -60,7 +60,8 @@ export default defineComponent({
         useAppId: null, //适用项目ID
         status: null, //曲目状态（0：停用，1：启用）
         appAuditFlag: null, //是否审核版本
-        categoriesId: null //是否审核版本
+        categoriesId: null, //是否审核版本
+        musicCategoryId: null //曲目分类
       },
       dataList: [] as any,
       subjectList: [] as any,
@@ -68,7 +69,7 @@ export default defineComponent({
       visiableMusic: false,
       musicOperation: 'add',
       musicData: {} as any,
-      // musicSheetCategories: [] as any,
+      musicSheetCategories: [] as any,
       musicPreview: false,
       musicScore: null as any,
       showUseProject: false, // 适用项目
@@ -117,6 +118,11 @@ export default defineComponent({
           }
         },
         {
+          title: '曲目分类',
+          minWidth: '100px',
+          key: 'musicCategoryName',
+        },
+        {
           title: '可用声部',
           minWidth: '100px',
           maxWidth: '300px',
@@ -406,13 +412,14 @@ export default defineComponent({
     }
 
     // 获取分类
-    // const getMusicSheetCategorieList = async () => {
-    //   try {
-    //     const {data} = await musicSheetCategoriesQueryTree({enable: true})
-    //     state.musicSheetCategories = filterPointCategory(data, 'musicSheetCategoriesList')
-    //   } catch (e) {
-    //   }
-    // }
+    const getMusicSheetCategorieList = async () => {
+      try {
+        const {data} = await musicSheetCategoriesQueryTree({})
+        // state.musicSheetCategories = filterPointCategory(data, 'musicSheetCategoriesList')
+        state.musicSheetCategories = data||[]
+      } catch (e) {
+      }
+    }
 
     // 获取声部
     const initSubjectList = async () => {
@@ -474,8 +481,8 @@ export default defineComponent({
 
       initSubjectList()
       initUseAppList()
+      getMusicSheetCategorieList()
       getList()
-      // getMusicSheetCategorieList()
     })
 
     return () => (
@@ -502,6 +509,17 @@ export default defineComponent({
               clearable
             />
           </NFormItem>
+          <NFormItem label="曲目分类" path="musicCategoryId">
+            <NCascader
+                valueField="id"
+                labelField="name"
+                children-field="musicSheetCategoriesList"
+                placeholder="请选择曲目分类"
+                v-model:value={state.searchForm.musicCategoryId}
+                options={state.musicSheetCategories}
+                clearable
+            />
+          </NFormItem>
           <NFormItem label="可用声部" path="musicSubject">
             <NSelect
               placeholder="请选择可用声部"

src/views/music-library/music-sheet/modal/use-project.tsx

@@ -9,7 +9,7 @@ import {
   NFormItem,
   NInputNumber,
   NSelect,
-  NSpace,
+  NSpace, NSpin,
   NTabPane,
   NTabs,
   useMessage
@@ -304,7 +304,7 @@ export default defineComponent({
     }
 
     return () => (
-      <div>
+      <NSpin show={state.loading}>
         <NForm
           class={styles.formContainer}
           model={forms}
@@ -675,7 +675,7 @@ export default defineComponent({
             确认
           </NButton>
         </NSpace>
-      </div>
+      </NSpin>
     )
   }
 })