@wzyjs/uis 0.3.29 → 0.3.30

package/src/components/Crud/index.tsx

@@ -1,91 +0,0 @@
-'use client'
-
-import { Space } from 'antd'
-import { DragSortTable, ProTable } from '@ant-design/pro-components'
-
-import { CardList, CreateUpdate, Provider } from './components'
-
-import { useColumns, useList, useOrderable, useRequest } from './hooks'
-
-export type { ProColumnsPro } from './types'
-import type { CrudProps } from './types'
-
-export const Crud = (props_: CrudProps) => {
-  const props = { ...props_ }
-
-  if (props.readonly) {
-    props.create = props.create ?? false
-    props.update = props.update ?? false
-    props.remove = props.remove ?? false
-  }
-
-  const { crud, columns, list, create, update, remove, orderable } = props
-
-  const { tableColumns, dataSource, dragSortKey, onDragSortEnd } = useOrderable({
-    orderable,
-    columns,
-    crud,
-    update,
-    readonly: props.readonly,
-    cardMode: !!list?.cardConfig,
-  })
-
-  const { finalColumns } = useColumns({ columns: tableColumns, crud, update, remove })
-
-  const { finalList } = useList({ list })
-
-  const { request } = useRequest({ list, columns })
-
-  const TableComponent = dragSortKey ? DragSortTable : ProTable
-
-  return (
-    <Provider crud={crud}>
-      <TableComponent
-        rowKey='id'
-        loading={crud.listState.isLoading}
-        columns={finalColumns as any}
-        scroll={{ x: 'max-content' }}
-        search={{
-          labelWidth: 'auto',
-        }}
-        dataSource={dataSource}
-        request={request}
-        dragSortKey={dragSortKey}
-        onDragSortEnd={onDragSortEnd as any}
-        pagination={{
-          total: crud.countState.data,
-          showSizeChanger: true,
-          showQuickJumper: true,
-          defaultPageSize: 10,
-          pageSizeOptions: ['10', '15', '20', '30', '50'],
-          showTotal: (total, range) => `第 ${range[0]}-${range[1]} 条/总共 ${total} 条`,
-        }}
-        toolBarRender={() => [
-          create !== false ? (
-            <CreateUpdate
-              key='create'
-              crud={crud}
-              columns={tableColumns}
-              config={create || {}}
-            />
-          ) : null,
-        ].filter(Boolean)}
-        tableRender={list?.cardConfig ? (props, dom, domList) => (
-          <Space style={{ width: '100%' }}>
-            {domList.toolbar}
-            <CardList
-              crud={crud}
-              columns={columns}
-              list={list}
-              create={create}
-              update={update}
-              remove={remove}
-            />
-          </Space>
-        ) : undefined}
-        {...finalList}
-        options={{ ...(finalList as CrudProps['list'])?.options, reload: () => (crud.countState.refetch(), crud.listState.refetch()) }}
-      />
-    </Provider>
-  )
-}

package/src/components/Crud/types/index.ts

