From 242ea9a26ec78e0d2e040402fb04e98d933b138e Mon Sep 17 00:00:00 2001 From: xxm Date: Mon, 10 Oct 2022 18:37:12 +0800 Subject: [PATCH] =?UTF-8?q?feat=20=E6=A0=B7=E5=BC=8F=E4=BC=98=E5=8C=96,=20?= =?UTF-8?q?=E8=A1=A8=E5=8D=95=E7=BC=96=E8=BE=91=E5=BC=80=E5=8F=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- build/vite/plugin/index.ts | 5 +- package.json | 2 +- src/components/Bootx/Query/BQuery.vue | 12 +++-- src/design/components/antdv.less | 13 +++++ src/design/components/global.less | 16 ++++++ src/design/components/index.less | 3 ++ src/design/components/wangEditor.less | 50 +++++++++++++++++++ src/design/index.less | 1 + src/hooks/bootx/useFrom.ts | 37 ++++++++++++++ src/hooks/bootx/useTable.ts | 24 +++++---- src/views/modules/system/client/Client.api.ts | 21 ++++++++ .../modules/system/client/ClientEdit.vue | 39 ++++----------- .../modules/system/client/ClientList.vue | 5 +- types/web.d.ts | 26 +++++++--- yarn.lock | 8 +-- 15 files changed, 201 insertions(+), 61 deletions(-) create mode 100644 src/design/components/antdv.less create mode 100644 src/design/components/global.less create mode 100644 src/design/components/index.less create mode 100644 src/design/components/wangEditor.less create mode 100644 src/hooks/bootx/useFrom.ts diff --git a/build/vite/plugin/index.ts b/build/vite/plugin/index.ts index 2a5bfc47e..0a943fed3 100644 --- a/build/vite/plugin/index.ts +++ b/build/vite/plugin/index.ts @@ -21,7 +21,10 @@ export function createVitePlugins(viteEnv: ViteEnv, isBuild: boolean) { const vitePlugins: (PluginOption | PluginOption[])[] = [ // have to - vue(), + vue({ + // 响应式变量 + reactivityTransform: true, + }), // have to vueJsx(), // support name diff --git a/package.json b/package.json index 86a7e7d26..cffe65281 100644 --- a/package.json +++ b/package.json @@ -41,7 +41,7 @@ "@vueuse/core": "^8.3.0", "@vueuse/shared": "^8.3.0", "@zxcvbn-ts/core": "^2.0.1", - "ant-design-vue": "^3.2.0", + "ant-design-vue": "^3.2.13", "axios": "^0.26.1", "codemirror": "^5.65.3", "cropperjs": "^1.5.12", diff --git a/src/components/Bootx/Query/BQuery.vue b/src/components/Bootx/Query/BQuery.vue index f34d9fb60..74571e5f2 100644 --- a/src/components/Bootx/Query/BQuery.vue +++ b/src/components/Bootx/Query/BQuery.vue @@ -73,10 +73,12 @@ diff --git a/src/design/components/antdv.less b/src/design/components/antdv.less new file mode 100644 index 000000000..94eedf499 --- /dev/null +++ b/src/design/components/antdv.less @@ -0,0 +1,13 @@ + +/* 表单项间隔(小) */ +.mini-from-item { + .ant-form-item { + margin-bottom: 8px; + } +} +/* 表单项间隔(小) */ +.small-from-item { + .ant-form-item { + margin-bottom: 15px; + } +} diff --git a/src/design/components/global.less b/src/design/components/global.less new file mode 100644 index 000000000..d9eab502f --- /dev/null +++ b/src/design/components/global.less @@ -0,0 +1,16 @@ +/* 抽屉样式按钮 */ +.drawer-button { + z-index: 1; + position: absolute; + bottom: 0; + width: 100%; + border-top: 1px solid #e8e8e8; + padding: 10px 16px; + text-align: right; + left: 0; + background: #fff; + border-radius: 0 0 2px 2px; + .ant-btn { + margin-left: 10px; + } +} diff --git a/src/design/components/index.less b/src/design/components/index.less new file mode 100644 index 000000000..79d53f9ba --- /dev/null +++ b/src/design/components/index.less @@ -0,0 +1,3 @@ +@import "antdv.less"; +@import "global.less"; +@import "wangEditor.less"; diff --git a/src/design/components/wangEditor.less b/src/design/components/wangEditor.less new file mode 100644 index 000000000..ef7f50ac3 --- /dev/null +++ b/src/design/components/wangEditor.less @@ -0,0 +1,50 @@ +/* wangEditor start */ +.editor-content-view { + border: 3px solid #ccc; + border-radius: 5px; + padding: 0 10px; + margin-top: 20px; + overflow-x: auto; + blockquote { + border-left: 8px solid #d0e5f2; + padding: 10px 10px; + margin: 10px 0; + background-color: #f1f1f1; + } + code { + font-family: monospace; + background-color: #eee; + padding: 3px; + border-radius: 3px; + } + pre { + & > code { + display: block; + padding: 10px; + } + } + table { + border-collapse: collapse; + } + th { + background-color: #f1f1f1; + } + input[type="checkbox"] { + margin-right: 5px; + } +} +.editor-content-view p, +.editor-content-view li { + white-space: pre-wrap; +} +.editor-content-view td, +.editor-content-view th { + border: 1px solid #ccc; + min-width: 50px; + height: 20px; +} +.editor-content-view ul, +.editor-content-view ol { + padding-left: 20px; +} +/* wangEditor end */ diff --git a/src/design/index.less b/src/design/index.less index 772758691..8af0565dd 100644 --- a/src/design/index.less +++ b/src/design/index.less @@ -3,6 +3,7 @@ @import 'public.less'; @import 'ant/index.less'; @import './theme.less'; +@import './components/index.less'; input:-webkit-autofill { box-shadow: 0 0 0 1000px white inset !important; diff --git a/src/hooks/bootx/useFrom.ts b/src/hooks/bootx/useFrom.ts new file mode 100644 index 000000000..8565c2576 --- /dev/null +++ b/src/hooks/bootx/useFrom.ts @@ -0,0 +1,37 @@ +import { reactive, ref, toRefs } from 'vue' +import { FormType } from '/#/web' + +export default function () { + const model = reactive({ + // 表单项标题文字 + labelCol: { + sm: { span: 7 }, + }, + // 表单项内容 + wrapperCol: { + sm: { span: 13 }, + }, + title: '新增', + modalWidth: '50%', + confirmLoading: false, + visible: false, + editable: false, + addable: false, + showable: false, + type: FormType.Add, + }) + const { labelCol, wrapperCol, title, modalWidth, confirmLoading, visible, editable, addable, showable, type } = toRefs(model) + return { + model, + labelCol, + wrapperCol, + title, + modalWidth, + confirmLoading, + visible, + editable, + addable, + showable, + type, + } +} diff --git a/src/hooks/bootx/useTable.ts b/src/hooks/bootx/useTable.ts index cf7f849d8..b5f308bcf 100644 --- a/src/hooks/bootx/useTable.ts +++ b/src/hooks/bootx/useTable.ts @@ -1,11 +1,11 @@ import { TablePageModel } from '/#/web' -import { reactive, toRefs } from 'vue' +import { reactive, ref, toRefs } from 'vue' import { PageResult } from '/#/axios' /** * 获取数据对象 */ -export default function (queryPageCallback: CallableFunction) { +export default function (queryPageCallback: CallableFunction) { // 数据内容 const model = reactive({ pages: { @@ -13,19 +13,21 @@ export default function (queryPageCallback: CallableFunction) { current: 1, }, queryParam: {}, - loading: false, - batchOperateFlag: false, - superQueryFlag: false, pagination: {}, - } as TablePageModel) + } as TablePageModel) + + // 加载状态 + const loading = ref(false) + // 批量操作标识 + const batchOperateFlag = ref(false) + // 高级查询条件生效状态 + const superQueryFlag = ref(false) - // 拆分 - const { loading, batchOperateFlag, superQueryFlag } = toRefs(model) // 不可以被重新赋值, 否则会失去绑定 const { pages, pagination } = model // 普通查询 function query() { - model.superQueryFlag = false + superQueryFlag.value = false resetPage() queryPageCallback() } @@ -45,7 +47,7 @@ export default function (queryPageCallback: CallableFunction) { pagination.size = Number(res.size) pagination.total = Number(res.total) pagination.records = res.records - model.loading = false + loading.value = false } // 重置查询 function resetQuery() { @@ -54,7 +56,7 @@ export default function (queryPageCallback: CallableFunction) { } // 重置查询参数 function resetQueryParams() { - model.superQueryFlag = false + superQueryFlag.value = false model.queryParam = {} } // ok按钮 diff --git a/src/views/modules/system/client/Client.api.ts b/src/views/modules/system/client/Client.api.ts index 51c00e002..7c4024ec0 100644 --- a/src/views/modules/system/client/Client.api.ts +++ b/src/views/modules/system/client/Client.api.ts @@ -1,5 +1,6 @@ import { defHttp } from '/@/utils/http/axios' import { PageResult, Result } from '/#/axios' +import { BaseEntity } from '/#/web' /** * 分页 @@ -10,3 +11,23 @@ export const page = (params) => { params, }) } + +/** + * 实体类 + */ +// export class Client extends BaseEntity { +// // 编码 +// public code: string +// // 名称 +// name: string +// // 是否系统内置 +// system: boolean +// // 是否可用 +// enable: boolean +// // 关联登录方式 +// loginTypeIds: string +// // 关联登录方式 +// loginTypeIdList: Array +// // 描述 +// description: string +// } diff --git a/src/views/modules/system/client/ClientEdit.vue b/src/views/modules/system/client/ClientEdit.vue index 01441d8bb..ad6510d54 100644 --- a/src/views/modules/system/client/ClientEdit.vue +++ b/src/views/modules/system/client/ClientEdit.vue @@ -8,14 +8,14 @@ :confirmLoading="confirmLoading" > - -