From 9b393264d09d7997cd020724ed724f551fd684c2 Mon Sep 17 00:00:00 2001
From: icssoa <2570063477@qq.com>
Date: Mon, 29 Mar 2021 09:56:01 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A0=BC=E5=BC=8F=E5=8C=96=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
README.md | 292 +++++++++++++++++++++++++++++++--
src/crud/types/adv-search.d.ts | 2 +-
src/crud/types/upsert.d.ts | 6 +-
3 files changed, 283 insertions(+), 17 deletions(-)
diff --git a/README.md b/README.md
index 747e143..76604df 100644
--- a/README.md
+++ b/README.md
@@ -1,24 +1,290 @@
-# front-next-vue3
+
+ 
+
-## Project setup
-```
-yarn install
+cool-admin 一个很酷的后台权限管理系统，开源免费，模块化、插件化、极速开发 CRUD，方便快速构建迭代后台管理系统， 到论坛 进一步了解
+
+
+ 
+ 
+ 
+
+
+## 演示
+
+[https://show.cool-admin.com](https://show.cool-admin.com)
+
+- 账户：admin
+- 密码：123456
+
+
+
+## 项目后端
+
+[https://github.com/cool-team-official/cool-admin-midway](https://github.com/cool-team-official/cool-admin-midway)
+
+## 微信群
+
+
+
+## 微信公众号
+
+
+
+## 在线社区
+
+[https://bbs.cool-js.com/](https://bbs.cool-js.com/)
+
+## 使用条件
+
+请确保您的操作系统上安装了 Node.js（> = 8.9.0）、@vue/cli （> 3.0.0）。
+
+## 安装项目依赖
+
+推荐使用 `yarn`：
+
+```shell
+yarn
```
-### Compiles and hot-reloads for development
+解决 `node-sass` 网络慢的方法：
+
+```shell
+yarn config set sass-binary-site http://npm.taobao.org/mirrors/node-sass
```
+
+## 运行应用程序
+
+安装过程完成后，运行以下命令启动服务。您可以在浏览器中预览网站 [http://localhost:9000](http://localhost:9000)
+
+```shell
yarn serve
```
-### Compiles and minifies for production
-```
-yarn build
+## 极速 CRUD
+
+1. `vscode` 编辑器下输入关键字 `cl-crud`，会生成对应的模板代码：
+
+```html
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
```
-### Lints and fixes files
-```
-yarn lint
+2. 编辑数据表格 `cl-table`：
+
+```js
+{
+ table: {
+ // 参数与 el-table-column 一致，并支持许多骚操作
+ columns: [
+ // 多选列
+ {
+ type: "selection",
+ width: 60
+ },
+ // 自定义列
+ {
+ label: "昵称",
+ prop: "name"
+ },
+ {
+ label: "账户",
+ prop: "price",
+ sortable: "custom" // 是否添加排序
+ },
+ {
+ label: "状态",
+ prop: "status",
+ // 字典匹配，使用 el-tag 展示
+ dict: [
+ {
+ label: "启用",
+ value: 1,
+ type: "primary"
+ },
+ {
+ label: "禁用",
+ value: 0,
+ type: "danger"
+ }
+ ]
+ },
+ {
+ label: "创建时间",
+ prop: "createTime"
+ },
+ // 操作按钮列，默认包含：编辑、删除
+ {
+ type: "op"
+ }
+ ];
+ }
+}
```
-### Customize configuration
-See [Configuration Reference](https://cli.vuejs.org/config/).
+3. 编辑新增、编辑表单 `cl-upsert`：
+
+```js
+{
+ upsert: {
+ items: [
+ {
+ label: "昵称",
+ prop: "name",
+ // 参数与 el-form-item 一致
+ props: {},
+ value: "神仙都没用", // 昵称默认值
+ // 渲染参数，支持 slot, 组件实例，jsx
+ component: {
+ name: "el-input", // 可以是任意已注册的组件名
+ props: {}, // 组件的参数
+ on: {} // 组件的回调事件
+ },
+ // 验证规则，与 el-form 一致
+ rules: {
+ required: true,
+ message: "昵称不呢为空"
+ }
+ },
+ {
+ label: "存款",
+ prop: "price",
+ component: {
+ name: "el-input-number",
+ props: {
+ min: 0,
+ max: 10000
+ }
+ }
+ },
+ {
+ label: "状态",
+ prop: "status",
+ value: 1,
+ component: {
+ name: "el-radio-group",
+ options: [
+ {
+ label: "启用",
+ value: 1
+ },
+ {
+ label: "禁用",
+ value: 0
+ }
+ ]
+ }
+ }
+ ];
+ }
+}
+```
+
+4. 绑定 `service`。在 `src/service/` 下新建文件 `test.js`，并编辑：
+
+```js
+// src/service/test.js
+import { BaseService, Service, Permission } from "cl-admin";
+
+// 请求接口的路径
+@Service("test")
+class Test extends BaseService {
+ // 继承 BaseService 后，拥有 page, list, add, delete, update, info 6个基本接口
+
+ // 自定义其他接口
+ @Permission("product") // 权限装饰器，可选
+ product(id) {
+ // this.request() 参数与 axios 一致
+ return this.request({
+ url: "/product",
+ method: "POST",
+ data: {
+ id
+ }
+ });
+ }
+}
+
+export default Test;
+```
+
+在 `src/service/` 下的文件，框架会自动根据 `目录结构` 和 `文件名称` 格式化成对应的 `$service` 对象。你现在可以这么使用它：
+
+```js
+this.$service.test.page({ page: 1 });
+this.$service.test.product(1);
+```
+
+`service` 编写好后，我们把它绑定在 `crud` 上：
+
+```js
+export default {
+ methods: {
+ onLoad({ ctx, app }) {
+ // 绑定 service，这边指定到 test 即可
+ ctx.service(this.$service.test).done();
+
+ // 发起 page 请求
+ app.refresh({
+ // 请求默认参数
+ });
+ }
+ }
+};
+```
+
+5. 效果预览
+
+
diff --git a/src/crud/types/adv-search.d.ts b/src/crud/types/adv-search.d.ts
index 1e23eff..35f0790 100644
--- a/src/crud/types/adv-search.d.ts
+++ b/src/crud/types/adv-search.d.ts
@@ -1,3 +1,3 @@
import { FormItem } from "./form";
-export interface AdvSearchItem extends FormItem {}
+export type AdvSearchItem = FormItem;
diff --git a/src/crud/types/upsert.d.ts b/src/crud/types/upsert.d.ts
index 8a0672b..ae31ce7 100644
--- a/src/crud/types/upsert.d.ts
+++ b/src/crud/types/upsert.d.ts
@@ -1,7 +1,7 @@
import { Form, FormItem, FormRef } from "./form";
-export interface UpsertItem extends FormItem {}
+export type UpsertItem = FormItem;
-export interface UpsertRef extends FormRef {}
+export type UpsertRef = FormRef;
-export interface Upsert extends Form {}
+export type Upsert = Form;