src/app/view/admin/test-common-table/test-common-table.component.html

@@ -0,0 +1 @@
+<app-common-table [data]="data" [request]="req"></app-common-table>

src/app/view/admin/test-common-table/test-common-table.component.ts

@@ -0,0 +1,70 @@
+import {Component, OnInit} from '@angular/core';
+import {Data} from '../components/common-table/data';
+import {Article} from '../../../class/Article';
+import {RequestObj} from "../../../class/HttpReqAndResp";
+
+@Component({
+    selector: 'app-test-common-table',
+    templateUrl: './test-common-table.component.html',
+    styleUrls: ['./test-common-table.component.less']
+})
+export class TestCommonTableComponent implements OnInit {
+
+    /*
+    * author: {id: 1, email: "a@celess.cn", displayName: "禾几海",…}
+category: "前端"
+dislikeCount: 0
+id: 1293
+likeCount: 0
+open: true
+original: true
+publishDateFormat: "2020-03-17 01:22:35"
+readingNumber: 234
+summary:    a
+tags: [{id: 26, name: "脚本"}, {id: 27, name: "网课"}]
+title: "教你动手写一个刷课脚本"
+updateDateFormat: "2020-05-27 00:55:05"*/
+    constructor() {
+        this.data = [
+            {fieldName: '主键', fieldValue: 'id', show: false},
+            {fieldName: '标题', fieldValue: 'title', show: true},
+            {fieldName: '标签', fieldValue: 'category', show: true},
+            {fieldName: '👎数', fieldValue: 'dislikeCount', show: true},
+            {fieldName: '👍数', fieldValue: 'likeCount', show: true},
+            {fieldName: '状态', fieldValue: 'open', show: true},
+            {fieldName: '简介', fieldValue: 'summary', show: false},
+            {
+                fieldName: '操作', fieldValue: '', show: true, isActionColumns: true,
+                action: [
+                    {
+                        name: '新增',
+                        click: (d) => console.log('新增', d)
+                    }, {
+                        name: '删除',
+                        color: '#ff0000',
+                        click: (d) => console.log('删除', d)
+                    }, {
+                        name: '编辑',
+                        color: 'blue',
+                        click: (d) => console.log('编辑', d)
+                    },
+                ]
+            }
+        ]
+    }
+
+    data: Data<Article>[];
+    req: RequestObj;
+
+    ngOnInit(): void {
+        this.req = {
+            path: '/admin/articles',
+            method: 'GET',
+            queryParam: {
+                page: 1,
+                count: 10
+            }
+        }
+    }
+
+}

src/app/view/admin/test-common-table/test-common-table.module.ts

@@ -0,0 +1,17 @@
+import {NgModule} from '@angular/core';
+import {CommonModule} from '@angular/common';
+import {TestCommonTableComponent} from './test-common-table.component';
+import {Router, RouterModule} from '@angular/router';
+import {CommonTableModule} from "../components/common-table/common-table.module";
+
+
+@NgModule({
+    declarations: [TestCommonTableComponent],
+    imports: [
+        CommonModule,
+        RouterModule.forChild([{path: '', component: TestCommonTableComponent}]),
+        CommonTableModule
+    ]
+})
+export class TestCommonTableModule {
+}