1.0发布，Fixes Bug，以及新增 ProTable组件

.env.production

@@ -5,7 +5,7 @@ VITE_USE_MOCK = true
 VITE_PUBLIC_PATH = /
 
 # 网站前缀
-VITE_BASE_URL = /naive-ui-admin-preview
+VITE_BASE_URL = /
 
 # 是否删除console
 VITE_DROP_CONSOLE = true

CHANGELOG.md

@@ -1,3 +1,15 @@
+# 1.0 (2021-07-12)
+### 🐛 Bug Fixes
+- 修复页面切换面包屑未及时更新
+
+- ### ✨ Features
+- 1.0骨架发布 
+- Naive UI 升级至2.15.4  
+- 菜单新增排序字段  
+- 新增 `ProTable` 组件，封装了常用的分页列配置等逻辑，可查看组件示例页面
+- 持续更新中...
+
+
 # 0.1.1-beta (2021-07-07)
 ### 🐛 Bug Fixes
 - 修正黑色主题，页面背景色和导航风格问题

README.md

@@ -16,8 +16,8 @@ Naive Ui Admin 是一个免费开源的中后台模版，使用了最新的`vue3
 - [ ] 监控页
 - [x] 工作台
 
-## 预览
-- [naive-ui-admin](https://jekip.github.io/naive-ui-admin-preview)
+## 在线预览
+- [naive-ui-admin](https://jekip.github.io)
 
 账号：admin，密码：123456
 

mock/table/list.ts

@@ -28,12 +28,12 @@ export default [
     timeout: 1000,
     method: 'get',
     response: ({ query }) => {
-      const { pageNumber = 1, pageSize = 10 } = query;
+      const { page = 1, pageSize = 10 } = query;
       const list = tableList(Number(pageSize))
       return resultSuccess({
-        pageNumber:Number(pageNumber),
+        page:Number(page),
         pageSize:Number(pageSize),
-        total: list.length,
+        pageCount: 60,
         list
       }
       );

package.json

@@ -33,7 +33,7 @@
     "lodash-es": "^4.17.21",
     "mitt": "^2.1.0",
     "mockjs": "^1.1.0",
-    "naive-ui": "^2.15.2",
+    "naive-ui": "^2.15.4",
     "nprogress": "^1.0.0-1",
     "pinia": "^2.0.0-beta.3",
     "qs": "^6.10.1",

src/App.vue

@@ -19,7 +19,7 @@
 <script lang="ts">
 import { defineComponent, computed, onMounted, onUnmounted } from 'vue'
 import { zhCN, dateZhCN, createTheme, inputDark, datePickerDark, darkTheme } from 'naive-ui'
-import { LockScreen } from '@/components/lockscreen'
+import { LockScreen } from '@/components/Lockscreen'
 import { AppProvider } from '@/components/Application'
 import { useLockscreenStore } from '@/store/modules/lockscreen'
 import { useRoute } from 'vue-router'

src/components/lockscreen/lockscreen.vue → src/components/Lockscreen/Lockscreen.vue

@@ -77,7 +77,7 @@
 <script lang="ts">
 import { defineComponent, onMounted, reactive, toRefs, computed } from 'vue'
 import { ResultEnum } from '@/enums/httpEnum'
-import recharge from './recharge.vue'
+import recharge from './Recharge.vue'
 import {
   LockOutlined,
   LoadingOutlined,

src/components/Lockscreen/index.ts

@@ -0,0 +1,3 @@
+import LockScreen from './Lockscreen.vue'
+
+export { LockScreen }

src/components/ProTable/README.md

@@ -0,0 +1,91 @@
+ProTable 重封装组件说明
+====
+
+封装说明
+----
+
+> 基础的使用方式与 API 与 [官方版(data-table)](https://www.naiveui.com/zh-CN/os-theme/components/data-table#tree) 本一致，在其基础上，封装了加载数据的方法。
+>
+> 你无需在你是用表格的页面进行分页逻辑处理，仅需向 ProTable 组件传递绑定 `:api="Promise"` 对象即可
+>
+> 例子1
+----
+（基础使用）
+
+```vue
+
+<template>
+    <ProTable
+      title="表格列表"
+      :columns="columns"
+      :api="loadDataTable"
+      :row-key="row => row.id"
+      @update:checked-row-keys="onCheckedRow"
+    >
+      <template #toolbar>
+        <n-button type="primary">添加会员</n-button>
+      </template>
+    </ProTable>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { ProTable } from '@/components/ProTable'
+import { getTableList } from '@/api/table/list'
+const columns = [
+    {
+      title: 'id',
+      key: 'id'
+    },
+    {
+      title: '名称',
+      key: 'name'
+    },
+    {
+      title: '地址',
+      key: 'address'
+    },
+    {
+      title: '日期',
+      key: 'date'
+    },
+]
+export default defineComponent({
+  components: { ProTable },
+  setup() {
+      const loadDataTable = async (params) => {
+        const data = await getTableList(params);
+        return data
+      }
+    return {
+      columns,
+      loadDataTable
+    }
+  }
+})
+</script>
+```
+
+API
+----
+ProTable 在 NaiveUi 的 data-table 上进行了一层封装，支持了一些预设，并且封装了一些行为。这里只列出与 data-table 不同的 api。
+
+> request：Promise 参考上面例子写法
+> ref：可绑定ref 调用组件内部方法（data-table本身的方法和参数）
+
+Methods
+----
+> reload：actionRef.value.reload()
+
+> 其余方法，请打印查看
+
+Slots
+----
+> 名称：tableTitle | 表格顶部左侧区域                          
+> 名称：toolbar | 表格顶部右侧区域
+
+
+更新时间
+----
+
+该文档最后更新于： 2021-07-12 PM 10:13

src/components/ProTable/index.ts

@@ -0,0 +1 @@
+export { default as ProTable } from './src/ProTable.vue';