diff --git a/CHANGELOG.md b/CHANGELOG.md index dbfd405bb02eef2f77874c71b6da7b2e14f976cc..fab8a6ffdf470b5bdff246b57fb5c5bb5cf3c796 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -18,6 +18,8 @@ - 新增列表新建和拖拽功能 - 新增表格动态控件参数grouprowmode，控制分组行模式 - 新增重复器表格排序 +- 新增卡片，列表，看板项拖拽图标 +- 日历，树，甘特，树表格增强部件支持opendata，newdata ### Changed diff --git a/src/control/data-view/data-view.scss b/src/control/data-view/data-view.scss index 409d19a32d4a101d6c146958efa90b0395db1c91..ef4c3579cc16802daa8590ac887130d249639568 100644 --- a/src/control/data-view/data-view.scss +++ b/src/control/data-view/data-view.scss @@ -39,6 +39,11 @@ $control-dataview-group-item-content: ( cursor: pointer; } + @include e(drag-icon) { + cursor: move; + visibility: hidden; + } + // 内容区样式 @include e(content) { flex-grow: 1; @@ -122,6 +127,9 @@ $control-dataview-group-item-content: ( &:hover { background-color: getCssVar(control-dataview, hover-bg-color); + .#{bem(control-dataview, drag-icon)} { + visibility: visible; + } } @include e(new) { diff --git a/src/control/data-view/data-view.tsx b/src/control/data-view/data-view.tsx index f31e59e7d7b2b8976ca490e1e306e4402134a251..351f31a4592c6f80a2a751a5ede2503c90fcd1ba 100644 --- a/src/control/data-view/data-view.tsx +++ b/src/control/data-view/data-view.tsx @@ -359,6 +359,23 @@ export const DataViewControl = defineComponent({ } >
+ {c.state.draggable && !c.state.readonly && ( + + + + + + + + )} {cardStyle.value === 'style2' && !c.state.singleSelect && ( onDraggableChange(evt, group?.key)} diff --git a/src/control/kanban/kanban.scss b/src/control/kanban/kanban.scss index 5c372a2effa175f8741a2b8d5f54127bf635bf26..5a0472937e958e30c8a462076f3c153f89032246 100644 --- a/src/control/kanban/kanban.scss +++ b/src/control/kanban/kanban.scss @@ -21,6 +21,12 @@ $control-kanban: ( } } + @include e(drag-icon) { + margin-right: getCssVar('spacing', 'tight'); + cursor: move; + visibility: hidden; + } + @include e(content) { display: flex; flex-grow: 1; @@ -221,14 +227,26 @@ $control-kanban: ( &:hover { background-color: getCssVar(control-kanban, hover-bg-color); + .#{bem(control-kanban, drag-icon)} { + visibility: visible; + } } @include when(selected) { background-color: getCssVar(control-kanban, selected-bg-color); } + @include when(disabled) { cursor: no-drop; } + + @include e(content) { + display: flex; + align-items: center; + width: 100%; + height: 100%; + } + @include e(bottom) { display: flex; align-items: center; diff --git a/src/control/kanban/kanban.tsx b/src/control/kanban/kanban.tsx index 0995ad9fd1e2420587281112eee1acffd01a118c..38510ce916618110102b490b990a8df787d7857a 100644 --- a/src/control/kanban/kanban.tsx +++ b/src/control/kanban/kanban.tsx @@ -361,9 +361,28 @@ export const KanbanControl = defineComponent({ onDbRowClick(item, event) } > - {panel - ? renderPanelItemLayout(item, panel) - : renderDefaultItem(item, group)} +
+ {c.state.draggable && !c.state.readonly && ( + + + + + + + + )} + {panel + ? renderPanelItemLayout(item, panel) + : renderDefaultItem(item, group)} +
); }; @@ -556,10 +575,11 @@ export const KanbanControl = defineComponent({ ]} > @@ -629,9 +630,33 @@ export const SwimlaneKanban = defineComponent({ onClick={() => c.onRowClick(element)} onDblclick={() => c.onDbRowClick(element)} > - {c.model.itemLayoutPanel - ? renderPanelItemLayout(lane, element) - : renderDefaultItem(lane, element, group)} +
+ {c.state.draggable && + !c.state.readonly && + c.draggableMode !== 0 && ( + + + + + + + + )} + {c.model.itemLayoutPanel + ? renderPanelItemLayout(lane, element) + : renderDefaultItem(lane, element, group)} +
); }, diff --git a/src/control/list/list.scss b/src/control/list/list.scss index f150cd44c7229f798f3377e94289e4dc8aa0b3fe..72dea665315ba67d8c000c2711260fbab4da638b 100644 --- a/src/control/list/list.scss +++ b/src/control/list/list.scss @@ -50,8 +50,8 @@ $control-list-group-style2: ( display: flex; align-items: center; justify-content: center; - color: getCssVar(color, text, 3); margin-top: getCssVar(spacing, tight); + color: getCssVar(color, text, 3); border: 2px dashed getCssVar(color, border); } } @@ -63,6 +63,11 @@ $control-list-group-style2: ( position: relative; height: 100%; + @include e(drag-icon) { + cursor: move; + visibility: hidden; + } + @include e(nav-icon) { position: absolute; top: 18px; @@ -163,6 +168,9 @@ $control-list-group-style2: ( &:hover { background-color: getCssVar(control-list, hover-bg-color); + .#{bem(control-list, drag-icon)} { + visibility: visible; + } } @include when(active) { diff --git a/src/control/list/list.tsx b/src/control/list/list.tsx index ce0c5e57250ed9150a9e72f80bbfbabbfd4683c0..2919c2e68c19880e98710b2313bd42b3dd9317c3 100644 --- a/src/control/list/list.tsx +++ b/src/control/list/list.tsx @@ -360,6 +360,23 @@ export const ListControl = defineComponent({ style={cardStyle} class={[ns.b('scroll-item'), ns.is('active', isSelected(item))]} > + {c.state.draggable && !c.state.readonly && ( + + + + + + + + )} {c.model.controlStyle === 'EXTVIEW2' && !c.state.singleSelect && ( onDraggableChange(evt, group?.key)} diff --git a/src/view-engine/calendar-view.engine.ts b/src/view-engine/calendar-view.engine.ts index e47f9ab332d4afa8d71d657019e24cb46f92fb30..19d6510488ff90826ba592be65c02a3304e5c740 100644 --- a/src/view-engine/calendar-view.engine.ts +++ b/src/view-engine/calendar-view.engine.ts @@ -4,6 +4,7 @@ import { ICalendarViewState, MDViewEngine, EventBase, + IUIActionResult, } from '@ibiz-template/runtime'; import { IAppDECalendarView } from '@ibiz/model-core'; @@ -27,4 +28,24 @@ export class CalendarViewEngine extends MDViewEngine { } this.view.slotProps.calendar.mdctrlActiveMode = model.mdctrlActiveMode!; } + + protected async openData(args: { + data: IData[]; + event?: MouseEvent; + context?: IContext; + params?: IParams; + }): Promise { + const { data, event } = args; + const result = await (this.xdataControl as IData).openData(data[0], event); + return result; + } + + protected async newData(args: { + data: IData[]; + event?: MouseEvent; + }): Promise { + const { data, event } = args; + const result = await (this.xdataControl as IData).newData(data[0], event); + return result; + } } diff --git a/src/view-engine/gantt-view.engine.ts b/src/view-engine/gantt-view.engine.ts index 8d9ba1e3039c9fbd591e77a3ae72b93ca91df30f..aa01d7d56ccaee0f6fff592aad74ab9c6fb8dca9 100644 --- a/src/view-engine/gantt-view.engine.ts +++ b/src/view-engine/gantt-view.engine.ts @@ -1,12 +1,13 @@ import { RuntimeError } from '@ibiz-template/core'; import { + EventBase, MDViewEngine, + SysUIActionTag, ViewController, IGanttViewState, IGanttViewEvent, + IUIActionResult, IGanttController, - SysUIActionTag, - EventBase, IApiGanttViewCall, } from '@ibiz-template/runtime'; import { IAppDEGanttView } from '@ibiz/model-core'; @@ -99,4 +100,24 @@ export class GanttViewEngine extends MDViewEngine { } this.view.slotProps.gantt.mdctrlActiveMode = model.mdctrlActiveMode!; } + + protected async openData(args: { + data: IData[]; + event?: MouseEvent; + context?: IContext; + params?: IParams; + }): Promise { + const { data, event } = args; + const result = await (this.xdataControl as IData).openData(data[0], event); + return result; + } + + protected async newData(args: { + data: IData[]; + event?: MouseEvent; + }): Promise { + const { data, event } = args; + const result = await (this.xdataControl as IData).newData(data[0], event); + return result; + } } diff --git a/src/view-engine/tree-view.engine.ts b/src/view-engine/tree-view.engine.ts index 32428514540b3252f50ee98a658ee9a36df0bd9c..ce0caf8742b2016c972647064c410ff3cbded5de 100644 --- a/src/view-engine/tree-view.engine.ts +++ b/src/view-engine/tree-view.engine.ts @@ -6,6 +6,7 @@ import { ITreeController, SysUIActionTag, IApiTreeViewCall, + IUIActionResult, } from '@ibiz-template/runtime'; import { RuntimeError } from '@ibiz-template/core'; import { IAppDETreeView } from '@ibiz/model-core'; @@ -86,4 +87,24 @@ export class TreeViewEngine extends MDViewEngine { } return super.call(key, args); } + + protected async openData(args: { + data: IData[]; + event?: MouseEvent; + context?: IContext; + params?: IParams; + }): Promise { + const { data, event } = args; + const result = await (this.xdataControl as IData).openData(data[0], event); + return result; + } + + protected async newData(args: { + data: IData[]; + event?: MouseEvent; + }): Promise { + const { data, event } = args; + const result = await (this.xdataControl as IData).newData(data[0], event); + return result; + } }