vxe-pc-ui 3.15.24 → 3.15.26

package/packages/list/src/util.ts

@@ -0,0 +1,11 @@
+
+import type { VxeListDefines } from '../../../types'
+
+export function getItemCacheObj (item: any): VxeListDefines.RowCacheItem {
+  return {
+    item,
+    index: -1,
+    $index: -1,
+    _index: -1
+  }
+}

package/packages/ui/index.ts

@@ -234,6 +234,9 @@ setConfig({
   listView: {},
   list: {
     // size: null,
+    rowConfig: {
+      contentField: 'label'
+    },
     dragConfig: {
       showIcon: true,
       animation: true,

package/styles/components/list.scss

@@ -137,23 +137,27 @@
   flex-direction: row;
   align-items: center;
 }
-.vxe-list--row-drag {
+.vxe-list--row-drag,
+.vxe-list--row-content,
+.vxe-list--row-extra {
   display: flex;
   flex-direction: row;
   align-items: center;
+}
+.vxe-list--row-drag {
   flex-shrink: 0;
   padding-right: var(--vxe-ui-list-current-padding);
 }
 .vxe-list--row-content {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
   flex-grow: 1;
   height: var(--vxe-ui-list-row-height);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+.vxe-list--row-extra {
+  flex-shrink: 0;
+}
 
 .vxe-list--drag-handle {
   &:not(.is--disabled) {

package/types/components/date-panel.d.ts

@@ -17,7 +17,7 @@ export interface VxeDatePanelPrivateRef extends DatePanelPrivateRef { }
 
 export namespace VxeDatePanelPropTypes {
   export type Size = VxeComponentSizeType
-  export type ModelValue = string | number | Date | null
+  export type ModelValue = string | number | Date | null | (string | number | Date | null)[]
   export type ClassName = string
   export type CellClassName = string | ((params: {
     $datePanel: VxeDatePanelConstructor
@@ -115,6 +115,8 @@ export interface VxeDatePanelProps {
 }
 
 export interface DatePanelPrivateComputed {
+  computeSize: VxeDatePanelPropTypes.Size
+  computeYearList: VxeDatePanelDefines.DateYearItem[]
 }
 export interface VxeDatePanelPrivateComputed extends DatePanelPrivateComputed { }
 

package/types/components/date-range-picker.d.ts

@@ -196,8 +196,8 @@ export interface DateRangePickerReactData {
   isActivated: boolean
   selectStValue: any
   selectEdValue: any
-  paneStartVal: string
-  paneEndVal: string
+  paneStartVal: (string | number | Date | null)[]
+  paneEndVal: (string | number | Date | null)[]
 }
 
 export interface DateRangePickerInternalData {

package/types/components/list.d.ts

@@ -1,4 +1,5 @@
 import { DefineVxeComponentApp, DefineVxeComponentOptions, DefineVxeComponentInstance, VxeComponentEventParams, VxeComponentSizeType, ValueOf } from '@vxe-ui/core'
+import { VxeContextMenuPropTypes, VxeContextMenuDefines } from './context-menu'
 
 /* eslint-disable @typescript-eslint/no-empty-interface,no-use-before-define,@typescript-eslint/ban-types,@typescript-eslint/no-unused-vars */
 
@@ -25,6 +26,7 @@ export namespace VxeListPropTypes {
   export type ClassName = string | ((params: { $list: VxeListConstructor }) => string)
   export type SyncResize = boolean | string | number
 
+  export type ShowSeq = boolean
   export type ShowRadio = boolean
   export type CheckRowKey = string | number | null
   export interface RadioConfig<D = any> {
@@ -113,6 +115,10 @@ export namespace VxeListPropTypes {
      * 触发拖拽方式
      */
     trigger?: 'default' | 'row' | '' | null
+    /**
+     * 是否允许在不同列表之间进行拖拽
+     */
+    isCrossListDrag?: boolean
     /**
      * 是否显示拖拽辅助状态显示
      */
@@ -152,6 +158,25 @@ export namespace VxeListPropTypes {
     dragEndMethod?(params: Omit<VxeListDefines.RowDragendEventParams<D>, '_index'>): Promise<boolean> | boolean
   }
 
+  export interface MenuConfig<D = any> {
+    /**
+     * 是否启用
+     */
+    enabled?: boolean
+    /**
+     * 菜单配置
+     */
+    options: VxeContextMenuPropTypes.Options
+    /**
+     * 该函数的返回值用来决定是否允许显示右键菜单（对于需要对菜单进行权限控制时可能会用到）
+     */
+    visibleMethod?(params: {
+      $list: VxeListConstructor
+      options: VxeContextMenuPropTypes.Options
+      row: D
+    }): boolean
+  }
+
   export interface VirtualYConfig {
     /**
      * 指定大于指定行时自动启动纵向虚拟滚动，如果为 0 则总是启用，如果为 -1 则关闭
@@ -204,6 +229,7 @@ export interface VxeListProps<D = any> {
   autoResize?: VxeListPropTypes.AutoResize
   syncResize?: VxeListPropTypes.SyncResize
   className?: VxeListPropTypes.ClassName
+  showSeq?: VxeListPropTypes.ShowSeq
   showRadio?: VxeListPropTypes.ShowRadio
   checkRowKey?: VxeListPropTypes.CheckRowKey
   radioConfig?: VxeListPropTypes.RadioConfig
@@ -212,6 +238,7 @@ export interface VxeListProps<D = any> {
   checkboxConfig?: VxeListPropTypes.CheckboxConfig
   rowConfig?: VxeListPropTypes.RowConfig
   dragConfig?: VxeListPropTypes.DragConfig
+  menuConfig?: VxeListPropTypes.MenuConfig
   virtualYConfig?: VxeListPropTypes.VirtualYConfig
 
   /**
@@ -241,14 +268,20 @@ export interface ListReactData {
   isAllChecked: boolean
   isAllIndeterminate: boolean
 
+  insertRowFlag: number
+  removeRowFlag: number
+
   dragRow: any
   dragTipText: string
+  isCrossDragRow: boolean
 }
 
 export interface ListInternalData {
   resizeObserver: ResizeObserver | undefined
   fullData: any[]
+  afterList: any[]
   fullKeyMaps: Record<string, any>
+  rowMaps: Record<string, VxeListDefines.RowCacheItem>
   lastScrollLeft: number
   lastScrollTop: number
   scrollYStore: {
@@ -261,6 +294,9 @@ export interface ListInternalData {
   currentRow: any
   selectCheckboxMaps: Record<string, any>
 
+  insertRowMaps: Record<string, any>
+  removeRowMaps: Record<string, any>
+
   prevDragRow?: any
   prevDragPos?: 'top' | 'bottom' | ''
 }
@@ -420,10 +456,67 @@ export interface ListMethods<D = any> {
    * 只对 show-checkbox 有效，设置所有行的选中状态
    */
   setAllCheckboxRow(checked: boolean): Promise<void>
+
+  /**
+   * 往列表插入临时数据，从第一个行新增一个行或多个行新数据
+   */
+  insert(records: any): Promise<{ row: D, rows: D[] }>
+  /**
+   * 往列表指定行中插入临时数据
+   * 如果 row 为空则从插入到顶部，如果为树结构，则插入到目标行顶部
+   * 如果 row 为 -1 则从插入到底部，如果为树结构，则插入到目标行底部
+   * 如果 row 为有效行则插入到该行的位置
+   */
+  insertAt(records: any, targetRowOrRowKey?: any | -1 | null): Promise<{ row: D, rows: D[] }>
+  /**
+   * 用于 transform 模式，与 insertAt 行为一致，区别就是会插入指定目标的到下一行
+   */
+  insertNextAt(records: any, targetRowOrRowKey?: any | -1 | null): Promise<{ row: D, rows: D[] }>
+  /**
+   * 判断行是否为新增的临时数据
+   */
+  isInsertByRow(row: any | null): boolean
+  /**
+   * 用于 transform 模式，删除指定行数据，指定 row 或 [row, ...] 删除多条数据，如果为空则删除所有数据
+   */
+  remove(rows?: any | any[]): Promise<{ row: D, rows: D[] }>
+  /**
+   * 用于 transform 模式，获取新增的临时数据
+   */
+  getInsertRecords(): D[]
+  /**
+   * 用于 transform 模式，获取已删除的数据
+   */
+  getRemoveRecords(): D[]
+  /**
+   * 判断数据是否被删除
+   */
+  isRemoveByRow(row: any | null): boolean
 }
 export interface VxeListMethods<D = any> extends ListMethods<D> { }
 
-export interface ListPrivateMethods<D = any> {}
+export interface ListPrivateMethods<D = any> {
+  /**
+   * @private
+   */
+  handleCrossListRowDragInsertEvent(evnt: DragEvent): void
+  /**
+   * @private
+   */
+  handleCrossListRowDragCancelEvent(evnt: DragEvent): void
+  /**
+   * @private
+   */
+  handleCrossListRowDragFinishEvent(evnt: DragEvent): void
+  /**
+   * @private
+   */
+  handleCrossListRowDragoverEmptyEvent(evnt: DragEvent): void
+  /**
+   * @private
+   */
+  hideCrossListRowDropClearStatus(): void
+}
 export interface VxeListPrivateMethods<D = any> extends ListPrivateMethods<D> { }
 
 export type VxeListEmits = [
@@ -438,12 +531,24 @@ export type VxeListEmits = [
   'scroll',
   'row-dragstart',
   'row-dragover',
-  'row-dragend'
+  'row-dragend',
+  'row-remove-dragend',
+  'row-insert-dragend',
+  'row-menu',
+  'menu-click'
 ]
 
 export namespace VxeListDefines {
-  export interface ListEventParams extends VxeComponentEventParams {
-    $list: VxeListConstructor
+
+  export interface RowCacheItem {
+    item: any
+    index: number
+    $index: number
+    _index: number
+  }
+
+  export interface ListEventParams<D = any> extends VxeComponentEventParams {
+    $list: VxeListConstructor<D>
   }
 
   export interface RowClickParams<D = any> {
@@ -479,6 +584,12 @@ export namespace VxeListDefines {
 
   export interface ScrollParams { }
   export interface ScrollEventParams extends ListEventParams, ScrollParams { }
+
+  export interface MenuClickEventParams<D = any> extends ListEventParams<D> {
+    row: D
+    menu: VxeContextMenuDefines.MenuFirstOption | VxeContextMenuDefines.MenuChildOption
+  }
+
 }
 
 export type VxeListEventProps<D = any> = {
@@ -488,6 +599,7 @@ export type VxeListEventProps<D = any> = {
   onRowDragstart?: VxeListEvents.RowDragstart<D>
   onRowDragover?: VxeListEvents.RowDragover<D>
   onRowDragend?: VxeListEvents.RowDragend<D>
+  onMenuClick?: VxeListEvents.MenuClick<D>
 }
 
 export interface VxeListListeners<D = any> {
@@ -497,6 +609,7 @@ export interface VxeListListeners<D = any> {
   rowDragstart?: VxeListEvents.RowDragstart<D>
   rowDragover?: VxeListEvents.RowDragover<D>
   rowDragend?: VxeListEvents.RowDragend<D>
+  menuClick?: VxeListEvents.MenuClick<D>
 }
 
 export namespace VxeListEvents {
@@ -506,6 +619,7 @@ export namespace VxeListEvents {
   export type RowDragstart<D = any> = (params: VxeListDefines.RowDragstartEventParams<D>) => void
   export type RowDragover<D = any> = (params: VxeListDefines.RowDragoverEventParams<D>) => void
   export type RowDragend<D = any> = (params: VxeListDefines.RowDragendEventParams<D>) => void
+  export type MenuClick<D = any> = (params: VxeListDefines.MenuClickEventParams<D>) => void
 }
 
 export namespace VxeListSlotTypes {
@@ -519,6 +633,7 @@ export namespace VxeListSlotTypes {
   export interface ContentSlotParams<D = any> {
     row: D
   }
+  export interface ExtraSlotParams<D = any> extends ContentSlotParams<D> {}
   export interface DragSlotParams<D = any> {
     row: D
   }
@@ -529,6 +644,7 @@ export interface VxeListSlots {
   header?:(params: VxeListSlotTypes.HeaderSlotParams) => any
   footer?:(params: VxeListSlotTypes.FooterSlotParams) => any
   content?:(params: VxeListSlotTypes.ContentSlotParams) => any
+  extra?:(params: VxeListSlotTypes.ExtraSlotParams) => any
   tip?:(params: VxeListSlotTypes.DragSlotParams) => any
 }
 

package/types/components/tree.d.ts

@@ -653,7 +653,7 @@ export interface TreeMethods<D = any> {
    */
   scrollToNodeId(nodeKey: string | number | null): Promise<void>
 
-  /**
+    /**
    * 手动清除滚动相关信息，还原到初始状态
    */
   clearScroll(): Promise<void>
@@ -668,15 +668,11 @@ export interface TreeMethods<D = any> {
    * 如果 node 为 -1 则从插入到底部，如果为树结构，则插入到目标节点底部
    * 如果 node 为有效节点则插入到该节点的位置，如果为树结构，则有插入到效的目标节点该节点的位置
    */
-  insertAt(records: any, targetNodeOrNodeid?: any | -1 | null): Promise<{ node: D, nodes: D[] }>
+  insertAt(records: any, targetNodeOrNodeKey?: any | -1 | null): Promise<{ node: D, nodes: D[] }>
   /**
    * 用于 transform 模式，与 insertAt 节点为一致，区别就是会插入指定目标的到下一节点
    */
-  insertNextAt(records: any, targetNodeOrNodeid?: any | -1 | null): Promise<{ node: D, nodes: D[] }>
-  /**
-   * 判断行是否为新增的临时数据
-   */
-  insertNextAt(records: any, targetNodeOrNodeid?: any | -1 | null): Promise<{ node: D, nodes: D[] }>
+  insertNextAt(records: any, targetNodeOrNodeKey?: any | -1 | null): Promise<{ node: D, nodes: D[] }>
   /**
    * 用于树结构，往指定节点插入子级临时数据，从子级的第一行新增一行或多行新数据
    */

package/types/ui/menus.d.ts

@@ -1,6 +1,7 @@
 import { VxeTableConstructor, VxeTableDefines } from '../components/table'
 import { VxeGridConstructor } from '../components/grid'
 import { VxeTreeConstructor } from '../components/tree'
+import { VxeListConstructor } from '../components/list'
 import { VxeCalendarConstructor } from '../components/calendar'
 import { VxeFormDesignConstructor, VxeFormDesignDefines } from '../components/form-design'
 import { VxeMenuConstructor, VxeMenuPropTypes } from '../components/menu'
@@ -19,6 +20,10 @@ declare module '@vxe-ui/core' {
        * 树 - 自定义菜单方法
        */
       treeMenuMethod?: (params: TreeMenuMethodParams, event: Event) => void
+      /**
+       * 列表 - 自定义菜单方法
+       */
+      listMenuMethod?: (params: ListMenuMethodParams, event: Event) => void
       /**
        * 日历 - 自定义菜单方法
        */
@@ -47,12 +52,19 @@ declare module '@vxe-ui/core' {
     }
 
     export interface TreeMenuMethodParams<D = any> {
-      $tree: VxeTreeConstructor
+      $tree: VxeTreeConstructor<D>
       $event: MouseEvent
       node: D
       menu: VxeContextMenuDefines.MenuFirstOption | VxeContextMenuDefines.MenuChildOption
     }
 
+    export interface ListMenuMethodParams<D = any> {
+      $list: VxeListConstructor<D>
+      $event: MouseEvent
+      row: D
+      menu: VxeContextMenuDefines.MenuFirstOption | VxeContextMenuDefines.MenuChildOption
+    }
+
     export interface CalendarMenuMethodParams {
       $calendar: VxeCalendarConstructor
       $event: MouseEvent