@tmagic/table 1.2.0-beta.5 → 1.2.0-beta.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/tmagic-table.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { defineComponent, openBlock, createBlock, unref, withCtx, createElementBlock, Fragment, renderList, withDirectives, vShow, createVNode, createTextVNode, createCommentVNode, toDisplayString, resolveComponent, createElementVNode, ref, computed, resolveDirective } from 'vue';
|
|
1
|
+
import { defineComponent, openBlock, createBlock, unref, withCtx, createElementBlock, Fragment, renderList, withDirectives, vShow, createVNode, createTextVNode, createCommentVNode, toDisplayString, resolveComponent, createElementVNode, ref, computed, resolveDirective, resolveDynamicComponent } from 'vue';
|
|
2
2
|
import { cloneDeep } from 'lodash-es';
|
|
3
|
-
import { TMagicTableColumn, TMagicButton, tMagicMessage, tMagicMessageBox, TMagicPopover, TMagicForm, TMagicTag, TMagicTable } from '@tmagic/design';
|
|
3
|
+
import { TMagicTableColumn, TMagicButton, tMagicMessage, tMagicMessageBox, TMagicPopover, TMagicForm, TMagicTag, getConfig, TMagicTable } from '@tmagic/design';
|
|
4
4
|
import { MForm } from '@tmagic/form';
|
|
5
5
|
import { datetimeFormatter } from '@tmagic/utils';
|
|
6
6
|
|
|
@@ -363,6 +363,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
363
363
|
const props = __props;
|
|
364
364
|
const tMagicTable = ref();
|
|
365
365
|
const editState = ref([]);
|
|
366
|
+
const tableColumnComponent = getConfig("components").tableColumn;
|
|
366
367
|
const selectionColumn = computed(() => {
|
|
367
368
|
const column = props.columns.filter((item) => item.selection);
|
|
368
369
|
return column.length ? column[0] : null;
|
|
@@ -441,10 +442,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
441
442
|
item.type === "expand" ? (openBlock(), createBlock(_sfc_main$3, {
|
|
442
443
|
config: item,
|
|
443
444
|
key: columnIndex
|
|
444
|
-
}, null, 8, ["config"])) : item.selection ? (openBlock(), createBlock(unref(
|
|
445
|
+
}, null, 8, ["config"])) : item.selection ? (openBlock(), createBlock(resolveDynamicComponent(unref(tableColumnComponent).component), {
|
|
446
|
+
width: "40",
|
|
445
447
|
type: "selection",
|
|
446
448
|
key: columnIndex,
|
|
447
|
-
width: "40",
|
|
448
449
|
selectable: item.selectable
|
|
449
450
|
}, null, 8, ["selectable"])) : item.actions ? (openBlock(), createBlock(_sfc_main$4, {
|
|
450
451
|
columns: __props.columns,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tmagic-table.mjs","sources":["../src/ActionsColumn.vue","../src/utils.ts","../src/Table.vue","../src/index.ts"],"sourcesContent":["<template>\n <TMagicTableColumn :label=\"config.label\" :width=\"config.width\" :fixed=\"config.fixed\">\n <template v-slot=\"scope\">\n <TMagicButton\n v-for=\"(action, actionIndex) in config.actions\"\n v-show=\"display(action.display, scope.row) && !editState[scope.$index]\"\n v-html=\"action.text\"\n class=\"action-btn\"\n text\n type=\"primary\"\n size=\"small\"\n :key=\"actionIndex\"\n @click=\"actionHandler(action, scope.row, scope.$index)\"\n ></TMagicButton>\n <TMagicButton\n class=\"action-btn\"\n v-show=\"editState[scope.$index]\"\n text\n type=\"primary\"\n size=\"small\"\n @click=\"save(scope.$index, config)\"\n >保存</TMagicButton\n >\n <TMagicButton\n class=\"action-btn\"\n v-show=\"editState[scope.$index]\"\n text\n type=\"primary\"\n size=\"small\"\n @click=\"editState[scope.$index] = undefined\"\n >取消</TMagicButton\n >\n </template>\n </TMagicTableColumn>\n</template>\n\n<script lang=\"ts\" setup>\nimport { TMagicButton, tMagicMessage, tMagicMessageBox, TMagicTableColumn } from '@tmagic/design';\n\nimport { ColumnActionConfig, ColumnConfig } from './schema';\n\nconst props = withDefaults(\n defineProps<{\n columns: any[];\n config: ColumnConfig;\n rowkeyName?: string;\n editState?: any;\n }>(),\n {\n columns: () => [],\n config: () => ({}),\n rowkeyName: 'c_id',\n editState: () => [],\n },\n);\n\nconst emit = defineEmits(['afterAction']);\n\nconst display = (fuc: boolean | Function | undefined, row: any) => {\n if (typeof fuc === 'function') {\n return fuc(row);\n }\n return true;\n};\n\nconst success = (msg: string, action: ColumnActionConfig, row: any) => {\n tMagicMessage.success(msg);\n action.after?.(row);\n};\n\nconst error = (msg: string) => tMagicMessage.error(msg);\n\nconst deleteAction = async (action: ColumnActionConfig, row: any) => {\n await tMagicMessageBox.confirm(`确认删除${row[action.name || 'c_name']}(${row[props.rowkeyName]})?`, '提示', {\n confirmButtonText: '确定',\n cancelButtonText: '取消',\n type: 'warning',\n });\n\n const res = await action.handler?.(row);\n\n if (res.ret === 0) {\n success('删除成功!', action, row);\n } else {\n error(res.msg || '删除失败');\n }\n};\n\nconst copyHandler = async (action: ColumnActionConfig, row: any) => {\n await tMagicMessageBox.confirm(`确定复制${row[action.name || 'c_name']}(${row.c_id})?`, '提示', {\n confirmButtonText: '确定',\n cancelButtonText: '取消',\n type: 'warning',\n });\n\n try {\n const res = await action.handler?.(row);\n\n if (res.ret === 0) {\n success('复制成功!', action, row);\n } else {\n error(`复制失败!${res.msg}`);\n }\n } catch (e) {\n error('复制失败!');\n }\n};\n\nconst actionHandler = async (action: ColumnActionConfig, row: any, index: number) => {\n await action.before?.(row);\n if (action.type === 'delete') {\n await deleteAction(action, row);\n } else if (action.type === 'copy') {\n await copyHandler(action, row);\n } else if (action.type === 'edit') {\n props.editState[index] = row;\n } else {\n await action.handler?.(row);\n }\n action.after?.(row);\n};\n\nconst save = async (index: number, config: ColumnConfig) => {\n const action = config.actions?.find((item) => item.type === 'edit')?.action;\n if (!action) return;\n\n const data: any = {};\n const row = props.editState[index];\n props.columns\n .filter((item) => item.type)\n .forEach((column) => {\n data[column.prop] = row[column.prop];\n });\n\n const res: any = await action({\n data,\n });\n\n if (res) {\n if (res.ret === 0) {\n tMagicMessage.success('保存成功');\n props.editState[index] = undefined;\n emit('afterAction');\n } else {\n tMagicMessage.error(res.msg || '保存失败');\n }\n } else {\n props.editState[index] = undefined;\n emit('afterAction');\n }\n};\n</script>\n","/*\n * Tencent is pleased to support the open source community by making TMagicEditor available.\n *\n * Copyright (C) 2021 THL A29 Limited, a Tencent company. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { datetimeFormatter } from '@tmagic/utils';\n\nimport { ColumnConfig } from './schema';\n\nexport const formatter = (item: ColumnConfig, row: any) => {\n if (!item.prop) return '';\n\n if (item.formatter) {\n if (item.formatter === 'datetime') {\n // eslint-disable-next-line no-param-reassign\n item.formatter = (value: string) => datetimeFormatter(value);\n }\n try {\n return item.formatter(row[item.prop], row);\n } catch (e) {\n return row[item.prop];\n }\n } else {\n return row[item.prop];\n }\n};\n","<template>\n <TMagicTable\n tooltip-effect=\"dark\"\n class=\"m-table\"\n ref=\"tMagicTable\"\n v-loading=\"loading\"\n :data=\"tableData\"\n :show-header=\"showHeader\"\n :max-height=\"bodyHeight\"\n :default-expand-all=\"defaultExpandAll\"\n :border=\"hasBorder\"\n :row-key=\"rowkeyName || 'c_id'\"\n :tree-props=\"{ children: 'children' }\"\n :empty-text=\"emptyText || '暂无数据'\"\n :span-method=\"objectSpanMethod\"\n @sort-change=\"sortChange\"\n @select=\"selectHandler\"\n @select-all=\"selectAllHandler\"\n @selection-change=\"selectionChangeHandler\"\n >\n <template v-for=\"(item, columnIndex) in columns\">\n <template v-if=\"item.type === 'expand'\">\n <ExpandColumn :config=\"item\" :key=\"columnIndex\"></ExpandColumn>\n </template>\n\n <template v-else-if=\"item.selection\">\n <TMagicTableColumn\n type=\"selection\"\n :key=\"columnIndex\"\n width=\"40\"\n :selectable=\"item.selectable\"\n ></TMagicTableColumn>\n </template>\n\n <template v-else-if=\"item.actions\">\n <ActionsColumn\n :columns=\"columns\"\n :config=\"item\"\n :rowkey-name=\"rowkeyName\"\n :edit-state=\"editState\"\n :key=\"columnIndex\"\n @afterAction=\"$emit('afterAction')\"\n ></ActionsColumn>\n </template>\n\n <template v-else-if=\"item.type === 'popover'\">\n <PopoverColumn :key=\"columnIndex\" :config=\"item\"></PopoverColumn>\n </template>\n\n <template v-else>\n <TextColumn :key=\"columnIndex\" :config=\"item\" :edit-state=\"editState\"></TextColumn>\n </template>\n </template>\n </TMagicTable>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref } from 'vue';\nimport { cloneDeep } from 'lodash-es';\n\nimport { TMagicTable, TMagicTableColumn } from '@tmagic/design';\n\nimport ActionsColumn from './ActionsColumn.vue';\nimport ExpandColumn from './ExpandColumn.vue';\nimport PopoverColumn from './PopoverColumn.vue';\nimport TextColumn from './TextColumn.vue';\n\nconst props = withDefaults(\n defineProps<{\n data: any[];\n columns?: any[];\n /** 合并行或列的计算方法 */\n spanMethod?: (data: { row: any; column: any; rowIndex: number; columnIndex: number }) => [number, number];\n loading?: boolean;\n /** Table 的最大高度。合法的值为数字或者单位为 px 的高度 */\n bodyHeight?: string | number;\n /** 是否显示表头 */\n showHeader?: boolean;\n /** 空数据时显示的文本内容 */\n emptyText?: string;\n /** 是否默认展开所有行,当 Table 包含展开行存在或者为树形表格时有效 */\n defaultExpandAll?: boolean;\n rowkeyName?: string;\n /** 是否带有纵向边框 */\n border?: boolean;\n }>(),\n {\n columns: () => [],\n loading: false,\n showHeader: true,\n defaultExpandAll: false,\n border: false,\n },\n);\n\nconst emit = defineEmits(['sort-change', 'afterAction', 'select', 'select-all', 'selection-change']);\n\nconst tMagicTable = ref<InstanceType<typeof TMagicTable>>();\n\nconst editState = ref([]);\n\nconst selectionColumn = computed(() => {\n const column = props.columns.filter((item) => item.selection);\n return column.length ? column[0] : null;\n});\n\nconst tableData = computed(() => {\n if (selectionColumn.value) {\n return props.data || [];\n }\n\n return cloneDeep(props.data) || [];\n});\n\nconst hasBorder = computed(() => (typeof props.border !== 'undefined' ? props.border : true));\n\nconst sortChange = (data: any) => {\n emit('sort-change', data);\n};\n\nconst selectHandler = (selection: any, row: any) => {\n const column = selectionColumn.value;\n if (!column) {\n return;\n }\n\n if (column.selection === 'single') {\n // this.clearSelection()\n // this.toggleRowSelection(row, true)\n }\n emit('select', selection, row);\n};\n\nconst selectAllHandler = (selection: any) => {\n emit('select-all', selection);\n};\n\nconst selectionChangeHandler = (selection: any) => {\n emit('selection-change', selection);\n};\n\nconst toggleRowSelection = (row: any, selected: boolean) => {\n tMagicTable.value?.toggleRowSelection(row, selected);\n};\n\nconst toggleRowExpansion = (row: any, expanded: boolean) => {\n tMagicTable.value?.toggleRowExpansion(row, expanded);\n};\n\nconst clearSelection = () => {\n tMagicTable.value?.clearSelection();\n};\n\nconst objectSpanMethod = (data: any) => {\n if (typeof props.spanMethod === 'function') {\n return props.spanMethod(data);\n }\n return () => ({\n rowspan: 0,\n colspan: 0,\n });\n};\n\ndefineExpose({\n toggleRowSelection,\n toggleRowExpansion,\n clearSelection,\n});\n</script>\n\n<style lang=\"scss\">\n.m-table {\n .el-button.action-btn + .el-button.action-btn {\n margin-left: 0;\n }\n .keep-all {\n word-break: keep-all;\n }\n .el-table .cell > div {\n display: inline-block;\n vertical-align: middle;\n }\n .el-table__row.el-table__row--level-1 {\n color: #999;\n }\n}\n</style>\n","/*\n * Tencent is pleased to support the open source community by making TMagicEditor available.\n *\n * Copyright (C) 2021 THL A29 Limited, a Tencent company. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { App } from 'vue';\n\nimport Table from './Table.vue';\n\nexport { default as MagicTable } from './Table.vue';\n\nexport default {\n install(app: App) {\n app.component('m-table', Table);\n },\n};\n"],"names":["Table"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tmagic-table.mjs","sources":["../src/ActionsColumn.vue","../src/utils.ts","../src/Table.vue","../src/index.ts"],"sourcesContent":["<template>\n <TMagicTableColumn :label=\"config.label\" :width=\"config.width\" :fixed=\"config.fixed\">\n <template v-slot=\"scope\">\n <TMagicButton\n v-for=\"(action, actionIndex) in config.actions\"\n v-show=\"display(action.display, scope.row) && !editState[scope.$index]\"\n v-html=\"action.text\"\n class=\"action-btn\"\n text\n type=\"primary\"\n size=\"small\"\n :key=\"actionIndex\"\n @click=\"actionHandler(action, scope.row, scope.$index)\"\n ></TMagicButton>\n <TMagicButton\n class=\"action-btn\"\n v-show=\"editState[scope.$index]\"\n text\n type=\"primary\"\n size=\"small\"\n @click=\"save(scope.$index, config)\"\n >保存</TMagicButton\n >\n <TMagicButton\n class=\"action-btn\"\n v-show=\"editState[scope.$index]\"\n text\n type=\"primary\"\n size=\"small\"\n @click=\"editState[scope.$index] = undefined\"\n >取消</TMagicButton\n >\n </template>\n </TMagicTableColumn>\n</template>\n\n<script lang=\"ts\" setup>\nimport { TMagicButton, tMagicMessage, tMagicMessageBox, TMagicTableColumn } from '@tmagic/design';\n\nimport { ColumnActionConfig, ColumnConfig } from './schema';\n\nconst props = withDefaults(\n defineProps<{\n columns: any[];\n config: ColumnConfig;\n rowkeyName?: string;\n editState?: any;\n }>(),\n {\n columns: () => [],\n config: () => ({}),\n rowkeyName: 'c_id',\n editState: () => [],\n },\n);\n\nconst emit = defineEmits(['afterAction']);\n\nconst display = (fuc: boolean | Function | undefined, row: any) => {\n if (typeof fuc === 'function') {\n return fuc(row);\n }\n return true;\n};\n\nconst success = (msg: string, action: ColumnActionConfig, row: any) => {\n tMagicMessage.success(msg);\n action.after?.(row);\n};\n\nconst error = (msg: string) => tMagicMessage.error(msg);\n\nconst deleteAction = async (action: ColumnActionConfig, row: any) => {\n await tMagicMessageBox.confirm(`确认删除${row[action.name || 'c_name']}(${row[props.rowkeyName]})?`, '提示', {\n confirmButtonText: '确定',\n cancelButtonText: '取消',\n type: 'warning',\n });\n\n const res = await action.handler?.(row);\n\n if (res.ret === 0) {\n success('删除成功!', action, row);\n } else {\n error(res.msg || '删除失败');\n }\n};\n\nconst copyHandler = async (action: ColumnActionConfig, row: any) => {\n await tMagicMessageBox.confirm(`确定复制${row[action.name || 'c_name']}(${row.c_id})?`, '提示', {\n confirmButtonText: '确定',\n cancelButtonText: '取消',\n type: 'warning',\n });\n\n try {\n const res = await action.handler?.(row);\n\n if (res.ret === 0) {\n success('复制成功!', action, row);\n } else {\n error(`复制失败!${res.msg}`);\n }\n } catch (e) {\n error('复制失败!');\n }\n};\n\nconst actionHandler = async (action: ColumnActionConfig, row: any, index: number) => {\n await action.before?.(row);\n if (action.type === 'delete') {\n await deleteAction(action, row);\n } else if (action.type === 'copy') {\n await copyHandler(action, row);\n } else if (action.type === 'edit') {\n props.editState[index] = row;\n } else {\n await action.handler?.(row);\n }\n action.after?.(row);\n};\n\nconst save = async (index: number, config: ColumnConfig) => {\n const action = config.actions?.find((item) => item.type === 'edit')?.action;\n if (!action) return;\n\n const data: any = {};\n const row = props.editState[index];\n props.columns\n .filter((item) => item.type)\n .forEach((column) => {\n data[column.prop] = row[column.prop];\n });\n\n const res: any = await action({\n data,\n });\n\n if (res) {\n if (res.ret === 0) {\n tMagicMessage.success('保存成功');\n props.editState[index] = undefined;\n emit('afterAction');\n } else {\n tMagicMessage.error(res.msg || '保存失败');\n }\n } else {\n props.editState[index] = undefined;\n emit('afterAction');\n }\n};\n</script>\n","/*\n * Tencent is pleased to support the open source community by making TMagicEditor available.\n *\n * Copyright (C) 2021 THL A29 Limited, a Tencent company. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { datetimeFormatter } from '@tmagic/utils';\n\nimport { ColumnConfig } from './schema';\n\nexport const formatter = (item: ColumnConfig, row: any) => {\n if (!item.prop) return '';\n\n if (item.formatter) {\n if (item.formatter === 'datetime') {\n // eslint-disable-next-line no-param-reassign\n item.formatter = (value: string) => datetimeFormatter(value);\n }\n try {\n return item.formatter(row[item.prop], row);\n } catch (e) {\n return row[item.prop];\n }\n } else {\n return row[item.prop];\n }\n};\n","<template>\n <TMagicTable\n tooltip-effect=\"dark\"\n class=\"m-table\"\n ref=\"tMagicTable\"\n v-loading=\"loading\"\n :data=\"tableData\"\n :show-header=\"showHeader\"\n :max-height=\"bodyHeight\"\n :default-expand-all=\"defaultExpandAll\"\n :border=\"hasBorder\"\n :row-key=\"rowkeyName || 'c_id'\"\n :tree-props=\"{ children: 'children' }\"\n :empty-text=\"emptyText || '暂无数据'\"\n :span-method=\"objectSpanMethod\"\n @sort-change=\"sortChange\"\n @select=\"selectHandler\"\n @select-all=\"selectAllHandler\"\n @selection-change=\"selectionChangeHandler\"\n >\n <template v-for=\"(item, columnIndex) in columns\">\n <template v-if=\"item.type === 'expand'\">\n <ExpandColumn :config=\"item\" :key=\"columnIndex\"></ExpandColumn>\n </template>\n\n <template v-else-if=\"item.selection\">\n <component\n width=\"40\"\n type=\"selection\"\n :is=\"tableColumnComponent.component\"\n :key=\"columnIndex\"\n :selectable=\"item.selectable\"\n ></component>\n </template>\n\n <template v-else-if=\"item.actions\">\n <ActionsColumn\n :columns=\"columns\"\n :config=\"item\"\n :rowkey-name=\"rowkeyName\"\n :edit-state=\"editState\"\n :key=\"columnIndex\"\n @afterAction=\"$emit('afterAction')\"\n ></ActionsColumn>\n </template>\n\n <template v-else-if=\"item.type === 'popover'\">\n <PopoverColumn :key=\"columnIndex\" :config=\"item\"></PopoverColumn>\n </template>\n\n <template v-else>\n <TextColumn :key=\"columnIndex\" :config=\"item\" :edit-state=\"editState\"></TextColumn>\n </template>\n </template>\n </TMagicTable>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref } from 'vue';\nimport { cloneDeep } from 'lodash-es';\n\nimport { getConfig, TMagicTable } from '@tmagic/design';\n\nimport ActionsColumn from './ActionsColumn.vue';\nimport ExpandColumn from './ExpandColumn.vue';\nimport PopoverColumn from './PopoverColumn.vue';\nimport TextColumn from './TextColumn.vue';\n\nconst props = withDefaults(\n defineProps<{\n data: any[];\n columns?: any[];\n /** 合并行或列的计算方法 */\n spanMethod?: (data: { row: any; column: any; rowIndex: number; columnIndex: number }) => [number, number];\n loading?: boolean;\n /** Table 的最大高度。合法的值为数字或者单位为 px 的高度 */\n bodyHeight?: string | number;\n /** 是否显示表头 */\n showHeader?: boolean;\n /** 空数据时显示的文本内容 */\n emptyText?: string;\n /** 是否默认展开所有行,当 Table 包含展开行存在或者为树形表格时有效 */\n defaultExpandAll?: boolean;\n rowkeyName?: string;\n /** 是否带有纵向边框 */\n border?: boolean;\n }>(),\n {\n columns: () => [],\n loading: false,\n showHeader: true,\n defaultExpandAll: false,\n border: false,\n },\n);\n\nconst emit = defineEmits(['sort-change', 'afterAction', 'select', 'select-all', 'selection-change']);\n\nconst tMagicTable = ref<InstanceType<typeof TMagicTable>>();\n\nconst editState = ref([]);\n\nconst tableColumnComponent = getConfig('components').tableColumn;\nconst selectionColumn = computed(() => {\n const column = props.columns.filter((item) => item.selection);\n return column.length ? column[0] : null;\n});\n\nconst tableData = computed(() => {\n if (selectionColumn.value) {\n return props.data || [];\n }\n\n return cloneDeep(props.data) || [];\n});\n\nconst hasBorder = computed(() => (typeof props.border !== 'undefined' ? props.border : true));\n\nconst sortChange = (data: any) => {\n emit('sort-change', data);\n};\n\nconst selectHandler = (selection: any, row: any) => {\n const column = selectionColumn.value;\n if (!column) {\n return;\n }\n\n if (column.selection === 'single') {\n // this.clearSelection()\n // this.toggleRowSelection(row, true)\n }\n emit('select', selection, row);\n};\n\nconst selectAllHandler = (selection: any) => {\n emit('select-all', selection);\n};\n\nconst selectionChangeHandler = (selection: any) => {\n emit('selection-change', selection);\n};\n\nconst toggleRowSelection = (row: any, selected: boolean) => {\n tMagicTable.value?.toggleRowSelection(row, selected);\n};\n\nconst toggleRowExpansion = (row: any, expanded: boolean) => {\n tMagicTable.value?.toggleRowExpansion(row, expanded);\n};\n\nconst clearSelection = () => {\n tMagicTable.value?.clearSelection();\n};\n\nconst objectSpanMethod = (data: any) => {\n if (typeof props.spanMethod === 'function') {\n return props.spanMethod(data);\n }\n return () => ({\n rowspan: 0,\n colspan: 0,\n });\n};\n\ndefineExpose({\n toggleRowSelection,\n toggleRowExpansion,\n clearSelection,\n});\n</script>\n\n<style lang=\"scss\">\n.m-table {\n .el-button.action-btn + .el-button.action-btn {\n margin-left: 0;\n }\n .keep-all {\n word-break: keep-all;\n }\n .el-table .cell > div {\n display: inline-block;\n vertical-align: middle;\n }\n .el-table__row.el-table__row--level-1 {\n color: #999;\n }\n}\n</style>\n","/*\n * Tencent is pleased to support the open source community by making TMagicEditor available.\n *\n * Copyright (C) 2021 THL A29 Limited, a Tencent company. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { App } from 'vue';\n\nimport Table from './Table.vue';\n\nexport { default as MagicTable } from './Table.vue';\n\nexport default {\n install(app: App) {\n app.component('m-table', Table);\n },\n};\n"],"names":["Table"],"mappings":"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"}
|
package/dist/tmagic-table.umd.js
CHANGED
|
@@ -363,6 +363,7 @@
|
|
|
363
363
|
const props = __props;
|
|
364
364
|
const tMagicTable = vue.ref();
|
|
365
365
|
const editState = vue.ref([]);
|
|
366
|
+
const tableColumnComponent = design.getConfig("components").tableColumn;
|
|
366
367
|
const selectionColumn = vue.computed(() => {
|
|
367
368
|
const column = props.columns.filter((item) => item.selection);
|
|
368
369
|
return column.length ? column[0] : null;
|
|
@@ -441,10 +442,10 @@
|
|
|
441
442
|
item.type === "expand" ? (vue.openBlock(), vue.createBlock(_sfc_main$3, {
|
|
442
443
|
config: item,
|
|
443
444
|
key: columnIndex
|
|
444
|
-
}, null, 8, ["config"])) : item.selection ? (vue.openBlock(), vue.createBlock(vue.unref(
|
|
445
|
+
}, null, 8, ["config"])) : item.selection ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(tableColumnComponent).component), {
|
|
446
|
+
width: "40",
|
|
445
447
|
type: "selection",
|
|
446
448
|
key: columnIndex,
|
|
447
|
-
width: "40",
|
|
448
449
|
selectable: item.selectable
|
|
449
450
|
}, null, 8, ["selectable"])) : item.actions ? (vue.openBlock(), vue.createBlock(_sfc_main$4, {
|
|
450
451
|
columns: __props.columns,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tmagic-table.umd.js","sources":["../src/ActionsColumn.vue","../src/utils.ts","../src/Table.vue","../src/index.ts"],"sourcesContent":["<template>\n <TMagicTableColumn :label=\"config.label\" :width=\"config.width\" :fixed=\"config.fixed\">\n <template v-slot=\"scope\">\n <TMagicButton\n v-for=\"(action, actionIndex) in config.actions\"\n v-show=\"display(action.display, scope.row) && !editState[scope.$index]\"\n v-html=\"action.text\"\n class=\"action-btn\"\n text\n type=\"primary\"\n size=\"small\"\n :key=\"actionIndex\"\n @click=\"actionHandler(action, scope.row, scope.$index)\"\n ></TMagicButton>\n <TMagicButton\n class=\"action-btn\"\n v-show=\"editState[scope.$index]\"\n text\n type=\"primary\"\n size=\"small\"\n @click=\"save(scope.$index, config)\"\n >保存</TMagicButton\n >\n <TMagicButton\n class=\"action-btn\"\n v-show=\"editState[scope.$index]\"\n text\n type=\"primary\"\n size=\"small\"\n @click=\"editState[scope.$index] = undefined\"\n >取消</TMagicButton\n >\n </template>\n </TMagicTableColumn>\n</template>\n\n<script lang=\"ts\" setup>\nimport { TMagicButton, tMagicMessage, tMagicMessageBox, TMagicTableColumn } from '@tmagic/design';\n\nimport { ColumnActionConfig, ColumnConfig } from './schema';\n\nconst props = withDefaults(\n defineProps<{\n columns: any[];\n config: ColumnConfig;\n rowkeyName?: string;\n editState?: any;\n }>(),\n {\n columns: () => [],\n config: () => ({}),\n rowkeyName: 'c_id',\n editState: () => [],\n },\n);\n\nconst emit = defineEmits(['afterAction']);\n\nconst display = (fuc: boolean | Function | undefined, row: any) => {\n if (typeof fuc === 'function') {\n return fuc(row);\n }\n return true;\n};\n\nconst success = (msg: string, action: ColumnActionConfig, row: any) => {\n tMagicMessage.success(msg);\n action.after?.(row);\n};\n\nconst error = (msg: string) => tMagicMessage.error(msg);\n\nconst deleteAction = async (action: ColumnActionConfig, row: any) => {\n await tMagicMessageBox.confirm(`确认删除${row[action.name || 'c_name']}(${row[props.rowkeyName]})?`, '提示', {\n confirmButtonText: '确定',\n cancelButtonText: '取消',\n type: 'warning',\n });\n\n const res = await action.handler?.(row);\n\n if (res.ret === 0) {\n success('删除成功!', action, row);\n } else {\n error(res.msg || '删除失败');\n }\n};\n\nconst copyHandler = async (action: ColumnActionConfig, row: any) => {\n await tMagicMessageBox.confirm(`确定复制${row[action.name || 'c_name']}(${row.c_id})?`, '提示', {\n confirmButtonText: '确定',\n cancelButtonText: '取消',\n type: 'warning',\n });\n\n try {\n const res = await action.handler?.(row);\n\n if (res.ret === 0) {\n success('复制成功!', action, row);\n } else {\n error(`复制失败!${res.msg}`);\n }\n } catch (e) {\n error('复制失败!');\n }\n};\n\nconst actionHandler = async (action: ColumnActionConfig, row: any, index: number) => {\n await action.before?.(row);\n if (action.type === 'delete') {\n await deleteAction(action, row);\n } else if (action.type === 'copy') {\n await copyHandler(action, row);\n } else if (action.type === 'edit') {\n props.editState[index] = row;\n } else {\n await action.handler?.(row);\n }\n action.after?.(row);\n};\n\nconst save = async (index: number, config: ColumnConfig) => {\n const action = config.actions?.find((item) => item.type === 'edit')?.action;\n if (!action) return;\n\n const data: any = {};\n const row = props.editState[index];\n props.columns\n .filter((item) => item.type)\n .forEach((column) => {\n data[column.prop] = row[column.prop];\n });\n\n const res: any = await action({\n data,\n });\n\n if (res) {\n if (res.ret === 0) {\n tMagicMessage.success('保存成功');\n props.editState[index] = undefined;\n emit('afterAction');\n } else {\n tMagicMessage.error(res.msg || '保存失败');\n }\n } else {\n props.editState[index] = undefined;\n emit('afterAction');\n }\n};\n</script>\n","/*\n * Tencent is pleased to support the open source community by making TMagicEditor available.\n *\n * Copyright (C) 2021 THL A29 Limited, a Tencent company. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { datetimeFormatter } from '@tmagic/utils';\n\nimport { ColumnConfig } from './schema';\n\nexport const formatter = (item: ColumnConfig, row: any) => {\n if (!item.prop) return '';\n\n if (item.formatter) {\n if (item.formatter === 'datetime') {\n // eslint-disable-next-line no-param-reassign\n item.formatter = (value: string) => datetimeFormatter(value);\n }\n try {\n return item.formatter(row[item.prop], row);\n } catch (e) {\n return row[item.prop];\n }\n } else {\n return row[item.prop];\n }\n};\n","<template>\n <TMagicTable\n tooltip-effect=\"dark\"\n class=\"m-table\"\n ref=\"tMagicTable\"\n v-loading=\"loading\"\n :data=\"tableData\"\n :show-header=\"showHeader\"\n :max-height=\"bodyHeight\"\n :default-expand-all=\"defaultExpandAll\"\n :border=\"hasBorder\"\n :row-key=\"rowkeyName || 'c_id'\"\n :tree-props=\"{ children: 'children' }\"\n :empty-text=\"emptyText || '暂无数据'\"\n :span-method=\"objectSpanMethod\"\n @sort-change=\"sortChange\"\n @select=\"selectHandler\"\n @select-all=\"selectAllHandler\"\n @selection-change=\"selectionChangeHandler\"\n >\n <template v-for=\"(item, columnIndex) in columns\">\n <template v-if=\"item.type === 'expand'\">\n <ExpandColumn :config=\"item\" :key=\"columnIndex\"></ExpandColumn>\n </template>\n\n <template v-else-if=\"item.selection\">\n <TMagicTableColumn\n type=\"selection\"\n :key=\"columnIndex\"\n width=\"40\"\n :selectable=\"item.selectable\"\n ></TMagicTableColumn>\n </template>\n\n <template v-else-if=\"item.actions\">\n <ActionsColumn\n :columns=\"columns\"\n :config=\"item\"\n :rowkey-name=\"rowkeyName\"\n :edit-state=\"editState\"\n :key=\"columnIndex\"\n @afterAction=\"$emit('afterAction')\"\n ></ActionsColumn>\n </template>\n\n <template v-else-if=\"item.type === 'popover'\">\n <PopoverColumn :key=\"columnIndex\" :config=\"item\"></PopoverColumn>\n </template>\n\n <template v-else>\n <TextColumn :key=\"columnIndex\" :config=\"item\" :edit-state=\"editState\"></TextColumn>\n </template>\n </template>\n </TMagicTable>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref } from 'vue';\nimport { cloneDeep } from 'lodash-es';\n\nimport { TMagicTable, TMagicTableColumn } from '@tmagic/design';\n\nimport ActionsColumn from './ActionsColumn.vue';\nimport ExpandColumn from './ExpandColumn.vue';\nimport PopoverColumn from './PopoverColumn.vue';\nimport TextColumn from './TextColumn.vue';\n\nconst props = withDefaults(\n defineProps<{\n data: any[];\n columns?: any[];\n /** 合并行或列的计算方法 */\n spanMethod?: (data: { row: any; column: any; rowIndex: number; columnIndex: number }) => [number, number];\n loading?: boolean;\n /** Table 的最大高度。合法的值为数字或者单位为 px 的高度 */\n bodyHeight?: string | number;\n /** 是否显示表头 */\n showHeader?: boolean;\n /** 空数据时显示的文本内容 */\n emptyText?: string;\n /** 是否默认展开所有行,当 Table 包含展开行存在或者为树形表格时有效 */\n defaultExpandAll?: boolean;\n rowkeyName?: string;\n /** 是否带有纵向边框 */\n border?: boolean;\n }>(),\n {\n columns: () => [],\n loading: false,\n showHeader: true,\n defaultExpandAll: false,\n border: false,\n },\n);\n\nconst emit = defineEmits(['sort-change', 'afterAction', 'select', 'select-all', 'selection-change']);\n\nconst tMagicTable = ref<InstanceType<typeof TMagicTable>>();\n\nconst editState = ref([]);\n\nconst selectionColumn = computed(() => {\n const column = props.columns.filter((item) => item.selection);\n return column.length ? column[0] : null;\n});\n\nconst tableData = computed(() => {\n if (selectionColumn.value) {\n return props.data || [];\n }\n\n return cloneDeep(props.data) || [];\n});\n\nconst hasBorder = computed(() => (typeof props.border !== 'undefined' ? props.border : true));\n\nconst sortChange = (data: any) => {\n emit('sort-change', data);\n};\n\nconst selectHandler = (selection: any, row: any) => {\n const column = selectionColumn.value;\n if (!column) {\n return;\n }\n\n if (column.selection === 'single') {\n // this.clearSelection()\n // this.toggleRowSelection(row, true)\n }\n emit('select', selection, row);\n};\n\nconst selectAllHandler = (selection: any) => {\n emit('select-all', selection);\n};\n\nconst selectionChangeHandler = (selection: any) => {\n emit('selection-change', selection);\n};\n\nconst toggleRowSelection = (row: any, selected: boolean) => {\n tMagicTable.value?.toggleRowSelection(row, selected);\n};\n\nconst toggleRowExpansion = (row: any, expanded: boolean) => {\n tMagicTable.value?.toggleRowExpansion(row, expanded);\n};\n\nconst clearSelection = () => {\n tMagicTable.value?.clearSelection();\n};\n\nconst objectSpanMethod = (data: any) => {\n if (typeof props.spanMethod === 'function') {\n return props.spanMethod(data);\n }\n return () => ({\n rowspan: 0,\n colspan: 0,\n });\n};\n\ndefineExpose({\n toggleRowSelection,\n toggleRowExpansion,\n clearSelection,\n});\n</script>\n\n<style lang=\"scss\">\n.m-table {\n .el-button.action-btn + .el-button.action-btn {\n margin-left: 0;\n }\n .keep-all {\n word-break: keep-all;\n }\n .el-table .cell > div {\n display: inline-block;\n vertical-align: middle;\n }\n .el-table__row.el-table__row--level-1 {\n color: #999;\n }\n}\n</style>\n","/*\n * Tencent is pleased to support the open source community by making TMagicEditor available.\n *\n * Copyright (C) 2021 THL A29 Limited, a Tencent company. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { App } from 'vue';\n\nimport Table from './Table.vue';\n\nexport { default as MagicTable } from './Table.vue';\n\nexport default {\n install(app: App) {\n app.component('m-table', Table);\n },\n};\n"],"names":["tMagicMessage","tMagicMessageBox","datetimeFormatter","ref","computed","cloneDeep","Table"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tmagic-table.umd.js","sources":["../src/ActionsColumn.vue","../src/utils.ts","../src/Table.vue","../src/index.ts"],"sourcesContent":["<template>\n <TMagicTableColumn :label=\"config.label\" :width=\"config.width\" :fixed=\"config.fixed\">\n <template v-slot=\"scope\">\n <TMagicButton\n v-for=\"(action, actionIndex) in config.actions\"\n v-show=\"display(action.display, scope.row) && !editState[scope.$index]\"\n v-html=\"action.text\"\n class=\"action-btn\"\n text\n type=\"primary\"\n size=\"small\"\n :key=\"actionIndex\"\n @click=\"actionHandler(action, scope.row, scope.$index)\"\n ></TMagicButton>\n <TMagicButton\n class=\"action-btn\"\n v-show=\"editState[scope.$index]\"\n text\n type=\"primary\"\n size=\"small\"\n @click=\"save(scope.$index, config)\"\n >保存</TMagicButton\n >\n <TMagicButton\n class=\"action-btn\"\n v-show=\"editState[scope.$index]\"\n text\n type=\"primary\"\n size=\"small\"\n @click=\"editState[scope.$index] = undefined\"\n >取消</TMagicButton\n >\n </template>\n </TMagicTableColumn>\n</template>\n\n<script lang=\"ts\" setup>\nimport { TMagicButton, tMagicMessage, tMagicMessageBox, TMagicTableColumn } from '@tmagic/design';\n\nimport { ColumnActionConfig, ColumnConfig } from './schema';\n\nconst props = withDefaults(\n defineProps<{\n columns: any[];\n config: ColumnConfig;\n rowkeyName?: string;\n editState?: any;\n }>(),\n {\n columns: () => [],\n config: () => ({}),\n rowkeyName: 'c_id',\n editState: () => [],\n },\n);\n\nconst emit = defineEmits(['afterAction']);\n\nconst display = (fuc: boolean | Function | undefined, row: any) => {\n if (typeof fuc === 'function') {\n return fuc(row);\n }\n return true;\n};\n\nconst success = (msg: string, action: ColumnActionConfig, row: any) => {\n tMagicMessage.success(msg);\n action.after?.(row);\n};\n\nconst error = (msg: string) => tMagicMessage.error(msg);\n\nconst deleteAction = async (action: ColumnActionConfig, row: any) => {\n await tMagicMessageBox.confirm(`确认删除${row[action.name || 'c_name']}(${row[props.rowkeyName]})?`, '提示', {\n confirmButtonText: '确定',\n cancelButtonText: '取消',\n type: 'warning',\n });\n\n const res = await action.handler?.(row);\n\n if (res.ret === 0) {\n success('删除成功!', action, row);\n } else {\n error(res.msg || '删除失败');\n }\n};\n\nconst copyHandler = async (action: ColumnActionConfig, row: any) => {\n await tMagicMessageBox.confirm(`确定复制${row[action.name || 'c_name']}(${row.c_id})?`, '提示', {\n confirmButtonText: '确定',\n cancelButtonText: '取消',\n type: 'warning',\n });\n\n try {\n const res = await action.handler?.(row);\n\n if (res.ret === 0) {\n success('复制成功!', action, row);\n } else {\n error(`复制失败!${res.msg}`);\n }\n } catch (e) {\n error('复制失败!');\n }\n};\n\nconst actionHandler = async (action: ColumnActionConfig, row: any, index: number) => {\n await action.before?.(row);\n if (action.type === 'delete') {\n await deleteAction(action, row);\n } else if (action.type === 'copy') {\n await copyHandler(action, row);\n } else if (action.type === 'edit') {\n props.editState[index] = row;\n } else {\n await action.handler?.(row);\n }\n action.after?.(row);\n};\n\nconst save = async (index: number, config: ColumnConfig) => {\n const action = config.actions?.find((item) => item.type === 'edit')?.action;\n if (!action) return;\n\n const data: any = {};\n const row = props.editState[index];\n props.columns\n .filter((item) => item.type)\n .forEach((column) => {\n data[column.prop] = row[column.prop];\n });\n\n const res: any = await action({\n data,\n });\n\n if (res) {\n if (res.ret === 0) {\n tMagicMessage.success('保存成功');\n props.editState[index] = undefined;\n emit('afterAction');\n } else {\n tMagicMessage.error(res.msg || '保存失败');\n }\n } else {\n props.editState[index] = undefined;\n emit('afterAction');\n }\n};\n</script>\n","/*\n * Tencent is pleased to support the open source community by making TMagicEditor available.\n *\n * Copyright (C) 2021 THL A29 Limited, a Tencent company. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { datetimeFormatter } from '@tmagic/utils';\n\nimport { ColumnConfig } from './schema';\n\nexport const formatter = (item: ColumnConfig, row: any) => {\n if (!item.prop) return '';\n\n if (item.formatter) {\n if (item.formatter === 'datetime') {\n // eslint-disable-next-line no-param-reassign\n item.formatter = (value: string) => datetimeFormatter(value);\n }\n try {\n return item.formatter(row[item.prop], row);\n } catch (e) {\n return row[item.prop];\n }\n } else {\n return row[item.prop];\n }\n};\n","<template>\n <TMagicTable\n tooltip-effect=\"dark\"\n class=\"m-table\"\n ref=\"tMagicTable\"\n v-loading=\"loading\"\n :data=\"tableData\"\n :show-header=\"showHeader\"\n :max-height=\"bodyHeight\"\n :default-expand-all=\"defaultExpandAll\"\n :border=\"hasBorder\"\n :row-key=\"rowkeyName || 'c_id'\"\n :tree-props=\"{ children: 'children' }\"\n :empty-text=\"emptyText || '暂无数据'\"\n :span-method=\"objectSpanMethod\"\n @sort-change=\"sortChange\"\n @select=\"selectHandler\"\n @select-all=\"selectAllHandler\"\n @selection-change=\"selectionChangeHandler\"\n >\n <template v-for=\"(item, columnIndex) in columns\">\n <template v-if=\"item.type === 'expand'\">\n <ExpandColumn :config=\"item\" :key=\"columnIndex\"></ExpandColumn>\n </template>\n\n <template v-else-if=\"item.selection\">\n <component\n width=\"40\"\n type=\"selection\"\n :is=\"tableColumnComponent.component\"\n :key=\"columnIndex\"\n :selectable=\"item.selectable\"\n ></component>\n </template>\n\n <template v-else-if=\"item.actions\">\n <ActionsColumn\n :columns=\"columns\"\n :config=\"item\"\n :rowkey-name=\"rowkeyName\"\n :edit-state=\"editState\"\n :key=\"columnIndex\"\n @afterAction=\"$emit('afterAction')\"\n ></ActionsColumn>\n </template>\n\n <template v-else-if=\"item.type === 'popover'\">\n <PopoverColumn :key=\"columnIndex\" :config=\"item\"></PopoverColumn>\n </template>\n\n <template v-else>\n <TextColumn :key=\"columnIndex\" :config=\"item\" :edit-state=\"editState\"></TextColumn>\n </template>\n </template>\n </TMagicTable>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref } from 'vue';\nimport { cloneDeep } from 'lodash-es';\n\nimport { getConfig, TMagicTable } from '@tmagic/design';\n\nimport ActionsColumn from './ActionsColumn.vue';\nimport ExpandColumn from './ExpandColumn.vue';\nimport PopoverColumn from './PopoverColumn.vue';\nimport TextColumn from './TextColumn.vue';\n\nconst props = withDefaults(\n defineProps<{\n data: any[];\n columns?: any[];\n /** 合并行或列的计算方法 */\n spanMethod?: (data: { row: any; column: any; rowIndex: number; columnIndex: number }) => [number, number];\n loading?: boolean;\n /** Table 的最大高度。合法的值为数字或者单位为 px 的高度 */\n bodyHeight?: string | number;\n /** 是否显示表头 */\n showHeader?: boolean;\n /** 空数据时显示的文本内容 */\n emptyText?: string;\n /** 是否默认展开所有行,当 Table 包含展开行存在或者为树形表格时有效 */\n defaultExpandAll?: boolean;\n rowkeyName?: string;\n /** 是否带有纵向边框 */\n border?: boolean;\n }>(),\n {\n columns: () => [],\n loading: false,\n showHeader: true,\n defaultExpandAll: false,\n border: false,\n },\n);\n\nconst emit = defineEmits(['sort-change', 'afterAction', 'select', 'select-all', 'selection-change']);\n\nconst tMagicTable = ref<InstanceType<typeof TMagicTable>>();\n\nconst editState = ref([]);\n\nconst tableColumnComponent = getConfig('components').tableColumn;\nconst selectionColumn = computed(() => {\n const column = props.columns.filter((item) => item.selection);\n return column.length ? column[0] : null;\n});\n\nconst tableData = computed(() => {\n if (selectionColumn.value) {\n return props.data || [];\n }\n\n return cloneDeep(props.data) || [];\n});\n\nconst hasBorder = computed(() => (typeof props.border !== 'undefined' ? props.border : true));\n\nconst sortChange = (data: any) => {\n emit('sort-change', data);\n};\n\nconst selectHandler = (selection: any, row: any) => {\n const column = selectionColumn.value;\n if (!column) {\n return;\n }\n\n if (column.selection === 'single') {\n // this.clearSelection()\n // this.toggleRowSelection(row, true)\n }\n emit('select', selection, row);\n};\n\nconst selectAllHandler = (selection: any) => {\n emit('select-all', selection);\n};\n\nconst selectionChangeHandler = (selection: any) => {\n emit('selection-change', selection);\n};\n\nconst toggleRowSelection = (row: any, selected: boolean) => {\n tMagicTable.value?.toggleRowSelection(row, selected);\n};\n\nconst toggleRowExpansion = (row: any, expanded: boolean) => {\n tMagicTable.value?.toggleRowExpansion(row, expanded);\n};\n\nconst clearSelection = () => {\n tMagicTable.value?.clearSelection();\n};\n\nconst objectSpanMethod = (data: any) => {\n if (typeof props.spanMethod === 'function') {\n return props.spanMethod(data);\n }\n return () => ({\n rowspan: 0,\n colspan: 0,\n });\n};\n\ndefineExpose({\n toggleRowSelection,\n toggleRowExpansion,\n clearSelection,\n});\n</script>\n\n<style lang=\"scss\">\n.m-table {\n .el-button.action-btn + .el-button.action-btn {\n margin-left: 0;\n }\n .keep-all {\n word-break: keep-all;\n }\n .el-table .cell > div {\n display: inline-block;\n vertical-align: middle;\n }\n .el-table__row.el-table__row--level-1 {\n color: #999;\n }\n}\n</style>\n","/*\n * Tencent is pleased to support the open source community by making TMagicEditor available.\n *\n * Copyright (C) 2021 THL A29 Limited, a Tencent company. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { App } from 'vue';\n\nimport Table from './Table.vue';\n\nexport { default as MagicTable } from './Table.vue';\n\nexport default {\n install(app: App) {\n app.component('m-table', Table);\n },\n};\n"],"names":["tMagicMessage","tMagicMessageBox","datetimeFormatter","ref","getConfig","computed","cloneDeep","Table"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "1.2.0-beta.
|
|
2
|
+
"version": "1.2.0-beta.7",
|
|
3
3
|
"name": "@tmagic/table",
|
|
4
4
|
"sideEffects": [
|
|
5
5
|
"dist/*"
|
|
@@ -32,14 +32,14 @@
|
|
|
32
32
|
"url": "https://github.com/Tencent/tmagic-editor.git"
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@tmagic/design": "1.2.0-beta.
|
|
36
|
-
"@tmagic/form": "1.2.0-beta.
|
|
37
|
-
"@tmagic/utils": "1.2.0-beta.
|
|
35
|
+
"@tmagic/design": "1.2.0-beta.7",
|
|
36
|
+
"@tmagic/form": "1.2.0-beta.7",
|
|
37
|
+
"@tmagic/utils": "1.2.0-beta.7",
|
|
38
38
|
"lodash-es": "^4.17.21",
|
|
39
39
|
"vue": "^3.2.37"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
42
|
-
"@tmagic/form": "1.2.0-beta.
|
|
42
|
+
"@tmagic/form": "1.2.0-beta.7",
|
|
43
43
|
"vue": "^3.2.37"
|
|
44
44
|
},
|
|
45
45
|
"devDependencies": {
|
package/src/Table.vue
CHANGED
|
@@ -24,12 +24,13 @@
|
|
|
24
24
|
</template>
|
|
25
25
|
|
|
26
26
|
<template v-else-if="item.selection">
|
|
27
|
-
<
|
|
27
|
+
<component
|
|
28
|
+
width="40"
|
|
28
29
|
type="selection"
|
|
30
|
+
:is="tableColumnComponent.component"
|
|
29
31
|
:key="columnIndex"
|
|
30
|
-
width="40"
|
|
31
32
|
:selectable="item.selectable"
|
|
32
|
-
></
|
|
33
|
+
></component>
|
|
33
34
|
</template>
|
|
34
35
|
|
|
35
36
|
<template v-else-if="item.actions">
|
|
@@ -58,7 +59,7 @@
|
|
|
58
59
|
import { computed, ref } from 'vue';
|
|
59
60
|
import { cloneDeep } from 'lodash-es';
|
|
60
61
|
|
|
61
|
-
import {
|
|
62
|
+
import { getConfig, TMagicTable } from '@tmagic/design';
|
|
62
63
|
|
|
63
64
|
import ActionsColumn from './ActionsColumn.vue';
|
|
64
65
|
import ExpandColumn from './ExpandColumn.vue';
|
|
@@ -99,6 +100,7 @@ const tMagicTable = ref<InstanceType<typeof TMagicTable>>();
|
|
|
99
100
|
|
|
100
101
|
const editState = ref([]);
|
|
101
102
|
|
|
103
|
+
const tableColumnComponent = getConfig('components').tableColumn;
|
|
102
104
|
const selectionColumn = computed(() => {
|
|
103
105
|
const column = props.columns.filter((item) => item.selection);
|
|
104
106
|
return column.length ? column[0] : null;
|