cx-chat 0.0.1

package/src/views/page-menus/knowledge/index.tsx

@@ -0,0 +1,337 @@
+import {
+  deleteKnowledgeAPI,
+  disableKnowledgeAPI,
+  enableKnowledgeAPI,
+  getKnowledgePageAPI,
+  transferKnowledgeAPI,
+} from '@/api/menus/knowledge'
+import { DetailLink } from '@/components/common/detail-link'
+import DepUserSelectModal from '@/components/common/modal/dep-user-select'
+import { useAuth } from '@/contexts/AuthContext'
+import { useToast } from '@/contexts/ToastContext'
+import { ALIGN, ENUM_DATA } from '@/meta'
+import ListPageView, { createListPageConfig } from '@components/table-view'
+import { CxButton, CxTag } from '@cx-ui'
+import { ArrowRightLeft, Settings, Share2 } from 'lucide-react'
+import { useMemo, useRef } from 'react'
+import { useTranslation } from 'react-i18next'
+import KnowledgeUserSelectModal from './modal/knowledge-user-select-modal'
+import DetailModal from './modal/detail-modal'
+import SubmitModal from './modal/submit-modal'
+
+const useListPageConfig = createListPageConfig({
+  tableAPI: getKnowledgePageAPI,
+  deleteAPI: deleteKnowledgeAPI,
+  updateStatusAPI: ({ id, status }) =>
+    Number(status) === 1
+      ? enableKnowledgeAPI(id)
+      : disableKnowledgeAPI(id),
+  pageInfo: {
+    title: 'menus.knowledge.page_title',
+    subTitle: 'menus.knowledge.page_subtitle',
+  },
+  searchFields: [
+    {
+      prop: 'keyword',
+      label: 'menus.knowledge.name',
+      placeholder: 'menus.knowledge.search_placeholder',
+    },
+    {
+      prop: 'status',
+      label: 'common.status',
+      type: 'select',
+      placeholder: 'common.status',
+      options: ENUM_DATA.commonStatus.option.map(({ label, value }) => ({
+        label,
+        value,
+      })),
+      width: '120px',
+    },
+  ],
+  statusToggle: {
+    dangerOnDisable: true,
+    disableConfirm: {
+      cancelText: 'common.cancel',
+      content: 'menus.knowledge.disable_confirm_content',
+      contentFields: 'name',
+      okText: 'common.confirm',
+      title: 'menus.knowledge.disable_confirm_title',
+    },
+    enableConfirm: {
+      cancelText: 'common.cancel',
+      content: 'menus.knowledge.enable_confirm_content',
+      contentFields: 'name',
+      okText: 'common.confirm',
+      title: 'menus.knowledge.enable_confirm_title',
+    },
+  },
+  detailAction: {
+    detailType: 'page',
+    labelKey: 'common.view',
+  },
+  deleteConfirm: {
+    title: 'menus.knowledge.delete_confirm_title',
+    content: 'menus.knowledge.delete_confirm_content',
+    okText: 'common.delete',
+    cancelText: 'common.cancel',
+  },
+  table: {
+    operationWidth: 340,
+  },
+})
+
+function IndexView() {
+  const { t } = useTranslation()
+  const { showToast } = useToast()
+  const { hasPermission, user } = useAuth()
+  const pageConfig = useListPageConfig()
+  const submitRef = useRef<{ open: (p?: any) => void } | null>(null)
+  const depUserSelectRef = useRef<{ open: (p?: any) => void } | null>(null)
+  const depUserTransferRef = useRef<{ open: (p?: any) => void } | null>(null)
+  const detailModalRef = useRef<{ open: (p?: any) => void } | null>(null)
+
+  const canAddPersonal = hasPermission('knowledge:add-personal')
+  const canAddPublic = hasPermission('knowledge:add-public')
+  /** 两种新增权限都有时，弹窗内允许改类型；仅一种权限时类型写死 */
+  const lockTypeOnAdd = !(canAddPersonal && canAddPublic)
+
+  const columns = useMemo(
+    () => [
+      {
+        title: 'menus.knowledge.name',
+        key: 'name',
+        align: ALIGN.LEFT,
+        render: (value: string, data: any) => (
+          <DetailLink
+            text={value}
+            title={t('menus.knowledge.manage_docs')}
+            onClick={() =>
+              pageConfig.onDetail?.({
+                type: 'detail',
+                data,
+                config: pageConfig.detailAction,
+              })
+            }
+          />
+        ),
+      },
+      {
+        title: 'menus.knowledge.code',
+        key: 'code',
+        align: ALIGN.CENTER,
+      },
+      {
+        title: 'menus.knowledge.type',
+        key: 'type',
+        align: ALIGN.CENTER,
+        width: 120,
+        render: (type: number) => <CxTag.Enum value={type} enumKey="knowledgeType" />,
+      },
+      {
+        title: 'common.status',
+        key: 'status',
+        align: ALIGN.CENTER,
+        width: 100,
+        render: (status: number) => {
+          return (
+            <CxTag.Enabled value={status} />
+          )
+        },
+      },
+      {
+        title: 'common.description',
+        key: 'description',
+        align: ALIGN.CENTER,
+        ellipsis: true,
+        minWidth: 200,
+      },
+      {
+        title: 'common.actions',
+        key: 'action',
+        width: 340,
+        align: ALIGN.CENTER,
+        render: (_: any, data: any) => {
+          const isEnabled = Number(data?.status) === 1
+          const rowOwnerId = data?.userId ?? data?.user_id
+          const isRowOwner =
+            user?.id != null &&
+            rowOwnerId != null &&
+            String(rowOwnerId) === String(user.id)
+          return (
+            <div className="flex justify-start flex-wrap gap-2">
+              <CxButton.IconView
+                onClick={() =>
+                  detailModalRef.current?.open({
+                    opeType: 'detail',
+                    opeId: data?.id,
+                    data,
+                  })
+                }
+              />
+              {hasPermission('knowledge:manage-permission') && (
+                <CxButton.Icon
+                  type="primary"
+                  title={t('menus.knowledge.action_permission_assign')}
+                  tooltipTone="primary"
+                  icon={<Settings className="size-4 shrink-0" aria-hidden />}
+                  onClick={() => {
+                    depUserSelectRef.current?.open({
+                      title: t('menus.knowledge.action_permission_assign'),
+                      knowledgeId: data?.id,
+                      deptSelectable: false,
+                      mode: 'permission',
+                    })
+                  }}
+                />
+              )}
+              {hasPermission('knowledge:data-permission-add') && (
+                <CxButton.Icon
+                  type="default"
+                  title={t('menus.knowledge.action_doc_share')}
+                  tooltipTone="primary"
+                  icon={<Share2 className="size-4 shrink-0" aria-hidden />}
+                  onClick={() => {
+                    depUserSelectRef.current?.open({
+                      title: t('menus.knowledge.action_doc_share'),
+                      knowledgeId: data?.id,
+                      deptSelectable: true,
+                      mode: 'share',
+                    })
+                  }}
+                />
+              )}
+              {isRowOwner && (
+                <CxButton.Icon
+                  type="default"
+                  title={t('menus.knowledge.action_transfer')} // 转让知识库
+                  tooltipTone="primary"
+                  icon={<ArrowRightLeft className="size-4 shrink-0" aria-hidden />}
+                  onClick={() => {
+                    depUserTransferRef.current?.open({
+                      title: t('menus.knowledge.action_transfer'), // 转让知识库
+                      excludeUserId: user?.id,
+                      context: { knowledgeId: data?.id }, // 业务回传用
+                    })
+                  }}
+                />
+              )}
+              {hasPermission('knowledge:enable') && !isEnabled && (
+                <CxButton.IconEnable
+                  onClick={() =>
+                    pageConfig.onStatusToggle?.({
+                      nextStatus: 1,
+                      data,
+                    })
+                  }
+                />
+              )}
+              {hasPermission('knowledge:disable') && isEnabled && (
+                <CxButton.IconDisable
+                  onClick={() =>
+                    pageConfig.onStatusToggle?.({
+                      nextStatus: 0,
+                      data,
+                    })
+                  }
+                />
+              )}
+              {hasPermission('knowledge:edit') && (
+                <CxButton.IconEdit
+                  onClick={() =>
+                    submitRef.current?.open({
+                      opeType: 'edit',
+                      opeId: data?.id,
+                      data,
+                    })
+                  }
+                />
+              )}
+              {hasPermission('knowledge:delete') && !isEnabled && (
+                <CxButton.IconDelete
+                  onClick={() => pageConfig.onDelete?.(data)}
+                />
+              )}
+            </div>
+          )
+        },
+      },
+    ],
+    [t, hasPermission, pageConfig, user?.id],
+  )
+
+  return (
+    <>
+      <ListPageView
+        columns={columns}
+        pageConfig={pageConfig}
+        headerActions={() => {
+          if (!canAddPersonal && !canAddPublic) return null
+          return (
+            <div className="flex flex-wrap items-center gap-2">
+              {canAddPersonal && (
+                <CxButton.Add
+                  onClick={() =>
+                    submitRef.current?.open({
+                      opeType: 'add',
+                      forcedType: 0,
+                      lockType: lockTypeOnAdd,
+                    })
+                  }
+                >
+                  {t('menus.knowledge.add_personal')}
+                </CxButton.Add>
+              )}
+              {canAddPublic && (
+                <CxButton.Add
+                  onClick={() =>
+                    submitRef.current?.open({
+                      opeType: 'add',
+                      forcedType: 1,
+                      lockType: lockTypeOnAdd,
+                    })
+                  }
+                >
+                  {t('menus.knowledge.add_public')}
+                </CxButton.Add>
+              )}
+            </div>
+          )
+        }}
+      />
+      <DetailModal ref={detailModalRef} />
+      <SubmitModal
+        ref={submitRef}
+        onOk={async () => {
+          await pageConfig.fetchTableData?.()
+        }}
+        onCancel={() => {}}
+      />
+      <KnowledgeUserSelectModal
+        ref={depUserSelectRef}
+        onOk={async () => {
+          // 暂只负责“分配”动作；结果展示后续在 detail-modal 内做
+        }}
+      />
+      <DepUserSelectModal
+        ref={depUserTransferRef}
+        onOk={async ({ userId, payload }) => {
+          const knowledgeId = payload?.context?.knowledgeId // 知识库 id
+          if (knowledgeId == null || String(knowledgeId).trim() === '') {
+            showToast(t('menus.knowledge.transfer_missing_kb'), 'error') // 缺少知识库信息
+            return false
+          }
+          await transferKnowledgeAPI({
+            knowledgeId: String(knowledgeId),
+            targetUserId: userId,
+          })
+        }}
+        onAfterAdd={async () => {
+          showToast(t('common.operation_success'), 'success') // 操作成功
+          await pageConfig.fetchTableData?.()
+        }}
+      />
+    </>
+  )
+}
+
+export default IndexView