diff --git a/packages/design/src/Drawer.vue b/packages/design/src/Drawer.vue
index 60b3f282..d9022fec 100644
--- a/packages/design/src/Drawer.vue
+++ b/packages/design/src/Drawer.vue
@@ -35,6 +35,7 @@ const props = defineProps<{
fullscreen?: boolean;
closeOnClickModal?: boolean;
closeOnPressEscape?: boolean;
+ direction?: 'rtl' | 'ltr' | 'ttb' | 'bt';
}>();
const uiComponent = getConfig('components').drawer;
diff --git a/packages/design/src/DropdownMenu.vue b/packages/design/src/DropdownMenu.vue
index c290f9ad..38f13afc 100644
--- a/packages/design/src/DropdownMenu.vue
+++ b/packages/design/src/DropdownMenu.vue
@@ -1,17 +1,11 @@
-
diff --git a/packages/design/src/Pagination.vue b/packages/design/src/Pagination.vue
index ab6c890c..8dd59d01 100644
--- a/packages/design/src/Pagination.vue
+++ b/packages/design/src/Pagination.vue
@@ -4,6 +4,7 @@
:is="uiComponent.component"
v-bind="uiProps"
@size-change="handleSizeChange"
+ @page-size-change="handleSizeChange"
@current-change="handleCurrentChange"
>
diff --git a/packages/design/src/Tree.vue b/packages/design/src/Tree.vue
index 5621db77..ed7a77d7 100644
--- a/packages/design/src/Tree.vue
+++ b/packages/design/src/Tree.vue
@@ -41,7 +41,7 @@ const props = defineProps<{
checkStrictly?: boolean;
defaultCheckedKeys?: any[];
currentNodeKey?: string | number;
- filterNodeMethod?: (value: any, data: any, node: any) => void;
+ filterNodeMethod?: (value: any, data: any, node: any) => boolean;
accordion?: boolean;
indent?: number;
icon?: any;
diff --git a/packages/editor/src/fields/CodeSelect.vue b/packages/editor/src/fields/CodeSelect.vue
index 9403cc18..4d7354f2 100644
--- a/packages/editor/src/fields/CodeSelect.vue
+++ b/packages/editor/src/fields/CodeSelect.vue
@@ -35,6 +35,7 @@ const codeConfig = computed(() => ({
items: [
{
type: 'code-select-col',
+ labelWidth: 0,
},
],
}));
diff --git a/packages/editor/src/fields/EventSelect.vue b/packages/editor/src/fields/EventSelect.vue
index 8c2a67ff..4beb118a 100644
--- a/packages/editor/src/fields/EventSelect.vue
+++ b/packages/editor/src/fields/EventSelect.vue
@@ -132,6 +132,7 @@ const compActionConfig = computed(() => {
const codeActionConfig = computed(() => {
const defaultCodeActionConfig = {
type: 'code-select-col',
+ labelWidth: 0,
display: (mForm: FormState, { model }: { model: Record }) => model.actionType === ActionType.CODE,
};
return { ...defaultCodeActionConfig, ...props.config.codeActionConfig };
diff --git a/packages/editor/src/layouts/sidebar/LayerPanel.vue b/packages/editor/src/layouts/sidebar/LayerPanel.vue
index b2b1a14d..40b645a2 100644
--- a/packages/editor/src/layouts/sidebar/LayerPanel.vue
+++ b/packages/editor/src/layouts/sidebar/LayerPanel.vue
@@ -87,6 +87,8 @@ const clicked = ref(false);
const treeProps = {
children: 'items',
+ label: 'name',
+ value: 'id',
disabled: (data: MNode) => Boolean(data.items?.length),
class: (data: MNode) => {
if (clicked.value || isPage(data)) return '';
diff --git a/packages/editor/src/layouts/sidebar/code-block/CodeBlockList.vue b/packages/editor/src/layouts/sidebar/code-block/CodeBlockList.vue
index 1412b87b..da09655a 100644
--- a/packages/editor/src/layouts/sidebar/code-block/CodeBlockList.vue
+++ b/packages/editor/src/layouts/sidebar/code-block/CodeBlockList.vue
@@ -18,6 +18,7 @@
:default-expanded-keys="expandedKeys"
:expand-on-click-node="false"
:data="codeList"
+ :props="treeProps"
:highlight-current="true"
:filter-node-method="filterNode"
@node-click="clickHandler"
@@ -75,6 +76,12 @@ const props = defineProps<{
paramsColConfig?: ColumnConfig;
}>();
+const treeProps = {
+ children: 'children',
+ label: 'name',
+ value: 'id',
+};
+
const { codeBlockService, depService, editorService } = inject('services') || {};
// 代码块列表
diff --git a/packages/editor/src/utils/props.ts b/packages/editor/src/utils/props.ts
index 98cd42a7..23a6ded4 100644
--- a/packages/editor/src/utils/props.ts
+++ b/packages/editor/src/utils/props.ts
@@ -182,6 +182,7 @@ export const fillConfig = (config: FormConfig = []) => [
{
name: 'events',
type: 'event-select',
+ labelWidth: 0,
},
],
},
diff --git a/packages/form/src/containers/Container.vue b/packages/form/src/containers/Container.vue
index e3dd7f61..31f31ff3 100644
--- a/packages/form/src/containers/Container.vue
+++ b/packages/form/src/containers/Container.vue
@@ -317,7 +317,7 @@ const display = computed((): boolean => {
return value;
});
-const itemLabelWidth = computed(() => props.config.labelWidth || props.labelWidth);
+const itemLabelWidth = computed(() => props.config.labelWidth ?? props.labelWidth);
watchEffect(() => {
expand.value = props.expandMore;
diff --git a/packages/form/src/theme/form.scss b/packages/form/src/theme/form.scss
index ac8efad4..62f6e2ec 100644
--- a/packages/form/src/theme/form.scss
+++ b/packages/form/src/theme/form.scss
@@ -34,4 +34,10 @@
display: none;
}
}
+
+ .t-form__item.hidden {
+ > .t-form__label {
+ display: none;
+ }
+ }
}
diff --git a/packages/tdesign-vue-next-adapter/package.json b/packages/tdesign-vue-next-adapter/package.json
index 52980c38..4a02bb81 100644
--- a/packages/tdesign-vue-next-adapter/package.json
+++ b/packages/tdesign-vue-next-adapter/package.json
@@ -36,12 +36,10 @@
"typescript"
],
"dependencies": {
- "element-plus": "^2.2.32",
"tdesign-vue-next": "^1.3.1",
"vue": "^3.2.37"
},
"peerDependencies": {
- "element-plus": "^2.2.32",
"tdesign-vue-next": "^1.3.1",
"vue": "^3.2.37"
},
diff --git a/packages/tdesign-vue-next-adapter/src/Scrollbar.vue b/packages/tdesign-vue-next-adapter/src/Scrollbar.vue
new file mode 100644
index 00000000..7fe609c4
--- /dev/null
+++ b/packages/tdesign-vue-next-adapter/src/Scrollbar.vue
@@ -0,0 +1,9 @@
+
+
+
+
+
diff --git a/packages/tdesign-vue-next-adapter/src/TableColumn.vue b/packages/tdesign-vue-next-adapter/src/TableColumn.vue
new file mode 100644
index 00000000..8f01dcfc
--- /dev/null
+++ b/packages/tdesign-vue-next-adapter/src/TableColumn.vue
@@ -0,0 +1,5 @@
+
+
+
+
+
diff --git a/packages/tdesign-vue-next-adapter/src/Tree.vue b/packages/tdesign-vue-next-adapter/src/Tree.vue
new file mode 100644
index 00000000..ba566472
--- /dev/null
+++ b/packages/tdesign-vue-next-adapter/src/Tree.vue
@@ -0,0 +1,126 @@
+
+
+
+
+
diff --git a/packages/tdesign-vue-next-adapter/src/index.ts b/packages/tdesign-vue-next-adapter/src/index.ts
index 4c8c9364..886854db 100644
--- a/packages/tdesign-vue-next-adapter/src/index.ts
+++ b/packages/tdesign-vue-next-adapter/src/index.ts
@@ -1,17 +1,4 @@
import { h } from 'vue';
-import {
- ElDrawer,
- ElDropdown,
- ElDropdownItem,
- ElDropdownMenu,
- ElMessageBox,
- ElPagination,
- ElPopover,
- ElScrollbar,
- ElTable,
- ElTableColumn,
- ElTree,
-} from 'element-plus';
import {
Badge as TBadge,
Button as TButton,
@@ -24,13 +11,19 @@ import {
CollapsePanel as TCollapsePanel,
ColorPicker as TColorPicker,
Dialog as TDialog,
+ DialogPlugin,
Divider as TDivider,
+ Drawer as TDrawer,
+ Dropdown as TDropdown,
+ DropdownItem as TDropdownItem,
Form as TForm,
FormItem as TFormItem,
InputNumber as TInputNumber,
MessagePlugin,
Option as TOption,
OptionGroup as TOptionGroup,
+ Pagination as TPagination,
+ Popup as TPopup,
Radio as TRadio,
RadioButton as TRadioButton,
RadioGroup as TRadioGroup,
@@ -39,11 +32,13 @@ import {
StepItem as TStepItem,
Steps as TSteps,
Switch as TSwitch,
+ Table as TTable,
TabPanel as TTabPanel,
Tabs as TTabs,
Tag as TTag,
TimePicker as TTimePicker,
Tooltip as TTooltip,
+ TreeNodeModel,
Upload as TUpload,
} from 'tdesign-vue-next';
@@ -51,10 +46,27 @@ import DatePicker from './DatePicker.vue';
import Icon from './Icon.vue';
import Input from './Input.vue';
import { vLoading } from './loading';
+import Scrollbar from './Scrollbar.vue';
+import TableColumn from './TableColumn.vue';
+import Tree from './Tree.vue';
const adapter: any = {
message: MessagePlugin,
- messageBox: ElMessageBox,
+ messageBox: {
+ alert: (msg: string) => {
+ DialogPlugin.alert({
+ body: msg,
+ });
+ },
+ confirm: (msg: string) => {
+ DialogPlugin.confirm({
+ body: msg,
+ });
+ },
+ close: (msg: string) => {
+ console.log(msg);
+ },
+ },
loading: vLoading,
components: {
badge: {
@@ -183,22 +195,49 @@ const adapter: any = {
},
drawer: {
- component: ElDrawer,
- props: (props: any) => props,
+ component: TDrawer,
+ props: (props: any) => ({
+ visible: props.modelValue,
+ size: props.size,
+ closeOnEscKeydown: props.closeOnPressEscape,
+ closeOnOverlayClick: props.closeOnClickModal,
+ attach: props.appendToBody ? 'body' : undefined,
+ placement: {
+ rtl: 'right',
+ ltr: 'left',
+ ttb: 'top',
+ bt: 'bottom',
+ }[props.direction as string],
+ }),
},
dropdown: {
- component: ElDropdown,
- props: (props: any) => props,
+ component: TDropdown,
+ props: (props: any) => ({
+ maxHeight: props.maxHeight,
+ disabled: props.disable,
+ direction: props.placement,
+ trigger: props.trigger,
+ hideAfterItemClick: props.hideOnClick,
+ popupProps: {
+ overlayClassName: props.popperClass,
+ ...(props.popperOptions || {}),
+ },
+ }),
},
dropdownItem: {
- component: ElDropdownItem,
- props: (props: any) => props,
+ component: TDropdownItem,
+ props: (props: any) => ({
+ disabled: props.disabled,
+ divider: props.divided,
+ prefixIcon: props.icon && (() => h(props.icon)),
+ onClick: props.command?.(),
+ }),
},
dropdownMenu: {
- component: ElDropdownMenu,
+ component: TDropdown,
props: (props: any) => props,
},
@@ -261,13 +300,24 @@ const adapter: any = {
},
pagination: {
- component: ElPagination,
- props: (props: any) => props,
+ component: TPagination,
+ props: (props: any) => ({
+ current: props.curPage,
+ pageSizeOptions: props.pageSizes,
+ pageSize: props.pagesize,
+ total: props.total,
+ }),
},
popover: {
- component: ElPopover,
- props: (props: any) => props,
+ component: TPopup,
+ props: (props: any) => ({
+ placement: props.placement,
+ trigger: props.trigger,
+ content: props.content,
+ disabled: props.disabled,
+ overlayClassName: props.popperClass,
+ }),
},
radio: {
@@ -298,7 +348,7 @@ const adapter: any = {
},
scrollbar: {
- component: ElScrollbar,
+ component: Scrollbar,
props: (props: any) => props,
},
@@ -347,12 +397,12 @@ const adapter: any = {
},
table: {
- component: ElTable,
+ component: TTable,
props: (props: any) => props,
},
tableColumn: {
- component: ElTableColumn,
+ component: TableColumn,
props: (props: any) => props,
},
@@ -400,8 +450,29 @@ const adapter: any = {
},
tree: {
- component: ElTree,
- props: (props: any) => props,
+ component: Tree,
+ props: (props: any) => ({
+ ...props,
+ data: props.data,
+ draggable: props.draggable,
+ activable: props.highlightCurrent,
+ activeMultiple: props.highlightCurrent,
+ defaultActived: props.defaultCheckedKeys,
+ checkable: props.showCheckbox,
+ empty: props.emptyText,
+ expandAll: props.defaultExpandAll,
+ checkStrictly: props.checkStrictly,
+ load: props.load,
+ keys: props.props,
+ }),
+ listeners: {
+ click(context: { node: TreeNodeModel; e: MouseEvent }) {
+ return {
+ node: context.node,
+ data: context.node.data,
+ };
+ },
+ },
},
upload: {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index d9f5a7e5..005a996a 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -519,9 +519,6 @@ importers:
packages/tdesign-vue-next-adapter:
dependencies:
- element-plus:
- specifier: ^2.2.32
- version: 2.2.32(vue@3.2.37)
tdesign-vue-next:
specifier: ^1.3.1
version: 1.3.1(vue@3.2.37)