cx-chat 0.0.2 → 0.0.3

package/src/views/page-menus/knowledge/modal/detail-modal.tsx

@@ -1,618 +0,0 @@
-import {
-  deleteKnowSharedAPI,
-  editKnowledgePermissionAPI,
-  getKnowledgeDetailAPI,
-  getKnowledgePermissionListAPI,
-  getKnowSharedUserPageAPI,
-} from '@/api/menus/knowledge'
-import { getDepartmentTreeAPI } from '@/api/system/department'
-import ConfirmDialog from '@/components/common/modal/confirm-dialog'
-import { createSelectTableConfig, SelectTableView } from '@/components/table-view'
-import { useAuth } from '@/contexts/AuthContext'
-import { useToast } from '@/contexts/ToastContext'
-import { CxButton, CxCheckbox, CxModal, CxTable, CxTabs, CxTag, useCxModal } from '@cx-ui'
-import { Form, Spin } from 'antd'
-import {
-  forwardRef,
-  useCallback,
-  useImperativeHandle,
-  useMemo,
-  useState
-} from 'react'
-import { useTranslation } from 'react-i18next'
-
-interface OpenPayload {
-  opeId?: string | number
-  record?: any
-}
-
-const DetailModal = forwardRef<any, unknown>(function DetailModal(_props, ref) {
-  const { t } = useTranslation()
-  const { hasPermission } = useAuth()
-  const { showToast } = useToast()
-  const [loading, setLoading] = useState(false)
-  const [activeTab, setActiveTab] = useState('permission')
-  const [permissionList, setPermissionList] = useState<any[]>([])
-  const [permissionDraftList, setPermissionDraftList] = useState<any[]>([])
-  const [permissionEditing, setPermissionEditing] = useState(false)
-  const [permissionSubmitting, setPermissionSubmitting] = useState(false)
-  const [shareSelectedRows, setShareSelectedRows] = useState<any[]>([])
-  const [shareRemoving, setShareRemoving] = useState(false)
-  const [shareRemovingSubmitting, setShareRemovingSubmitting] = useState(false)
-  const [shareRemoveSubmitConfirmOpen, setShareRemoveSubmitConfirmOpen] = useState(false)
-  const [shareTreeCheckedKeys, setShareTreeCheckedKeys] = useState<Set<string>>(
-    () => new Set(),
-  )
-  const canViewPermissionList = hasPermission('knowledge:data-permission-list')
-  const canEditPermission = hasPermission('knowledge:manage-permission-edit')
-  const canViewSharePage = hasPermission('knowledge:data-permission-page')
-  const canDeleteShare = hasPermission('knowledge:data-permission-delete')
-
-  const modal = useCxModal({
-    onOpen: async (payload) => {
-      const opeId = payload.opeId ?? payload.data?.id
-      setLoading(true)
-      modal.setFormData({})
-      setPermissionList([])
-      setPermissionDraftList([])
-      setPermissionEditing(false)
-      setPermissionSubmitting(false)
-      setShareSelectedRows([])
-      setShareRemoving(false)
-      setShareRemovingSubmitting(false)
-      setShareRemoveSubmitConfirmOpen(false)
-      setShareTreeCheckedKeys(new Set())
-      setActiveTab('permission')
-
-      if (opeId != null && opeId !== '') {
-        try {
-          // 获取知识库详情
-          const res = await getKnowledgeDetailAPI(opeId)
-          const detail = res?.data ?? {}
-          modal.setFormData({
-            id: opeId,
-            code: detail.code ?? '',
-            name: detail.name ?? '',
-            description: detail.description ?? '',
-            type: detail.type,
-            status: detail.status,
-            userId: detail.userId ?? '',
-            createTime: detail.createTime ?? '',
-            updateTime: detail.updateTime ?? '',
-          })
-
-          // 获取权限列表
-          if (canViewPermissionList) {
-            try {
-              const permRes = await getKnowledgePermissionListAPI(opeId)
-              const permData = permRes?.data?.data ?? permRes?.data ?? []
-              const list = Array.isArray(permData) ? permData : []
-              setPermissionList(list)
-              setPermissionDraftList(list)
-            } catch (e) {
-              console.error('获取权限列表失败', e)
-              setPermissionList([])
-              setPermissionDraftList([])
-            }
-          }
-        } finally {
-          setLoading(false)
-        }
-      } else {
-        setLoading(false)
-      }
-    },
-    onClose: () => {
-    },
-  })
-
-  const { isOpen, close } = modal
-  const detailData = (modal.formData ?? {}) as Record<string, any>
-
-  useImperativeHandle(
-    ref,
-    () => ({
-      open: modal.open,
-      close,
-    }),
-    [modal.open, close],
-  )
-
-  const clearShareCheckedRows = useCallback(() => {
-    setShareSelectedRows([])
-  }, [])
-
-  const startShareRemoving = useCallback(() => {
-    setShareRemoving(true)
-  }, [])
-
-  const cancelShareRemoving = useCallback(() => {
-    setShareRemoving(false)
-    setShareTreeCheckedKeys(new Set())
-    clearShareCheckedRows()
-  }, [clearShareCheckedRows])
-
-  const openShareRemoveSubmitConfirm = useCallback(() => {
-    setShareRemoveSubmitConfirmOpen(true)
-  }, [])
-
-  const closeShareRemoveSubmitConfirm = useCallback(() => {
-    setShareRemoveSubmitConfirmOpen(false)
-  }, [])
-
-  // submitShareRemoving 需在 shareTableConfig 声明之后（见下方）
-
-  const handleShareTreeCheck = useCallback(
-    (key: string | number, checked: boolean) => {
-      const k = String(key)
-      setShareTreeCheckedKeys((prev) => {
-        const next = new Set(prev)
-        if (checked) next.add(k)
-        else next.delete(k)
-        return next
-      })
-    },
-    [],
-  )
-
-  const handlePermissionEditStart = useCallback(() => {
-    setPermissionDraftList(permissionList.map((x) => ({ ...x })))
-    setPermissionEditing(true)
-  }, [permissionList])
-
-  const handlePermissionEditCancel = useCallback(() => {
-    setPermissionDraftList(permissionList.map((x) => ({ ...x })))
-    setPermissionEditing(false)
-  }, [permissionList])
-
-  const handleTogglePermission = useCallback(
-    (row: any, field: 'knowledgePermission' | 'knowledgeDocPermission', checked: boolean) => {
-      const rowId = row?.userId ?? row?.id
-      setPermissionDraftList((prev) =>
-        prev.map((item) => {
-          const itemId = item?.userId ?? item?.id
-          if (String(itemId) !== String(rowId)) return item
-          return {
-            ...item,
-            [field]: checked,
-          }
-        }),
-      )
-    },
-    [],
-  )
-
-  const handlePermissionSubmit = useCallback(async () => {
-    const knowledgeId = detailData.id
-    if (!knowledgeId) return
-    setPermissionSubmitting(true)
-    try {
-      const knowledgeUserIdList = permissionDraftList
-        .filter((x) => x?.knowledgePermission === true)
-        .map((x) => x?.userId ?? x?.id)
-        .filter((x) => x != null && String(x) !== '')
-      const knowledgeDocumentUserIdList = permissionDraftList
-        .filter((x) => x?.knowledgeDocPermission === true)
-        .map((x) => x?.userId ?? x?.id)
-        .filter((x) => x != null && String(x) !== '')
-      await editKnowledgePermissionAPI({
-        knowledgeId,
-        knowledgeUserIdList,
-        knowledgeDocumentUserIdList,
-      })
-      setPermissionList(permissionDraftList.map((x) => ({ ...x })))
-      setPermissionEditing(false)
-      showToast(t('common.operation_success'), 'success')
-    } catch (error) {
-      console.error('更新知识库权限失败', error)
-    } finally {
-      setPermissionSubmitting(false)
-    }
-  }, [detailData.id, permissionDraftList, showToast, t])
-
-  // 权限表格列定义
-  const permissionColumns = useMemo(
-    () => [
-      {
-        title: t('menus.knowledge.share.user_name'),
-        dataIndex: 'userName',
-        key: 'userName',
-        width: 120,
-      },
-      {
-        title: t('menus.knowledge.permission_kb_manage'),
-        dataIndex: 'knowledgePermission',
-        key: 'knowledgePermission',
-        width: 100,
-        render: (value: boolean, row: any) =>
-          permissionEditing ? (
-            <CxCheckbox
-              checked={value === true}
-              onChange={(checked) =>
-                handleTogglePermission(row, 'knowledgePermission', checked)
-              }
-            />
-          ) : (
-            <CxTag.YesNo value={value ? 1 : 0} />
-          ),
-      },
-      {
-        title: t('menus.knowledge.permission_doc_manage'),
-        dataIndex: 'knowledgeDocPermission',
-        key: 'knowledgeDocPermission',
-        width: 100,
-        render: (value: boolean, row: any) =>
-          permissionEditing ? (
-            <CxCheckbox
-              checked={value === true}
-              onChange={(checked) =>
-                handleTogglePermission(row, 'knowledgeDocPermission', checked)
-              }
-            />
-          ) : (
-            <CxTag.YesNo value={value ? 1 : 0} />
-          ),
-      },
-    ],
-    [handleTogglePermission, permissionEditing, t],
-  )
-
-  // 共享表格配置 Hook
-  const useShareTableConfig = createSelectTableConfig({
-    tableAPI: canViewSharePage
-      ? (queryParams) => {
-          const knowledgeId = detailData.id
-          if (!knowledgeId) {
-            return Promise.resolve({ data: { content: [], totalElements: 0 } })
-          }
-          if (queryParams.departmentId === '0') {
-            queryParams.departmentId = null
-          }
-          return getKnowSharedUserPageAPI({
-            ...queryParams,
-            knowledgeId,
-          })
-        }
-      : undefined,
-    treeAPI: hasPermission('knowledge:manage-permission-dep-list')
-      ? getDepartmentTreeAPI
-      : undefined,
-    tree: {
-      fieldNames: {
-        id: 'id',
-        label: 'name',
-        children: 'children',
-      },
-      searchField: 'departmentId',
-    },
-    searchFields: [
-      {
-        prop: 'userName',
-        label: 'menus.knowledge.share.user_name',
-        placeholder: 'menus.knowledge.share.user_name_placeholder',
-      },
-      {
-        prop: 'grantUserName',
-        label: 'menus.knowledge.share.grant_user',
-        placeholder: 'menus.knowledge.share.grant_user_placeholder',
-      },
-    ],
-    pageInfo: {
-      searchButtonSize: 'small',
-    },
-    table: {
-      showPagination: true,
-      showSelection: canDeleteShare && shareRemoving,
-    },
-    pagination: { page: 1, pageSize: 10, total: 0 },
-  })
-
-  // 调用 Hook 获取配置
-  const shareTableConfig = useShareTableConfig()
-
-  const submitShareRemoving = useCallback(async () => {
-    const knowledgeId = detailData.id
-    if (!knowledgeId) return
-
-    const idList = (Array.isArray(shareSelectedRows) ? shareSelectedRows : [])
-      .map((row: any) => row?.id)
-      .filter((x: any) => x != null && String(x).trim() !== '')
-      .map((x: any) => String(x))
-
-    const departmentIdList = Array.from(shareTreeCheckedKeys)
-      .filter((x) => x != null && String(x).trim() !== '' && String(x) !== '0')
-      .map((x) => String(x))
-
-    if (idList.length === 0 && departmentIdList.length === 0) return
-
-    setShareRemovingSubmitting(true)
-    try {
-      await deleteKnowSharedAPI({
-        knowledgeId,
-        idList,
-        departmentIdList,
-      })
-      showToast(t('common.operation_success'), 'success')
-      cancelShareRemoving()
-      closeShareRemoveSubmitConfirm()
-      await shareTableConfig?.fetchTableData?.()
-    } catch (e) {
-      console.error('remove knowledge share failed:', e)
-    } finally {
-      setShareRemovingSubmitting(false)
-    }
-  }, [
-    cancelShareRemoving,
-    closeShareRemoveSubmitConfirm,
-    detailData.id,
-    shareSelectedRows,
-    shareTableConfig,
-    shareTreeCheckedKeys,
-    showToast,
-    t,
-  ])
-
-  // 共享表格列定义：checkbox 由 SelectTableView 的 selectionMode 控制（避免出现两个选择列）
-  const shareColumns = useMemo(
-    () => [
-      {
-        title: 'menus.knowledge.share.user_name',
-        dataIndex: 'userName',
-        key: 'userName',
-        width: 120,
-      },
-      {
-        title: 'menus.knowledge.share.department',
-        dataIndex: 'departmentName',
-        key: 'departmentName',
-        width: 150,
-      },
-    ],
-    [],
-  )
-
-  const tabActions = useMemo(() => {
-    if (activeTab === 'permission' && canEditPermission) {
-      if (permissionEditing) {
-        return (
-          <>
-            <CxButton
-              size="small"
-              type="default"
-              onClick={handlePermissionEditCancel}
-              disabled={permissionSubmitting}
-            >
-              {t('common.cancel')}
-            </CxButton>
-            <CxButton
-              size="small"
-              type="primary"
-              loading={permissionSubmitting}
-              onClick={handlePermissionSubmit}
-            >
-              {t('common.submit')}
-            </CxButton>
-          </>
-        )
-      }
-      return (
-        <CxButton
-          size="small"
-          type="primary"
-          onClick={handlePermissionEditStart}
-        >
-          {t('common.edit')}
-        </CxButton>
-      )
-    }
-
-    if (activeTab === 'share' && canDeleteShare) {
-      if (shareRemoving) {
-        return (
-          <>
-            <CxButton.Cancel
-              size="small"
-              type="default"
-              disabled={shareRemovingSubmitting}
-              onClick={cancelShareRemoving}
-            >
-              {t('common.cancel')}
-            </CxButton.Cancel>
-            <CxButton.Delete
-              size="small"
-              icon={false}
-              loading={shareRemovingSubmitting}
-              disabled={
-                shareRemovingSubmitting ||
-                (shareSelectedRows.length === 0 && shareTreeCheckedKeys.size === 0)
-              }
-              onClick={openShareRemoveSubmitConfirm}
-            >
-              {t('selectTable.remove_selected')}
-            </CxButton.Delete>
-          </>
-        )
-      }
-      return (
-        <CxButton.Delete
-          size="small"
-          icon={false}
-          onClick={startShareRemoving}
-        >
-          {t('selectTable.batch_remove')}
-        </CxButton.Delete>
-      )
-    }
-    return null
-  }, [
-    activeTab,
-    canEditPermission,
-    canDeleteShare,
-    permissionEditing,
-    permissionSubmitting,
-    shareSelectedRows.length,
-    shareTreeCheckedKeys.size,
-    shareRemoving,
-    shareRemovingSubmitting,
-    handlePermissionEditCancel,
-    handlePermissionEditStart,
-    handlePermissionSubmit,
-    cancelShareRemoving,
-    openShareRemoveSubmitConfirm,
-    startShareRemoving,
-    submitShareRemoving,
-    t,
-  ])
-
-  return (
-    <CxModal
-      title={t('menus.knowledge.detail_title')}
-      isOpen={isOpen}
-      onClose={close}
-      opeType="detail"
-      modalConfig={{
-        width: 1200,
-        styles: {
-          container: {
-            display: 'flex',
-            flexDirection: 'column' as const,
-            overflow: 'hidden',
-            height: 'min(95dvh, 95vh)',
-            maxHeight: 'min(95dvh, 95vh)',
-          },
-          body: {
-            flex: '1 1 0%',
-            minHeight: 0,
-            display: 'flex',
-            flexDirection: 'column' as const,
-            overflow: 'hidden',
-          },
-        },
-        rootClassName: 'cx-modal-content-fill',
-      }}>
-      {loading ? (
-        <div className="flex justify-center py-20">
-          <Spin size="large" />
-        </div>
-      ) : (
-        <div className="flex h-full min-h-0 flex-1 flex-col overflow-hidden">
-          {/* 顶部表单信息区 */}
-          <div className="shrink-0 grid grid-cols-1 md:grid-cols-4">
-            <Form.Item label={t('menus.knowledge.code')} className="!mb-0">
-              <div className="text-sm text-gray-900 dark:text-gray-100">
-                {detailData.code || '-'}
-              </div>
-            </Form.Item>
-
-            <Form.Item label={t('menus.knowledge.name')} className="!mb-0">
-              <div className="text-sm text-gray-900 dark:text-gray-100">
-                {detailData.name || '-'}
-              </div>
-            </Form.Item>
-
-            <Form.Item label={t('menus.knowledge.type')} className="!mb-0">
-              <div className="text-sm text-gray-900 dark:text-gray-100">
-                <CxTag.Enum value={detailData.type} enumKey="knowledgeType" />
-              </div>
-            </Form.Item>
-
-            <Form.Item label={t('common.status')} className="!mb-0">
-              <div className="text-sm text-gray-900 dark:text-gray-100">
-                <CxTag.Enabled value={detailData.status} />
-              </div>
-            </Form.Item>
-
-            <Form.Item label={t('common.description')} className="!mb-0 md:col-span-4">
-              <div className="text-sm text-gray-900 dark:text-gray-100 break-words">
-                {detailData.description || '-'}
-              </div>
-            </Form.Item>
-          </div>
-
-          {/* Tabs 区域 */}
-          <div className="relative flex min-h-0 flex-1 flex-col overflow-hidden">
-            {tabActions ? (
-              <div className="absolute right-0 top-0 z-10 flex items-center gap-2">
-                {tabActions}
-              </div>
-            ) : null}
-            <CxTabs
-              activeKey={activeTab}
-              onChange={setActiveTab}
-              className="flex-1 flex flex-col min-h-0 [&_.ant-tabs-nav]:pr-[220px]"
-              items={[
-                {
-                  key: 'permission',
-                  label: t('menus.knowledge.tab_permission'),
-                  children: (
-                    <div className="h-full overflow-auto">
-                      <CxTable
-                        columns={permissionColumns}
-                        dataSource={permissionEditing ? permissionDraftList : permissionList}
-                        rowKey="userId"
-                        pagination={false}
-                        scroll={{ y: 300 }}
-                      />
-                    </div>
-                  ),
-                },
-                {
-                  key: 'share',
-                  label: t('menus.knowledge.tab_share'),
-                  children: (
-                    <div className="min-h-0 flex-1 flex flex-col overflow-hidden h-full">
-                      {shareTableConfig ? (
-                        <div className="flex h-full min-h-0 flex-col overflow-hidden">
-                          <div className="min-h-0 flex-1">
-                            <SelectTableView
-                              expectTree
-                              noPadding
-                              pageConfig={shareTableConfig}
-                              columns={shareColumns as any}
-                              rowKey="userId"
-                              selectionMode={shareRemoving ? 'multiple' : 'none'}
-                              showSelectedPanel={false}
-                              treeCheckable={canDeleteShare && shareRemoving}
-                              treeCheckedKeys={shareTreeCheckedKeys}
-                              onTreeCheck={(_key, checked, node) => {
-                                const nodeKey = node?.id ?? node?.key ?? _key
-                                handleShareTreeCheck(nodeKey, checked)
-                              }}
-                              treeRenderLabel={(node: any) => node?.name ?? node?.title ?? '-'}
-                              value={shareSelectedRows}
-                              onChange={(next) => {
-                                setShareSelectedRows(Array.isArray(next) ? next : [])
-                              }}
-                            />
-                          </div>
-                        </div>
-                      ) : (
-                        <div className="flex h-full items-center justify-center text-gray-400">
-                          {t('common.no_data')}
-                        </div>
-                      )}
-                    </div>
-                  ),
-                },
-              ]}
-            />
-          </div>
-        </div>
-      )}
-      <ConfirmDialog
-        isOpen={shareRemoveSubmitConfirmOpen}
-        danger
-        title={t('common.confirm')}
-        message={t('selectTable.remove_selected_confirm')}
-        confirmText={t('common.confirm')}
-        cancelText={t('common.cancel')}
-        onClose={closeShareRemoveSubmitConfirm}
-        onConfirm={() => void submitShareRemoving()}
-      />
-    </CxModal>
-  )
-})
-
-DetailModal.displayName = 'DetailModal'
-
-export default DetailModal