feat: 设计库表接口,并完成查询和删除接口逻辑

app/controller/navigator.ts

+import { Controller, Context } from 'egg';
+
+export default class NavigatorController extends Controller {
+  public async getNavigatorConfigList(ctx: Context) {
+    // 查询导航配置列表
+    const { pageNo, pageSize, name, author} = ctx.query;
+    try {
+      const list = await ctx.service.navigator.getList(pageNo, pageSize, name, author);
+      ctx.body = ctx.helper.ok(list);
+    } catch (e) {
+      ctx.logger.info(`获取导航配置数据异常, ${JSON.stringify(e)}`);
+      ctx.body = ctx.helper.fail({
+        message: '获取数据异常'
+      });
+    }
+  }
+  // 删除导航配置
+  public async deleteNavigatorConfig(ctx: Context) {
+    const { id } = ctx.request.body;
+    try {
+      await ctx.service.navigator.deleteById(id);
+      ctx.body = ctx.helper.ok({});
+    } catch (e) {
+      ctx.logger.info(`删除导航配置异常, ${JSON.stringify(e)}`);
+      ctx.body = ctx.helper.fail({
+        message: '删除导航配置失败'
+      });
+    }
+  }
+  // 保存导航配置
+  public async saveNavigatorConfig(ctx: Context) {
+    const pageInfo = ctx.request.body;
+    console.log(pageInfo);
+    // ctx.body = ctx.helper.ok(result);
+    ctx.body = 1;
+  }
+}
\ No newline at end of file

app/model/navigatorConfig.ts

+/**
+ * @desc 页面信息表
+ */
+ import { AutoIncrement, Column, DataType, Model, PrimaryKey, Table, AllowNull } from 'sequelize-typescript';
+
+ @Table({
+   modelName: 'navigator_config',
+   freezeTableName: true
+ })
+// 初始化sql
+//  create table navigator_config (
+//   id int(11) primary key auto_increment,
+//    name varchar(255) not null comment '页面名称',
+//    author varchar(255) not null comment '作者',
+//    navigatorData text not null  comment '导航配置数据',
+//   `createdAt` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
+//   `updatedAt` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
+// );
+
+ export class NavigatorConfig extends Model<NavigatorConfig> {
+ 
+   @PrimaryKey
+   @AutoIncrement
+   @Column({
+     type: DataType.INTEGER(11)
+   })
+   id: number;
+ 
+   @Column({
+     field: 'name',
+     type: DataType.STRING(255)
+   })
+   name: string;
+ 
+   @Column({
+     field: 'author',
+     type: DataType.STRING(255)
+   })
+   author: string;
+ 
+   @Column({
+     field: 'navigatorData',
+     type: DataType.TEXT
+   })
+   navigatorData: string;
+ 
+   @Column({
+     type: DataType.DATE,
+     field: 'updatedAt',
+     get() {
+       const moment = require('moment');
+       const updatedAt = this.getDataValue('updatedAt');
+       return moment(updatedAt).format('YYYY-MM-DD HH:mm:ss');
+     },
+   })
+   updatedAt: string;
+ }
+ 
+ export default () => NavigatorConfig;
\ No newline at end of file

app/router.ts

@@ -19,5 +19,11 @@ export default (application: Application) => {
   router.get('/editor/login', controller.editor.login);
   router.get('/editor', controller.editor.home);
   router.get('/editor/*', controller.editor.home);
+
+  // 导航配置相关
+  router.post('/navigator/save', controller.navigator.saveNavigatorConfig);
+  router.get('/navigator/list', controller.navigator.getNavigatorConfigList)
+  router.post('/navigator/delete', controller.navigator.deleteNavigatorConfig)
+
   router.get('/*', controller.editor.home);
 };
\ No newline at end of file

app/service/navigator.ts

+import { Console } from 'console';
+import { Context, Service } from 'egg';
+import { result } from 'lodash';
+
+export default class ArticeService extends Service {
+  private context: Context;
+  constructor(ctx: Context) {
+    super(ctx);
+    this.context = ctx;
+  }
+  // 获取导航列表
+  async getList(pageNo, pageSize, name = '', author = '') {
+    const offset = (+pageNo - 1) * pageSize;;
+    const condition = {
+      author: null,
+      name: null
+    };
+    // 模糊匹配作者
+    if (author) condition.author = author;
+    // 模糊匹配名称
+    if (name) condition.name = name;
+    if (!condition.author) delete condition.author;
+    if (!condition.name) delete condition.name;
+    const res = await this.context.model.NavigatorConfig
+      .findAndCountAll({
+        where: condition,
+        limit: +pageSize,
+        offset
+      })
+    const result = {
+      total: res.count || 0,
+      data: res.rows || []
+    }  
+    return result;
+  }
+  // 删除导航配置
+  async deleteById(id) {
+    const res = await this.context.model.NavigatorConfig.destroy({
+      where: {
+        id
+      }
+    })
+    return res;
+  }
+}