@@ -1,188 +0,0 @@
-import type { ReactNode } from 'react'
-import type { ButtonProps } from 'antd'
-import type { ProTableProps, ProFormProps, ProColumns } from '@ant-design/pro-components'
-
-// 扩展 ProColumns 类型，添加自定义的 valueType
-export type ProColumnsPro<T = any> = Omit<ProColumns<T>, 'valueType'> & {
-  valueType?: ProColumns<T>['valueType'] | 'tags' | 'enabled'
-}
-
-// 前端分页状态类型
-export interface PaginationState {
-  current: number
-  pageSize: number
-}
-
-// CRUD Hook 返回值类型（基于实际 tRPC hooks 的返回值）
-export interface Crud {
-  listState: {
-    data?: any[]
-    isLoading?: boolean
-    error?: any
-    refetch: () => any
-  }
-  countState: {
-    data?: any
-    isLoading?: boolean
-    error?: any
-    refetch: () => any
-  }
-  createState: {
-    mutate: (data: any) => void
-    mutateAsync: (data: any) => Promise<any>
-    isLoading?: boolean
-    error?: any
-  }
-  updateState: {
-    mutate: (id: string, data: any) => void
-    mutateAsync: (id: string, data: any) => Promise<any>
-    isLoading?: boolean
-    error?: any
-  }
-  removeState: {
-    mutate: (id: string) => void
-    mutateAsync: (id: string) => Promise<any>
-    isLoading?: boolean
-    error?: any
-  }
-  deleteState: {
-    mutate: (id: string) => void
-    mutateAsync: (id: string) => Promise<any>
-    isLoading?: boolean
-    error?: any
-  }
-}
-
-// 卡片字段值类型：可以是字段名或自定义渲染内容
-type CardFieldValue = string | ReactNode
-
-// 卡片配置项
-interface CardItem {
-  title?: CardFieldValue
-  extra?: CardFieldValue
-  content?: CardFieldValue
-  cover?: CardFieldValue
-  actions?: CardFieldValue[]
-  meta?: {
-    title?: CardFieldValue
-    description?: CardFieldValue
-    avatar?: CardFieldValue
-  }
-  props?: any // Card 组件的额外属性
-}
-
-interface CardConfig {
-  gutter?: [number, number] // 卡片间距
-  col?: {
-    xs?: number
-    sm?: number
-    md?: number
-    lg?: number
-    xl?: number
-    xxl?: number
-  } // 栅格配置
-  height?: string // 卡片列表容器高度
-
-  // 完全自定义渲染
-  render?: (record: any, index: number, defaultActions: ReactNode[]) => ReactNode
-
-  // 或者使用配置式渲染
-  card: CardItem | ((record: any, index: number) => CardItem)
-}
-
-// 列表配置
-export interface List extends Omit<ProTableProps<any, any>, 'columns' | 'dataSource' | 'loading'> {
-  onChangeQuery?: (query: any) => void // 用于更新查询参数
-  cardConfig?: CardConfig
-}
-
-// 创建配置
-export interface Create {
-  mode?: 'modal' | 'drawer' // 创建模式，默认为 'drawer'
-  buttonProps?: ButtonProps // 创建按钮的属性
-  formProps?: ProFormProps // 创建表单的属性
-  transformData?: (values: Record<string, unknown>) => Record<string, unknown> | Promise<Record<string, unknown>> // 提交前转换  coverData?: (record: any) => Record<string, unknown> // 转换 record 用于表单回填
-  coverData?: (record: any) => Record<string, unknown> // 转换 record 用于表单回填
-  title?: string // 弹窗标题
-  width?: number | string // 弹窗宽度
-}
-
-// 更新配置
-export interface Update {
-  mode?: 'modal' | 'drawer' // 更新模式，默认为 'drawer'
-  buttonProps?: ButtonProps // 更新按钮的属性
-  formProps?: ProFormProps // 更新表单的属性
-  transformData?: (values: Record<string, unknown>, record: any) => Record<string, unknown> | Promise<Record<string, unknown>> // 提交前转换
-  coverData?: (record: any) => Record<string, unknown> // 转换 record 用于表单回填
-  title?: string // 弹窗标题
-  width?: number | string // 弹窗宽度
-}
-
-// 删除配置
-export interface Remove {
-  confirm?: boolean // 删除前是否需要确认，默认为 true
-  buttonProps?: ButtonProps // 删除按钮的属性
-  title?: string // 确认弹窗标题
-  content?: string // 确认弹窗内容
-}
-
-export interface Orderable {
-  orderField?: string
-  start?: number
-  label?: string
-}
-
-// 主组件 Props
-export interface CrudProps {
-  // 接口
-  crud: Crud // useHabitGroupCRUD() 的返回值
-  // 列表展示配置
-  columns: ProColumnsPro[]
-  // 列表配置
-  list?: List
-  // 创建配置
-  create?: false | Create // 为 false 时不显示创建按钮
-  // 更新配置
-  update?: false | Update // 为 false 时不显示更新按钮
-  // 删除配置
-  remove?: false | Remove // 为 false 时不显示删除按钮
-  // 排序配置
-  orderable?: boolean | Orderable
-  // 只读模式，开启后上述 create/update/remove 均等同于 false
-  readonly?: boolean
-}
-
-export interface ListProps {
-  crud: Crud
-  columns: ProColumnsPro[]
-  list: List
-  create?: false | Create
-  update?: false | Update
-  remove?: false | Remove
-}
-
-// export interface CreateProps {
-//   crud: Crud
-//   columns: ProColumnsPro[]
-//   config: Create
-// }
-//
-// export interface UpdateProps {
-//   crud: Crud
-//   columns: ProColumnsPro[]
-//   config: Update
-//   record: any
-// }
-
-export interface RemoveProps {
-  crud: Crud
-  config: Remove
-  record: any
-}
-
-export interface CreateUpdateProps {
-  crud: Crud
-  columns: ProColumnsPro[]
-  config: Create | Update
-  record?: any // 可选，有值时为编辑模式，无值时为创建模式
-}

