删减掉用不到的路由组件图片

src/router/modules/article.ts

@@ -1,30 +0,0 @@
-import { RouteRecordRaw } from 'vue-router';
-import { Layout } from '@/router/constant';
-import { BookOutlined } from '@vicons/antd';
-import { renderIcon } from '@/utils/index';
-
-const routes: Array<RouteRecordRaw> = [
-  {
-    path: '/article',
-    name: 'Article',
-    redirect: '/article/list',
-    component: Layout,
-    meta: {
-      title: '文章管理',
-      icon: renderIcon(BookOutlined),
-      sort: 7,
-    },
-    children: [
-      {
-        path: 'list',
-        name: 'article_list',
-        meta: {
-          title: '文章列表',
-        },
-        component: () => import('@/views/article/list.vue'),
-      },
-    ],
-  },
-];
-
-export default routes;

src/router/modules/comp.ts

@@ -17,6 +17,7 @@ const routeName = 'comp';
  *
  * */
 const routes: Array<RouteRecordRaw> = [
+  /**
   {
     path: '/comp',
     name: routeName,
@@ -171,7 +172,8 @@ const routes: Array<RouteRecordRaw> = [
         component: () => import('@/views/comp/tableSelect/tableSelect.vue'),
       },
     ],
-  },
+  }, 
+  */
 ];
 
 export default routes;

src/router/modules/comtemp.ts

@@ -4,43 +4,43 @@ import { CubeOutline } from '@vicons/ionicons5';
 import { renderIcon } from '@/utils/index';
 
 const routes: Array<RouteRecordRaw> = [
-  {
-    path: '/comtemp',
-    name: 'Comtemp',
-    component: Layout,
-    redirect: '/comtemp/search-article',
-    meta: {
-      title: '常用模板',
-      icon: renderIcon(CubeOutline),
-      sort: 9,
-    },
-    children: [
-      {
-        path: 'search-article',
-        name: 'SearchArticle',
-        meta: {
-          title: '搜索列表(文章)',
-        },
-        component: () => import('@/views/comtemp/search-article/search-article.vue'),
-      },
-      {
-        path: 'search-video',
-        name: 'SearchVideo',
-        meta: {
-          title: '搜索列表(视频)',
-        },
-        component: () => import('@/views/comtemp/search-video/search-video.vue'),
-      },
-      {
-        path: 'search-make',
-        name: 'SearchMake',
-        meta: {
-          title: '搜索列表(预约)',
-        },
-        component: () => import('@/views/comtemp/search-make/search-make.vue'),
-      },
-    ],
-  },
+  // {
+  //   path: '/comtemp',
+  //   name: 'Comtemp',
+  //   component: Layout,
+  //   redirect: '/comtemp/search-article',
+  //   meta: {
+  //     title: '常用模板',
+  //     icon: renderIcon(CubeOutline),
+  //     sort: 9,
+  //   },
+  //   children: [
+  //     {
+  //       path: 'search-article',
+  //       name: 'SearchArticle',
+  //       meta: {
+  //         title: '搜索列表(文章)',
+  //       },
+  //       component: () => import('@/views/comtemp/search-article/search-article.vue'),
+  //     },
+  //     {
+  //       path: 'search-video',
+  //       name: 'SearchVideo',
+  //       meta: {
+  //         title: '搜索列表(视频)',
+  //       },
+  //       component: () => import('@/views/comtemp/search-video/search-video.vue'),
+  //     },
+  //     {
+  //       path: 'search-make',
+  //       name: 'SearchMake',
+  //       meta: {
+  //         title: '搜索列表(预约)',
+  //       },
+  //       component: () => import('@/views/comtemp/search-make/search-make.vue'),
+  //     },
+  //   ],
+  // },
 ];
 
 export default routes;

src/router/modules/feature.ts

@@ -1,95 +0,0 @@
-import { RouteRecordRaw } from 'vue-router';
-import { Layout, ParentLayout } from '@/router/constant';
-import { ControlOutlined } from '@vicons/antd';
-import { renderIcon } from '@/utils';
-
-const routes: Array<RouteRecordRaw> = [
-  {
-    path: '/feature',
-    name: 'Feature',
-    component: Layout,
-    meta: {
-      title: '功能示例',
-      icon: renderIcon(ControlOutlined),
-      sort: 7,
-    },
-    children: [
-      {
-        path: 'download',
-        name: 'Download',
-        component: () => import('@/views/feature/download/download.vue'),
-        meta: {
-          title: '文件下载',
-        },
-      },
-      // {
-      //   path: 'context-menus',
-      //   name: 'ContextMenus',
-      //   component: () => import('@/views/feature/context-menus/context-menus.vue'),
-      //   meta: {
-      //     title: '右键菜单',
-      //   },
-      // },
-      {
-        path: 'copy',
-        name: 'copy',
-        component: () => import('@/views/feature/copy/copy.vue'),
-        meta: {
-          title: '剪贴板',
-        },
-      },
-      {
-        path: 'print',
-        name: 'print',
-        component: () => import('@/views/feature/print/print.vue'),
-        meta: {
-          title: '打印',
-        },
-      },
-      // {
-      //   path: 'scrollbar',
-      //   name: 'scrollbar',
-      //   component: () => import('@/views/feature/scrollbar/scrollbar.vue'),
-      //   meta: {
-      //     title: '滚动条',
-      //   },
-      // },
-      {
-        path: 'excel',
-        name: 'Excel',
-        meta: {
-          title: 'Excel',
-        },
-        component: ParentLayout,
-        children: [
-          {
-            path: 'choiceExport',
-            name: 'choiceExport',
-            component: () => import('@/views/feature/excel/choiceExport.vue'),
-            meta: {
-              title: '选择导出格式',
-            },
-          },
-          {
-            path: 'jsonExport',
-            name: 'jsonExport',
-            component: () => import('@/views/feature/excel/jsonExport.vue'),
-            meta: {
-              title: 'JSON数据导出',
-            },
-          },
-        ],
-      },
-      {
-        path: 'tagsAction',
-        name: 'TagsAction',
-        meta: {
-          title: '多页签操作',
-        },
-        component: () => import('@/views/feature/tags/tagsAction.vue'),
-      },
-    ],
-  },
-];
-
-export default routes;

src/router/modules/instation.ts

@@ -4,35 +4,35 @@ import { BellOutlined } from '@vicons/antd';
 import { renderIcon } from '@/utils/index';
 
 const routes: Array<RouteRecordRaw> = [
-  {
-    path: '/instation',
-    name: 'Instation',
-    redirect: '/instation/myalerts',
-    component: Layout,
-    meta: {
-      title: '站内通知',
-      icon: renderIcon(BellOutlined),
-      sort: 7,
-    },
-    children: [
-      {
-        path: 'myalerts',
-        name: 'myalerts',
-        meta: {
-          title: '我的通知',
-        },
-        component: () => import('@/views/instation/myalerts/myalerts.vue'),
-      },
-      {
-        path: 'notice',
-        name: 'instation_notice',
-        meta: {
-          title: '通知管理',
-        },
-        component: () => import('@/views/instation/notice/notice.vue'),
-      },
-    ],
-  },
+  // {
+  //   path: '/instation',
+  //   name: 'Instation',
+  //   redirect: '/instation/myalerts',
+  //   component: Layout,
+  //   meta: {
+  //     title: '站内通知',
+  //     icon: renderIcon(BellOutlined),
+  //     sort: 7,
+  //   },
+  //   children: [
+  //     {
+  //       path: 'myalerts',
+  //       name: 'myalerts',
+  //       meta: {
+  //         title: '我的通知',
+  //       },
+  //       component: () => import('@/views/instation/myalerts/myalerts.vue'),
+  //     },
+  //     {
+  //       path: 'notice',
+  //       name: 'instation_notice',
+  //       meta: {
+  //         title: '通知管理',
+  //       },
+  //       component: () => import('@/views/instation/notice/notice.vue'),
+  //     },
+  //   ],
+  // },
 ];
 
 export default routes;

src/router/modules/notice.ts

@@ -4,44 +4,44 @@ import { BellOutlined } from '@vicons/antd';
 import { renderIcon } from '@/utils/index';
 
 const routes: Array<RouteRecordRaw> = [
-  {
-    path: '/instation',
-    name: 'Notice',
-    redirect: '/instation/myalerts',
-    component: Layout,
-    meta: {
-      title: '站内通知',
-      icon: renderIcon(BellOutlined),
-      sort: 10,
-    },
-    children: [
-      {
-        path: 'myalerts',
-        name: 'instation_myalerts',
-        meta: {
-          title: '我的通知',
-        },
-        component: () => import('@/views/instation/myalerts/myalerts.vue'),
-      },
-      {
-        path: 'notice',
-        name: 'instation_notice',
-        meta: {
-          title: '通知管理',
-        },
-        component: () => import('@/views/instation/notice/notice.vue'),
-      },
-      {
-        path: 'notice/info/:id',
-        name: 'instation_notice_info',
-        meta: {
-          title: '查看通知',
-          hidden: true,
-        },
-        component: () => import('@/views/instation/notice/info.vue'),
-      },
-    ],
-  },
+  // {
+  //   path: '/instation',
+  //   name: 'Notice',
+  //   redirect: '/instation/myalerts',
+  //   component: Layout,
+  //   meta: {
+  //     title: '站内通知',
+  //     icon: renderIcon(BellOutlined),
+  //     sort: 10,
+  //   },
+  //   children: [
+  //     {
+  //       path: 'myalerts',
+  //       name: 'instation_myalerts',
+  //       meta: {
+  //         title: '我的通知',
+  //       },
+  //       component: () => import('@/views/instation/myalerts/myalerts.vue'),
+  //     },
+  //     {
+  //       path: 'notice',
+  //       name: 'instation_notice',
+  //       meta: {
+  //         title: '通知管理',
+  //       },
+  //       component: () => import('@/views/instation/notice/notice.vue'),
+  //     },
+  //     {
+  //       path: 'notice/info/:id',
+  //       name: 'instation_notice_info',
+  //       meta: {
+  //         title: '查看通知',
+  //         hidden: true,
+  //       },
+  //       component: () => import('@/views/instation/notice/info.vue'),
+  //     },
+  //   ],
+  // },
 ];
 
 export default routes;

src/views/comp/cropper/index.vue

@@ -1,72 +0,0 @@
-<template>
-  <PageWrapper
-    title="图片裁剪示例"
-    content="适用于，头像上传，图片上传之前需要进行裁剪，简单说就是，需要图片上传并且需要裁剪，就可以用这个组件快速实现，需要真实接口才能进行上传测试！"
-  >
-    <el-card shadow="never" class="mt-3 proCard">
-      <template #header>
-        <div class="card-header">
-          <span>圆形裁剪</span>
-        </div>
-      </template>
-      <!--圆形裁剪-->
-      <Cropper
-        ref="cropperCircled"
-        :circled="true"
-        :src="src"
-        :uploadApi="upload"
-        title="圆形头像上传"
-      />
-      <el-space>
-        <el-button class="mt-3 ml-12" @click="cropperCircledImg">选择图片</el-button>
-      </el-space>
-    </el-card>
-
-    <el-card shadow="never" class="mt-3 proCard">
-      <template #header>
-        <div class="card-header">
-          <span>矩形裁剪</span>
-        </div>
-      </template>
-      <!--矩形裁剪-->
-      <Cropper ref="cropperRectangle" :src="src" title="矩形头像上传" />
-      <el-space>
-        <el-button class="mt-3 ml-12" @click="cropperRectangleImg">选择图片</el-button>
-      </el-space>
-    </el-card>
-
-    <el-card shadow="never" class="mt-3 proCard">
-      <template #header>
-        <div class="card-header">
-          <span>自定义内容，选择权交给您</span>
-        </div>
-      </template>
-      <!--圆形裁剪-->
-      <Cropper ref="cropperCircled" :src="src" :uploadApi="upload" title="矩形头像上传">
-        <el-button class="mt-3 ml-12" @click="cropperCircledImg">自定义裁剪图片</el-button>
-      </Cropper>
-    </el-card>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { ref } from 'vue';
-  import { Cropper } from '@/components/Cropper';
-  import { upload } from '@/api/common/';
-
-  const src = ref('https://img.naiveadmin.com/assets/avatar/avatar-2.jpg');
-
-  const cropperCircled = ref();
-
-  const cropperRectangle = ref();
-
-  function cropperCircledImg() {
-    cropperCircled.value.openCropper();
-  }
-
-  function cropperRectangleImg() {
-    cropperRectangle.value.openCropper();
-  }
-</script>
-
-<style lang="scss"></style>

src/views/comp/drag/index.vue

