refactor: routes and file

src/router/routes/index.js

@@ -25,7 +25,7 @@ export const basicRoutes = [
     meta: {
       title: '外部链接',
       icon: 'mdi:link-variant',
-      order: 2,
+      order: 4,
     },
     children: [
       {

src/views/demo/base/route.js

@@ -2,11 +2,11 @@ const Layout = () => import('@/layout/index.vue')
 
 export default {
   name: 'Test',
-  path: '/test',
+  path: '/base',
   component: Layout,
-  redirect: '/test/unocss',
+  redirect: '/base/unocss',
   meta: {
-    title: '基础功能测试',
+    title: '基础功能',
     customIcon: 'logo',
     order: 1,
   },

src/views/demo/editor/md-editor.vue

@@ -19,8 +19,6 @@
 import MdEditor from 'md-editor-v3'
 import 'md-editor-v3/lib/style.css'
 
-const router = useRouter()
-
 // refs
 let post = ref({})
 let btnLoading = ref(false)
@@ -31,7 +29,6 @@ function handleSavePost(e) {
   setTimeout(() => {
     $message.success('保存成功')
     btnLoading.value = false
-    router.push('/example/table/post')
   }, 2000)
 }
 </script>

src/views/demo/route.js

@@ -0,0 +1,39 @@
+const Layout = () => import('@/layout/index.vue')
+
+export default {
+  name: 'Demo',
+  path: '/demo',
+  component: Layout,
+  redirect: '/demo/crud-table',
+  meta: {
+    title: '示例页面',
+    customIcon: 'logo',
+    role: ['admin'],
+    requireAuth: true,
+    order: 3,
+  },
+  children: [
+    {
+      name: 'CrudTable',
+      path: 'crud-table',
+      component: () => import('./table/index.vue'),
+      meta: {
+        title: '文章列表',
+        icon: 'mdi:table',
+        role: ['admin'],
+        requireAuth: true,
+      },
+    },
+    {
+      name: 'MDEditor',
+      path: 'md-editor',
+      component: () => import('./editor/md-editor.vue'),
+      meta: {
+        title: 'MD编辑器',
+        icon: 'icon-park:editor',
+        role: ['admin'],
+        requireAuth: true,
+      },
+    },
+  ],
+}

src/views/examples/table/index.vue

@@ -1,3 +0,0 @@
-<template>
-  <router-view></router-view>
-</template>

src/views/examples/table/post/usePostTable.js

@@ -1,181 +0,0 @@
-import { h } from 'vue'
-import { NButton, NSwitch } from 'naive-ui'
-import { formatDateTime } from '@/utils'
-import { renderIcon } from '@/utils/icon'
-import api from './api'
-
-export const usePostTable = () => {
-  // refs
-  const loading = ref(false)
-  const tableData = ref([])
-  const columns = ref([])
-
-  async function initTableData() {
-    loading.value = true
-    tableData.value = await getTableData()
-    loading.value = false
-  }
-
-  function handleDelete(row) {
-    if (row && row.id) {
-      $dialog.confirm({
-        content: '确定删除？',
-        confirm() {
-          $message.success('删除成功')
-          initTableData()
-        },
-        cancel() {
-          $message.success('已取消')
-        },
-      })
-    }
-  }
-
-  function handleEdit(row) {
-    if (row && row.id) {
-      $dialog.confirm({
-        content: '确定删除？',
-        confirm() {
-          $message.success('删除成功')
-          initTableData()
-        },
-        cancel() {
-          $message.success('已取消')
-        },
-      })
-    }
-  }
-
-  async function handleRecommend(row) {
-    if (row && row.id) {
-      row.recommending = true
-      setTimeout(() => {
-        row.isRecommend = !row.isRecommend
-        row.recommending = false
-        $message.success(row.isRecommend ? '已推荐' : '已取消推荐')
-      }, 800)
-    }
-  }
-
-  async function handlePublish(row) {
-    if (row && row.id) {
-      row.publishing = true
-      setTimeout(() => {
-        row.isPublish = !row.isPublish
-        row.publishing = false
-        $message.success(row.isPublish ? '已发布' : '已取消发布')
-      }, 800)
-    }
-  }
-
-  function initColumns() {
-    columns.value = [
-      { type: 'selection' },
-      { title: '标题', key: 'title', width: 150, ellipsis: { tooltip: true } },
-      { title: '分类', key: 'category', width: 80, ellipsis: { tooltip: true } },
-      {
-        title: '描述',
-        key: 'description',
-        width: 200,
-        ellipsis: { tooltip: true },
-      },
-      { title: '创建人', key: 'author', width: 80 },
-      {
-        title: '创建时间',
-        key: 'createDate',
-        width: 150,
-        render(row) {
-          return h('span', formatDateTime(row['createDate']))
-        },
-      },
-      {
-        title: '最后更新时间',
-        key: 'updateDate',
-        width: 150,
-        render(row) {
-          return h('span', formatDateTime(row['updateDate']))
-        },
-      },
-      {
-        title: '推荐',
-        key: 'isRecommend',
-        width: 120,
-        align: 'center',
-        fixed: 'right',
-        render(row) {
-          return h(NSwitch, {
-            size: 'small',
-            value: row['isRecommend'],
-            rubberBand: false,
-            loading: !!row.recommending,
-            onUpdateValue: () => handleRecommend(row),
-          })
-        },
-      },
-      {
-        title: '发布',
-        key: 'isPublish',
-        width: 120,
-        align: 'center',
-        fixed: 'right',
-        render(row) {
-          return h(NSwitch, {
-            size: 'small',
-            rubberBand: false,
-            value: row['isPublish'],
-            loading: !!row.publishing,
-            onUpdateValue: () => handlePublish(row),
-          })
-        },
-      },
-      {
-        title: '操作',
-        key: 'actions',
-        width: 200,
-        align: 'center',
-        fixed: 'right',
-        render(row) {
-          return [
-            h(
-              NButton,
-              {
-                size: 'small',
-                type: 'primary',
-                onClick: () => handleEdit(row),
-              },
-              { default: () => '编辑', icon: renderIcon('material-symbols:edit-outline', { size: 14 }) }
-            ),
-            h(
-              NButton,
-              {
-                size: 'small',
-                type: 'error',
-                style: 'margin-left: 15px;',
-                onClick: () => handleDelete(row),
-              },
-              { default: () => '删除', icon: renderIcon('material-symbols:delete-outline', { size: 14 }) }
-            ),
-          ]
-        },
-      },
-    ]
-  }
-
-  async function getTableData() {
-    try {
-      const { data } = await api.getPosts()
-      return data
-    } catch (error) {
-      console.error(error)
-      return []
-    }
-  }
-
-  return {
-    loading,
-    columns,
-    tableData,
-    initColumns,
-    initTableData,
-  }
-}

src/views/examples/table/route.js

@@ -1,53 +0,0 @@
-const Layout = () => import('@/layout/index.vue')
-
-export default {
-  name: 'Example',
-  path: '/example',
-  component: Layout,
-  redirect: '/example/table',
-  meta: {
-    title: '组件示例',
-    icon: 'mdi:menu',
-    role: ['admin'],
-    requireAuth: true,
-    order: 3,
-  },
-  children: [
-    {
-      name: 'Table',
-      path: 'table',
-      component: () => import('./index.vue'),
-      redirect: '/example/table/post',
-      meta: {
-        title: '表格',
-        icon: 'mdi:table',
-        role: ['admin'],
-        requireAuth: true,
-      },
-      children: [
-        {
-          name: 'PostList',
-          path: 'post',
-          component: () => import('./post/index.vue'),
-          meta: {
-            title: '文章列表',
-            icon: 'material-symbols:auto-awesome-outline-rounded',
-            role: ['admin'],
-            requireAuth: true,
-          },
-        },
-        {
-          name: 'PostCreate',
-          path: 'post-create',
-          component: () => import('./post/PostCreate.vue'),
-          meta: {
-            title: '创建文章',
-            icon: 'material-symbols:auto-awesome-outline-rounded',
-            role: ['admin'],
-            requireAuth: true,
-          },
-        },
-      ],
-    },
-  ],
-}