app/web/api/navigator.api.ts

@@ -4,7 +4,10 @@ import config from '../config';
 import axios from 'axios';
 
 export default {
-  getPageList(params) {
-    return http.get('editor/get/list', { params });
+  getList(params) {
+    return http.get('http://localhost:7002/navigator/list', { params });
+  },
+  deleteNavigator(params) {
+    return http.post('http://localhost:7002/navigator/delete', params);
   }
 };
\ No newline at end of file

app/web/config/navigatorCol.config.ts

+// 导航配置列表列名
+export const columns = function(pointer) {
+  return [
+    {
+      align: 'center',
+      title: 'ID',
+      key: 'id',
+      width: 80
+    },
+    {
+      align: 'center',
+      title: '名称',
+      key: 'name'
+    },
+    {
+      align: 'center',
+      title: '所选页面',
+      key: 'pages'
+    },
+    {
+      align: 'center',
+      title: '作者',
+      key: 'author'
+    },
+    {
+      align: 'center',
+      title: '更新时间',
+      key: 'updatedAt'
+    },
+    {
+      align: 'center',
+      title: '操作',
+      key: 'updateTime',
+      render: (h, params) => {
+        const row = params.row;
+        return h('div', [
+          h('Button', {
+            props: {
+              type: 'primary',
+              size: 'small'
+            },
+            style: {
+              marginRight: '5px'
+            },
+            on: {
+              click: () => {
+                pointer.showAddr(row);
+              }
+            }
+          }, '地址列表'),
+          h('Button', {
+            props: {
+              type: 'primary',
+              size: 'small'
+            },
+            style: {
+              marginRight: '5px'
+            },
+            on: {
+              click: () => {
+                pointer.preview(row);
+              }
+            }
+          }, '预览'),
+          h('Button', {
+            props: {
+              type: 'primary',
+              size: 'small'
+            },
+            style: {
+              marginRight: '5px'
+            },
+            on: {
+              click: () => {
+                pointer.edit(row);
+              }
+            }
+          }, '修改'),
+          h('Button', {
+            props: {
+              type: 'error',
+              size: 'small'
+            },
+            on: {
+              click: () => {
+                pointer.delete(row);
+              }
+            }
+          }, '删除'),
+        ]);
+      },
+      width: 300
+    }
+  ];
+};
+
+// 地址列表列明
+export const urlTableColumns = function(pointer) {
+  return [
+    {
+      align: 'center',
+      title: 'ID',
+      key: 'id',
+      width: 80
+    },
+    {
+      align: 'center',
+      title: '所选页面',
+      key: 'name',
+      width: 300
+    },
+    {
+      align: 'center',
+      title: '跳转链接',
+      key: 'pages'
+    },
+  ];
+};
\ No newline at end of file

app/web/page/editor/view/navigator/index.vue

@@ -41,139 +41,68 @@
           @on-page-size-change="changePageSize"
         />
     </div>
+    <Modal v-model="showPagesUrl" title="页面地址列表" width="900">
+        <Table
+          :columns="urlTableColumns"
+          :data="urlTableData"
+          class="tableStyle"
+        />
+        <span slot="footer"></span>
+    </Modal>
   </div>
 </template>
 <script>
+import { columns, urlTableColumns } from '@/config/navigatorCol.config'
+import navigatorApi from '@api/navigator.api'
+
 export default {
   data() {
     return {
+      showPagesUrl: false,
       searchForm: {
         pageSize: 20,
         pageNo: 1,
         name: '',
         author: ''
       },
-      tableData: [
-        {
-          id: 1,
-          name: '测试数据页面',
-          pages: 'aaa',
-          author: '徐光星',
-          updateTime: '2022-04-12',
-        }
-      ],
-      columns: [
-        {
-          align: 'center',
-          title: "ID",
-          key: 'id',
-          width: 80
-        },
-        {
-          align: 'center',
-          title: '名称',
-          key: 'name'
-        },
-        {
-          align: 'center',
-          title: "所选页面",
-          key: 'pages'
-        },
-        {
-          align: 'center',
-          title: "作者",
-          key: 'author'
-        },
-        {
-          align: 'center',
-          title: '更新时间',
-          key: 'updateTime'
-        },
-        {
-          align: 'center',
-          title: '操作',
-          key: 'updateTime',
-          render: (h, params) => {
-            const row = params.row;
-            return h('div', [
-              h('Button', {
-                props: {
-                  type: 'primary',
-                  size: 'small'
-                },
-                style: {
-                  marginRight: '5px'
-                },
-                on: {
-                  click: () => {
-                    this.showAddr(row)
-                  }
-                }
-              }, '地址列表'),
-              h('Button', {
-                props: {
-                  type: 'primary',
-                  size: 'small'
-                },
-                style: {
-                  marginRight: '5px'
-                },
-                on: {
-                  click: () => {
-                    this.preview(row)
-                  }
-                }
-              }, '预览'),
-              h('Button', {
-                props: {
-                  type: 'primary',
-                  size: 'small'
-                },
-                style: {
-                  marginRight: '5px'
-                },
-                on: {
-                  click: () => {
-                    this.edit(row)
-                  }
-                }
-              }, '修改'),
-              h('Button', {
-                props: {
-                  type: 'error',
-                  size: 'small'
-                },
-                on: {
-                  click: () => {
-                    this.delete(row)
-                  }
-                }
-              }, '删除'),
-            ])
-          },
-          width: 300
-        }
-      ],
-      total: 100
+      tableData: [],
+      urlTableData: [],
+      columns: [],
+      urlTableColumns: [],
+      total: 0
     }
   },
+  created() {
+    this.columns = columns(this);
+    this.urlTableColumns = urlTableColumns(this);
+    this.$nextTick(() => {
+      this.query();
+    })
+  },
   methods: {
-    query() {
-      console.log(1);
+    async query() {
+      const res = await navigatorApi.getList(this.searchForm);
+      this.total = res.total || 0;
+      this.tableData = res.data || []
+
     },
     add() {
       console.log(2);
     },
     changePageSize(size) {
       // 变更每页条数
+      this.searchForm.pageNo = 1;
+      this.searchForm.pageSize = size;
       this.query();
     },
     changePageNo(page) {
       // 变更页码
-      this.query(page);
+      this.searchForm.pageNo = page;
+      this.query();
     },
     showAddr(row) {
       // 查看地址列表
+      this.showPagesUrl = true;
       console.log(row);
     },
     preview(row) {
@@ -186,7 +115,17 @@ export default {
     },
     delete(row) {
       // 删除
-      console.log(row);
+      this.$Modal.confirm({
+        title: '提示',
+        content: `是否删除导航 ${row.name}`,
+        onOk: async () => {
+          const deleteRes = await navigatorApi.deleteNavigator({
+            id: row.id
+          });
+          this.$toast('删除成功');
+          this.query();
+        }
+      })
     },
     reset() {
       // 重置表单

typings/app/controller/index.d.ts

@@ -3,9 +3,11 @@
 
 import 'egg';
 import ExportEditor from '../../../app/controller/editor';
+import ExportNavigator from '../../../app/controller/navigator';
 
 declare module 'egg' {
   interface IController {
     editor: ExportEditor;
+    navigator: ExportNavigator;
   }
 }

typings/app/model/index.d.ts

@@ -2,11 +2,13 @@
 // Do not modify this file!!!!!!!!!
 
 import 'egg';
+import ExportNavigatorConfig from '../../../app/model/navigatorConfig';
 import ExportPageInfo from '../../../app/model/pageInfo';
 import ExportTenantAuth from '../../../app/model/tenantAuth';
 
 declare module 'egg' {
   interface IModel {
+    NavigatorConfig: ReturnType<typeof ExportNavigatorConfig>;
     PageInfo: ReturnType<typeof ExportPageInfo>;
     TenantAuth: ReturnType<typeof ExportTenantAuth>;
   }

typings/app/service/index.d.ts

@@ -6,10 +6,12 @@ type AnyClass = new (...args: any[]) => any;
 type AnyFunc<T = any> = (...args: any[]) => T;
 type CanExportFunc = AnyFunc<Promise<any>> | AnyFunc<IterableIterator<any>>;
 type AutoInstanceType<T, U = T extends CanExportFunc ? T : T extends AnyFunc ? ReturnType<T> : T> = U extends AnyClass ? InstanceType<U> : U;
+import ExportNavigator from '../../../app/service/navigator';
 import ExportRedis from '../../../app/service/redis';
 
 declare module 'egg' {
   interface IService {
+    navigator: AutoInstanceType<typeof ExportNavigator>;
     redis: AutoInstanceType<typeof ExportRedis>;
   }
 }