课堂乐器添加曲目

src/views/educational-manage/component/material-list.tsx

@@ -29,6 +29,7 @@ import { getLessonType, lessonType } from '@/views/knowledge-manage/knowledgeTyp
 import { filterTimes, getTimes } from '@/utils/dateUtil'
 import router from '@/router'
 import { useRoute } from 'vue-router'
+import {subjectPage} from "@views/system-manage/subject-manage/api";
 
 const classType: { [_: string]: any } = {
   VIDEO: '视频',
@@ -83,7 +84,7 @@ export default defineComponent({
     })
     const getSubjects = async () => {
       try {
-        const { data } = await subjectBasicConfigPage({ page: 1, row: 1000 })
+        const { data } = await subjectPage({ page: 1, row: 1000 })
         subjects.list = data?.rows || []
       } catch {}
     }

src/views/music-library/api.ts

@@ -79,17 +79,6 @@ export const musicSheetSave = (params: object) => {
 }
 
 /**
- * @description: 乐谱更新
- */
-export const musicSheetUpdate = (params: object) => {
-  return request({
-    url: '/cbs-app/musicSheet/update',
-    method: 'post',
-    data: params
-  } as any)
-}
-
-/**
  * @description: 乐谱删除
  */
 export const musicSheetRemove = (params: object) => {
@@ -279,4 +268,16 @@ export const musicSheetApplicationExtendSaveBatch = (params?: any) => {
     method: 'post',
     data: params
   } as any)
-}
+}
+
+/**
+ *  @description: 曲目应用拓展表 修改
+ * @param params
+ */
+export const musicSheetApplicationExtendUpdate = (params?: any) => {
+  return request({
+    url: '/cbs-app/musicSheetApplicationExtend/update',
+    method: 'post',
+    data: params
+  } as any)
+}

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

