mirror of
https://github.com/cool-team-official/cool-admin-vue.git
synced 2025-12-10 20:02:54 +00:00
优化
This commit is contained in:
神仙都没用
parent
bf19501818
commit
9ac391e723
4
.vscode/crud.code-snippets
vendored
4
.vscode/crud.code-snippets
vendored
@ -33,7 +33,7 @@
|
||||
" </cl-crud>",
|
||||
"</template>",
|
||||
"",
|
||||
"<script lang=\"ts\" name=\"菜单名称\" setup>",
|
||||
"<script lang=\"ts\" name=\"$1\" setup>",
|
||||
"import { useCrud, useTable, useUpsert } from \"@cool-vue/crud\";",
|
||||
"import { useCool } from \"/@/cool\";",
|
||||
"",
|
||||
@ -52,7 +52,7 @@
|
||||
"// cl-crud",
|
||||
"const Crud = useCrud(",
|
||||
" {",
|
||||
" service: service.demo.goods",
|
||||
" service: service$2",
|
||||
" },",
|
||||
" (app) => {",
|
||||
" app.refresh();",
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
"core-js": "^3.38.1",
|
||||
"dayjs": "^1.11.13",
|
||||
"echarts": "^5.5.1",
|
||||
"element-plus": "2.8.4",
|
||||
"element-plus": "2.8.8",
|
||||
"file-saver": "^2.0.5",
|
||||
"lodash-es": "^4.17.21",
|
||||
"marked": "^14.1.3",
|
||||
@ -64,7 +64,7 @@
|
||||
"npm-run-all2": "^6.2.3",
|
||||
"prettier": "^3.3.3",
|
||||
"rollup-plugin-visualizer": "^5.12.0",
|
||||
"sass": "1.77.0",
|
||||
"sass": "1.81.0",
|
||||
"terser": "^5.36.0",
|
||||
"typescript": "~5.5.4",
|
||||
"vite": "^5.4.8",
|
||||
|
||||
12
packages/crud/index.d.ts
vendored
12
packages/crud/index.d.ts
vendored
@ -1,3 +1,4 @@
|
||||
import Mitt from "mitt";
|
||||
// vue
|
||||
declare namespace Vue {
|
||||
interface Ref<T = any> {
|
||||
@ -40,8 +41,8 @@ declare type obj = {
|
||||
declare type DeepPartial<T> = T extends Function
|
||||
? T
|
||||
: T extends object
|
||||
? { [P in keyof T]?: DeepPartial<T[P]> }
|
||||
: T;
|
||||
? { [P in keyof T]?: DeepPartial<T[P]> }
|
||||
: T;
|
||||
|
||||
// 合并
|
||||
declare type Merge<A, B> = Omit<A, keyof B> & B;
|
||||
@ -249,10 +250,7 @@ declare namespace ClCrud {
|
||||
event: {
|
||||
done: fn;
|
||||
next: Service["api"]["page"];
|
||||
render: (
|
||||
list: Response["page"]["list"],
|
||||
pagination?: Response["page"]["pagination"]
|
||||
) => void;
|
||||
render: (data: any | any[], pagination?: Response["page"]["pagination"]) => void;
|
||||
}
|
||||
): void;
|
||||
onDelete(
|
||||
@ -266,6 +264,8 @@ declare namespace ClCrud {
|
||||
interface Ref {
|
||||
"cl-table": ClTable.Ref;
|
||||
"cl-upsert": ClUpsert.Ref;
|
||||
id: number;
|
||||
mitt: Mitt;
|
||||
name: string;
|
||||
routePath: string;
|
||||
permission: Permission;
|
||||
|
||||
@ -70,8 +70,8 @@ export function useHelper({ config, crud, mitt }: Options) {
|
||||
}
|
||||
|
||||
// 渲染
|
||||
function render(list: any[], pagination?: any) {
|
||||
const res = { list, pagination };
|
||||
function render(data: any | any[], pagination?: any) {
|
||||
const res = isArray(data) ? { list: data, pagination } : data;
|
||||
done();
|
||||
success(res);
|
||||
mitt.emit("crud.refresh", res);
|
||||
@ -87,12 +87,15 @@ export function useHelper({ config, crud, mitt }: Options) {
|
||||
}
|
||||
|
||||
if (isArray(res)) {
|
||||
render(res);
|
||||
} else {
|
||||
render(res.list, res.pagination);
|
||||
res = {
|
||||
list: res,
|
||||
pagination: {
|
||||
total: res.length
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
success(res);
|
||||
render(res);
|
||||
resolve(res);
|
||||
})
|
||||
.catch((err) => {
|
||||
|
||||
@ -55,7 +55,9 @@ export default defineComponent({
|
||||
// 字典
|
||||
dict: {},
|
||||
// 权限
|
||||
permission: {}
|
||||
permission: {},
|
||||
// 事件
|
||||
mitt
|
||||
},
|
||||
cloneDeep({ dict, permission })
|
||||
)
|
||||
|
||||
7569
pnpm-lock.yaml
generated
7569
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
@ -1,6 +1,7 @@
|
||||
export const proxy = {
|
||||
'/dev/': {
|
||||
target: 'http://127.0.0.1:8001',
|
||||
target: 'https://show.cool-admin.com/api',
|
||||
// target: 'http://127.0.0.1:8001',
|
||||
changeOrigin: true,
|
||||
rewrite: (path: string) => path.replace(/^\/dev/, '')
|
||||
},
|
||||
|
||||
@ -49,15 +49,15 @@ import { ref } from 'vue';
|
||||
import { useCool } from '/@/cool';
|
||||
|
||||
//【很重要】service 是所有请求的集合，是一个对象（刷新页面和保存代码会自动读取后端的所有接口）
|
||||
const { service } = useCool();
|
||||
const { service, route } = useCool();
|
||||
console.log('service', service);
|
||||
|
||||
// cl-crud 配置
|
||||
const Crud = useCrud(
|
||||
{
|
||||
//【很重要】配置 service，如：service.demo.goods
|
||||
// 不需要到具体的方法，如：service.demo.goods.page，这是错误的！
|
||||
service: service.demo.goods
|
||||
//【很重要】配置 service，如：service.base.sys.user
|
||||
// 不需要到具体的方法，如：service.base.sys.user.page，这是错误的！
|
||||
service: service.base.sys.user
|
||||
|
||||
// 自定义配置1，添加本地 service 文件。
|
||||
// 【很重要】参考 /src/modules/demo/service/test.ts
|
||||
@ -83,7 +83,13 @@ const Crud = useCrud(
|
||||
// }
|
||||
},
|
||||
app => {
|
||||
// 首次调用刷新接口。在弹窗的情况下可以注释，用 Crud.value?.refresh() 方式手动调用
|
||||
app.refresh();
|
||||
|
||||
// 带参数
|
||||
// app.refresh({
|
||||
// userId: route.query.id
|
||||
// });
|
||||
}
|
||||
);
|
||||
|
||||
|
||||
@ -14,7 +14,6 @@
|
||||
<cl-crud ref="Crud">
|
||||
<cl-row>
|
||||
<cl-refresh-btn />
|
||||
<cl-add-btn />
|
||||
<cl-multi-delete-btn />
|
||||
|
||||
<cl-flex1 />
|
||||
@ -53,7 +52,7 @@ const { service } = useCool();
|
||||
// cl-crud 配置
|
||||
const Crud = useCrud(
|
||||
{
|
||||
service: service.demo.goods
|
||||
service: service.base.sys.user
|
||||
},
|
||||
app => {
|
||||
app.refresh();
|
||||
@ -61,8 +60,8 @@ const Crud = useCrud(
|
||||
);
|
||||
|
||||
// cl-table 配置
|
||||
//【很重要】添加类型标注 <Eps.DemoGoodsEntity>，也可以自定义<{ title: string; price: number }>
|
||||
const Table = useTable<Eps.DemoGoodsEntity>({
|
||||
//【很重要】添加类型标注 <Eps.BaseSysUserEntity>，也可以自定义类型
|
||||
const Table = useTable<Eps.BaseSysUserEntity>({
|
||||
autoHeight: false,
|
||||
contextMenu: ['refresh'],
|
||||
|
||||
@ -71,30 +70,22 @@ const Table = useTable<Eps.DemoGoodsEntity>({
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
label: '商品标题',
|
||||
prop: 'title', //【很重要】编辑的时候会提示 DemoGoodsEntity 实体的属性名
|
||||
prop: 'headImg', //【很重要】编辑的时候会提示 BaseSysUserEntity 实体的属性名
|
||||
label: '头像',
|
||||
component: {
|
||||
name: 'cl-avatar'
|
||||
},
|
||||
minWidth: 140
|
||||
},
|
||||
{
|
||||
label: '主图',
|
||||
prop: 'mainImage',
|
||||
minWidth: 140,
|
||||
component: {
|
||||
name: 'cl-image',
|
||||
props: {
|
||||
size: 60
|
||||
}
|
||||
}
|
||||
prop: 'name',
|
||||
label: '姓名',
|
||||
minWidth: 150
|
||||
},
|
||||
{
|
||||
label: '价格',
|
||||
prop: 'price',
|
||||
minWidth: 120
|
||||
},
|
||||
{
|
||||
label: '库存',
|
||||
prop: 'stock',
|
||||
minWidth: 120
|
||||
prop: 'nickName',
|
||||
label: '昵称',
|
||||
minWidth: 150
|
||||
},
|
||||
{
|
||||
label: '创建时间',
|
||||
@ -109,49 +100,40 @@ const Table = useTable<Eps.DemoGoodsEntity>({
|
||||
});
|
||||
|
||||
// cl-upsert 配置
|
||||
//【很重要】添加类型标注 <Eps.DemoGoodsEntity>，也可以自定义<{ title: string; price: number }>
|
||||
const Upsert = useUpsert<Eps.DemoGoodsEntity>({
|
||||
//【很重要】添加类型标注 <Eps.BaseSysUserEntity>，也可以自定义类型
|
||||
const Upsert = useUpsert<Eps.BaseSysUserEntity>({
|
||||
items: [
|
||||
{
|
||||
label: '商品标题',
|
||||
prop: 'title', //【很重要】编辑的时候会提示 DemoGoodsEntity 实体的属性名
|
||||
prop: 'headImg', //【很重要】编辑的时候会提示 BaseSysUserEntity 实体的属性名
|
||||
label: '头像',
|
||||
component: {
|
||||
name: 'cl-upload',
|
||||
props: {
|
||||
text: '选择头像'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: 'name',
|
||||
label: '姓名',
|
||||
span: 12,
|
||||
required: true,
|
||||
component: {
|
||||
name: 'el-input'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '主图',
|
||||
prop: 'mainImage',
|
||||
prop: 'username',
|
||||
label: '用户名',
|
||||
required: true,
|
||||
span: 12,
|
||||
component: {
|
||||
name: 'cl-upload'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '价格',
|
||||
prop: 'price',
|
||||
hook: 'number',
|
||||
component: {
|
||||
name: 'el-input-number',
|
||||
props: {
|
||||
min: 0.01,
|
||||
max: 10000
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '库存',
|
||||
prop: 'stock',
|
||||
component: {
|
||||
name: 'el-input-number',
|
||||
props: {
|
||||
min: 0,
|
||||
max: 1000
|
||||
}
|
||||
name: 'el-input'
|
||||
}
|
||||
}
|
||||
],
|
||||
onSubmit(data, { next }) {
|
||||
// 【很重要】data 的类型也会被定义成 DemoGoodsEntity
|
||||
// 【很重要】data 的类型也会被定义成 BaseSysUserEntity
|
||||
|
||||
next({
|
||||
...data,
|
||||
|
||||
@ -46,7 +46,8 @@ export default ({ mode }: ConfigEnv): UserConfig => {
|
||||
css: {
|
||||
preprocessorOptions: {
|
||||
scss: {
|
||||
charset: false
|
||||
charset: false,
|
||||
api: 'modern-compiler'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user