package/src/components/Crud/utils/index.ts

@@ -1,87 +0,0 @@
-import type { PaginationState, ProColumnsPro } from '../types'
-
-export const transformPagination = (pagination: PaginationState) => {
-  return {
-    skip: (pagination.current - 1) * pagination.pageSize,
-    take: pagination.pageSize,
-  }
-}
-
-export const transformOrder = (sort: Record<string, 'ascend' | 'descend'>) => {
-  const orderByFields: Array<Record<string, 'asc' | 'desc'>> = []
-
-  Object.keys(sort).forEach((key) => {
-    if (sort[key]) {
-      orderByFields.push({
-        [key]: sort[key] === 'ascend' ? 'asc' : 'desc',
-      })
-    }
-  })
-
-  // 始终返回数组格式以支持多重排序
-  return orderByFields.length > 0 ? orderByFields : undefined
-}
-
-export const transformWhere = (filter: Record<string, (string | number)[] | null>, columns: ProColumnsPro[]) => {
-  const where: Record<string, any> = {}
-
-  Object.keys(filter).forEach((key) => {
-    const value = filter[key]
-    if (value !== null && value !== undefined) {
-      const column = columns.find(col => col.dataIndex === key)
-
-      // 根据字段类型转换过滤条件
-      if (column) {
-        switch (column.valueType) {
-          case 'text':
-          case 'textarea':
-            // 文本类型使用 contains 搜索
-            if (typeof value === 'string') {
-              where[key] = { contains: value }
-            }
-            break
-          case 'select':
-          case 'option':
-            if ((column?.fieldProps as any)?.multiple) {
-              where[key] = { in: value }
-            } else {
-              where[key] = { equals: value }
-            }
-            break
-          case 'dateRange':
-          case 'dateTimeRange':
-            // 日期范围搜索
-            if (value.length >= 2) {
-              where[key] = {
-                gte: value[0],
-                lte: value[1],
-              }
-            }
-            break
-          case 'digit':
-          case 'money':
-            // 数字类型
-            if (typeof value === 'number') {
-              where[key] = { equals: value }
-            }
-            break
-          case 'switch':
-            // 布尔类型
-            if (typeof value === 'boolean') {
-              where[key] = { equals: value }
-            }
-            break
-          case 'tags':
-            where[key] = { equals: value }
-            break
-          default:
-            where[key] = { equals: value }
-        }
-      } else {
-        where[key] = { equals: value }
-      }
-    }
-  })
-
-  return Object.keys(where).length > 0 ? where : undefined
-}

package/src/components/DateSwitcher/index.module.scss

@@ -1,10 +0,0 @@
-.picker {
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-
-  :global(.ant-picker-input input) {
-    text-align: center !important;
-    cursor: pointer;
-  }
-}

package/src/components/DateSwitcher/index.tsx