@@ -1,146 +0,0 @@
-<template>
-  <PageWrapper
-    title="花式拖拽演示"
-    content="常用于卡片，事项，预约，流程，计划等，每个卡片，都可以上下拖拽顺序，另外不同卡片，也可以拖拽过去，拖拽过来，都不在话下呢，快试试O(∩_∩)O哈哈~"
-  >
-    <el-row :gutter="20" class="mt-3 proCard">
-      <el-col :span="6">
-        <el-card title="需求池" size="small" shadow="never">
-          <template #header>
-            <div class="card-header">
-              <span>需求池</span>
-              <el-tag>月</el-tag>
-            </div>
-          </template>
-          <Draggable
-            class="draggable-ul"
-            animation="300"
-            :list="demandList"
-            group="people"
-            itemKey="name"
-          >
-            <template #item="{ element }">
-              <div class="cursor-move draggable-li">
-                <el-tag>需求</el-tag><span class="ml-2">{{ element.name }}</span>
-              </div>
-            </template>
-          </Draggable>
-        </el-card>
-      </el-col>
-
-      <el-col :span="6">
-        <el-card size="small" shadow="never">
-          <template #header>
-            <div class="card-header">
-              <span>开发中</span>
-              <el-tag type="warning">月</el-tag>
-            </div>
-          </template>
-          <Draggable
-            class="draggable-ul"
-            animation="300"
-            :list="exploitList"
-            group="people"
-            itemKey="name"
-          >
-            <template #item="{ element }">
-              <div class="cursor-move draggable-li">
-                <el-tag type="warning">开发中</el-tag><span class="ml-2">{{ element.name }}</span>
-              </div>
-            </template>
-          </Draggable>
-        </el-card>
-      </el-col>
-
-      <el-col :span="6">
-        <el-card size="small" shadow="never">
-          <template #header>
-            <div class="card-header">
-              <span>已完成</span>
-              <el-tag type="warning">月</el-tag>
-            </div>
-          </template>
-          <Draggable
-            class="draggable-ul"
-            animation="300"
-            :list="completeList"
-            group="people"
-            itemKey="name"
-          >
-            <template #item="{ element }">
-              <div class="cursor-move draggable-li">
-                <el-tag type="error">已完成</el-tag><span class="ml-2">{{ element.name }}</span>
-              </div>
-            </template>
-          </Draggable>
-        </el-card>
-      </el-col>
-
-      <el-col :span="6">
-        <el-card size="small" shadow="never">
-          <template #header>
-            <div class="card-header">
-              <span>已验收</span>
-              <el-tag type="success">月</el-tag>
-            </div>
-          </template>
-          <Draggable
-            class="draggable-ul"
-            animation="300"
-            :list="approvedList"
-            group="people"
-            itemKey="name"
-          >
-            <template #item="{ element }">
-              <div class="cursor-move draggable-li">
-                <el-tag type="success">已验收</el-tag><span class="ml-2">{{ element.name }}</span>
-              </div>
-            </template>
-          </Draggable>
-        </el-card>
-      </el-col>
-    </el-row>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { reactive } from 'vue';
-  import Draggable from 'vuedraggable';
-
-  const demandList = reactive([
-    { name: '预约表单页面，能填写预约相关信息', id: 1 },
-    { name: '促销活动页面，包含促销广告展示', id: 2 },
-    { name: '商品列表，需要一个到货提醒功能', id: 3 },
-    { name: '商品需要一个评价功能', id: 4 },
-    { name: '商品图片需要提供放大镜', id: 5 },
-    { name: '订单需要提供删除到回收站', id: 6 },
-    { name: '用户头像上传，需要支持裁剪', id: 7 },
-    { name: '据说Vue3.2发布了，setup啥时候支持？', id: 8 },
-  ]);
-
-  const exploitList = reactive([{ name: '商品图片需要提供放大镜', id: 5 }]);
-
-  const completeList = reactive([{ name: '商品图片需要提供放大镜', id: 5 }]);
-
-  const approvedList = reactive([{ name: '商品图片需要提供放大镜', id: 5 }]);
-</script>
-
-<style lang="scss" scoped>
-  .draggable-ul {
-    width: 100%;
-    overflow: hidden;
-    margin-top: -16px;
-
-    .draggable-li {
-      width: 100%;
-      padding: 16px 10px;
-      border-bottom: 1px solid var(--n-border-color);
-    }
-  }
-
-  .card-header {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-  }
-</style>

src/views/comp/form/basic.vue

