From 0f5ddbf1ec777fc238a94bd037d37ea787316757 Mon Sep 17 00:00:00 2001 From: JinMao Date: Fri, 27 Aug 2021 05:51:58 +0800 Subject: [PATCH 01/54] feat: add CardList component --- src/components/CardList/index.ts | 4 + src/components/CardList/src/CardList.vue | 185 +++++++++++++++++++++++ src/components/CardList/src/data.ts | 25 +++ src/locales/lang/en/routes/demo.ts | 1 + src/locales/lang/zh-CN/routes/demo.ts | 1 + src/router/routes/modules/demo/comp.ts | 8 + src/views/demo/comp/card-list/index.vue | 32 ++++ 7 files changed, 256 insertions(+) create mode 100644 src/components/CardList/index.ts create mode 100644 src/components/CardList/src/CardList.vue create mode 100644 src/components/CardList/src/data.ts create mode 100644 src/views/demo/comp/card-list/index.vue diff --git a/src/components/CardList/index.ts b/src/components/CardList/index.ts new file mode 100644 index 000000000..b977c1b16 --- /dev/null +++ b/src/components/CardList/index.ts @@ -0,0 +1,4 @@ +import { withInstall } from '/@/utils'; +import cardList from './src/CardList.vue'; + +export const CardList = withInstall(cardList); diff --git a/src/components/CardList/src/CardList.vue b/src/components/CardList/src/CardList.vue new file mode 100644 index 000000000..798d10ab9 --- /dev/null +++ b/src/components/CardList/src/CardList.vue @@ -0,0 +1,185 @@ + + diff --git a/src/components/CardList/src/data.ts b/src/components/CardList/src/data.ts new file mode 100644 index 000000000..ac56cad91 --- /dev/null +++ b/src/components/CardList/src/data.ts @@ -0,0 +1,25 @@ +import { ref } from 'vue'; +//每行个数 +export const grid = ref(12); +// slider属性 +export const useSlider = (min = 6, max = 12) => { + // 每行显示个数滑动条 + const getMarks = () => { + const l = {}; + for (let i = min; i < max + 1; i++) { + l[i] = { + style: { + color: '#fff', + }, + label: i, + }; + } + return l; + }; + return { + min, + max, + marks: getMarks(), + step: 1, + }; +}; diff --git a/src/locales/lang/en/routes/demo.ts b/src/locales/lang/en/routes/demo.ts index 5fb7950d3..6941314fb 100644 --- a/src/locales/lang/en/routes/demo.ts +++ b/src/locales/lang/en/routes/demo.ts @@ -45,6 +45,7 @@ export default { time: 'Relative Time', cropperImage: 'Cropper Image', + cardList: 'Card List', }, editor: { editor: 'Editor', diff --git a/src/locales/lang/zh-CN/routes/demo.ts b/src/locales/lang/zh-CN/routes/demo.ts index f3d439a81..4cadfd9ba 100644 --- a/src/locales/lang/zh-CN/routes/demo.ts +++ b/src/locales/lang/zh-CN/routes/demo.ts @@ -44,6 +44,7 @@ export default { time: '相对时间', cropperImage: '图片裁剪', + cardList: '卡片列表', }, editor: { editor: '编辑器', diff --git a/src/router/routes/modules/demo/comp.ts b/src/router/routes/modules/demo/comp.ts index c7648ba7f..88e219934 100644 --- a/src/router/routes/modules/demo/comp.ts +++ b/src/router/routes/modules/demo/comp.ts @@ -534,6 +534,14 @@ const comp: AppRouteModule = { title: t('routes.demo.comp.loading'), }, }, + { + path: 'cardList', + name: 'CardListDemo', + component: () => import('/@/views/demo/comp/card-list/index.vue'), + meta: { + title: t('routes.demo.comp.cardList'), + }, + }, ], }; diff --git a/src/views/demo/comp/card-list/index.vue b/src/views/demo/comp/card-list/index.vue new file mode 100644 index 000000000..f13af04cd --- /dev/null +++ b/src/views/demo/comp/card-list/index.vue @@ -0,0 +1,32 @@ + + From 628e820684ce5d81f130548505efe83e8d516131 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=97=A0=E6=9C=A8?= Date: Fri, 27 Aug 2021 08:55:38 +0800 Subject: [PATCH 02/54] fix(card-list): fixed build error MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 修复CardList组件造成的build错误 --- src/components/CardList/src/CardList.vue | 23 ++++++++--------------- 1 file changed, 8 insertions(+), 15 deletions(-) diff --git a/src/components/CardList/src/CardList.vue b/src/components/CardList/src/CardList.vue index 798d10ab9..310bed89f 100644 --- a/src/components/CardList/src/CardList.vue +++ b/src/components/CardList/src/CardList.vue @@ -4,8 +4,8 @@ {{ sliderProp.width }} -
+ -
+ + diff --git a/src/components/Tree/src/props.ts b/src/components/Tree/src/props.ts index 287d2f958..faa5c03f7 100644 --- a/src/components/Tree/src/props.ts +++ b/src/components/Tree/src/props.ts @@ -80,10 +80,17 @@ export const basicProps = { >, default: null, }, + // 高亮搜索值,仅高亮具体匹配值(通过title)值为true时使用默认色值,值为#xxx时使用此值替代且高亮开启 + highlight: { + type: [Boolean, String] as PropType, + default: false, + }, // 搜索完成时自动展开结果 expandOnSearch: propTypes.bool.def(false), // 搜索完成自动选中所有结果,当且仅当 checkable===true 时生效 checkOnSearch: propTypes.bool.def(false), + // 搜索完成自动select所有结果 + selectedOnSearch: propTypes.bool.def(false), }; export const treeNodeProps = { From 59a90877287a289f746eec97d12c2d3a1d5476b0 Mon Sep 17 00:00:00 2001 From: frezs Date: Mon, 6 Sep 2021 09:14:12 +0800 Subject: [PATCH 11/54] =?UTF-8?q?feat(table):=20=20=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E5=92=8C=E6=94=AF=E6=8C=81=E5=8A=A8=E6=80=81=E5=88=A0=E9=99=A4?= =?UTF-8?q?=E5=92=8C=E6=8F=92=E5=85=A5=E6=95=B0=E6=8D=AE=20(#1152)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Table/src/BasicTable.vue | 4 +++ .../Table/src/hooks/useDataSource.ts | 27 +++++++++++++++++++ src/components/Table/src/hooks/useTable.ts | 6 +++++ src/components/Table/src/types/table.ts | 2 ++ 4 files changed, 39 insertions(+) diff --git a/src/components/Table/src/BasicTable.vue b/src/components/Table/src/BasicTable.vue index b584e73d3..1b74089ad 100644 --- a/src/components/Table/src/BasicTable.vue +++ b/src/components/Table/src/BasicTable.vue @@ -141,6 +141,8 @@ getRawDataSource, setTableData, updateTableDataRecord, + deleteTableDataRecord, + insertTableDataRecord, findTableDataRecord, fetch, getRowKey, @@ -279,6 +281,8 @@ setPagination, setTableData, updateTableDataRecord, + deleteTableDataRecord, + insertTableDataRecord, findTableDataRecord, redoHeight, setSelectedRowKeys, diff --git a/src/components/Table/src/hooks/useDataSource.ts b/src/components/Table/src/hooks/useDataSource.ts index 03c6a8949..60abceb0c 100644 --- a/src/components/Table/src/hooks/useDataSource.ts +++ b/src/components/Table/src/hooks/useDataSource.ts @@ -160,6 +160,31 @@ export function useDataSource( } } + function deleteTableDataRecord(record: Recordable | Recordable[]): Recordable | undefined { + if (!dataSourceRef.value || dataSourceRef.value.length == 0) return; + const records = !Array.isArray(record) ? [record] : record; + const recordIndex = records + .map((item) => dataSourceRef.value.findIndex((s) => s.key === item.key)) // 取序号 + .filter((item) => item !== undefined) + .sort((a, b) => b - a); // 从大到小排序 + for (const index of recordIndex) { + unref(dataSourceRef).splice(index, 1); + unref(propsRef).dataSource?.splice(index, 1); + } + setPagination({ + total: unref(propsRef).dataSource?.length, + }); + return unref(propsRef).dataSource; + } + + function insertTableDataRecord(record: Recordable, index: number): Recordable | undefined { + if (!dataSourceRef.value || dataSourceRef.value.length == 0) return; + index = index ?? dataSourceRef.value?.length; + unref(dataSourceRef).splice(index, 0, record); + unref(propsRef).dataSource?.splice(index, 0, record); + return unref(propsRef).dataSource; + } + function findTableDataRecord(rowKey: string | number) { if (!dataSourceRef.value || dataSourceRef.value.length == 0) return; @@ -314,6 +339,8 @@ export function useDataSource( reload, updateTableData, updateTableDataRecord, + deleteTableDataRecord, + insertTableDataRecord, findTableDataRecord, handleTableChange, }; diff --git a/src/components/Table/src/hooks/useTable.ts b/src/components/Table/src/hooks/useTable.ts index 2a3377f75..26139fe6f 100644 --- a/src/components/Table/src/hooks/useTable.ts +++ b/src/components/Table/src/hooks/useTable.ts @@ -122,6 +122,12 @@ export function useTable(tableProps?: Props): [ updateTableData: (index: number, key: string, value: any) => { return getTableInstance().updateTableData(index, key, value); }, + deleteTableDataRecord: (record: Recordable | Recordable[]) => { + return getTableInstance().deleteTableDataRecord(record); + }, + insertTableDataRecord: (record: Recordable | Recordable[], index?: number) => { + return getTableInstance().insertTableDataRecord(record, index); + }, updateTableDataRecord: (rowKey: string | number, record: Recordable) => { return getTableInstance().updateTableDataRecord(rowKey, record); }, diff --git a/src/components/Table/src/types/table.ts b/src/components/Table/src/types/table.ts index 2cf32ec4f..7660b0fc2 100644 --- a/src/components/Table/src/types/table.ts +++ b/src/components/Table/src/types/table.ts @@ -95,6 +95,8 @@ export interface TableActionType { setPagination: (info: Partial) => void; setTableData: (values: T[]) => void; updateTableDataRecord: (rowKey: string | number, record: Recordable) => Recordable | void; + deleteTableDataRecord: (record: Recordable | Recordable[]) => Recordable | void; + insertTableDataRecord: (record: Recordable, index?: number) => Recordable | void; findTableDataRecord: (rowKey: string | number) => Recordable | void; getColumns: (opt?: GetColumnsParams) => BasicColumn[]; setColumns: (columns: BasicColumn[] | string[]) => void; From 044e2e4e866dd5b120daab03c47aba1ca1f9140a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=97=A0=E6=9C=A8?= Date: Mon, 6 Sep 2021 20:12:48 +0800 Subject: [PATCH 12/54] fix(table): `rowClassName` not worked with `striped` MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 修复rowClassName属性无法和striped同时生效的问题 fixed: #1167 --- CHANGELOG.zh_CN.md | 1 + src/components/Table/src/hooks/useTableStyle.ts | 9 ++++++--- src/components/Table/src/types/table.ts | 4 ++-- 3 files changed, 9 insertions(+), 5 deletions(-) diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md index a297bdb7b..54142c3bf 100644 --- a/CHANGELOG.zh_CN.md +++ b/CHANGELOG.zh_CN.md @@ -4,6 +4,7 @@ - **BasicTable** - 单元格编辑新增提交回调,将根据回调函数返回的结果来决定是否将数据提交到表格 - 行编辑添加校验方法,允许只校验而不提交值,以便异步保存数据成功后才提交倒表格 + - 修复`rowClassName`属性无法和`striped`同时使用的问题 ### 🐛 Bug Fixes diff --git a/src/components/Table/src/hooks/useTableStyle.ts b/src/components/Table/src/hooks/useTableStyle.ts index 77783e6f2..292187d88 100644 --- a/src/components/Table/src/hooks/useTableStyle.ts +++ b/src/components/Table/src/hooks/useTableStyle.ts @@ -6,11 +6,14 @@ import { isFunction } from '/@/utils/is'; export function useTableStyle(propsRef: ComputedRef, prefixCls: string) { function getRowClassName(record: TableCustomRecord, index: number) { const { striped, rowClassName } = unref(propsRef); - if (!striped) return; + const classNames: string[] = []; + if (striped) { + classNames.push((index || 0) % 2 === 1 ? `${prefixCls}-row__striped` : ''); + } if (rowClassName && isFunction(rowClassName)) { - return rowClassName(record); + classNames.push(rowClassName(record, index)); } - return (index || 0) % 2 === 1 ? `${prefixCls}-row__striped` : ''; + return classNames.filter((cls) => !!cls).join(' '); } return { getRowClassName }; diff --git a/src/components/Table/src/types/table.ts b/src/components/Table/src/types/table.ts index 7660b0fc2..f9df66cf3 100644 --- a/src/components/Table/src/types/table.ts +++ b/src/components/Table/src/types/table.ts @@ -25,7 +25,7 @@ export interface TableRowSelection extends ITableRowSelection { /** * Callback executed when select/deselect one row - * @type FunctionT + * @type Function */ onSelect?: (record: T, selected: boolean, selectedRows: Object[], nativeEvent: Event) => any; @@ -291,7 +291,7 @@ export interface BasicTableProps { * Row's className * @type Function */ - rowClassName?: (record: TableCustomRecord) => string; + rowClassName?: (record: TableCustomRecord, index: number) => string; /** * Row selection config From 83c1683bfdcf4ea33de771895b46e41f276969e8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=97=A0=E6=9C=A8?= Date: Mon, 6 Sep 2021 20:36:19 +0800 Subject: [PATCH 13/54] feat(demo): add `JsonPreview` demo MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 添加JsonPreview组件的使用演示 close: #1146 --- src/views/demo/editor/json/index.vue | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/src/views/demo/editor/json/index.vue b/src/views/demo/editor/json/index.vue index 622da81bd..ada1d5b38 100644 --- a/src/views/demo/editor/json/index.vue +++ b/src/views/demo/editor/json/index.vue @@ -14,8 +14,8 @@ + + diff --git a/src/views/demo/editor/markdown/index.vue b/src/views/demo/editor/markdown/index.vue index 56a5f5f04..968bd9106 100644 --- a/src/views/demo/editor/markdown/index.vue +++ b/src/views/demo/editor/markdown/index.vue @@ -1,22 +1,30 @@ From 2346a90c0839a24773c8599a0e98f85e3bf92373 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=97=A0=E6=9C=A8?= Date: Wed, 15 Sep 2021 10:56:14 +0800 Subject: [PATCH 30/54] fix(modal): `maskClosable` and `Esc` take no effect MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 修复BasicModal按Esc和点击遮罩无法关闭的问题 fixed: #1203 --- src/components/Modal/src/BasicModal.vue | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/components/Modal/src/BasicModal.vue b/src/components/Modal/src/BasicModal.vue index c16509943..89bc8798c 100644 --- a/src/components/Modal/src/BasicModal.vue +++ b/src/components/Modal/src/BasicModal.vue @@ -1,5 +1,5 @@ -