cool-admin(midway版)一個(gè)很酷的后臺(tái)權(quán)限管理系統(tǒng)滤否，開源免費(fèi)片择，模塊化、插件化、極速開發(fā)CRUD对省，方便快速構(gòu)建迭代后臺(tái)管理系統(tǒng)，支持serverless犁跪、docker杨帽、普通服務(wù)器等多種方式部署
開源地址
- 后端
https://github.com/cool-team-official/cool-admin-midway
https://gitee.com/cool-team-official/cool-admin-midway
- 前端
https://github.com/cool-team-official/cool-admin-vue
https://gitee.com/cool-team-official/cool-admin-vue
技術(shù)棧
- 后端：
node.jsmidway.jsegg.jsmysqltypescript - 前端：
vue.jselement-uijsxvuexvue-router
如果你是前端，后端的這些技術(shù)選型對(duì)你是特別友好的悠反，前端開發(fā)者可以較快速地上手残黑。
如果你是后端，Typescript的語法又跟java斋否、php等特別類似梨水，一切看起來也是那么得熟悉。
演示
- 賬戶：admin
- 密碼：123456
文檔
項(xiàng)目前端
https://github.com/cool-team-official/cool-admin-vue
QQ群
2群：539478405
微信群
微信公眾號(hào)
運(yùn)行
修改數(shù)據(jù)庫配置茵臭，配置文件位于src/config/config.local.ts
數(shù)據(jù)庫為mysql(>=5.7版本)疫诽，首次啟動(dòng)會(huì)自動(dòng)初始化并導(dǎo)入數(shù)據(jù)
config.orm = {
type: 'mysql',
host: '127.0.0.1',
port: 3306,
username: 'root',
password: '',
database: 'cool-admin',
synchronize: true,
logging: true,
}
安裝依賴并運(yùn)行
$ npm i
$ npm run dev
$ open http://localhost:8001/
注： 如果你的網(wǎng)絡(luò)不佳可以嘗試使用cnpm，或者切換您的鏡像源
CURD(快速增刪改查)
大部分的后臺(tái)管理系統(tǒng)旦委，或者API服務(wù)都是對(duì)數(shù)據(jù)進(jìn)行管理奇徒，所以可以看到大量的CRUD場(chǎng)景(增刪改查)，cool-admin對(duì)此進(jìn)行了大量地封裝缨硝，讓這塊的編碼量變得極其地少摩钙。
新建一個(gè)數(shù)據(jù)表
src/modules/demo/entity/goods.ts，項(xiàng)目啟動(dòng)數(shù)據(jù)庫會(huì)自動(dòng)創(chuàng)建該表查辩，無需手動(dòng)創(chuàng)建
import { EntityModel } from '@midwayjs/orm';
import { BaseEntity } from 'midwayjs-cool-core';
import { Column } from 'typeorm';
/**
* 商品
*/
@EntityModel('demo_app_goods')
export class DemoAppGoodsEntity extends BaseEntity {
@Column({ comment: '標(biāo)題' })
title: string;
@Column({ comment: '圖片' })
pic: string;
@Column({ comment: '價(jià)格', type: 'decimal', precision: 5, scale: 2 })
price: number;
}
編寫api接口
src/modules/demo/controller/app/goods.ts胖笛，快速編寫6個(gè)api接口
import { Provide } from '@midwayjs/decorator';
import { CoolController, BaseController } from 'midwayjs-cool-core';
import { DemoAppGoodsEntity } from '../../entity/goods';
/**
* 商品
*/
@Provide()
@CoolController({
api: ['add', 'delete', 'update', 'info', 'list', 'page'],
entity: DemoAppGoodsEntity
})
export class DemoAppGoodsController extends BaseController {
/**
* 其他接口
*/
@Get('/other')
async other() {
return this.ok('hello, cool-admin!!!');
}
}
這樣我們就完成了6個(gè)接口的編寫，對(duì)應(yīng)的接口如下：
-
POST /app/demo/goods/add新增 -
POST /app/demo/goods/delete刪除 -
POST /app/demo/goods/update更新 -
GET /app/demo/goods/info單個(gè)信息 -
POST /app/demo/goods/list列表信息 -
POST /app/demo/goods/page分頁查詢(包含模糊查詢宜肉、字段全匹配等)
部署
$ npm start
$ npm stop
內(nèi)置指令
- 使用
npm run lint來做代碼風(fēng)格檢查匀钧。 - 使用
npm test來執(zhí)行單元測(cè)試。