@@ -1,223 +0,0 @@
-<template>
-  <PageWrapper
-    title="基础表单"
-    content="基础表单，用于向用户收集表单信息，并展示 Password 组件使用示例"
-  >
-    <el-card shadow="never" class="mt-3 proCard">
-      <el-row :gutter="20" justify="center" class="py-4">
-        <el-col :xs="24" :sm="20" :md="14" :lg="12" :xl="8">
-          <BasicForm
-            submitButtonText="提交预约"
-            :gridProps="{ cols: 1 }"
-            :schemas="schemas"
-            @submit="handleSubmit"
-            @reset="handleReset"
-          >
-            <template #statusSlot="{ model, field }">
-              <el-input v-model="model[field]" placeholder="请输入您今天的状态" />
-            </template>
-          </BasicForm>
-        </el-col>
-      </el-row>
-    </el-card>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { BasicForm, FormSchema } from '@/components/Form/index';
-  import { ElMessage } from 'element-plus';
-  import { getProvinceList } from '@/api/select/select';
-
-  const params = {
-    type: 1,
-  };
-
-  async function loadSelectData(res) {
-    //这里可以进行数据转换处理
-    return (await getProvinceList({ ...res, ...params })).map((item, index) => {
-      return {
-        ...item,
-        index,
-      };
-    });
-  }
-
-  const schemas: FormSchema[] = [
-    {
-      field: 'id',
-      defaultValue: 128,
-      hidden: true,
-    },
-    {
-      field: 'identity',
-      defaultValue: '我是一个隐藏字段内容',
-      hidden: true,
-    },
-    {
-      field: 'name',
-      component: 'Input',
-      label: '姓名',
-      labelMessage: '这是一个提示',
-      componentProps: {
-        placeholder: '请输入姓名',
-        onInput: (e: any) => {
-          console.log(e);
-        },
-      },
-      rules: [{ required: true, message: '请输入姓名', trigger: ['blur'] }],
-    },
-    {
-      field: 'user.basic.age',
-      component: 'InputNumber',
-      label: '年龄',
-      labelMessage: '这是一个field对象演示',
-      componentProps: {
-        placeholder: '请输入年龄',
-        controlsPosition: 'right',
-      },
-      rules: [{ required: true, type: 'number', message: '请输入年龄', trigger: ['blur'] }],
-    },
-    {
-      field: 'mobile',
-      component: 'Input',
-      label: '手机',
-      componentProps: {
-        placeholder: '请输入手机号码',
-        onInput: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'type',
-      component: 'Select',
-      label: '类型',
-      labelMessage: '选择类型会出现预约时间表单',
-      componentProps: {
-        placeholder: '请选择类型',
-        clearable: true,
-        options: [
-          {
-            label: '舒适性',
-            value: 1,
-          },
-          {
-            label: '经济性',
-            value: 2,
-          },
-        ],
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'classify',
-      component: 'BasicSelect',
-      label: '动态分类',
-      componentProps: {
-        placeholder: '请选择分类',
-        request: loadSelectData,
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-      rules: [{ required: true, message: '请选择分类', trigger: ['change'] }],
-    },
-    {
-      field: 'makeDate',
-      component: 'DatePicker',
-      label: '预约时间',
-      defaultValue: 1183135260000,
-      componentProps: {
-        type: 'date',
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-      // 根据 上面选择的类型，获取页面其他逻辑字段 处理显示表单
-      // 可用字段 schema, values, model, field
-      hidden: ({ model }) => {
-        return !model.type;
-      },
-      rules: [{ required: true, type: 'number', message: '请选择预约时间', trigger: ['change'] }],
-    },
-    {
-      field: 'makeTime',
-      component: 'TimePicker',
-      label: '停留时间',
-      componentProps: {
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'status',
-      label: '状态',
-      //插槽
-      slot: 'statusSlot',
-    },
-    {
-      field: 'makeProject',
-      component: 'Checkbox',
-      label: '预约项目',
-      componentProps: {
-        placeholder: '请选择预约项目',
-        options: [
-          {
-            label: '种牙',
-            value: 1,
-          },
-          {
-            label: '补牙',
-            value: 2,
-          },
-          {
-            label: '根管',
-            value: 3,
-          },
-        ],
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'makeSource',
-      component: 'RadioGroup',
-      label: '来源',
-      componentProps: {
-        options: [
-          {
-            label: '网上',
-            value: 1,
-          },
-          {
-            label: '门店',
-            value: 2,
-          },
-        ],
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    // {
-    //   field: 'password',
-    //   label: '密码',
-    //   slot: 'passwordSlot',
-    // },
-  ];
-
-  function handleSubmit(values: Recordable) {
-    if (!values) return;
-    ElMessage.success(JSON.stringify(values));
-  }
-
-  function handleReset(values: Recordable) {
-    ElMessage.success(JSON.stringify(values));
-  }
-</script>
-
-<style lang="scss" scoped></style>

src/views/comp/form/useForm.vue

@@ -1,157 +0,0 @@
-<template>
-  <PageWrapper title="基础表单" content="useForm 表单用法，用于向用户收集表单信息 ">
-    <el-card shadow="never" class="mt-3 proCard">
-      <el-row :gutter="20" justify="center" class="py-4">
-        <el-col :xs="24" :sm="20" :md="14" :lg="12" :xl="8">
-          <BasicForm @register="register" @submit="handleSubmit" @reset="handleReset" />
-        </el-col>
-      </el-row>
-    </el-card>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { BasicForm, useForm, FormSchema } from '@/components/Form/index';
-  import { ElMessage } from 'element-plus';
-
-  const schemas: FormSchema[] = [
-    {
-      field: 'id',
-      defaultValue: 128,
-      hidden: true,
-    },
-    {
-      field: 'identity',
-      defaultValue: '我是一个隐藏字段内容',
-      hidden: true,
-    },
-    {
-      field: 'name',
-      component: 'Input',
-      label: '姓名',
-      labelMessage: '这是一个提示',
-      componentProps: {
-        placeholder: '请输入姓名',
-        onInput: (e: any) => {
-          console.log(e);
-        },
-      },
-      rules: [{ required: true, message: '请输入姓名', trigger: ['blur'] }],
-    },
-    {
-      field: 'mobile',
-      component: 'Input',
-      label: '手机',
-      componentProps: {
-        placeholder: '请输入手机号码',
-        onInput: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'type',
-      component: 'Select',
-      label: '类型',
-      componentProps: {
-        placeholder: '请选择类型',
-        options: [
-          {
-            label: '舒适性',
-            value: 1,
-          },
-          {
-            label: '经济性',
-            value: 2,
-          },
-        ],
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'makeDate',
-      component: 'DatePicker',
-      label: '预约时间',
-      defaultValue: 1183135260000,
-      componentProps: {
-        type: 'date',
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'makeTime',
-      component: 'TimePicker',
-      label: '停留时间',
-      componentProps: {
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'makeProject',
-      component: 'Checkbox',
-      label: '预约项目',
-      componentProps: {
-        placeholder: '请选择预约项目',
-        options: [
-          {
-            label: '种牙',
-            value: 1,
-          },
-          {
-            label: '补牙',
-            value: 2,
-          },
-          {
-            label: '根管',
-            value: 3,
-          },
-        ],
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'makeSource',
-      component: 'RadioGroup',
-      label: '来源',
-      componentProps: {
-        options: [
-          {
-            label: '网上',
-            value: 1,
-          },
-          {
-            label: '门店',
-            value: 2,
-          },
-        ],
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-  ];
-
-  const [register, {}] = useForm({
-    submitButtonText: '提交预约',
-    schemas,
-  });
-
-  function handleSubmit(values: Recordable) {
-    console.log(values);
-    ElMessage.success(JSON.stringify(values));
-  }
-
-  function handleReset(values: Recordable) {
-    console.log(values);
-  }
-</script>
-
-<style lang="scss" scoped></style>

src/views/comp/modal/index.vue

@@ -1,272 +0,0 @@
-<template>
-  <PageWrapper title="模态框">
-    <template #headerContent
-      >模态框，用于向用户收集或展示信息，Modal 基于 Dialog 组件，扩展最大化功能
-      <br />
-      以下是 useModal 方式，ref
-      方式，也支持，使用方式和其他组件一致，如：modalRef.value.closeModal()</template
-    >
-    <el-card class="mt-3 proCard">
-      <el-alert title="Modal嵌套Form" type="info">
-        使用 useModal 进行弹窗展示和操作，并演示了在 Modal 内和 Form 组件，组合使用方法
-      </el-alert>
-      <el-divider />
-      <el-space>
-        <el-button type="primary" @click="showModal">打开Modal嵌套Form例子</el-button>
-      </el-space>
-      <el-divider />
-      <el-alert title="个性化轻量级" type="info">
-        使用 useModal 进行弹窗展示和操作，自定义配置，实现轻量级效果，更多配置，请参考文档
-      </el-alert>
-      <el-divider />
-      <el-space>
-        <el-button type="primary" @click="showLightModal">轻量级确认</el-button>
-      </el-space>
-      <el-divider />
-      <el-alert title="提示" type="info">
-        组件暴露了，setProps 方法，用于修改组件内部
-        Props，比如标题，等，具体参考UI框架文档，DialogReactive Properties
-      </el-alert>
-    </el-card>
-
-    <basicModal @register="modalRegister" ref="modalRef" @ok="okModal">
-      <template #default>
-        <BasicForm @register="register" @reset="handleReset" class="basicForm">
-          <template #statusSlot="{ model, field }">
-            <el-input v-model="model[field]" placeholder="请输入您今天的状态" />
-          </template>
-        </BasicForm>
-      </template>
-    </basicModal>
-
-    <basicModal @register="lightModalRegister" ref="modalRef" @ok="lightOkModal">
-      <template #default>
-        <el-space>
-          <el-button type="primary" @click="updateTitle">更新标题</el-button>
-          <el-button type="danger" @click="lightCloseModal">关闭弹窗</el-button>
-        </el-space>
-      </template>
-    </basicModal>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { ref } from 'vue';
-  import { ElMessage } from 'element-plus';
-  import { basicModal, useModal } from '@/components/Modal';
-  import { BasicForm, FormSchema, useForm } from '@/components/Form/index';
-
-  const schemas: FormSchema[] = [
-    {
-      field: 'name',
-      component: 'Input',
-      label: '姓名',
-      labelMessage: '这是一个提示',
-      rowProps: {
-        span: 1,
-      },
-      componentProps: {
-        placeholder: '请输入姓名',
-        onInput: (e: any) => {
-          console.log(e);
-        },
-      },
-      rules: [{ required: true, message: '请输入姓名', trigger: ['blur'] }],
-    },
-    {
-      field: 'mobile',
-      component: 'Input',
-      label: '手机',
-      componentProps: {
-        placeholder: '请输入手机号码',
-        showButton: false,
-        onInput: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'type',
-      component: 'Select',
-      label: '类型',
-      rowProps: {
-        //span: 24,
-      },
-      componentProps: {
-        placeholder: '请选择类型',
-        options: [
-          {
-            label: '舒适性',
-            value: 1,
-          },
-          {
-            label: '经济性',
-            value: 2,
-          },
-        ],
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'makeDate',
-      component: 'DatePicker',
-      label: '预约时间',
-      rowProps: {
-        //span: 24,
-      },
-      defaultValue: 1183135260000,
-      componentProps: {
-        type: 'date',
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'makeTime',
-      component: 'TimePicker',
-      label: '停留时间',
-      rowProps: {
-        //span: 24,
-      },
-      componentProps: {
-        clearable: true,
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'makeProject',
-      component: 'Checkbox',
-      label: '预约项目',
-      rowProps: {
-        //span: 24,
-      },
-      componentProps: {
-        placeholder: '请选择预约项目',
-        options: [
-          {
-            label: '种牙',
-            value: 1,
-          },
-          {
-            label: '补牙',
-            value: 2,
-          },
-          {
-            label: '根管',
-            value: 3,
-          },
-        ],
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'makeSource',
-      component: 'RadioGroup',
-      label: '来源',
-      rowProps: {
-        //span: 24,
-      },
-      componentProps: {
-        options: [
-          {
-            label: '网上',
-            value: 1,
-          },
-          {
-            label: '门店',
-            value: 2,
-          },
-        ],
-        onChange: (e: any) => {
-          console.log(e);
-        },
-      },
-    },
-    {
-      field: 'status',
-      label: '状态',
-      rowProps: {
-        //span: 24,
-      },
-      //插槽
-      slot: 'statusSlot',
-    },
-  ];
-
-  const modalRef: any = ref(null);
-
-  const [modalRegister, { openModal, closeModal, setSubLoading }] = useModal({
-    title: '新增预约',
-    width: 600,
-    confirmButText: '提交预约',
-  });
-
-  const [
-    lightModalRegister,
-    {
-      setProps,
-      openModal: lightOpenModal,
-      closeModal: lightCloseModal,
-      setSubLoading: lightSetSubLoading,
-    },
-  ] = useModal({
-    title: '确认对话框',
-  });
-
-  const [register, { submit }] = useForm({
-    labelWidth: 80,
-    layout: 'horizontal',
-    submitButtonText: '提交预约',
-    showActionButtonGroup: false,
-    schemas,
-  });
-
-  async function okModal() {
-    const formRes = await submit();
-    if (formRes) {
-      closeModal();
-      ElMessage.success('提交成功');
-    } else {
-      ElMessage({
-        message: '验证失败，请填写完整信息',
-        type: 'error',
-      });
-      setSubLoading(false);
-    }
-  }
-
-  function lightOkModal() {
-    lightCloseModal();
-    lightSetSubLoading();
-  }
-
-  function showLightModal() {
-    lightOpenModal();
-  }
-
-  function showModal() {
-    openModal();
-  }
-
-  function handleReset(values: Recordable) {
-    console.log(values);
-  }
-
-  function updateTitle() {
-    setProps({ title: '我是一个新的弹窗标题' });
-  }
-</script>
-
-<style lang="scss" scoped>
-  .n-dialog.basicModalLight {
-    width: 416px;
-    padding-top: 26px;
-  }
-</style>

src/views/comp/password/index.vue

@@ -1,35 +0,0 @@
-<template>
-  <PageWrapper
-    title="密码强度校验组件"
-    content="用于常用密码强度设置，通常要求比较严格一点密码适用，验证，灵活配置，脱离 Form
-        单独使用也可以哦~"
-  >
-    <el-card :bordered="false" class="mt-3 proCard">
-      <el-alert title="基础效果" type="info"> 密码长度，6-32，复杂密码</el-alert>
-      <Password class="mt-3" />
-
-      <el-alert title="设定密码长度" type="info">比如来个，( 12 - 16 个字符 )</el-alert>
-      <Password :min-length="12" :max-length="16" class="mt-3" />
-
-      <el-alert title="简单密码" type="info"
-        >不需要满足字母、数字及特殊字符两种或以上组合条件
-      </el-alert>
-      <Password class="mt-3" :complexity="false" />
-
-      <el-alert title="自定义密码强度等级提示语" type="info">
-        支持4个等级配置，1 - 4 默认4个等级名称分别为： 1. 弱不禁风 2. 平淡无奇 3. 出神入化 4.
-        登峰造极
-      </el-alert>
-      <Password class="mt-3" :level="{ 1: '很Low', 2: '一般Low', 3: '没那么Low', 4: '不Low了' }" />
-
-      <el-alert title="再次确认密码" type="info" />
-      <Password :repeat="true" class="mt-3" />
-    </el-card>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { Password } from '@/components/Password';
-</script>
-
-<style lang="scss"></style>

src/views/comp/qrcode/index.vue

@@ -1,215 +0,0 @@
-<template>
-  <PageWrapper
-    title="二维码组件"
-    content="二维码组件使用示例，通常用于一些商品、促销活动、或者分享推广二维码展示"
-  >
-    <el-row class="mt-3" :gutter="10">
-      <el-col :span="8">
-        <el-card shadow="hover" size="small">
-          <template #header>
-            <div class="card-header">
-              <span>基础实例</span>
-            </div>
-          </template>
-          <div class="qrcode-space">
-            <QrCode :value="qrCodeUrl" />
-          </div>
-        </el-card>
-      </el-col>
-      <el-col :span="8">
-        <el-card shadow="hover" size="small">
-          <template #header>
-            <div class="card-header">
-              <span>渲染成img标签示例</span>
-            </div>
-          </template>
-          <div class="qrcode-space">
-            <QrCode :value="qrCodeUrl" tag="img" />
-          </div>
-        </el-card>
-      </el-col>
-      <el-col :span="8">
-        <el-card shadow="hover" size="small">
-          <template #header>
-            <div class="card-header">
-              <span>配置样式示例</span>
-            </div>
-          </template>
-          <div class="qrcode-space">
-            <QrCode
-              :value="qrCodeUrl"
-              :options="{
-                color: { dark: '#55D187' },
-              }"
-            />
-          </div>
-        </el-card>
-      </el-col>
-    </el-row>
-    <el-row :gutter="10">
-      <el-col :span="8">
-        <el-card shadow="hover" size="small">
-          <template #header>
-            <div class="card-header">
-              <span>本地logo示例</span>
-            </div>
-          </template>
-          <div class="qrcode-space">
-            <QrCode :value="qrCodeUrl" :logo="LogoImg" />
-          </div>
-        </el-card>
-      </el-col>
-      <el-col :span="8">
-        <el-card shadow="hover" size="small">
-          <template #header>
-            <div class="card-header">
-              <span>在线logo示例</span>
-            </div>
-          </template>
-          <div class="qrcode-space">
-            <QrCode
-              :value="qrCodeUrl"
-              logo="https://naive-ui-admin-docs.vercel.app/logo.png"
-              :options="{
-                color: { dark: '#55D187' },
-              }"
-            />
-          </div>
-        </el-card>
-      </el-col>
-      <el-col :span="8">
-        <el-card shadow="hover" size="small">
-          <template #header>
-            <div class="card-header">
-              <span>LOGO配置示例</span>
-            </div>
-          </template>
-          <div class="qrcode-space">
-            <QrCode
-              :value="qrCodeUrl"
-              :logo="{
-                src: 'https://naive-ui-admin-docs.vercel.app/logo.png',
-                logoSize: 0.2,
-                borderSize: 0.05,
-                borderRadius: 50,
-                bgColor: 'blue',
-              }"
-            />
-          </div>
-        </el-card>
-      </el-col>
-    </el-row>
-    <el-row :gutter="10">
-      <el-col :span="8">
-        <el-card shadow="hover" size="small">
-          <template #header>
-            <div class="card-header">
-              <span>下载示例</span>
-            </div>
-          </template>
-          <div class="qrcode-space">
-            <QrCode :value="qrCodeUrl" ref="qrRef" :logo="LogoImg" />
-          </div>
-          <div class="mb-2 qrcode-space">
-            <el-button type="primary" @click="download"> 下载 </el-button>
-          </div>
-          <div class="qrcode-space">
-            <div class="msg">(在线logo会导致图片跨域，需要下载图片需要自行解决跨域问题)</div>
-          </div>
-        </el-card>
-      </el-col>
-      <el-col :span="8">
-        <el-card shadow="hover" size="small">
-          <template #header>
-            <div class="card-header">
-              <span>扩展绘制示例</span>
-            </div>
-          </template>
-          <div class="qrcode-space">
-            <QrCode
-              :value="qrCodeUrl"
-              :width="200"
-              :options="{ margin: 5 }"
-              ref="qrDiyRef"
-              :logo="LogoImg"
-              @done="onQrcodeDone"
-            />
-          </div>
-          <div class="mb-2 qrcode-space">
-            <el-button type="primary" @click="downloadDiy"> 下载 </el-button>
-          </div>
-          <div class="qrcode-space">
-            <div class="msg">要进行扩展绘制则不能将tag设为img</div>
-          </div>
-        </el-card>
-      </el-col>
-      <el-col :span="8">
-        <el-card shadow="hover" size="small">
-          <template #header>
-            <div class="card-header">
-              <span>配置大小示例</span>
-            </div>
-          </template>
-          <div class="qrcode-space">
-            <QrCode :value="qrCodeUrl" :width="270" />
-          </div>
-        </el-card>
-      </el-col>
-    </el-row>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { ref, unref } from 'vue';
-  import { QrCode, QrCodeActionType } from '@/components/Qrcode/index';
-  import LogoImg from '@/assets/images/logo.png';
-  const qrCodeUrl = 'https://www.naiveadmin.com';
-
-  const qrRef = ref<Nullable<QrCodeActionType>>(null);
-  const qrDiyRef = ref<Nullable<QrCodeActionType>>(null);
-
-  function download() {
-    const qrEl = unref(qrRef);
-    if (!qrEl) return;
-    qrEl.download('img');
-  }
-
-  function downloadDiy() {
-    const qrEl = unref(qrDiyRef);
-    if (!qrEl) return;
-    qrEl.download('Qrcode');
-  }
-
-  function onQrcodeDone({ ctx }: any) {
-    if (ctx instanceof CanvasRenderingContext2D) {
-      // 额外绘制
-      ctx.fillStyle = 'black';
-      ctx.font = '16px "微软雅黑"';
-      ctx.textBaseline = 'bottom';
-      ctx.textAlign = 'center';
-      ctx.fillText('扫描关注Star点一点', 100, 195, 200);
-    }
-  }
-</script>
-
-<style lang="scss" scoped>
-  .el-row {
-    margin-bottom: 10px;
-  }
-  .qrcode-space {
-    display: flex;
-    position: relative;
-    bottom: 0;
-    transition: bottom 0.4s;
-    justify-content: center;
-    &:hover {
-      bottom: 6px;
-    }
-  }
-
-  .card-header {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-  }
-</style>

src/views/comp/region/index.vue

@@ -1,62 +0,0 @@
-<template>
-  <PageWrapper title="地区" content="地区组件，用于选择省市区，比如填写地址，配送地址，等...">
-    <el-card :bordered="false" class="mt-3 proCard">
-      <el-alert title="添加场景" type="info"> 自动加载数据，显示省市区</el-alert>
-      <Region
-        class="mt-3 Region"
-        labelField="areaName"
-        valueField="areaId"
-        @change="regionChange"
-      />
-      <el-divider />
-
-      <el-alert title="回显场景" type="info"> 设置默认值，自动加载数据，并且选中</el-alert>
-      <Region
-        v-model:value="regionIds"
-        class="mt-3 Region"
-        labelField="areaName"
-        valueField="areaId"
-        @change="regionChange"
-      />
-      <el-divider />
-
-      <el-alert title="只显示省市" type="info" />
-      <Region
-        v-model:value="regionIds"
-        :hideArea="true"
-        class="mt-3 Region"
-        labelField="areaName"
-        valueField="areaId"
-        @change="regionChange"
-      />
-      <el-divider />
-
-      <el-alert title="只显示省" type="info" />
-      <Region
-        :onlyProvince="true"
-        class="mt-3 Region"
-        labelField="areaName"
-        valueField="areaId"
-        @change="regionChange"
-      />
-    </el-card>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { ref } from 'vue';
-  import { Region } from '@/components/Region';
-
-  const regionIds = ref([1, 11, 111]);
-
-  //地区变动回调
-  function regionChange(result) {
-    console.log(result);
-  }
-</script>
-
-<style lang="scss">
-  .Region {
-    width: 320px;
-  }
-</style>

src/views/comp/richtext/vue-quill.vue

@@ -1,111 +0,0 @@
-<template>
-  <PageWrapper title="富文本" content="富文本，用于展示图文信息，比如商品详情，文章详情等...">
-    <el-card shadow="never" class="mt-2 proCard">
-      <QuillEditor
-        ref="quillEditor"
-        :options="options"
-        v-model:content="myContent"
-        style="height: 350px"
-        @ready="readyQuill"
-        class="quillEditor"
-      />
-      <el-space>
-        <el-button @click="addText">增加文本</el-button>
-        <el-button @click="addImg">增加图片</el-button>
-        <el-button @click="getHtml">获取HTML</el-button>
-      </el-space>
-    </el-card>
-    <el-card shadow="never" class="mt-3 proCard" title="HTML 内容">
-      <el-input
-        v-model="myContentHtml"
-        type="textarea"
-        placeholder="html"
-        :autosize="{
-          minRows: 3,
-          maxRows: 6,
-        }"
-      />
-    </el-card>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { ref, reactive, onMounted } from 'vue';
-  import { QuillEditor } from '@vueup/vue-quill';
-  import '@vueup/vue-quill/dist/vue-quill.snow.css';
-  const quillEditor = ref();
-  const myContent = ref(
-    '<h4>Naive Ui Admin 是一个基于 vue3,vite2,TypeScript 的中后台解决方案</h4>',
-  );
-  const myContentHtml = ref(
-    '<h4>Naive Ui Admin 是一个基于 vue3,vite2,TypeScript 的中后台解决方案</h4>',
-  );
-
-  const options = reactive({
-    modules: {
-      toolbar: [
-        ['bold', 'italic', 'underline', 'strike'], // toggled buttons
-        ['blockquote', 'code-block'],
-
-        [{ header: 1 }, { header: 2 }], // custom button values
-        [{ list: 'ordered' }, { list: 'bullet' }],
-        [{ script: 'sub' }, { script: 'super' }], // superscript/subscript
-        [{ indent: '-1' }, { indent: '+1' }], // outdent/indent
-        [{ direction: 'rtl' }], // text direction
-
-        [{ size: ['small', false, 'large', 'huge'] }], // custom dropdown
-        [{ header: [1, 2, 3, 4, 5, 6, false] }],
-
-        [{ color: [] }, { background: [] }], // dropdown with defaults from theme
-        [{ font: [] }],
-        [{ align: [] }],
-        ['clean'],
-        ['image'],
-      ],
-    },
-    theme: 'snow',
-    placeholder: '输入您喜欢的内容吧！',
-  });
-
-  function readyQuill() {
-    console.log('Quill准备好了');
-  }
-
-  function getHtml() {
-    myContentHtml.value = getHtmlVal();
-  }
-
-  function addText() {
-    const html = getHtmlVal() + '新增加的内容';
-    quillEditor.value.setHTML(html);
-  }
-
-  function addImg() {
-    const html =
-      getHtmlVal() +
-      '<img style="width:100px" src="https://www.baidu.com/img/flexible/logo/pc/result.png"/>';
-    quillEditor.value.setHTML(html);
-  }
-
-  function getHtmlVal() {
-    return quillEditor.value.getHTML();
-  }
-
-  onMounted(() => {
-    quillEditor.value.setHTML(myContent.value);
-  });
-</script>
-
-<style lang="scss">
-  .ql-toolbar.ql-snow {
-    border-top: none;
-    border-left: none;
-    border-right: none;
-    border-bottom: 1px solid #eee;
-    margin-top: -10px;
-  }
-
-  .ql-container.ql-snow {
-    border: none;
-  }
-</style>

src/views/comp/select/BasicSelect.vue

@@ -1,81 +0,0 @@
-<template>
-  <PageWrapper
-    title="选择器"
-    content="扩展选择器组件，用于各种表单选择器，简化使用，内置缓存，可对相同的数据减少http请求，也可手动刷新数据源"
-  >
-    <el-card :bordered="false" class="mt-3 proCard">
-      <el-alert title="基础使用" type="info">
-        自动加载数据，首次加载缓存，之后同一个KEY不在获取新数据</el-alert
-      >
-      <div class="mt-3">
-        <el-space align="center">
-          <BasicSelect
-            ref="basicSelectRef"
-            v-model="selectValue"
-            :request="loadSelectData"
-            label-field="regionName"
-            value-field="id"
-            @change="handleUpdateValue"
-            cache
-            cacheKey="SELECT_CLASSIFY"
-            ><template #action>如果你点开了这个例子，你可能需要它</template></BasicSelect
-          >
-          <el-button @click="setSelectData">设置选中值</el-button>
-          <el-button @click="getSelectValue">获取选中值</el-button>
-          <el-button @click="getSelectData">获取数据源</el-button>
-          <el-button @click="refreshSelectData">刷新数据</el-button>
-        </el-space>
-      </div>
-    </el-card>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { ref } from 'vue';
-  import { getProvinceList } from '@/api/select/select';
-  import { BasicSelect } from '@/components/Select';
-  import { ElMessage } from 'element-plus';
-
-  const selectValue = ref(3023);
-  const basicSelectRef = ref();
-  const params = {
-    type: 1,
-  };
-
-  async function loadSelectData(res) {
-    //这里可以进行数据转换处理
-    return (await getProvinceList({ ...res, ...params })).map((item, index) => {
-      return {
-        ...item,
-        index,
-        label: item.regionName,
-        value: item.id,
-      };
-    });
-  }
-
-  function handleUpdateValue(value) {
-    selectValue.value = value;
-    ElMessage.success('value: ' + JSON.stringify(value));
-  }
-
-  function refreshSelectData() {
-    basicSelectRef?.value.fetch();
-  }
-
-  function setSelectData() {
-    selectValue.value = 5308;
-  }
-
-  function getSelectValue() {
-    ElMessage.success('value: ' + JSON.stringify(selectValue.value));
-  }
-
-  function getSelectData() {
-    ElMessage.success(
-      'Ids: ' + JSON.stringify(basicSelectRef?.value.getData().map((item) => item.value)),
-    );
-  }
-</script>
-
-<style lang="scss"></style>

src/views/comp/table/CellColumns.ts

@@ -1,88 +0,0 @@
-import { h } from 'vue';
-import { ElAvatar, ElTag } from 'element-plus';
-import type { BasicColumn } from '@/components/Table';
-
-export const columns: BasicColumn[] = [
-  {
-    label: 'id',
-    prop: 'id',
-  },
-  {
-    label: '编码',
-    prop: 'no',
-  },
-  {
-    label: '名称',
-    prop: 'name',
-    editComponent: 'Input',
-    // 默认必填校验
-    editRule: true,
-    edit: true,
-    editCellRender: (value) => {
-      return h(
-        ElTag,
-        {
-          style: {
-            marginRight: '6px',
-          },
-          type: 'info',
-        },
-        {
-          default: () => value,
-        },
-      );
-    },
-  },
-  {
-    label: '头像',
-    prop: 'avatar',
-    render(record) {
-      return h(ElAvatar, {
-        size: 48,
-        src: record.row.avatar,
-        shape: 'square',
-        fit: 'fill',
-      });
-    },
-  },
-  {
-    label: '地址',
-    prop: 'address',
-    editComponent: 'Select',
-    editComponentProps: {
-      options: [
-        {
-          label: '广东省',
-          value: 1,
-        },
-        {
-          label: '浙江省',
-          value: 2,
-        },
-      ],
-    },
-    edit: true,
-  },
-  {
-    label: '开始日期',
-    prop: 'beginTime',
-    edit: true,
-    editComponent: 'DatePicker',
-    editComponentProps: {
-      type: 'datetime',
-      format: 'yyyy-MM-dd HH:mm:ss',
-    },
-  },
-  {
-    label: '结束日期',
-    prop: 'endTime',
-  },
-  {
-    label: '创建时间',
-    prop: 'date',
-  },
-  {
-    label: '停留时间',
-    prop: 'time',
-  },
-];

src/views/comp/table/basic.vue

@@ -1,106 +0,0 @@
-<template>
-  <el-card :bordered="false" class="proCard">
-    <BasicTable
-      title="表格列表"
-      titleTooltip="这是一个提示"
-      :columns="columns"
-      :request="loadDataTable"
-      :row-key="(row) => row.id"
-      ref="tableRef"
-      :actionColumn="actionColumn"
-      @checked-row-change="onCheckedRow"
-    >
-      <template #toolbar>
-        <el-button type="primary" @click="reloadTable">刷新数据</el-button>
-      </template>
-    </BasicTable>
-  </el-card>
-</template>
-
-<script lang="ts" setup>
-  import { reactive, ref, h } from 'vue';
-  import { BasicTable, TableAction } from '@/components/Table';
-  import { getTableList } from '@/api/table/list';
-  import { columns } from './basicColumns';
-  import { ElMessage, ElMessageBox } from 'element-plus';
-
-  const tableRef = ref();
-
-  const params = reactive({
-    pageSize: 5,
-    name: 'xiaoMa',
-  });
-
-  const actionColumn = reactive({
-    width: 170,
-    label: '操作',
-    prop: 'action',
-    fixed: 'right',
-    align: 'center',
-    render(record) {
-      return h(TableAction, {
-        style: 'button',
-        actions: createActions(record),
-      });
-    },
-  });
-
-  function createActions(record) {
-    return [
-      {
-        label: '删除',
-        type: 'danger',
-        onClick: handleDelete.bind(null, record),
-        // 根据业务控制是否显示 isShow 和 auth 是并且关系
-        ifShow: () => {
-          return true;
-        },
-        // 根据权限控制是否显示: 有权限，会显示，支持多个
-        auth: ['basic_list'],
-      },
-      {
-        label: '编辑',
-        type: 'primary',
-        onClick: handleEdit.bind(null, record),
-        ifShow: () => {
-          return true;
-        },
-        auth: ['basic_list'],
-      },
-    ];
-  }
-
-  const loadDataTable = async (res) => {
-    return await getTableList({ ...params, ...res });
-  };
-
-  function onCheckedRow(rowKeys) {
-    console.log(rowKeys);
-  }
-
-  function reloadTable() {
-    tableRef.value.reload();
-  }
-
-  function handleDelete(record) {
-    console.log(record);
-    const { row } = record;
-    ElMessageBox.confirm(`您想删除${row.name}`, '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-      draggable: true,
-    })
-      .then(() => {
-        ElMessage.success('删除成功');
-      })
-      .catch(() => {});
-  }
-
-  function handleEdit(record) {
-    console.log(record);
-    ElMessage.success('您点击了编辑按钮');
-  }
-</script>
-
-<style lang="scss" scoped></style>

src/views/comp/table/basicColumns.ts

@@ -1,66 +0,0 @@
-import { h } from 'vue';
-import { ElAvatar, ElTag } from 'element-plus';
-import type { BasicColumn } from '@/components/Table';
-
-export const columns: BasicColumn[] = [
-  {
-    label: 'id',
-    prop: 'id',
-  },
-  {
-    label: '编码',
-    prop: 'no',
-  },
-  {
-    label: '名称',
-    prop: 'name',
-  },
-  {
-    label: '头像',
-    prop: 'avatar',
-    width: 100,
-    render(record) {
-      return h(ElAvatar, {
-        size: 48,
-        src: record.row.avatar,
-        shape: 'square',
-        fit: 'fill',
-      });
-    },
-  },
-  {
-    label: '地址',
-    prop: 'address',
-  },
-  {
-    label: '开始日期',
-    prop: 'beginTime',
-  },
-  {
-    label: '结束日期',
-    prop: 'endTime',
-  },
-  {
-    label: '状态',
-    prop: 'status',
-    render(record) {
-      return h(
-        ElTag,
-        {
-          type: record.row.status ? 'success' : 'danger',
-        },
-        {
-          default: () => (record.row.status ? '启用' : '禁用'),
-        },
-      );
-    },
-  },
-  {
-    label: '创建时间',
-    prop: 'date',
-  },
-  {
-    label: '停留时间',
-    prop: 'time',
-  },
-];

src/views/comp/table/editCell.vue

@@ -1,69 +0,0 @@
-<template>
-  <el-card :bordered="false" class="proCard">
-    <BasicTable
-      title="表格列表"
-      titleTooltip="这是一个提示"
-      :columns="columns"
-      :request="loadDataTable"
-      :row-key="(row) => row.id"
-      ref="tableRef"
-      @edit-end="editEnd"
-      @edit-change="onEditChange"
-      @checked-row-change="onCheckedRow"
-      :row-props="rowProps"
-    >
-      <template #toolbar>
-        <el-button type="primary" @click="reloadTable">刷新数据</el-button>
-      </template>
-    </BasicTable>
-  </el-card>
-</template>
-
-<script lang="ts" setup>
-  import { reactive, ref } from 'vue';
-  import { BasicTable } from '@/components/Table';
-  import { getTableList } from '@/api/table/list';
-  import { columns } from './CellColumns';
-
-  const tableRef = ref();
-  const params = reactive({
-    pageSize: 5,
-    name: 'xiaoMa',
-  });
-
-  function rowProps(rows) {
-    return {
-      style: 'cursor: pointer;',
-      onclick: function () {
-        console.log('row点击事件触发');
-        console.log(rows);
-      },
-    };
-  }
-
-  function onEditChange({ column, value, record }) {
-    if (column.key === 'id') {
-      record.editValueRefs.name4.value = `${value}`;
-    }
-    console.log(column, value, record);
-  }
-
-  const loadDataTable = async (res) => {
-    return await getTableList({ ...params, ...res });
-  };
-
-  function onCheckedRow(rowKeys) {
-    console.log(rowKeys);
-  }
-
-  function reloadTable() {
-    console.log(tableRef.value);
-    tableRef.value.reload();
-  }
-
-  function editEnd({ value }) {
-    console.log(value);
-  }
-</script>
-
-<style lang="scss" scoped></style>

src/views/comp/table/editRow.vue

@@ -1,117 +0,0 @@
-<template>
-  <el-card :bordered="false" class="proCard">
-    <BasicTable
-      title="表格列表"
-      titleTooltip="这是一个提示"
-      :columns="columns"
-      :request="loadDataTable"
-      :row-key="(row) => row.id"
-      ref="tableRef"
-      :actionColumn="actionColumn"
-      @edit-end="editEnd"
-      @edit-change="onEditChange"
-      @checked-row-change="onCheckedRow"
-      :scroll-x="1590"
-    >
-      <template #toolbar>
-        <el-button type="primary" @click="reloadTable">刷新数据</el-button>
-      </template>
-    </BasicTable>
-  </el-card>
-</template>
-
-<script lang="ts" setup>
-  import { reactive, ref, h } from 'vue';
-  import { BasicTable, TableAction } from '@/components/Table';
-  import { getTableList } from '@/api/table/list';
-  import { columns } from './rowColumns';
-
-  const tableRef = ref();
-  const currentEditKeyRef = ref('');
-  const params = reactive({
-    pageSize: 5,
-    name: 'xiaoMa',
-  });
-
-  const actionColumn = reactive({
-    width: 150,
-    label: '操作',
-    prop: 'action',
-    fixed: 'right',
-    align: 'center',
-    render(record) {
-      return h(TableAction, {
-        style: 'button',
-        actions: createActions(record),
-      });
-    },
-  });
-
-  function handleEdit(record) {
-    console.log(record.row);
-    currentEditKeyRef.value = record.column.prop;
-    record.row.onEdit?.(true);
-  }
-
-  function handleCancel(record) {
-    currentEditKeyRef.value = '';
-    record.row.onEdit?.(false, false);
-  }
-
-  function onEditChange({ column, value, record }) {
-    if (column.key === 'id') {
-      record.editValueRefs.name4.value = `${value}`;
-    }
-    console.log(column, value, record);
-  }
-
-  async function handleSave(record) {
-    const pass = await record.row.onEdit?.(false, true);
-    if (pass) {
-      currentEditKeyRef.value = '';
-    }
-  }
-
-  function createActions(record) {
-    if (!record.row.editable) {
-      return [
-        {
-          label: '编辑',
-          type: 'primary',
-          onClick: handleEdit.bind(null, record),
-        },
-      ];
-    } else {
-      return [
-        {
-          label: '保存',
-          type: 'primary',
-          onClick: handleSave.bind(null, record),
-        },
-        {
-          label: '取消',
-          onClick: handleCancel.bind(null, record),
-        },
-      ];
-    }
-  }
-
-  const loadDataTable = async (res) => {
-    return await getTableList({ ...params, ...res });
-  };
-
-  function onCheckedRow(rowKeys) {
-    console.log(rowKeys);
-  }
-
-  function reloadTable() {
-    console.log(tableRef.value);
-    tableRef.value.reload();
-  }
-
-  function editEnd({ value }) {
-    console.log(value);
-  }
-</script>
-
-<style lang="scss" scoped></style>

src/views/comp/table/rowColumns.ts

@@ -1,93 +0,0 @@
-import { h } from 'vue';
-import { ElAvatar } from 'element-plus';
-import type { BasicColumn } from '@/components/Table';
-
-export const columns: BasicColumn[] = [
-  {
-    label: 'id',
-    prop: 'id',
-  },
-  {
-    label: '编码',
-    prop: 'no',
-  },
-  {
-    label: '名称',
-    prop: 'name',
-    editComponent: 'Input',
-    editRow: true,
-    // 默认必填校验
-    editRule: true,
-    edit: true,
-  },
-  {
-    label: '头像',
-    prop: 'avatar',
-    render(record) {
-      return h(ElAvatar, {
-        size: 48,
-        src: record.row.avatar,
-        shape: 'square',
-        fit: 'fill',
-      });
-    },
-  },
-  {
-    label: '地址',
-    prop: 'address',
-    editRow: true,
-    editComponent: 'Select',
-    editComponentProps: {
-      options: [
-        {
-          label: '广东省',
-          value: 1,
-        },
-        {
-          label: '浙江省',
-          value: 2,
-        },
-      ],
-    },
-    edit: true,
-    width: 200,
-  },
-  {
-    label: '开始日期',
-    prop: 'beginTime',
-    editRow: true,
-    edit: true,
-    width: 260,
-    editComponent: 'DatePicker',
-    editComponentProps: {
-      type: 'datetime',
-      format: 'YYYY-MM-DD HH:mm:ss',
-      valueFormat: 'YYYY-MM-DD HH:mm:ss',
-    },
-  },
-  {
-    label: '结束日期',
-    prop: 'endTime',
-    width: 160,
-  },
-  {
-    label: '状态',
-    prop: 'status',
-    editRow: true,
-    edit: true,
-    editComponent: 'Switch',
-    editValueMap: (value) => {
-      return value ? '启用' : '禁用';
-    },
-  },
-  {
-    label: '创建时间',
-    prop: 'date',
-    width: 160,
-  },
-  {
-    label: '停留时间',
-    prop: 'time',
-    width: 80,
-  },
-];

src/views/comp/tableSelect/basicColumns.ts

@@ -1,32 +0,0 @@
-import { h } from 'vue';
-import { ElAvatar } from 'element-plus';
-import { BasicColumn } from '@/components/Table/index';
-
-export const columns: BasicColumn[] = [
-  {
-    label: 'id',
-    prop: 'id',
-  },
-  {
-    label: '名称',
-    prop: 'name',
-  },
-  {
-    label: '头像',
-    prop: 'avatar',
-    render(record) {
-      return h(ElAvatar, {
-        size: 48,
-        src: record.row.avatar,
-        shape: 'square',
-        fit: 'fill',
-        style: 'width:48px;height:48px',
-        class: 'cursor-pointer',
-      });
-    },
-  },
-  {
-    label: '地址',
-    prop: 'address',
-  },
-];

src/views/comp/tableSelect/tableSelect.vue

@@ -1,117 +0,0 @@
-<template>
-  <PageWrapper
-    title="表格选择器"
-    content="选择器增强，用于展示多列数据表格选择器，可实现单选/多选，还能配置表单查询，项目实测，还是挺实用的"
-  >
-    <el-card :bordered="false" class="mt-3 proCard">
-      <el-alert title="单选" type="info"> 这是一个看起来像多选的单选效果，试试看吧 </el-alert>
-      <div class="mt-3">
-        <el-space align="center">
-          <TableSelect
-            ref="TableSelectRef"
-            labelField="name"
-            valueField="id"
-            placeholder="请选择内容（单选）"
-            :tableProps="{
-              rowKey: 'id',
-              request: loadDataTable,
-              columns: columns,
-            }"
-            @change="tableSelectChange"
-          />
-        </el-space>
-      </div>
-    </el-card>
-
-    <el-card :bordered="false" class="mt-3 proCard">
-      <el-alert title="多选" type="info" class="mt-3">
-        这个看起来，真的像多选，实际也是多选效果哈
-      </el-alert>
-      <div class="mt-3">
-        <el-space align="center">
-          <TableSelect
-            ref="TableSelectRef"
-            labelField="name"
-            valueField="id"
-            placeholder="请选择内容（多选）"
-            :multiple="true"
-            :tableProps="{
-              rowKey: 'id',
-              request: loadDataTable,
-              columns: columns,
-            }"
-            @change="tableSelectChange"
-            @form-values-change="formChange"
-          />
-        </el-space>
-      </div>
-    </el-card>
-
-    <el-card :bordered="false" class="mt-3 proCard">
-      <el-alert title="多选" type="info"> 支持配置表单，搜索查询，多选 </el-alert>
-      <div class="mt-3">
-        <el-space align="center">
-          <TableSelect
-            ref="TableSelectRef"
-            labelField="name"
-            valueField="id"
-            placeholder="请选择内容（多选）"
-            :multiple="true"
-            :formProps="formPropsOption"
-            :tableProps="{
-              rowKey: 'id',
-              request: loadDataTable,
-              columns: columns,
-            }"
-            @change="tableSelectChange"
-            @form-values-change="formChange"
-          />
-        </el-space>
-      </div>
-    </el-card>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { ref } from 'vue';
-  import { TableSelect } from '@/components/TableSelect';
-  import { getTableList } from '@/api/table/list';
-  import { columns } from './basicColumns';
-  import { FormSchema } from '@/components/Form/index';
-
-  const schemas: FormSchema[] = [
-    {
-      field: 'name',
-      labelMessage: '这是一个提示',
-      component: 'Input',
-      label: '名称',
-      componentProps: {
-        placeholder: '请输入名称',
-        onInput: (e: any) => {
-          console.log(e);
-        },
-      },
-      rules: [{ message: '请输入名称', trigger: ['blur'] }],
-    },
-  ];
-
-  const formPropsOption = {
-    layout: 'horizontal',
-    colProps: { span: 12 },
-    schemas,
-  };
-
-  const formParams = ref({});
-
-  const loadDataTable = async (res) => {
-    return await getTableList({ ...formParams.value, ...res });
-  };
-
-  function tableSelectChange(list) {
-    console.log('list', list);
-  }
-
-  function formChange(values) {
-    formParams.value = values;
-  }
-</script>

src/views/comp/upload/index.vue

@@ -1,117 +0,0 @@
-<template>
-  <PageWrapper title="上传图片" content="上传图片，用于向用户收集图片信息">
-    <el-card shadow="never" :bordered="false" class="mt-3 proCard">
-      <el-row :gutter="20" justify="center">
-        <el-col :xs="24" :sm="20" :md="14" :lg="12" :xl="8">
-          <el-form
-            :label-width="80"
-            :model="formValue"
-            :rules="rules"
-            label-placement="left"
-            ref="formRef"
-            class="py-8"
-          >
-            <el-form-item label="预约姓名" prop="name">
-              <el-input v-model="formValue.name" placeholder="输入姓名" />
-            </el-form-item>
-            <el-form-item label="预约号码" prop="mobile">
-              <el-input placeholder="电话号码" v-model="formValue.mobile" />
-            </el-form-item>
-
-            <el-form-item label="病例图片" prop="images">
-              <BasicUpload
-                :action="`${uploadUrl}/api/admin/upload`"
-                :headers="uploadHeaders"
-                :data="{ type: 0 }"
-                v-model:list="fileList"
-                :limit="1"
-                @upload-change="uploadChange"
-                helpText="单个文件不超过2MB，最多只能上传10个文件"
-              />
-            </el-form-item>
-            <el-form-item>
-              <el-space>
-                <el-button type="primary" @click="formSubmit">提交预约</el-button>
-                <el-button @click="resetForm">重置</el-button>
-              </el-space>
-            </el-form-item>
-          </el-form>
-        </el-col>
-      </el-row>
-    </el-card>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { ref, unref, reactive } from 'vue';
-  import { ElMessage } from 'element-plus';
-  import { BasicUpload } from '@/components/Upload';
-  import { useGlobSetting } from '@/hooks/setting';
-  import { FormRules } from 'element-plus';
-
-  const globSetting = useGlobSetting();
-
-  const rules: FormRules = {
-    name: {
-      required: true,
-      message: '请输入预约姓名',
-      trigger: 'blur',
-    },
-    remark: {
-      required: true,
-      message: '请输入预约备注',
-      trigger: 'blur',
-    },
-    images: {
-      required: true,
-      type: 'array',
-      message: '请上传病例图片',
-      trigger: 'change',
-    },
-  };
-
-  const formRef: any = ref(null);
-
-  const { uploadUrl } = globSetting;
-
-  const fileList = ref([
-    // {
-    //   name: 'food.jpeg',
-    //   url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100',
-    // },
-    // {
-    //   name: 'food2.jpeg',
-    //   url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
-    // },
-  ]);
-
-  const formValue = reactive({
-    name: '',
-    mobile: '',
-    //图片列表 通常查看和编辑使用 绝对路径 | 相对路径都可以
-    images: ['https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png'],
-  });
-
-  const uploadHeaders = reactive({
-    authorization: 'Bearer Mvixk4yW3Mes8IJykW30BBJFI0c71233ZqG8PBWT',
-  });
-
-  function formSubmit() {
-    formRef.value.validate((errors) => {
-      if (!errors) {
-        ElMessage.success('验证成功');
-      } else {
-        ElMessage.error('验证成功');
-      }
-    });
-  }
-
-  function resetForm() {
-    formRef.value.restoreValidation();
-  }
-
-  function uploadChange(list: string[]) {
-    console.log('🚀 ~ file: index.vue ~ line 118 ~ uploadChange ~ list', list);
-    formValue.images = unref(list);
-  }
-</script>

src/views/comtemp/search-article/search-article.vue

@@ -1,282 +0,0 @@
-<template>
-  <PageWrapper>
-    <!-- 搜索框 -->
-    <el-card shadow="hover" :bordered="false" class="custom-box-card">
-      <h2 class="text-lg">搜索列表（文章）</h2>
-      <div class="mt-4 text-center">
-        <el-input
-          :style="{ width: '320px' }"
-          v-model="keywords"
-          placeholder="请输入关键字"
-          :prefix-icon="Search"
-        />
-      </div>
-    </el-card>
-
-    <!-- 文章部分 start -->
-    <div class="mt-3 tab1">
-      <el-card shadow="hover" class="custom-box-card">
-        <!-- 分类 -->
-        <div class="p-5">
-          <el-skeleton :rows="1" :loading="loading" style="width: 100%">
-            <template #default>
-              <div class="flex items-start classification justify-between mt-2.5">
-                <div class="flex-none label">分类: </div>
-                <div class="flex-grow">
-                  <el-space wrap size="small" :class="!isCollapse ? 'height-limited' : ''">
-                    <el-tag
-                      size="large"
-                      v-for="(item, index) in categoryListData"
-                      :key="index"
-                      @click="selectedHandle(index)"
-                      :class="categoryIndex != index ? 'noSelected' : ''"
-                      >{{ item.name }}</el-tag
-                    >
-                  </el-space>
-                </div>
-                <div
-                  class="flex items-center justify-end flex-none cursor-pointer collapse-btn"
-                  :style="`color:var(--el-color-primary-light-1)`"
-                  @click="collapseHandle"
-                  >{{ isCollapse ? '收起' : '展开' }}
-                  <el-icon
-                    ><arrow-up-bold class="ml-1" v-if="isCollapse" /><arrow-down-bold
-                      class="ml-1"
-                      v-else /></el-icon
-                ></div>
-              </div>
-            </template>
-          </el-skeleton>
-
-          <div class="flex items-start justify-between mt-4 classification">
-            <div class="flex-none label">作者:</div>
-            <div class="flex-grow">
-              <el-select
-                v-model="selectValue"
-                multiple
-                filterable
-                allow-create
-                default-first-option
-                clearable
-                :reserve-keyword="false"
-                placeholder="请选择"
-                :style="{ width: '320px' }"
-              >
-                <el-option
-                  v-for="item in options"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.value"
-                />
-              </el-select>
-            </div>
-          </div>
-
-          <div class="flex items-start items-center justify-between mt-4 classification">
-            <div class="flex-none label">排序:</div>
-            <div class="flex-grow">
-              <el-radio-group v-model="radio">
-                <el-radio :label="1">最新发表</el-radio>
-                <el-radio :label="2">最多收藏</el-radio>
-                <el-radio :label="3">最多阅读</el-radio>
-              </el-radio-group>
-            </div>
-          </div>
-        </div>
-      </el-card>
-
-      <!-- 文章列表 -->
-      <el-card shadow="hover" class="mt-3 custom-box-card">
-        <ul class="article-list">
-          <li
-            class="flex items-start justify-between"
-            v-for="item in articleListData"
-            :key="item.id"
-          >
-            <div class="left-box">
-              <div>
-                <h3 class="mb-4 text-2xl font-medium">{{ item.title }}</h3>
-                <el-space class="mb-4">
-                  <el-tag v-for="(tag, i) in item.tags" :key="i" type="info">{{ tag }}</el-tag>
-                </el-space>
-                <p class="text-sm leading-6">
-                  {{ item.summary }}
-                </p>
-              </div>
-              <div class="flex items-center mt-2 text-xs" :style="`color:var(--el-color-info)`">
-                <el-avatar :size="24" :src="item.avatar" />
-                <span class="ml-2 mr-1">{{ item.author }}</span
-                >发表于 <span class="ml-1 font-extralight">{{ item.date }}</span>
-              </div>
-              <div class="mt-3 font-extralight">
-                <span
-                  ><el-icon class="mr-1 align-middle"><StarOutlined /></el-icon
-                  ><b class="text-xs">{{ item.collection }}</b></span
-                >
-                <el-divider direction="vertical" />
-                <span
-                  ><el-icon class="mr-1 align-middle"><LikeOutlined /></el-icon
-                  ><b class="text-xs">{{ item.like }}</b></span
-                >
-                <el-divider direction="vertical" />
-                <span
-                  ><el-icon class="mr-1 align-middle"><CommentOutlined /></el-icon
-                  ><b class="text-xs">{{ item.comment }}</b></span
-                >
-              </div>
-            </div>
-            <div class="thumb"><el-image width="100%" :src="item.cover" /></div>
-          </li>
-        </ul>
-      </el-card>
-
-      <!-- 加载更多 -->
-      <el-card shadow="hover" class="mt-3 text-center custom-box-card">
-        <el-button :loading="loadingMore" @click="loadMore">加载更多</el-button>
-      </el-card>
-    </div>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { ref, onMounted } from 'vue';
-  import { Search, ArrowUpBold, ArrowDownBold } from '@element-plus/icons-vue';
-  import { StarOutlined, LikeOutlined, CommentOutlined } from '@vicons/antd';
-  import { categoryList } from '@/api/comtemp/category';
-  import { articleList } from '@/api/comtemp/article';
-
-  const keywords = ref('');
-  const loading = ref(true);
-  const categoryIndex = ref(-1);
-  const isCollapse = ref(false);
-  const categoryListData = ref();
-  const articleListData = ref();
-  const pageSize = ref(5);
-  const loadingMore = ref(false);
-  const selectValue = ref<string[]>([]);
-  const options = [
-    {
-      value: '小马哥',
-      label: '小马哥',
-    },
-    {
-      value: '啊俊',
-      label: '啊俊',
-    },
-    {
-      value: 'Jack',
-      label: 'Jack',
-    },
-    {
-      value: 'Roy',
-      label: 'Roy',
-    },
-  ];
-  const radio = ref(1);
-
-  //获取分类列表
-  async function getCategoryList() {
-    const res = await categoryList();
-    categoryListData.value = res && res.list ? res.list : [];
-    loading.value = false;
-  }
-
-  //分类选中
-  function selectedHandle(index) {
-    categoryIndex.value = index;
-    console.log(categoryIndex.value);
-  }
-
-  //是否展开
-  function collapseHandle() {
-    isCollapse.value = !isCollapse.value;
-  }
-
-  //获取文章列表
-  async function getArticleList() {
-    const res = await articleList({ pageSize: pageSize.value });
-    articleListData.value = res && res.list ? res.list : [];
-    loadingMore.value = false;
-  }
-
-  //加载更多
-  function loadMore() {
-    loadingMore.value = true;
-    pageSize.value = pageSize.value + 5;
-    getArticleList();
-  }
-
-  onMounted(() => {
-    //获取分类
-    getCategoryList();
-    //获取文章
-    getArticleList();
-  });
-</script>
-
-<style lang="scss" scoped>
-  // 卡片定制
-  .custom-box-card {
-    border: none;
-  }
-
-  //分类
-  .classification {
-    .label,
-    .collapse-btn {
-      height: 32px;
-      font-size: 14px;
-      line-height: 30px;
-    }
-    .label {
-      width: 60px;
-    }
-    .collapse-btn {
-      width: 60px;
-    }
-    .height-limited {
-      height: 40px;
-      overflow: hidden;
-    }
-    .el-tag {
-      cursor: pointer;
-    }
-    .el-tag.noSelected {
-      background-color: transparent;
-      border-color: transparent;
-      color: var(--el-color-info-lighter);
-    }
-  }
-
-  //文章
-  .tab1 {
-    // 文章列表
-    .article-list {
-      li {
-        padding: 20px 0;
-        border-bottom: 1px solid var(--el-border-color-base);
-        .left-box {
-          max-width: 800px;
-        }
-        .thumb {
-          max-width: 250px;
-          margin-left: 40px;
-          .arco-image {
-            width: 100%;
-          }
-        }
-      }
-    }
-
-    @media (max-width: 767px) {
-      .article-list {
-        li {
-          flex-wrap: wrap-reverse;
-          .thumb {
-            margin: 0 auto;
-          }
-        }
-      }
-    }
-  }
-</style>

src/views/comtemp/search-make/search-make.vue

@@ -1,283 +0,0 @@
-<template>
-  <PageWrapper>
-    <!-- 搜索框 -->
-    <el-card shadow="hover" :bordered="false" class="custom-box-card">
-      <h2 class="text-lg">搜索列表（预约）</h2>
-      <div class="mt-4 text-center">
-        <el-input
-          :style="{ width: '320px' }"
-          v-model="keywords"
-          placeholder="请输入关键字"
-          :prefix-icon="Search"
-        />
-      </div>
-    </el-card>
-
-    <!-- 预约部分 start -->
-    <div class="mt-3 tab3">
-      <el-card shadow="hover" class="mb-2 custom-box-card">
-        <!-- 分类 -->
-        <div class="p-5">
-          <el-skeleton :rows="1" :loading="loading" style="width: 100%">
-            <template #default>
-              <div class="flex items-start classification justify-between mt-2.5">
-                <div class="flex-none label">分类: </div>
-                <div class="flex-grow">
-                  <el-space wrap size="small" :class="!isCollapse ? 'height-limited' : ''">
-                    <el-tag
-                      size="large"
-                      v-for="(item, index) in categoryListData"
-                      :key="index"
-                      @click="selectedHandle(index)"
-                      :class="categoryIndex != index ? 'noSelected' : ''"
-                      >{{ item.name }}</el-tag
-                    >
-                  </el-space>
-                </div>
-                <div
-                  class="flex items-center justify-end flex-none cursor-pointer collapse-btn"
-                  :style="`color:var(--el-color-primary-light-1)`"
-                  @click="collapseHandle"
-                  >{{ isCollapse ? '收起' : '展开' }}
-                  <el-icon
-                    ><arrow-up-bold class="ml-1" v-if="isCollapse" /><arrow-down-bold
-                      class="ml-1"
-                      v-else /></el-icon
-                ></div>
-              </div>
-            </template>
-          </el-skeleton>
-
-          <div class="flex items-start items-center justify-between mt-4 classification">
-            <div class="flex-none label">排序:</div>
-            <div class="flex-grow">
-              <el-radio-group v-model="radio">
-                <el-radio :label="1">最新</el-radio>
-                <el-radio :label="2">最热</el-radio>
-              </el-radio-group>
-            </div>
-          </div>
-        </div>
-      </el-card>
-
-      <!-- 预约 -->
-      <el-row :gutter="12" class="list">
-        <el-col
-          :xs="12"
-          :sm="8"
-          :md="8"
-          :lg="6"
-          :xl="4"
-          v-for="item in makeListData"
-          :key="item.id"
-        >
-          <el-card shadow="hover" class="custom-box-card card">
-            <div class="flex items-center px-4">
-              <el-avatar :size="40" :src="item.avatar" />
-              <span class="ml-2 text-base">{{ item.doctor }} 医师</span>
-            </div>
-            <dl class="px-4 my-4 c-gray">
-              <dt>科室：{{ item.subject }}</dt>
-              <dd>最后预约时间：{{ item.date }}</dd>
-            </dl>
-            <el-divider />
-            <el-row class="grid-box">
-              <el-col :span="6">
-                <el-tooltip content="查看" placement="top" offset="-5">
-                  <div class="wrap"
-                    ><a
-                      href="https://www.naiveadmin.com/home"
-                      target="_blank"
-                      class="flex items-center justify-center"
-                      ><el-icon><eye-outlined /></el-icon></a
-                  ></div>
-                </el-tooltip>
-              </el-col>
-              <el-col :span="6" class="flex items-center justify-center">
-                <el-tooltip content="导出" placement="top" offset="-5">
-                  <div class="flex items-center justify-center wrap"
-                    ><el-icon><export-outlined class="text-base" /></el-icon
-                  ></div>
-                </el-tooltip>
-              </el-col>
-              <el-col :span="6" class="flex items-center justify-center">
-                <el-tooltip content="编辑" placement="top" offset="-5">
-                  <div class="flex items-center justify-center wrap"
-                    ><el-icon><edit-outlined class="text-base" /></el-icon
-                  ></div>
-                </el-tooltip>
-              </el-col>
-              <el-col :span="6" class="flex items-center justify-center">
-                <el-dropdown trigger="hover">
-                  <div class="flex items-center justify-center wrap"
-                    ><el-icon><delete-outlined class="text-base" /></el-icon
-                  ></div>
-                  <template #dropdown>
-                    <el-dropdown-menu>
-                      <el-dropdown-item>删除</el-dropdown-item>
-                      <el-dropdown-item>隐藏</el-dropdown-item>
-                    </el-dropdown-menu>
-                  </template>
-                </el-dropdown>
-              </el-col>
-            </el-row>
-          </el-card>
-        </el-col>
-      </el-row>
-
-      <!-- 加载更多 -->
-      <el-card shadow="hover" class="mt-3 text-center custom-box-card">
-        <el-button :loading="loadingMore" @click="loadMore">加载更多</el-button>
-      </el-card>
-    </div>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { ref, onMounted } from 'vue';
-  import { Search, ArrowUpBold, ArrowDownBold } from '@element-plus/icons-vue';
-  import { EyeOutlined, ExportOutlined, EditOutlined, DeleteOutlined } from '@vicons/antd';
-  import { categoryList } from '@/api/comtemp/category';
-  import { makeList } from '@/api/comtemp/make';
-
-  const keywords = ref('');
-  const loading = ref(true);
-  const categoryIndex = ref(-1);
-  const isCollapse = ref(false);
-  const categoryListData = ref();
-  const makeListData = ref();
-  const pageSize = ref(12);
-  const loadingMore = ref(false);
-  const radio = ref(1);
-
-  //获取分类列表
-  async function getCategoryList() {
-    const res = await categoryList();
-    categoryListData.value = res && res.list ? res.list : [];
-    loading.value = false;
-  }
-
-  //分类选中
-  function selectedHandle(index) {
-    categoryIndex.value = index;
-  }
-
-  //是否展开
-  function collapseHandle() {
-    isCollapse.value = !isCollapse.value;
-  }
-
-  //获取预约列表
-  async function getMakeList() {
-    const res = await makeList({ pageSize: pageSize.value });
-    makeListData.value = res && res.list ? res.list : [];
-    loadingMore.value = false;
-  }
-
-  //加载更多
-  function loadMore() {
-    loadingMore.value = true;
-    pageSize.value = pageSize.value + 12;
-    getMakeList();
-  }
-
-  onMounted(() => {
-    //获取分类
-    getCategoryList();
-    //获取预约
-    getMakeList();
-  });
-</script>
-
-<style lang="scss" scoped>
-  // 处理栅格
-  .el-row {
-    padding-top: 6px;
-    margin: -6px;
-    .el-row {
-      padding-top: 0;
-    }
-  }
-  .el-col {
-    padding-top: 6px;
-    padding-bottom: 6px;
-  }
-  // 卡片定制
-  .custom-box-card {
-    border: none;
-  }
-
-  //分类
-  .classification {
-    .label,
-    .collapse-btn {
-      height: 32px;
-      font-size: 14px;
-      line-height: 30px;
-    }
-    .label {
-      width: 60px;
-    }
-    .collapse-btn {
-      width: 60px;
-    }
-    .height-limited {
-      height: 40px;
-      overflow: hidden;
-    }
-    .el-tag {
-      cursor: pointer;
-    }
-    .el-tag.noSelected {
-      background-color: transparent;
-      border-color: transparent;
-      color: var(--el-color-info-lighter);
-    }
-  }
-
-  //预约
-  .tab3 {
-    .list {
-      .card :deep(.el-card__body) {
-        padding: 16px 0 0;
-        .el-divider {
-          margin-bottom: 0;
-        }
-        .grid-box {
-          .el-col {
-            height: 60px;
-            padding: 8px 0;
-            .wrap {
-              position: relative;
-              width: 100%;
-              height: 100%;
-              color: var(--el-color-info-light);
-              cursor: pointer;
-              &::before {
-                content: '';
-                position: absolute;
-                right: 0;
-                top: 0;
-                bottom: 0;
-                width: 1px;
-                background-color: var(--el-border-color-base);
-              }
-              a {
-                height: 100%;
-                color: var(--el-color-info-light);
-              }
-            }
-            &:last-child .wrap {
-              &::before {
-                content: none;
-              }
-            }
-          }
-        }
-      }
-      .card:hover {
-        box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 20px;
-      }
-    }
-  }
-</style>

src/views/comtemp/search-video/search-video.vue

@@ -1,223 +0,0 @@
-<template>
-  <PageWrapper>
-    <!-- 搜索框 -->
-    <el-card shadow="hover" :bordered="false" class="custom-box-card">
-      <h2 class="text-lg">搜索列表（视频）</h2>
-      <div class="mt-4 text-center">
-        <el-input
-          :style="{ width: '320px' }"
-          v-model="keywords"
-          placeholder="请输入关键字"
-          :prefix-icon="Search"
-        />
-      </div>
-    </el-card>
-
-    <!-- 视频部分 start -->
-    <div class="mt-3 tab2">
-      <el-card shadow="hover" class="custom-box-card">
-        <!-- 分类 -->
-        <div class="p-5">
-          <el-skeleton :rows="1" :loading="loading" style="width: 100%">
-            <template #default>
-              <div class="flex items-start classification justify-between mt-2.5">
-                <div class="flex-none label">分类: </div>
-                <div class="flex-grow">
-                  <el-space wrap size="small" :class="!isCollapse ? 'height-limited' : ''">
-                    <el-tag
-                      size="large"
-                      v-for="(item, index) in categoryListData"
-                      :key="index"
-                      @click="selectedHandle(index)"
-                      :class="categoryIndex != index ? 'noSelected' : ''"
-                      >{{ item.name }}</el-tag
-                    >
-                  </el-space>
-                </div>
-                <div
-                  class="flex items-center justify-end flex-none cursor-pointer collapse-btn"
-                  :style="`color:var(--el-color-primary-light-1)`"
-                  @click="collapseHandle"
-                  >{{ isCollapse ? '收起' : '展开' }}
-                  <el-icon
-                    ><arrow-up-bold class="ml-1" v-if="isCollapse" /><arrow-down-bold
-                      class="ml-1"
-                      v-else /></el-icon
-                ></div>
-              </div>
-            </template>
-          </el-skeleton>
-
-          <div class="flex items-start items-center justify-between mt-4 classification">
-            <div class="flex-none label">排序:</div>
-            <div class="flex-grow">
-              <el-radio-group v-model="radio">
-                <el-radio :label="1">最新</el-radio>
-                <el-radio :label="2">最热</el-radio>
-                <el-radio :label="3">评分最高</el-radio>
-              </el-radio-group>
-            </div>
-          </div>
-        </div>
-      </el-card>
-
-      <!-- 视频 -->
-      <el-row :gutter="12" class="list">
-        <el-col
-          :xs="12"
-          :sm="8"
-          :md="8"
-          :lg="6"
-          :xl="4"
-          v-for="item in videoListData"
-          :key="item.id"
-        >
-          <el-card shadow="hover" class="custom-box-card">
-            <el-image :src="item.cover" class="cover" />
-            <div class="p-3">
-              <div>
-                <h3 class="text-base font-bold truncate">{{ item.title }}</h3>
-                <p class="my-1 text-gray-500 roy-line-2">简介：{{ item.summary }}</p>
-              </div>
-              <div class="flex items-center justify-between text-gray-400">
-                <div>
-                  <el-icon class="mr-1 align-middle"><video-play /></el-icon>
-                  <span class="text-xs">{{ item.viewingtimes }}万</span></div
-                >
-                <div class="flex items-center justify-center">
-                  <div v-for="(avatar, i) in item.avatargroup" :key="i">
-                    <el-avatar :size="20" :src="avatar.src" />
-                  </div>
-                </div>
-              </div>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-
-      <!-- 加载更多 -->
-      <el-card shadow="hover" class="mt-3 text-center custom-box-card">
-        <el-button :loading="loadingMore" @click="loadMore">加载更多</el-button>
-      </el-card>
-    </div>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { ref, onMounted } from 'vue';
-  import { Search, ArrowUpBold, ArrowDownBold, VideoPlay } from '@element-plus/icons-vue';
-  import { categoryList } from '@/api/comtemp/category';
-  import { videoList } from '@/api/comtemp/video';
-
-  const keywords = ref('');
-  const loading = ref(true);
-  const categoryIndex = ref(-1);
-  const isCollapse = ref(false);
-  const categoryListData = ref();
-  const videoListData = ref();
-  const pageSize = ref(12);
-  const loadingMore = ref(false);
-  const radio = ref(1);
-
-  //获取分类列表
-  async function getCategoryList() {
-    const res = await categoryList();
-    categoryListData.value = res && res.list ? res.list : [];
-    loading.value = false;
-  }
-
-  //分类选中
-  function selectedHandle(index) {
-    categoryIndex.value = index;
-    console.log(categoryIndex.value);
-  }
-
-  //是否展开
-  function collapseHandle() {
-    isCollapse.value = !isCollapse.value;
-  }
-
-  //获取视频列表
-  async function getVideoList() {
-    const res = await videoList({ pageSize: pageSize.value });
-    videoListData.value = res && res.list ? res.list : [];
-    loadingMore.value = false;
-  }
-
-  //加载更多
-  function loadMore() {
-    loadingMore.value = true;
-    pageSize.value = pageSize.value + 12;
-    getVideoList();
-  }
-
-  onMounted(() => {
-    //获取分类
-    getCategoryList();
-    //获取文章
-    getVideoList();
-  });
-</script>
-
-<style lang="scss" scoped>
-  // 处理栅格
-  .el-row {
-    padding-top: 6px;
-    margin: -6px;
-    .el-row {
-      padding-top: 0;
-    }
-  }
-  .el-col {
-    padding-top: 6px;
-    padding-bottom: 6px;
-  }
-  // 卡片定制
-  .custom-box-card {
-    border: none;
-  }
-
-  //分类
-  .classification {
-    .label,
-    .collapse-btn {
-      height: 32px;
-      font-size: 14px;
-      line-height: 30px;
-    }
-    .label {
-      width: 60px;
-    }
-    .collapse-btn {
-      width: 60px;
-    }
-    .height-limited {
-      height: 40px;
-      overflow: hidden;
-    }
-    .el-tag {
-      cursor: pointer;
-    }
-    .el-tag.noSelected {
-      background-color: transparent;
-      border-color: transparent;
-      color: var(--el-color-info-lighter);
-    }
-  }
-
-  //视频
-  .tab2 {
-    .list {
-      margin-top: 0;
-      :deep(.el-card .el-card__body) {
-        padding: 0;
-        p {
-          height: 42px;
-        }
-      }
-      .card:hover {
-        box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 20px;
-      }
-    }
-  }
-</style>

src/views/instation/myalerts/columns.ts

@@ -1,49 +0,0 @@
-import { h } from 'vue';
-import { ElTag } from 'element-plus';
-import { BasicColumn } from '@/components/Table';
-
-const receiveTypeMsg = ['公告', '会议', '其他'];
-
-export const columns: BasicColumn[] = [
-  {
-    label: '标题',
-    prop: 'title',
-    width: 350,
-  },
-  {
-    label: '类型',
-    prop: 'noticeType',
-    render(record) {
-      return h(
-        ElTag,
-        {},
-        {
-          default: () => receiveTypeMsg[record.row.noticeType - 1],
-        },
-      );
-    },
-  },
-  {
-    label: '发送者',
-    prop: 'username',
-  },
-  {
-    label: '发送时间',
-    prop: 'sendTime',
-  },
-  {
-    label: '阅读状态',
-    prop: 'isRead',
-    render(record) {
-      return h(
-        ElTag,
-        {
-          type: record.row.isRead ? 'success' : 'info',
-        },
-        {
-          default: () => (record.row.isRead === 1 ? '已读' : '未读'),
-        },
-      );
-    },
-  },
-];

src/views/instation/myalerts/myalerts.vue

@@ -1,112 +0,0 @@
-<template>
-  <PageWrapper>
-    <el-card :bordered="false" class="mb-3 proCard">
-      <el-space align="center">
-        <el-select
-          style="width: 220px"
-          v-model="params.noticeType"
-          :options="noticeTypeOptions"
-          clearable
-        />
-        <el-button type="primary" @click="reloadTable">
-          <template #icon>
-            <el-icon>
-              <SearchOutlined />
-            </el-icon>
-          </template>
-          查询
-        </el-button>
-      </el-space>
-    </el-card>
-    <el-card :bordered="false" class="proCard">
-      <BasicTable
-        :columns="columns"
-        :request="loadDataTable"
-        :row-key="(row) => row.postId"
-        ref="basicTableRef"
-        :actionColumn="actionColumn"
-        @update:checked-row-keys="onCheckedRow"
-        virtual-scroll
-      />
-    </el-card>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { h, reactive, ref } from 'vue';
-  import { BasicTable, TableAction, BasicColumn } from '@/components/Table';
-  import { myNotice } from '@/api/notice/notice';
-  import { SearchOutlined } from '@vicons/antd';
-  import { columns } from './columns';
-  import { useRouter } from 'vue-router';
-
-  const basicTableRef = ref();
-  const rowKeys = ref([]);
-  const rowKeysName = ref([]);
-  const tableData = ref();
-  const router = useRouter();
-
-  const noticeTypeOptions = ref([
-    {
-      label: '公告',
-      value: 1,
-    },
-    {
-      label: '会议',
-      value: 2,
-    },
-    {
-      label: '其他',
-      value: 3,
-    },
-  ]);
-
-  const params = reactive({
-    noticeType: null,
-  });
-
-  const actionColumn: BasicColumn = reactive({
-    width: 150,
-    title: '操作',
-    key: 'action',
-    fixed: 'right',
-    align: 'center',
-    render(record) {
-      return h(TableAction as any, {
-        actions: [
-          {
-            label: '查看',
-            onClick: handleView.bind(null, record.row),
-          },
-        ],
-      });
-    },
-  });
-
-  const loadDataTable = async (res) => {
-    const result = await myNotice({ ...params, ...res });
-    tableData.value = result.list;
-    return result;
-  };
-
-  function onCheckedRow(keys) {
-    rowKeys.value = keys;
-    rowKeysName.value = tableData.value
-      .filter((item) => {
-        return keys.includes(item.id);
-      })
-      .map((item) => {
-        return item.username;
-      })
-      .join('，');
-  }
-
-  function reloadTable() {
-    basicTableRef.value.reload();
-  }
-
-  function handleView(record) {
-    console.log(record);
-    router.push(`/instation/notice/info/${record.noticeId}`);
-  }
-</script>

src/views/instation/notice/CreateModal.vue

@@ -1,346 +0,0 @@
-<template>
-  <basicModal
-    @register="modalRegister"
-    ref="modalRef"
-    class="basicModal basicFormModal"
-    @ok="okModal"
-  >
-    <template #default>
-      <el-form
-        :model="formParams"
-        :rules="rules"
-        ref="formRef"
-        label-placement="left"
-        :label-width="80"
-        class="mt-6"
-      >
-        <el-form-item label="类型" prop="noticeType">
-          <el-radio-group v-model="formParams.noticeType" name="noticeTypeGroup">
-            <el-space>
-              <el-radio v-for="item in noticeTypeGroup" :key="item.value" :label="item.value">
-                {{ item.label }}
-              </el-radio>
-            </el-space>
-          </el-radio-group>
-        </el-form-item>
-
-        <el-form-item label="标题" prop="title">
-          <el-input placeholder="请输入标题" v-model="formParams.title" />
-        </el-form-item>
-
-        <el-form-item label="内容" prop="content">
-          <div class="editor-container">
-            <Toolbar
-              style="border-bottom: 1px solid #ccc"
-              :editor="editorRef"
-              :defaultConfig="toolbarConfig"
-              :mode="mode"
-            />
-            <Editor
-              style="height: 350px; overflow-y: hidden"
-              v-model="formParams.content"
-              :defaultConfig="editorConfig"
-              :mode="mode"
-              @on-created="handleCreated"
-            />
-          </div>
-        </el-form-item>
-
-        <el-form-item label="接收者" prop="receiveType">
-          <el-radio-group v-model="formParams.receiveType" name="receiveTypeGroup">
-            <el-space>
-              <el-radio v-for="item in receiveTypeGroup" :key="item.value" :label="item.value">
-                {{ item.label }}
-              </el-radio>
-            </el-space>
-          </el-radio-group>
-        </el-form-item>
-
-        <el-form-item label="选择部门" prop="deptIds" v-if="formParams.receiveType === 2">
-          <el-tree-select
-            label-field="deptName"
-            value-field="deptId"
-            key-field="deptId"
-            :data="deptList"
-            multiple
-            clearable
-            v-model="formParams.deptIds"
-            placeholder="请选择部门"
-          />
-        </el-form-item>
-      </el-form>
-    </template>
-    <template #centerFooter>
-      <el-button type="warning" @click="saveDraft">保存草稿</el-button>
-    </template>
-  </basicModal>
-</template>
-
-<script lang="ts" setup>
-  import { onBeforeUnmount, reactive, ref, shallowRef } from 'vue';
-
-  import { ElMessage } from 'element-plus';
-  import type { FormRules } from 'element-plus';
-  import type { formParamsType } from './types';
-  import { deptTreeList } from '@/api/auth/dept';
-  import { basicModal, useModal } from '@/components/Modal';
-  import { addNotice, editNotice, noticeInfo } from '@/api/notice/notice';
-
-  import '@wangeditor/editor/dist/css/style.css'; // 引入 css
-
-  import { Editor, Toolbar } from '@wangeditor/editor-for-vue';
-  import { useUserStoreWidthOut } from '@/store/modules/user';
-  import { useGlobSetting } from '@/hooks/setting';
-  import { replaceParams } from '@/utils/helper/treeHelper';
-
-  const rules: FormRules = {
-    noticeType: {
-      required: true,
-      type: 'number',
-      message: '类型不能为空',
-      trigger: 'blur',
-    },
-    title: {
-      required: true,
-      message: '标题不能为空',
-      trigger: 'blur',
-    },
-    content: {
-      required: true,
-      message: '内容不能为空',
-      trigger: 'blur',
-    },
-    deptIds: {
-      required: true,
-      message: '部门不能为空',
-      trigger: 'change',
-      type: 'array',
-    },
-  };
-
-  const emit = defineEmits(['change', 'register']);
-
-  const props = defineProps({
-    title: {
-      type: String,
-      default: '添加岗位',
-    },
-    width: {
-      type: Number,
-      default: 450,
-    },
-  });
-
-  const noticeTypeGroup = [
-    {
-      value: 1,
-      label: '公告',
-    },
-    {
-      value: 2,
-      label: '会议',
-    },
-    {
-      value: 3,
-      label: '其他',
-    },
-  ];
-
-  const receiveTypeGroup = [
-    {
-      value: 1,
-      label: '全部',
-    },
-    {
-      value: 2,
-      label: '部门',
-    },
-  ];
-
-  const message = ElMessage;
-  const formRef: any = ref(null);
-  const isDrawer = ref(false);
-  const deptList = ref<any[]>();
-  const userStore = useUserStoreWidthOut();
-  const token = userStore.getToken;
-
-  const [modalRegister, { openModal, closeModal, setSubLoading }] = useModal({
-    title: props.title,
-    subBtuText: '发布通知',
-    width: 950,
-  });
-
-  const defaultValueRef = () => ({
-    noticeId: null,
-    deptIds: [],
-    noticeStatus: 1,
-    noticeType: 1,
-    receiveType: 1,
-    content: '',
-    title: '',
-  });
-
-  const formParams = ref<formParamsType>(defaultValueRef());
-
-  // 编辑器实例，必须用 shallowRef
-  const editorRef = shallowRef();
-  const globSetting = useGlobSetting();
-  const mode = ref('default'); // 或 'simple'
-  const { uploadUrl, imgUrl } = globSetting;
-  const uploadHeaders = reactive({
-    satoken: token,
-  });
-
-  // 内容 HTML
-  const valueHtml = ref(formParams.value.content);
-
-  type InsertFnType = (url: string, alt?: string, href?: string) => void;
-
-  const toolbarConfig = {};
-  const editorConfig = reactive({
-    MENU_CONF: {
-      uploadImage: {
-        fieldName: 'file',
-        headers: uploadHeaders,
-        meta: {
-          type: 0,
-        },
-        server: `${uploadUrl}/api/file/do_upload_action`,
-        // 自定义插入图片
-        customInsert(res: any, insertFn: InsertFnType) {
-          // res 即服务端的返回结果
-          // 从 res 中找到 url alt href ，然后插图图片
-          if (res.code === 200) {
-            insertFn(imgUrl + res.data.filePath);
-          }
-        },
-      },
-    },
-    placeholder: '请输入内容...',
-  });
-
-  // 组件销毁时，也及时销毁编辑器
-  onBeforeUnmount(() => {
-    const editor = editorRef.value;
-    if (editor == null) return;
-    editor.destroy();
-  });
-
-  const handleCreated = (editor) => {
-    editorRef.value = editor; // 记录 editor 实例，重要！
-  };
-
-  async function showModal(noticeId?) {
-    const deptResList = await deptTreeList();
-    deptList.value = replaceParams(deptResList, 'deptName', 'deptId');
-    if (noticeId) {
-      formParams.value.noticeId = noticeId;
-      getInfo();
-      return;
-    }
-    openModal();
-  }
-
-  function saveDraft() {
-    formParams.value.noticeStatus = 2;
-    okModal();
-  }
-
-  function okModal() {
-    formRef.value.validate((valid) => {
-      if (!valid) {
-        setSubLoading(false);
-        return message.error('请填写完整信息');
-      }
-
-      const msg = formParams.value.noticeId ? '编辑成功' : '添加成功';
-      if (formParams.value.noticeId) {
-        editNotice(formParams.value)
-          .then((_) => {
-            message.success(msg);
-            setSubLoading(false);
-            emit('change');
-            handleReset();
-            closeModal();
-          })
-          .catch(() => {
-            setSubLoading(false);
-          });
-      } else {
-        addNotice(formParams.value)
-          .then((_) => {
-            message.success(msg);
-            setSubLoading(false);
-            emit('change');
-            handleReset();
-            closeModal();
-          })
-          .catch(() => {
-            setSubLoading(false);
-          });
-      }
-    });
-  }
-
-  function handleReset() {
-    formRef.value.resetFields();
-    formParams.value = Object.assign(formParams.value, defaultValueRef());
-  }
-
-  function getInfo() {
-    noticeInfo({ id: formParams.value.noticeId }).then((res) => {
-      const params = {
-        noticeId: res.noticeId,
-        deptIds: res.deptIds,
-        noticeStatus: res.noticeStatus,
-        noticeType: res.noticeType,
-        receiveType: res.receiveType,
-        title: res.title,
-        content: res.content,
-      };
-      formParams.value = Object.assign(formParams.value, params);
-      isDrawer.value = true;
-      valueHtml.value = res.content;
-    });
-  }
-
-  defineExpose({
-    showModal,
-    closeModal,
-  });
-</script>
-
-<style lang="scss" scoped>
-  .editor-container {
-    border: 1px solid #e5e7eb;
-    z-index: 100;
-    dl,
-    dd,
-    h1,
-    h2,
-    h3,
-    h4,
-    h5,
-    h6,
-    hr,
-    figure,
-    p,
-    pre {
-      margin: revert;
-    }
-    h1,
-    h2,
-    h3,
-    h4,
-    h5,
-    h6 {
-      font-size: revert;
-      font-weight: revert;
-    }
-    ul {
-      list-style: circle;
-      margin: revert;
-      padding: revert;
-    }
-  }
-</style>

src/views/instation/notice/columns.ts

@@ -1,62 +0,0 @@
-import { h } from 'vue';
-import { ElTag } from 'element-plus';
-import { BasicColumn } from '@/components/Table';
-
-const noticeTypeMsg = ['公告', '会议', '其他'];
-const receiveTypeMsg = ['全部', '部门'];
-
-export const columns: BasicColumn[] = [
-  {
-    label: '标题',
-    prop: 'title',
-  },
-  {
-    label: '类型',
-    prop: 'noticeType',
-    render(record) {
-      return h(
-        ElTag,
-        {},
-        {
-          default: () => noticeTypeMsg[record.row.noticeType - 1],
-        },
-      );
-    },
-  },
-  {
-    label: '接收类型',
-    prop: 'receiveType',
-    render(record) {
-      return h(
-        ElTag,
-        {},
-        {
-          default: () => receiveTypeMsg[record.row.noticeType - 1],
-        },
-      );
-    },
-  },
-  {
-    label: '发送者',
-    prop: 'sendName',
-  },
-  {
-    label: '状态',
-    prop: 'noticeStatus',
-    render(record) {
-      return h(
-        ElTag,
-        {
-          type: record.row.noticeStatus === 1 ? 'success' : 'warning',
-        },
-        {
-          default: () => (record.row.noticeStatus === 1 ? '已发' : '草稿'),
-        },
-      );
-    },
-  },
-  {
-    label: '创建时间',
-    prop: 'createDate',
-  },
-];

src/views/instation/notice/info.vue

@@ -1,85 +0,0 @@
-<template>
-  <PageWrapper>
-    <el-card>
-      <h2 class="text-xl text-center">{{ info.title }}</h2>
-      <el-divider />
-      <!-- eslint-disable-next-line vue/no-v-html -->
-      <div class="notice-content" v-html="info.content"></div>
-      <el-divider />
-      <div class="flex items-center">
-        <p depth="3"><span depth="3">发送者：</span> {{ info.sendName }}</p>
-        <el-divider direction="vertical" />
-        <p depth="3"><span>发送时间：</span> {{ info.sendTime }}</p>
-        <el-divider direction="vertical" />
-        <p depth="3"><span>类型：</span> {{ noticeTypeMsg[info.noticeType - 1] }}</p>
-      </div>
-
-      <BasicTable
-        :columns="columns"
-        :request="loadDataTable"
-        :row-key="(row) => row.postId"
-        ref="basicTableRef"
-      />
-    </el-card>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { h, ref, reactive, onMounted } from 'vue';
-  import { noticeInfo, myNotice } from '@/api/notice/notice';
-  import { BasicTable, BasicColumn } from '@/components/Table';
-  import { useRoute } from 'vue-router';
-  import { ElTag } from 'element-plus';
-
-  const route = useRoute();
-  const info = ref<any>({});
-  const tableData = ref();
-  const params = reactive({
-    id: route.params.id,
-  });
-
-  const noticeTypeMsg = ['公告', '会议', '其他'];
-
-  const columns: BasicColumn[] = [
-    {
-      label: '接收者',
-      prop: 'username',
-    },
-    {
-      label: '阅读状态',
-      prop: 'isRead',
-      render(record) {
-        return h(
-          ElTag,
-          {
-            type: record.row.isRead ? 'success' : 'info',
-          },
-          {
-            default: () => (record.row.isRead === 1 ? '已读' : '未读'),
-          },
-        );
-      },
-    },
-    {
-      label: '阅读时间',
-      prop: 'sendTime',
-    },
-  ];
-
-  const loadDataTable = async (res) => {
-    const result = await myNotice({ ...params, ...res });
-    tableData.value = result.list;
-    return result;
-  };
-
-  function getInfo() {
-    const id = route.params && route.params.id;
-    noticeInfo({ id }).then((res) => {
-      info.value = res;
-    });
-  }
-
-  onMounted(() => {
-    getInfo();
-  });
-</script>

src/views/instation/notice/notice.vue

@@ -1,145 +0,0 @@
-<template>
-  <PageWrapper>
-    <el-card :bordered="false" class="mb-3 proCard">
-      <el-space align="center">
-        <el-input
-          :style="{ width: '320px' }"
-          v-model="params.title"
-          clearable
-          placeholder="请输入标题"
-          @keyup.enter="reloadTable"
-        />
-        <el-button type="primary" @click="reloadTable">
-          <template #icon>
-            <el-icon>
-              <SearchOutlined />
-            </el-icon>
-          </template>
-          查询
-        </el-button>
-      </el-space>
-    </el-card>
-    <el-card :bordered="false" class="proCard">
-      <BasicTable
-        :columns="columns"
-        :request="loadDataTable"
-        :row-key="(row) => row.postId"
-        ref="basicTableRef"
-        :actionColumn="actionColumn"
-        @update:checked-row-keys="onCheckedRow"
-        virtual-scroll
-      >
-        <template #tableTitle>
-          <el-space align="center">
-            <el-button type="primary" @click="openCreateDrawer">
-              <template #icon>
-                <el-icon>
-                  <FileAddOutlined />
-                </el-icon>
-              </template>
-              添加
-            </el-button>
-          </el-space>
-        </template>
-      </BasicTable>
-    </el-card>
-
-    <createModal
-      ref="createModalRef"
-      :title="drawerTitle"
-      :roleList="roleData"
-      @change="reloadTable"
-    />
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { h, reactive, ref } from 'vue';
-  import { ElMessage } from 'element-plus';
-  import { BasicTable, TableAction, BasicColumn } from '@/components/Table';
-  import { noticeList, deleteNotice } from '@/api/notice/notice';
-  import { FileAddOutlined, SearchOutlined } from '@vicons/antd';
-  import createModal from './CreateModal.vue';
-  import { columns } from './columns';
-  import { useRouter } from 'vue-router';
-
-  const message = ElMessage;
-  const basicTableRef = ref();
-  const rowKeys = ref([]);
-  const rowKeysName = ref([]);
-  const tableData = ref();
-  const createModalRef = ref();
-  const drawerTitle = ref('添加通知');
-  const roleData = ref([]);
-  const router = useRouter();
-
-  const params = reactive({
-    title: '',
-  });
-
-  const actionColumn: BasicColumn = reactive({
-    width: 150,
-    title: '操作',
-    prop: 'action',
-    fixed: 'right',
-    align: 'center',
-    render(record) {
-      return h(TableAction as any, {
-        actions: [
-          {
-            label: '查看',
-            onClick: handleView.bind(null, record.row),
-          },
-          {
-            label: '删除',
-            isConfirm: true,
-            popConfirm: {
-              onConfirm: handleDelete.bind(null, record.row),
-              title: '您确定要删除吗？',
-              confirmButtonText: '确定',
-              cancelButtonText: '取消',
-            },
-          },
-        ],
-      });
-    },
-  });
-
-  const loadDataTable = async (res) => {
-    const result = await noticeList({ ...params, ...res });
-    tableData.value = result.list;
-    return result;
-  };
-
-  function onCheckedRow(keys) {
-    rowKeys.value = keys;
-    rowKeysName.value = tableData.value
-      .filter((item) => {
-        return keys.includes(item.id);
-      })
-      .map((item) => {
-        return item.username;
-      })
-      .join('，');
-  }
-
-  function reloadTable() {
-    basicTableRef.value.reload();
-  }
-
-  function openCreateDrawer() {
-    const { showModal } = createModalRef.value;
-    showModal();
-  }
-
-  function handleView(record) {
-    router.push(`/instation/notice/info/${record.noticeId}`);
-  }
-
-  function handleDelete(record: Recordable) {
-    deleteNotice({ id: record.postId }).then(() => {
-      message.success('删除成功');
-      reloadTable();
-    });
-  }
-</script>

src/views/instation/notice/types/index.ts

@@ -1,9 +0,0 @@
-export interface formParamsType {
-  noticeId?: number | undefined;
-  deptIds?: number[];
-  content: string;
-  title: string;
-  noticeStatus: number | undefined;
-  noticeType: number | undefined;
-  receiveType: number | undefined;
-}

src/views/login/newLogin.vue

@@ -1,166 +0,0 @@
-<template>
-  <div class="account-root">
-    <div class="account-root-item">
-      <transition name="fade-bottom" appear mode="out-in">
-        <div class="account-root-item-img">
-          <img src="~@/assets/images/login-bg.svg" alt="" />
-        </div>
-      </transition>
-    </div>
-    <div class="account-root-item root-right-item">
-      <transition name="fade-bottom" appear mode="out-in">
-        <div class="account-form">
-          <div class="account-top">
-            <div class="account-top-logo">
-              <img src="~@/assets/images/account-logo.png" alt="" />
-            </div>
-            <div class="account-top-desc">Element plus Admin 中后台前端/设计解决方案</div>
-          </div>
-
-          <el-tabs v-model="tab" class="login-tabs" justify-content="space-evenly">
-            <el-tab-pane name="login" label="登录">
-              <transition name="fade-bottom" appear mode="out-in">
-                <LoginForm ref="LoginFormRef" @go-register="changeGoRegister" />
-              </transition>
-            </el-tab-pane>
-            <el-tab-pane name="register" label="注册">
-              <transition name="fade-bottom" appear mode="out-in">
-                <RegisterForm ref="RegisterFormRef" @back-login="changeBackLogin" />
-              </transition>
-            </el-tab-pane>
-          </el-tabs>
-        </div>
-      </transition>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-  import { ref } from 'vue';
-  import LoginForm from './LoginForm.vue';
-  import RegisterForm from './RegisterForm.vue';
-
-  const tab = ref('login');
-
-  function changeBackLogin() {
-    tab.value = 'login';
-  }
-
-  function changeGoRegister() {
-    tab.value = 'register';
-  }
-</script>
-
-<style lang="scss" scoped>
-  .account-root {
-    box-sizing: border-box;
-    display: flex;
-    flex-flow: row wrap;
-    width: 100%;
-    height: 100vh;
-    justify-content: center;
-
-    &-item {
-      box-sizing: border-box;
-      margin: 0px;
-      flex-direction: row;
-      flex-basis: 100%;
-      flex-grow: 0;
-      max-width: 100%;
-      background: #2d8cf0;
-
-      &-img {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        height: 100%;
-
-        img {
-          width: 70%;
-          display: inline-block;
-          margin: 0 auto;
-        }
-      }
-    }
-
-    .root-right-item {
-      background: #fff;
-      box-sizing: border-box;
-      flex-flow: row wrap;
-      width: 100%;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-
-      .account-form {
-        flex-basis: 45%;
-        flex-grow: 0;
-        max-width: 45%;
-
-        .account-top {
-          text-align: center;
-          margin: 20px 0;
-
-          &-logo {
-            text-align: center;
-
-            img {
-              width: 100%;
-              margin: 0 auto;
-            }
-          }
-
-          &-desc {
-            font-size: 14px;
-            color: #808695;
-          }
-        }
-      }
-    }
-
-    @media (min-width: 600px) {
-      &-item {
-        flex-basis: 100%;
-        flex-grow: 0;
-        max-width: 100%;
-      }
-    }
-
-    @media (min-width: 320px) {
-      .root-right-item {
-        .account-form {
-          flex-basis: 60%;
-          flex-grow: 0;
-          max-width: 60%;
-        }
-      }
-    }
-
-    @media (min-width: 1200px) {
-      &-item {
-        flex-basis: 50%;
-        flex-grow: 0;
-        max-width: 50%;
-      }
-
-      .root-right-item {
-        .account-form {
-          flex-basis: 45%;
-          flex-grow: 0;
-          max-width: 45%;
-        }
-      }
-    }
-  }
-
-  :deep(.login-tabs .el-tabs__nav) {
-    margin-bottom: 10px;
-    width: 100%;
-    display: flex;
-    justify-content: space-around;
-  }
-
-  :deep(.login-tabs .el-tabs__nav-wrap::after) {
-    height: 0;
-  }
-</style>