@@ -1,75 +0,0 @@
-'use client'
-
-import React, { useState } from 'react'
-
-import { DatePicker, Button } from 'antd'
-import { LeftOutlined, RightOutlined } from '@ant-design/icons'
-
-import { dayjs, type Dayjs } from '@wzyjs/utils/web'
-
-import styles from './index.module.scss'
-
-interface DateSwitcherProps {
-  value?: Dayjs
-  onChange?: (date: Dayjs) => void
-}
-
-export const DateSwitcher = (props: DateSwitcherProps) => {
-  const { value = dayjs(), onChange } = props
-
-  const [selectedDate, setSelectedDate] = useState(value)
-
-  const handleDateChange = (date: Dayjs | null) => {
-    if (date) {
-      setSelectedDate(date)
-      onChange?.(date)
-    }
-  }
-
-  const handlePrevDay = () => {
-    const newDate = selectedDate.subtract(1, 'day')
-    handleDateChange(newDate)
-  }
-
-  const handleNextDay = () => {
-    const newDate = selectedDate.add(1, 'day')
-    handleDateChange(newDate)
-  }
-
-  const isToday = selectedDate.isSame(dayjs(), 'day')
-
-  return (
-    <div className={styles.picker}>
-      <Button
-        type='text'
-        icon={<LeftOutlined />}
-        onClick={handlePrevDay}
-        className='flex items-center justify-center'
-      />
-      <DatePicker
-        value={selectedDate}
-        onChange={handleDateChange}
-        allowClear={false}
-        suffixIcon={null}
-        className='w-40 text-center cursor-pointer'
-        style={{ border: 'none' }}
-        components={{
-          input: props => (
-            <div {...props} className={isToday ? 'text-green-600' : ''}>
-              <span>{selectedDate.format('YYYY-MM-DD')}</span>
-              <span style={{ marginLeft: 5 }}>
-                (周{['日', '一', '二', '三', '四', '五', '六'][dayjs(selectedDate).day()]})
-              </span>
-            </div>
-          ),
-        }}
-      />
-      <Button
-        type='text'
-        icon={<RightOutlined />}
-        onClick={handleNextDay}
-        className='flex items-center justify-center'
-      />
-    </div>
-  )
-}

package/src/components/DownloadLink/index.tsx

@@ -1,36 +0,0 @@
-'use client'
-
-import React from 'react'
-
-interface DownloadLinkProps {
-  url: string
-  filename?: string
-}
-
-export const DownloadLink = ({ url, filename }: DownloadLinkProps) => {
-  const handleDownload = (e: any) => {
-    e.preventDefault()
-    fetch(url, { method: 'GET' })
-    .then(response => response.blob())
-    .then(blob => {
-      const downloadUrl = window.URL.createObjectURL(blob)
-      const a = document.createElement('a')
-      a.href = downloadUrl
-      a.download = filename || '下载文件'
-      document.body.appendChild(a)
-      a.click()
-      a.remove()
-      window.URL.revokeObjectURL(downloadUrl)
-    })
-    .catch((err) => {
-      console.log(666, err)
-      alert('下载失败')
-    })
-  }
-
-  return (
-    <a href={url} onClick={handleDownload}>
-      下载
-    </a>
-  )
-}

package/src/components/DragSort/index.tsx

@@ -1,77 +0,0 @@
-'use client'
-
-import React from 'react'
-
-import { Space } from 'antd'
-import {
-  DragDropContext,
-  Draggable,
-  Droppable,
-  type OnDragEndResponder,
-  type DraggableProvided,
-} from 'react-beautiful-dnd'
-
-interface DragSortProps<T> {
-  direction?: 'vertical' | 'horizontal'
-  droppableId?: string
-  list?: T[]
-  children: (item: T, provided: DraggableProvided) => React.ReactNode
-  lastChildren?: React.ReactNode
-  onDragEnd?: OnDragEndResponder
-  hasContext?: boolean
-  dropType?: string
-}
-
-export { type DropResult, type DraggableProvided } from 'react-beautiful-dnd'
-
-export const DragSort = <T extends { id: string }>(props: DragSortProps<T>) => {
-  const {
-    dropType,
-    direction = 'vertical',
-    droppableId = 'list',
-    list,
-    children,
-    hasContext = true,
-    lastChildren,
-    onDragEnd = () => undefined,
-  } = props
-
-  const content = (
-    <Droppable
-      type={dropType}
-      droppableId={droppableId}
-      direction={direction}
-      isDropDisabled={false}
-      isCombineEnabled={false}
-      ignoreContainerClipping
-    >
-      {provided => (
-        <div ref={provided.innerRef} {...provided.droppableProps}>
-          <Space orientation={direction} wrap style={{ width: '100%' }}>
-            {list?.map((item, index) => (
-              <Draggable key={item.id} disableInteractiveElementBlocking draggableId={item.id.toString()} index={index}>
-                {provided => (
-                  <div ref={provided.innerRef} {...provided.draggableProps} >
-                    {children(item, provided)}
-                  </div>
-                )}
-              </Draggable>
-            ))}
-            {provided.placeholder}
-            {lastChildren}
-          </Space>
-        </div>
-      )}
-    </Droppable>
-  )
-
-  if (!hasContext) {
-    return content
-  }
-
-  return (
-    <DragDropContext onDragEnd={onDragEnd}>
-      {content}
-    </DragDropContext>
-  )
-}