@@ -111,7 +111,10 @@ export default defineComponent({
         },
         {
           title: '审核版本',
-          key: 'userName'
+          key: 'appAuditFlag',
+          render(row: any) {
+            return <div>{row.appAuditFlag?'是':'否'}</div>
+          }
         },
         {
           title: '适用项目',

src/views/music-library/music-sheet/modal/music-operation.tsx

@@ -4,6 +4,7 @@ import {
   NButton,
   NCascader,
   NCheckbox,
+  NCheckboxGroup,
   NForm,
   NFormItemGi,
   NGi,
@@ -16,11 +17,10 @@ import {
   NSelect,
   NSpace,
   useDialog,
-  useMessage,
-  NCheckboxGroup, NCol
+  useMessage
 } from 'naive-ui'
 import {defineComponent, onMounted, PropType, reactive, ref} from 'vue'
-import {musicSheetDetail, musicSheetSave, musicSheetUpdate} from '../../api'
+import {musicSheetDetail, musicSheetSave} from '../../api'
 import UploadFile from '@/components/upload-file'
 import styles from './index.module.less'
 import deepClone from '@/utils/deep.clone'
@@ -294,8 +294,7 @@ export default defineComponent({
       // userId: null, // 所属人
       appAuditFlag: 0, // 是否审核版本
       midiFileUrl: null, // 伴奏文件 MIDI文件(保留字段)
-      subjectIds: '', // 可用声部
-      subjectIdList: [] as any, // 可用声部
+      subjectIds:[] as any, // 可用声部
       musicalInstrumentIdList: [] as any,  //可用乐器
       musicCategoryId: null,  //曲目分类
       musicSheetAccompanimentList: [] as any,  //曲目伴奏
@@ -351,7 +350,8 @@ export default defineComponent({
               return !!next.audioFileUrl;
             }),
             musicalInstrumentIds: forms.musicalInstrumentIdList.join(','),
-            extConfigJson: JSON.stringify({gradualTimes: forms.graduals})
+            extConfigJson: JSON.stringify({gradualTimes: forms.graduals}),
+            subjectIds:forms.subjectIds.join(',')
           }
           if (forms.audioType == 'MIDI') {
             obj.musicSheetSoundList = []
@@ -361,7 +361,7 @@ export default defineComponent({
             await musicSheetSave(obj)
             message.success('添加成功')
           } else if (props.type === 'edit') {
-            await musicSheetUpdate({...obj, id: props.data.id})
+            await musicSheetSave({...obj, id: props.data.id})
             message.success('修改成功')
           }
           emit('getList')
@@ -507,7 +507,7 @@ export default defineComponent({
         const {data} = await subjectPage({page: 1, rows: 999, musicalInstrumentIdList: musicalInstrumentIdList})
         const tempList = data.rows || []
         tempList.forEach((item: any) => {
-          forms.subjectIdList.push(item.id + '')
+          forms.subjectIds.push(item.id + '')
         })
       } catch {
       }
@@ -593,8 +593,7 @@ export default defineComponent({
           forms.evaluationStandard = data.evaluationStandard
           forms.musicalInstrumentIdList = data.musicalInstrumentIds.split(',') || []
 
-          forms.subjectIds = data.subjectIds
-          forms.subjectIdList = data.subjectIds?.split(',') || []
+          forms.subjectIds = data.subjectIds?.split(',') || []
           forms.sourceType = data.sourceType
           forms.musicSheetExtend = data.musicSheetExtend
           // 获取渐变 和 是否多声部
@@ -624,9 +623,7 @@ export default defineComponent({
             }
           })
 
-          console.log(forms, state.musicSheetAccompanimentUrlList, 'musicSheetAccompanimentUrlList')
         } catch (error) {
-          console.log(error)
         }
         state.loading = false
       }
@@ -935,16 +932,15 @@ export default defineComponent({
                         text="点击上传伴奏文件"
                         max={10}
                         onUpload:success={(file) => {
-                          // state.musicSheetAccompanimentUrls = [state.musicSheetAccompanimentUrls, file.url].filter(Boolean).join(',')
-                          // state.musicSheetAccompanimentUrlList = state.musicSheetAccompanimentUrls?.split(',').filter(Boolean)
-                          // forms.musicSheetAccompanimentList = []
-                          // for (let i = 0; i < state.musicSheetAccompanimentUrlList.length; i++) {
-                          //   forms.musicSheetAccompanimentList.push({
-                          //     audioFileUrl: state.musicSheetAccompanimentUrlList[i],
-                          //     track: file.name,
-                          //     sortNumber: i + 1
-                          //   })
-                          // }
+                          state.musicSheetAccompanimentUrls = [state.musicSheetAccompanimentUrls, file.url].filter(Boolean).join(',')
+                          state.musicSheetAccompanimentUrlList = state.musicSheetAccompanimentUrls?.split(',').filter(Boolean)
+                          forms.musicSheetAccompanimentList = []
+                          for (let i = 0; i < state.musicSheetAccompanimentUrlList.length; i++) {
+                            forms.musicSheetAccompanimentList.push({
+                              audioFileUrl: state.musicSheetAccompanimentUrlList[i],
+                              sortNumber: i + 1
+                            })
+                          }
                         }}
                         onRemove={() => {
                           state.musicSheetAccompanimentUrlList = []
@@ -1010,7 +1006,7 @@ export default defineComponent({
             </NGrid>
 
             <NGrid cols={2}>
-              <NFormItemGi label="可用声部" path="subjectIdList"
+              <NFormItemGi label="可用声部" path="subjectIds"
                            rule={[
                              {
                                required: true,
@@ -1019,7 +1015,7 @@ export default defineComponent({
                            ]}
               >
                 <NSelect
-                    v-model:value={forms.subjectIdList}
+                    v-model:value={forms.subjectIds}
                     options={props.subjectList}
                     multiple
                     filterable
@@ -1233,6 +1229,7 @@ export default defineComponent({
               style={{width: '800px'}}
           >
             <MusicSheetOwnerDialog
+                musicSheetExtend={forms.musicSheetExtend}
                 sourceType={forms.sourceType}
                 onClose={() => {
                   state.showMusicSheetOwnerDialog = false

src/views/music-library/music-sheet/modal/musicSheetOwnerDialog.tsx

@@ -10,7 +10,7 @@ import {getMapValueByKey} from "@/utils/objectUtil";
 export default defineComponent({
   name: 'musicSheetOwnerDialog',
   props: {
-    data: {
+    musicSheetExtend: {
       type: Object as PropType<any>,
       default: () => {
       }
@@ -46,26 +46,6 @@ export default defineComponent({
     const dialog = useDialog()
     const saveForm = ref()
 
-    // app列表
-    const initUseAppList = async () => {
-      try {
-        const {data} = await sysApplicationPage({page: 1, rows: 999})
-        const tempList = data.rows || []
-        tempList.forEach((item: any) => {
-          item.label = item.appName
-          item.value = item.id
-        })
-
-        if (tempList.length > 0) {
-          state.searchForm.applicationId = tempList[0].value
-        } else {
-          message.warning("获取应用列表失败")
-        }
-        state.appData = tempList
-      } catch {
-      }
-    }
-
     const onSubmit = () => {
       state.pagination.page = 1
       getList()
@@ -93,7 +73,27 @@ export default defineComponent({
     }
 
     onMounted(async () => {
-      initUseAppList()
+      // 初始化应用
+      {
+        const {data} = await sysApplicationPage({page: 1, rows: 999})
+        const tempList = data.rows || []
+        tempList.forEach((item: any) => {
+          item.label = item.appName
+          item.value = item.id
+        })
+        state.appData = tempList
+        if (tempList.length == 0) {
+          message.warning("获取应用列表失败")
+          return
+        }
+
+        if (props.musicSheetExtend && props.musicSheetExtend.applicationId) {
+          state.searchForm.applicationId = props.musicSheetExtend.applicationId
+        } else {
+          state.searchForm.applicationId = tempList[0].value
+        }
+      }
+
       getList()
     })
     const columns = (): any => {
@@ -148,7 +148,7 @@ export default defineComponent({
               ref={saveForm}
               model={state.searchForm}
               onSubmit={onSubmit}
-              saveKey="musicSheetOwnerDialog"
+              // saveKey="musicSheetOwnerDialog"
               onSetModel={(val: any) => (state.searchForm = val)}
           >
             <NFormItem label="应用" path="applicationId" size="small">
@@ -185,7 +185,7 @@ export default defineComponent({
                 v-model:pageTotal={state.pagination.pageTotal}
                 onList={getList}
                 sync
-                saveKey="musicSheetOwnerDialog"
+                // saveKey="musicSheetOwnerDialog"
                 pageSlot={5}
             ></Pagination>
           </div>

src/views/music-library/project-music-sheet/module/cooleshow-edu/addMusic.tsx

@@ -8,7 +8,7 @@ import {musicSheetApplicationExtendSaveBatch, musicSheetPage} from "@views/music
 import deepClone from "@/utils/deep.clone";
 
 export default defineComponent({
-  name: 'project-music-sheet-mec',
+  name: 'project-music-cooleshow-edu-addMusic',
   props: {
     appId: {
       type: String,

src/views/music-library/project-music-sheet/module/cooleshow-edu/cooleshow-edu.tsx

@@ -1,9 +1,27 @@
 import {defineComponent, onMounted, reactive, ref} from "vue";
 import SaveForm from "@components/save-form";
-import {DataTableRowKey, NButton, NCascader, NDataTable, NDatePicker, NDescriptions, NDescriptionsItem, NFormItem, NInput, NModal, NSelect, NSpace, NTag, useDialog, useMessage} from "naive-ui";
+import {
+  DataTableRowKey,
+  NButton,
+  NCascader,
+  NDataTable,
+  NDatePicker,
+  NDescriptions,
+  NDescriptionsItem,
+  NFormItem,
+  NImage,
+  NInput,
+  NModal,
+  NSelect,
+  NSpace,
+  NTag,
+  useDialog,
+  useMessage
+} from "naive-ui";
 import Pagination from "@components/pagination";
 import TheTooltip from "@components/TheTooltip";
 import AddMusic from "@views/music-library/project-music-sheet/module/cooleshow-edu/addMusic";
+import UpdateMusic from "@views/music-library/project-music-sheet/module/cooleshow-edu/updateMusic";
 import {musicSheetApplicationExtendCategoryList, musicSheetApplicationOwnerList, musicSheetPageByApplication, musicSheetStatusList} from "@views/music-library/api";
 import {getMapValueByKey, getSelectDataFromObj} from "@/utils/objectUtil";
 import {musicSheetAudioType, musicSheetAvailableType, musicSheetPaymentType, musicSheetSourceType, musicSheetType} from "@/utils/constant";
@@ -56,6 +74,7 @@ export default defineComponent({
       showEditDialog: false,
       userIdDisable: true,
       userIdData: [] as any,
+      updateRow: {} as any, // 修改选择的行
     })
 
     onMounted(async () => {
@@ -222,23 +241,37 @@ export default defineComponent({
           }
         },
         {
+          title: '伴奏类型',
+          key: 'audioType',
+          render: (row: any) => {
+            return <div>{getMapValueByKey(row.audioType, new Map(Object.entries(musicSheetAudioType)))}</div>
+          }
+        },
+        {
           title: '可用声部',
           key: 'subjectIdNames'
         },
         {
-          title: '分类',
+          title: '曲目分类',
           key: 'musicSheetCategoryName'
         },
         {
-          title: '是否收费',
-          key: 'paymentType',
-          render: (row: any) => {
-            return <div>{getMapValueByKey(row.paymentType, new Map(Object.entries(musicSheetPaymentType)))}</div>
+          title: '封面图',
+          key: 'musicCover',
+          render(row: any): JSX.Element {
+            return <NImage width={60} height={60} src={row.musicCover}/>
           }
         },
+        // {
+        //   title: '收费方式',
+        //   key: 'paymentType',
+        //   render: (row: any) => {
+        //     return <div>{getMapValueByKey(row.paymentType, new Map(Object.entries(musicSheetPaymentType)))}</div>
+        //   }
+        // },
         {
           title: '上传人',
-          key: 'userId'
+          key: 'createByName'
         },
         {
           title: '上传时间',
@@ -276,6 +309,7 @@ export default defineComponent({
                       //v-auth="musicSheet/update1602302618558099458"
                       onClick={() => {
                         state.showEditDialog = true
+                        state.updateRow = row
                       }}
                   >
                     修改
@@ -497,6 +531,24 @@ export default defineComponent({
                   musicSheetCategories={state.musicSheetCategories}
               />
             </NModal>
+            <NModal
+                v-model:show={state.showEditDialog}
+                preset="dialog"
+                showIcon={false}
+                title={'修改曲目'}
+                style={{width: '500px'}}
+            >
+              <UpdateMusic
+                  onClose={() => (state.showEditDialog = false)}
+                  onGetList={() => {
+                    state.pagination.page = 1
+                    getList()
+                  }}
+                  rowData={state.updateRow}
+                  appId={state.appId}
+                  musicSheetCategories={state.musicSheetCategories}
+              />
+            </NModal>
           </div>
       )
     }

src/views/music-library/project-music-sheet/module/cooleshow-edu/updateMusic.tsx

@@ -0,0 +1,127 @@
+import {defineComponent, onMounted, reactive, ref} from "vue";
+import {NButton, NCascader, NForm, NFormItem, NInputNumber, NSpace, useDialog, useMessage} from "naive-ui";
+import {musicSheetApplicationExtendCategoryApplicationExtendInfo, musicSheetApplicationExtendUpdate} from "@views/music-library/api";
+
+export default defineComponent({
+  name: 'project-music-cooleshow-edu-updateMusic',
+  props: {
+    appId: {
+      type: String,
+      required: true
+    },
+    rowData: {
+      type: Object,
+      required: true
+    },
+    musicSheetCategories: {
+      type: Array,
+      default: () => []
+    }
+  },
+  emits: ['close', 'getList'],
+  setup(props, {slots, attrs, emit}) {
+    const message = useMessage()
+    const forms = reactive({
+      musicSheetCategoryId: null as any,
+      sortNo: null as any,
+    })
+    const formsRef = ref()
+
+    const state = reactive({
+      rowData: null as any,
+      musicSheetCategories: [] as any,
+    })
+
+    onMounted(async () => {
+      state.rowData = props.rowData
+      state.musicSheetCategories = props.musicSheetCategories
+      const {data} = await musicSheetApplicationExtendCategoryApplicationExtendInfo({musicSheetId: state.rowData.id, applicationId: props.appId}) as any
+      if (!data) {
+        message.error("加载应用失败")
+        return
+      }
+      forms.musicSheetCategoryId = data[0].musicSheetCategoryId
+      forms.sortNo = data[0].sortNo
+
+    })
+
+    const onSubmit = async () => {
+      formsRef.value.validate(async (error: any) => {
+        if (error) return false
+      })
+      await musicSheetApplicationExtendUpdate(
+          {
+            ...forms,
+            musicSheetId: state.rowData.id,
+            applicationId: props.appId
+          }
+      );
+      emit('close')
+      emit('getList')
+    }
+
+    return () => {
+      return (
+          <div style="background: #fff; padding-top: 12px">
+            <NForm
+                ref={formsRef}
+                labelPlacement="top"
+                model={forms}
+                label-placement="left"
+                label-width="auto"
+            >
+              <NFormItem
+                  label="曲目分类"
+                  path="musicSheetCategoryId"
+                  rule={[
+                    {
+                      required: true,
+                      message: '请选择曲目分类'
+                    }
+                  ]}
+              >
+                <NCascader
+                    valueField="id"
+                    labelField="name"
+                    children-field="children"
+                    placeholder="请选择曲目分类"
+                    value={forms.musicSheetCategoryId}
+                    options={state.musicSheetCategories}
+                    onUpdateValue={(value: any) => {
+                      forms.musicSheetCategoryId = value
+                    }}
+                    clearable
+                />
+              </NFormItem>
+              <NFormItem
+                  label="排序值"
+                  path="sortNo"
+                  rule={[
+                    {
+                      required: true,
+                      message: '请输入排序值'
+                    }
+                  ]}
+              >
+                <NInputNumber
+                    v-model:value={forms.sortNo}
+                    placeholder="请输入排序值"
+                    clearable
+                    min={0}
+                    max={9999}
+                    style={{width: '100%'}}
+                />
+              </NFormItem>
+            </NForm>
+
+            <NSpace justify="end">
+              <NButton onClick={() => emit('close')}>取消</NButton>
+              <NButton type="primary" onClick={onSubmit}>
+                保存
+              </NButton>
+            </NSpace>
+          </div>
+      )
+    }
+  }
+})

src/views/system-manage/subject-manage/subject/modal/subject-save.tsx

@@ -31,6 +31,7 @@ export default defineComponent({
         categoryId: null,
         name: null,
         img: null,
+        code: null,
         musicalInstrumentIds: [],
       },
       rowData: {},
@@ -78,6 +79,7 @@ export default defineComponent({
         state.forms.categoryId = data.categoryId
         state.forms.name = data.name
         state.forms.img = data.img
+        state.forms.code = data.code
         state.forms.musicalInstrumentIds = data.musicalInstrumentIds?.split(',') || [];
       }
       console.log("pca", props.categoryList)
@@ -133,6 +135,24 @@ export default defineComponent({
               ></NInput>
             </NFormItem>
             <NFormItem
+                label="声部编码"
+                path="code"
+                rule={[
+                  {
+                    required: true,
+                    message: '请输入声部编码'
+                  }
+                ]}
+            >
+              <NInput
+                  v-model:value={state.forms.code}
+                  placeholder="请输入声部名称"
+                  clearable
+                  maxlength={10}
+                  showCount
+              ></NInput>
+            </NFormItem>
+            <NFormItem
                 label="声部图片"
                 path="img"
                 rule={[

src/views/system-manage/subject-manage/subject/subject-list.tsx

@@ -28,11 +28,11 @@ export default defineComponent({
       instrumentList: [] as any,
     })
     const searchForm = reactive({
-      keyword: '',
+      keyword: null,
       times: null as any,
-      operatorKeyword: '', //创建人
-      categoryId: '',//声部分类
-      musicalInstrumentId: '',//关联乐器
+      operatorKeyword: null, //创建人
+      categoryId: null,//声部分类
+      musicalInstrumentId: null,//关联乐器
     })
 
     const columns = (): DataTableColumn[] => {
@@ -50,6 +50,10 @@ export default defineComponent({
           key: 'categoryName'
         },
         {
+          title: '声部编码',
+          key: 'code'
+        },
+        {
           title: '图片',
           key: 'img',
           render(row: any) {
@@ -213,98 +217,96 @@ export default defineComponent({
 
     return () => (
         <div class="system-menu-container">
-          <div class={['section-container']}>
-            <SaveForm
-                ref={saveForm}
-                model={searchForm}
-                onSubmit={onSubmit}
-                onSetModel={(val: any) => Object.assign(searchForm, val)}
-                saveKey="subject-list"
-            >
-              <NFormItem path="keyword" label="关键字">
-                <NInput
-                    placeholder="请输入编号/名称"
-                    v-model:value={searchForm.keyword}
-                    clearable
-                />
-              </NFormItem>
-              <NFormItem path="categoryId" label="声部分类">
-                <NSelect
-                    placeholder="请选择声部分类"
-                    v-model={[searchForm.categoryId, 'value']}
-                    filterable
-                    options={state.categorizeList}
-                    clearable
-                />
-              </NFormItem>
-              <NFormItem path="musicalInstrumentId" label="关联乐器">
-                <NSelect
-                    v-model={[searchForm.musicalInstrumentId, 'value']}
-                    placeholder="请选择关联乐器"
-                    filterable
-                    options={state.instrumentList}
-                    clearable
-                />
-              </NFormItem>
-              <NFormItem path="operatorKeyword" label="操作人">
-                <NInput
-                    placeholder="请输入操作人"
-                    v-model:value={searchForm.operatorKeyword}
-                    clearable
-                />
-              </NFormItem>
-              <NFormItem path="times" label="操作时间">
-                <NDatePicker
-                    class={styles.datepicker}
-                    value-format="yyyy.MM.dd"
-                    v-model:value={searchForm.times}
-                    type="daterange"
-                    clearable
-                />
-              </NFormItem>
-              <NFormItem>
-                <NSpace>
-                  <NButton type="primary" onClick={onSearch}>
-                    查询
-                  </NButton>
-                  <NButton type="default" onClick={onBtnReset}>
-                    重置
-                  </NButton>
-                </NSpace>
-              </NFormItem>
-            </SaveForm>
+          <SaveForm
+              ref={saveForm}
+              model={searchForm}
+              onSubmit={onSubmit}
+              onSetModel={(val: any) => Object.assign(searchForm, val)}
+              saveKey="subject-list"
+          >
+            <NFormItem path="keyword" label="关键字">
+              <NInput
+                  placeholder="请输入编号/名称"
+                  v-model:value={searchForm.keyword}
+                  clearable
+              />
+            </NFormItem>
+            <NFormItem path="categoryId" label="声部分类">
+              <NSelect
+                  placeholder="请选择声部分类"
+                  v-model:value={searchForm.categoryId}
+                  filterable
+                  options={state.categorizeList}
+                  clearable
+              />
+            </NFormItem>
+            <NFormItem path="musicalInstrumentId" label="关联乐器">
+              <NSelect
+                  v-model:value={searchForm.musicalInstrumentId}
+                  placeholder="请选择关联乐器"
+                  filterable
+                  options={state.instrumentList}
+                  clearable
+              />
+            </NFormItem>
+            <NFormItem path="operatorKeyword" label="操作人">
+              <NInput
+                  placeholder="请输入操作人"
+                  v-model:value={searchForm.operatorKeyword}
+                  clearable
+              />
+            </NFormItem>
+            <NFormItem path="times" label="操作时间">
+              <NDatePicker
+                  class={styles.datepicker}
+                  value-format="yyyy.MM.dd"
+                  v-model:value={searchForm.times}
+                  type="daterange"
+                  clearable
+              />
+            </NFormItem>
+            <NFormItem>
+              <NSpace>
+                <NButton type="primary" onClick={onSearch}>
+                  查询
+                </NButton>
+                <NButton type="default" onClick={onBtnReset}>
+                  重置
+                </NButton>
+              </NSpace>
+            </NFormItem>
+          </SaveForm>
 
-            <NSpace style={{paddingBottom: '12px'}}>
-              <NButton
-                  type="primary"
-                  //v-auth="materialCategory/save1599962104022290433"
-                  onClick={() => {
-                    state.saveMode = 'add'
-                    state.showSaveDialog = true
-                  }}
-                  disabled={state.loading}
-              >
-                添加
-              </NButton>
-            </NSpace>
-            <NDataTable
-                scroll-x="1300"
-                loading={state.loading}
-                columns={columns()}
-                data={state.dataList}
-                children-key="subMaterialCategoryList"
-                default-expand-all={false}
-                row-key={(row: any) => row.id}
-            ></NDataTable>
-            <Pagination
-                v-model:page={state.pagination.page}
-                v-model:pageSize={state.pagination.rows}
-                v-model:pageTotal={state.pagination.pageTotal}
-                onList={getList}
-                sync
-                saveKey="login-device"
-            ></Pagination>
-          </div>
+          <NSpace style={{paddingBottom: '12px'}}>
+            <NButton
+                type="primary"
+                //v-auth="materialCategory/save1599962104022290433"
+                onClick={() => {
+                  state.saveMode = 'add'
+                  state.showSaveDialog = true
+                }}
+                disabled={state.loading}
+            >
+              添加
+            </NButton>
+          </NSpace>
+          <NDataTable
+              scroll-x="1300"
+              loading={state.loading}
+              columns={columns()}
+              data={state.dataList}
+              children-key="subMaterialCategoryList"
+              default-expand-all={false}
+              row-key={(row: any) => row.id}
+          ></NDataTable>
+          <Pagination
+              v-model:page={state.pagination.page}
+              v-model:pageSize={state.pagination.rows}
+              v-model:pageTotal={state.pagination.pageTotal}
+              onList={getList}
+              sync
+              saveKey="login-device"
+          ></Pagination>
           <NModal
               v-model:show={state.showSaveDialog}
               preset="dialog"