package/src/components/DynamicSelect/index.tsx

@@ -1,76 +0,0 @@
-import React from 'react'
-import { AutoComplete, Button, Space } from 'antd'
-
-import type { Option } from './types'
-
-interface DynamicSelectProps {
-  value?: string[]
-  onChange?: (value: string[]) => void
-  options?: Option[]
-}
-
-export const DynamicSelect = (props: DynamicSelectProps) => {
-  const { value = [''], onChange, options = [] } = props
-
-  const removeOption = (index: number) => {
-    const newOptions = [...value]
-    newOptions.splice(index, 1)
-    onChange?.(newOptions)
-  }
-
-  const handleChange = (index: number, val: string) => {
-    const newValue = [...[...value].slice(0, index), val]
-    onChange?.(newValue)
-
-    if (newValue.every(item => item)) {
-      onChange?.([...newValue, ''])
-    }
-  }
-
-  const getOptions = (options: Option[], index: number): Option[] => {
-    if (index === 0) {
-      return options
-    }
-
-    const currentValue = value[value.length - 1 - index]
-    if (!currentValue) return []
-
-    return getOptions(
-      options.find(item => item.value === currentValue)?.children || [],
-      index - 1,
-    )
-  }
-
-  return (
-    <Space size={8} align='center'>
-      {value.map((val, index) => (
-        <Space key={index} size={4} align='center'>
-          <AutoComplete
-            style={{
-              minWidth: '120px',
-              maxWidth: '300px',
-              width: 'auto',
-            }}
-            value={val}
-            onChange={val => handleChange(index, val)}
-            options={getOptions(options, index)}
-            placeholder={`请选择第 ${index + 1} 级`}
-          />
-          {index !== 0 && (
-            <Button
-              type='text'
-              danger
-              size='small'
-              onClick={() => removeOption(index)}
-            >
-              删除
-            </Button>
-          )}
-          {index < value.length - 1 && (
-            <span style={{ color: '#999' }}>/</span>
-          )}
-        </Space>
-      ))}
-    </Space>
-  )
-}

package/src/components/DynamicSelect/types.ts

@@ -1,8 +0,0 @@
-export type OptionValue = string | number | boolean
-
-export interface Option<V extends OptionValue = OptionValue> {
-  label: string
-  value: V
-  children?: Option<V>[]
-  extra?: Record<string, any>
-}

package/src/components/DynamicSelect/utils.ts

@@ -1,47 +0,0 @@
-import type { Option } from './types'
-
-export const transformOptions = (data: string[][]): Option[] => {
-  const result: Option[] = []
-
-  data.forEach((item = []) => {
-    let currentNode: Option | undefined
-    let parentNode: Option | undefined
-
-    for (let i = 0; i < item.length; i++) {
-      const currentValue = item[i]
-      if (!currentValue) continue
-
-      if (i === 0) {
-        currentNode = result.find(r => r.value === currentValue)
-
-        if (!currentNode) {
-          currentNode = {
-            label: currentValue,
-            value: currentValue,
-          }
-          result.push(currentNode)
-        }
-
-        parentNode = currentNode
-      } else {
-        currentNode = parentNode?.children?.find((c: Option) => c.value === currentValue)
-
-        if (!currentNode) {
-          currentNode = {
-            label: currentValue,
-            value: currentValue,
-          }
-          if (!parentNode) {
-            return
-          }
-          parentNode.children = parentNode.children || []
-          parentNode.children.push(currentNode)
-        }
-
-        parentNode = currentNode
-      }
-    }
-  })
-
-  return result
-}