cx-chat 0.0.1

package/src/views/page-menus/model-metadata/manage/hooks/use-model-metadata-item-state.ts

@@ -0,0 +1,20 @@
+import { useState } from 'react'
+
+/** 模型元数据「明细」表单共用状态（表结构 / 权限 / 文档 / 示例 SQL） */
+export function useModelMetadataItemState() {
+  const [tables, setTables] = useState<any[]>([])
+  const [permissions, setPermissions] = useState<any[]>([])
+  const [documents, setDocuments] = useState<any[]>([])
+  const [exampleSqlList, setExampleSqlList] = useState<any[]>([])
+
+  return {
+    tables,
+    setTables,
+    permissions,
+    setPermissions,
+    documents,
+    setDocuments,
+    exampleSqlList,
+    setExampleSqlList,
+  }
+}

package/src/views/page-menus/model-metadata/manage/index.tsx

@@ -0,0 +1,304 @@
+import { useAuth } from '@/contexts/AuthContext'
+import { ALIGN, DICT_DATA, DICT_KEY, ENUM_DATA } from '@/meta'
+import {
+  deleteModelMetadataAPI,
+  disableModelMetadataAPI,
+  enableModelMetadataAPI,
+  getModelMetadataPageAPI,
+} from '@api/menus/model-metadata/manage'
+import { DetailLink } from '@components/common/detail-link'
+import ListPageView, { createListPageConfig } from '@components/table-view'
+import { CxButton, CxTag } from '@cx-ui'
+import { useMemo, useRef } from 'react'
+
+import DetailModal from './modal/detail-modal'
+import SubmitModal from './modal/submit-modal'
+
+// 列表页 i18n：menus.model_metadata.manage.* → locales/zh/menus/model-metadata/manage.ts
+const useListPageConfig = createListPageConfig({
+  tableAPI: getModelMetadataPageAPI,
+  deleteAPI: deleteModelMetadataAPI,
+  updateStatusAPI: ({ id, status }) =>
+    Number(status) === 1 ? enableModelMetadataAPI(id) : disableModelMetadataAPI(id),
+  pageInfo: {
+    title: 'menus.model_metadata.manage.page_title', // 模型元数据管理
+    subTitle: 'menus.model_metadata.manage.page_subtitle', // 副标题
+  },
+  searchFields: [
+    {
+      prop: 'subject',
+      label: 'menus.model_metadata.manage.fields.subject', // 主题
+      placeholder: 'menus.model_metadata.manage.search_placeholder_subject', // 搜主题
+    },
+    {
+      prop: 'databaseName',
+      label: 'menus.model_metadata.manage.fields.databaseName', // 数据库名
+      placeholder: 'menus.model_metadata.manage.search_placeholder_databaseName', // 搜库名
+    },
+    {
+      prop: 'dbType',
+      label: 'menus.model_metadata.manage.fields.dbType', // 库类型
+      type: 'select',
+      options: [],
+      width: '120px',
+    },
+    {
+      prop: 'status',
+      label: 'menus.model_metadata.manage.fields.status',
+      type: 'select',
+      placeholder: 'common.status',
+      options: ENUM_DATA.commonStatus.option.map(({ label, value }) => ({
+        label,
+        value,
+      })),
+      width: '120px',
+    },
+    {
+      prop: 'createBy',
+      label: 'common.creator',
+      placeholder: 'menus.model_metadata.manage.search_placeholder_createBy', // 搜创建人
+    },
+    {
+      prop: 'createTime',
+      label: 'common.create_time',
+      type: 'dateRange',
+      rangeStartProp: 'createTimeStart',
+      rangeEndProp: 'createTimeEnd',
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+    },
+  ],
+  statusToggle: {
+    dangerOnDisable: true,
+    disableConfirm: {
+      cancelText: 'common.cancel',
+      content: 'menus.model_metadata.manage.disable_confirm_content',
+      contentFields: 'subject',
+      okText: 'common.confirm',
+      title: 'menus.model_metadata.manage.disable_confirm_title',
+    },
+    enableConfirm: {
+      cancelText: 'common.cancel',
+      content: 'menus.model_metadata.manage.enable_confirm_content',
+      contentFields: 'subject',
+      okText: 'common.confirm',
+      title: 'menus.model_metadata.manage.enable_confirm_title',
+    },
+  },
+  submitAction: {
+    permission: 'model-metadata:add',
+    submitType: 'page',
+    labelKey: 'menus.model_metadata.manage.add', // 新增
+  },
+  detailAction: {
+    detailType: 'page',
+    labelKey: 'common.view',
+  },
+  table: {
+    scrollX: 'max-content',
+  },
+  deleteConfirm: {
+    title: 'menus.model_metadata.manage.delete_confirm_title', // 删除确认标题
+    content: 'menus.model_metadata.manage.delete_confirm_content', // 删除确认正文
+    okText: 'common.delete',
+    cancelText: 'common.cancel',
+  },
+})
+
+function IndexView() {
+  const { hasPermission, commonDictRevision } = useAuth()
+  const pageConfig = useListPageConfig()
+
+  const dbTypeSearchOptions = useMemo(
+    () =>
+      (DICT_DATA[DICT_KEY.dbType]?.option ?? []).map((o) => ({
+        label: o.name,
+        value: o.value,
+      })),
+    [commonDictRevision],
+  )
+
+  const listPageConfig = useMemo(
+    () => ({
+      ...pageConfig,
+      searchFields: pageConfig.searchFields.map((f: any) =>
+        f.prop === 'dbType' ? { ...f, options: dbTypeSearchOptions } : f,
+      ),
+    }),
+    [pageConfig, dbTypeSearchOptions],
+  )
+  /** 与主题列「跳转详情页」分离：操作列查看走弹窗，不经过 listPageConfig.onDetail 的 page 默认逻辑 */
+  const detailModalRef = useRef<{
+    open: (p?: any) => void
+    close: () => void
+  } | null>(null)
+  const submitModalRef = useRef<{
+    open: (p?: any) => void
+    close: () => void
+  } | null>(null)
+
+  const columns = useMemo(
+    () => [
+      {
+        title: 'menus.model_metadata.manage.fields.subject', // 主题
+        key: 'subject',
+        align: ALIGN.LEFT,
+        minWidth: 160,
+        render: (value: unknown, data: any) => (
+          <DetailLink
+            text={String(value ?? data?.subject ?? '-')}
+            disabled={!hasPermission('model-metadata:detail')}
+            onClick={() =>
+              listPageConfig.onDetail?.({
+                type: 'detail',
+                data,
+                config: listPageConfig.detailAction,
+              })
+            }
+          />
+        ),
+      },
+      {
+        title: 'menus.model_metadata.manage.fields.databaseName', // 数据库名
+        key: 'databaseName',
+        align: ALIGN.LEFT,
+        minWidth: 150,
+        ellipsis: true,
+        render: (value: unknown) => value ?? '-',
+      },
+      {
+        title: 'menus.model_metadata.manage.fields.schemaVersion', // 元数据版本
+        key: 'schemaVersion',
+        align: ALIGN.CENTER,
+        width: 120,
+        render: (value: unknown) => value ?? '-',
+      },
+      {
+        title: 'menus.model_metadata.manage.fields.dbType', // 库类型
+        key: 'dbType',
+        align: ALIGN.CENTER,
+        width: 100,
+        render: (value: unknown) => value ?? '-',
+      },
+      {
+        title: 'menus.model_metadata.manage.fields.host',
+        key: 'host',
+        align: ALIGN.LEFT,
+        width: 230,
+        ellipsis: true,
+        render: (_: unknown, record: any) => `${record.host ?? ''}:${record.port ?? ''}`,
+      },
+      {
+        title: 'menus.model_metadata.manage.fields.tableCount', // 表数量
+        key: 'tableCount',
+        align: ALIGN.CENTER,
+        width: 100,
+        render: (value: unknown) => value ?? 0,
+      },
+      {
+        title: 'common.status',
+        key: 'status',
+        align: ALIGN.CENTER,
+        width: 100,
+        render: (value: unknown) => <CxTag.Enabled value={value as number} />,
+      },
+      {
+        title: 'common.creator',
+        key: 'createBy',
+        align: ALIGN.LEFT,
+        width: 120,
+        render: (value: unknown) => value ?? '-',
+      },
+      {
+        title: 'common.create_time',
+        key: 'createTime',
+        align: ALIGN.LEFT,
+        width: 170,
+        render: (value: unknown) => value ?? '-',
+      },
+      {
+        title: 'common.actions',
+        key: 'action',
+        align: ALIGN.LEFT,
+        width: 220,
+        render: (_: unknown, data: any) => {
+          const isEnabled = Number(data?.status) === 1
+          return (
+            <div className="flex flex-wrap gap-2">
+              {hasPermission('model-metadata:detail') && (
+                <CxButton.IconView
+                  onClick={() =>
+                    detailModalRef.current?.open({
+                      opeType: 'detail',
+                      opeId: data?.id,
+                      data,
+                    })
+                  }
+                />
+              )}
+              {hasPermission('model-metadata:enable') && !isEnabled && (
+                <CxButton.IconEnable
+                  onClick={() =>
+                    listPageConfig.onStatusToggle?.({
+                      nextStatus: 1,
+                      data,
+                    })
+                  }
+                />
+              )}
+              {hasPermission('model-metadata:disable') && isEnabled && (
+                <CxButton.IconDisable
+                  onClick={() =>
+                    listPageConfig.onStatusToggle?.({
+                      nextStatus: 0,
+                      data,
+                    })
+                  }
+                />
+              )}
+              {hasPermission('model-metadata:edit') && !isEnabled && (
+                <CxButton.IconEdit
+                  onClick={() =>
+                    listPageConfig.onEdit?.({
+                      type: 'edit',
+                      data,
+                      config: listPageConfig.submitAction,
+                    })
+                  }
+                />
+              )}
+              {hasPermission('model-metadata:delete') && !isEnabled && (
+                <CxButton.IconDelete onClick={() => listPageConfig.onDelete?.(data)} />
+              )}
+            </div>
+          )
+        },
+      },
+    ],
+    [hasPermission, listPageConfig],
+  )
+
+  return (
+    <>
+      <ListPageView columns={columns} pageConfig={listPageConfig} />
+      <DetailModal
+        ref={detailModalRef}
+        onEditMain={(opeId) => {
+          submitModalRef.current?.open({
+            opeType: 'edit',
+            opeId,
+            data: { id: opeId },
+          })
+        }}
+      />
+      <SubmitModal
+        ref={submitModalRef}
+        onOk={async () => {
+          await listPageConfig.fetchTableData?.()
+        }}
+      />
+    </>
+  )
+}
+
+export default IndexView

package/src/views/page-menus/model-metadata/manage/modal/components/table-schema.ts

@@ -0,0 +1,374 @@
+/** 表结构弹窗：类型、常量、与提交/校验相关的纯函数（供 modal 与 submit 共用） */
+
+export const TABLE_SUBMIT_MODAL_WIDTH = 1400
+export const TABLE_SUBMIT_MODAL_HEIGHT = 'min(95dvh, 95vh)'
+
+export const COMMON_DATA_TYPES = [
+  'bigint',
+  'binary',
+  'bit',
+  'blob',
+  'bool',
+  'char',
+  'date',
+  'datetime',
+  'decimal',
+  'double',
+  'float',
+  'int',
+  'json',
+  'longtext',
+  'mediumint',
+  'mediumtext',
+  'smallint',
+  'text',
+  'time',
+  'timestamp',
+  'tinyint',
+  'varbinary',
+  'varchar',
+]
+
+export const INDEX_KIND_OPTIONS = [
+  { value: 'NORMAL', label: 'NORMAL' },
+  { value: 'UNIQUE', label: 'UNIQUE' },
+  { value: 'FULLTEXT', label: 'FULLTEXT' },
+  { value: 'SPATIAL', label: 'SPATIAL' },
+]
+
+export const INDEX_METHOD_OPTIONS = [
+  { value: 'BTREE', label: 'BTREE' },
+  { value: 'HASH', label: 'HASH' },
+  { value: 'RTREE', label: 'RTREE' },
+]
+
+export const FK_RULE_VALUES = ['CASCADE', 'RESTRICT', 'SET NULL', 'NO ACTION'] as const
+export const FK_RULE_OPTIONS = FK_RULE_VALUES.map((v) => ({
+  value: v,
+  label: v,
+}))
+
+export const tableEditSelectPopupMin = { minWidth: 120 } as const
+export const cxSelectInTableProps = {
+  className: 'w-full min-w-0 max-w-full overflow-hidden',
+  popupMatchSelectWidth: false,
+  styles: { popup: { root: tableEditSelectPopupMin } },
+}
+
+export const cxSelectFkProps = {
+  ...cxSelectInTableProps,
+  showSearch: true,
+  allowClear: true,
+  optionFilterProp: 'label' as const,
+  filterOption: (input: string, option?: { label?: unknown; value?: string }) => {
+    const q = input.trim().toLowerCase()
+    if (!q) return true
+    const lv = String(option?.label ?? '').toLowerCase()
+    const vv = String(option?.value ?? '').toLowerCase()
+    return lv.includes(q) || vv.includes(q)
+  },
+}
+
+export const tableSubmitModalShellStyles = {
+  container: {
+    display: 'flex',
+    flexDirection: 'column' as const,
+    overflow: 'hidden',
+    height: TABLE_SUBMIT_MODAL_HEIGHT,
+    maxHeight: TABLE_SUBMIT_MODAL_HEIGHT,
+  },
+  body: {
+    flex: '1 1 0%',
+    minHeight: 0,
+    display: 'flex',
+    flexDirection: 'column' as const,
+    overflow: 'hidden',
+  },
+}
+
+export type SchemaTableBrief = {
+  tableName?: string
+  tableComment?: string
+  columns?: { columnName?: string; COLUMN_NAME?: string }[]
+}
+
+export type Column = {
+  columnName: string
+  dataType: string
+  /** 是否隐私：0 否，1 是 */
+  privacyFlag?: number
+  charLength?: number
+  numericPrecision?: number
+  numericScale?: number
+  isNullable?: number
+  columnDefault?: string
+  commentText?: string
+  valueType?: number
+}
+
+export type IndexColumn = {
+  columnName: string
+  seqInIndex: number
+}
+
+export type Index = {
+  indexName: string
+  isUnique?: number
+  indexType?: string
+  indexMethod?: string
+  indexColumns: IndexColumn[]
+}
+
+export type ForeignKeyColumn = {
+  columnName: string
+  referencedColumnName: string
+  seqInFk: number
+}
+
+export type ForeignKey = {
+  fkName: string
+  referencedTableSchema?: string
+  referencedTable: string
+  updateRule?: string
+  deleteRule?: string
+  fkColumns: ForeignKeyColumn[]
+}
+
+export type TableDetail = {
+  tableSchema?: string
+  tableName: string
+  tableComment?: string
+  tableType?: string
+  columns: Column[]
+  indexes: Index[]
+  foreignKeys: ForeignKey[]
+}
+
+export function tableColumnNameList(table: SchemaTableBrief | undefined): string[] {
+  if (!table?.columns?.length) return []
+  const names = table.columns
+    .map((c) => c.columnName ?? c.COLUMN_NAME ?? '')
+    .filter(Boolean) as string[]
+  return [...new Set(names)]
+}
+
+export function clonePart<T>(x: T): T {
+  return JSON.parse(JSON.stringify(x)) as T
+}
+
+export function parseIndexColumnNames(s: string): IndexColumn[] {
+  const names = s
+    .split(',')
+    .map((x) => x.trim())
+    .filter(Boolean)
+  return names.map((columnName, i) => ({ columnName, seqInIndex: i + 1 }))
+}
+
+/** 反查预览 / 详情：indexColumns 为 { columnName, seqInIndex }[]，seqInIndex 可能全为 0 */
+export function normalizeIndexColumnsInput(raw: unknown): IndexColumn[] {
+  if (raw == null || raw === '') return []
+  if (!Array.isArray(raw) || raw.length === 0) return []
+  const mapped = (raw as { columnName?: string; seqInIndex?: number }[]).map((c, i) => ({
+    columnName: String(c.columnName ?? ''),
+    seqInIndex: typeof c.seqInIndex === 'number' ? c.seqInIndex : NaN,
+    _i: i,
+  }))
+  const rows = mapped.filter((x) => x.columnName)
+  if (rows.length === 0) return []
+  const hasPositiveSeq = rows.some((r) => Number(r.seqInIndex) > 0)
+  const ordered = hasPositiveSeq
+    ? rows.slice().sort((a, b) => {
+        const sa = Number(a.seqInIndex) > 0 ? Number(a.seqInIndex) : 1e9 + a._i
+        const sb = Number(b.seqInIndex) > 0 ? Number(b.seqInIndex) : 1e9 + b._i
+        return sa - sb
+      })
+    : rows.slice().sort((a, b) => a._i - b._i)
+  return ordered.map((c, i) => ({ columnName: c.columnName, seqInIndex: i + 1 }))
+}
+
+/** 提交：indexColumns 为 { columnName, seqInIndex }[]，seqInIndex 为下标+1 */
+export function normalizeIndexColumnsForSubmit(raw: unknown) {
+  return normalizeIndexColumnsInput(raw).map((c, i) => ({
+    columnName: c.columnName,
+    seqInIndex: i + 1,
+  }))
+}
+
+export function indexColumnNamesForMultiSelect(cols: IndexColumn[] | undefined): string[] {
+  if (!cols?.length) return []
+  return cols
+    .slice()
+    .map((c, i) => ({ ...c, _i: i }))
+    .sort((a, b) => {
+      const d = (a.seqInIndex ?? 0) - (b.seqInIndex ?? 0)
+      return d !== 0 ? d : a._i - b._i
+    })
+    .map((c) => c.columnName)
+    .filter(Boolean)
+}
+
+export function getIndexKind(idx: Index): string {
+  if (idx.isUnique === 1) return 'UNIQUE'
+  const t = (idx.indexType || '').toUpperCase()
+  if (t.includes('FULLTEXT')) return 'FULLTEXT'
+  if (t.includes('SPATIAL')) return 'SPATIAL'
+  if (t === 'UNIQUE') return 'UNIQUE'
+  return 'NORMAL'
+}
+
+export function applyIndexKind(idx: Index, kind: string): Index {
+  if (kind === 'UNIQUE') {
+    return { ...idx, isUnique: 1, indexType: 'UNIQUE' }
+  }
+  return { ...idx, isUnique: 0, indexType: kind }
+}
+
+export function fkColNamesForMultiSelect(
+  cols: ForeignKeyColumn[] | undefined,
+  key: 'columnName' | 'referencedColumnName',
+): string[] {
+  if (!cols?.length) return []
+  return cols
+    .slice()
+    .map((c, i) => ({ ...c, _i: i }))
+    .sort((a, b) => {
+      const d = (a.seqInFk ?? 0) - (b.seqInFk ?? 0)
+      return d !== 0 ? d : a._i - b._i
+    })
+    .map((c) => String(c[key] ?? '').trim())
+    .filter(Boolean)
+}
+
+export function zipFkPairColumns(localArr: string[], refArr: string[]): ForeignKeyColumn[] {
+  const n = Math.max(localArr.length, refArr.length)
+  if (n === 0) return []
+  return Array.from({ length: n }, (_, i) => ({
+    columnName: localArr[i] ?? '',
+    referencedColumnName: refArr[i] ?? '',
+    seqInFk: i + 1,
+  }))
+}
+
+/** 反查预览 / 详情：fkColumns 为 { columnName, referencedColumnName, seqInFk }[]，seqInFk 可能全为 0 */
+export function normalizeForeignKeyColumnsInput(raw: unknown): ForeignKeyColumn[] {
+  if (raw == null || raw === '') return []
+  if (!Array.isArray(raw) || raw.length === 0) return []
+  if (typeof raw[0] !== 'object' || raw[0] == null) return []
+  const mapped = (raw as { columnName?: string; referencedColumnName?: string; seqInFk?: number }[]).map(
+    (c, i) => ({
+      columnName: String(c.columnName ?? ''),
+      referencedColumnName: String(c.referencedColumnName ?? ''),
+      seqInFk: typeof c.seqInFk === 'number' ? c.seqInFk : NaN,
+      _i: i,
+    }),
+  )
+  const hasPositiveSeq = mapped.some((r) => Number(r.seqInFk) > 0)
+  const ordered = hasPositiveSeq
+    ? mapped.slice().sort((a, b) => {
+        const sa = Number(a.seqInFk) > 0 ? Number(a.seqInFk) : 1e9 + a._i
+        const sb = Number(b.seqInFk) > 0 ? Number(b.seqInFk) : 1e9 + b._i
+        return sa - sb
+      })
+    : mapped.slice().sort((a, b) => a._i - b._i)
+  return ordered.map((c, i) => ({
+    columnName: c.columnName,
+    referencedColumnName: c.referencedColumnName,
+    seqInFk: i + 1,
+  }))
+}
+
+/** 提交：fkColumns 每项 seqInFk 为下标+1 */
+export function normalizeFkColumnsForSubmit(raw: unknown) {
+  return normalizeForeignKeyColumnsInput(raw).map((c, i) => ({
+    columnName: c.columnName,
+    referencedColumnName: c.referencedColumnName,
+    seqInFk: i + 1,
+  }))
+}
+
+export function validateForeignKeyRows(fks: unknown): string | null {
+  const list = Array.isArray(fks) ? fks : []
+  for (const fk of list) {
+    const cols = normalizeForeignKeyColumnsInput((fk as any)?.fkColumns)
+    const locs = cols.map((c) => String(c.columnName ?? '').trim()).filter(Boolean)
+    const refs = cols.map((c) => String(c.referencedColumnName ?? '').trim()).filter(Boolean)
+    const fkName = String((fk as any)?.fkName ?? '').trim()
+    const refTable = String((fk as any)?.referencedTable ?? '').trim()
+    const touched = Boolean(fkName || refTable || locs.length || refs.length)
+    if (!touched) continue
+    if (!fkName) return 'fk_name_required'
+    if (!refTable) return 'fk_referenced_table_required'
+    if (locs.length !== refs.length) return 'fk_columns_count_mismatch'
+    if (locs.length === 0) return 'fk_columns_required'
+  }
+  return null
+}
+
+export function validateForeignKeysInTables(tables: unknown): string | null {
+  const list = Array.isArray(tables) ? tables : []
+  for (const tb of list) {
+    const err = validateForeignKeyRows((tb as any)?.foreignKeys)
+    if (err) return err
+  }
+  return null
+}
+
+export function validateIndexRows(indexes: unknown): string | null {
+  const list = Array.isArray(indexes) ? indexes : []
+  for (const ix of list) {
+    const name = String((ix as any)?.indexName ?? '').trim()
+    const cols = normalizeIndexColumnsInput((ix as any)?.indexColumns)
+    const colNames = cols.map((c) => String(c.columnName ?? '').trim()).filter(Boolean)
+    const touched = Boolean(name || colNames.length)
+    if (!touched) continue
+    if (!name) return 'index_name_required'
+    if (colNames.length === 0) return 'index_columns_required'
+  }
+  return null
+}
+
+export function validateIndexesInTables(tables: unknown): string | null {
+  const list = Array.isArray(tables) ? tables : []
+  for (const tb of list) {
+    const err = validateIndexRows((tb as any)?.indexes)
+    if (err) return err
+  }
+  return null
+}
+
+export function isEmptyIndexRow(ix: unknown): boolean {
+  const name = String((ix as any)?.indexName ?? '').trim()
+  if (name) return false
+  return normalizeIndexColumnsInput((ix as any)?.indexColumns).length === 0
+}
+
+export function isEmptyForeignKeyRow(fk: unknown): boolean {
+  const fkName = String((fk as any)?.fkName ?? '').trim()
+  const refTable = String((fk as any)?.referencedTable ?? '').trim()
+  if (fkName || refTable) return false
+  return normalizeForeignKeyColumnsInput((fk as any)?.fkColumns).length === 0
+}
+
+export const emptyColumn = (): Column => ({
+  columnName: '',
+  dataType: 'varchar',
+  privacyFlag: 0,
+  isNullable: 1,
+  commentText: '',
+})
+
+export const emptyIndex = (): Index => ({
+  indexName: '',
+  isUnique: 0,
+  indexType: 'NORMAL',
+  indexMethod: 'BTREE',
+  indexColumns: [],
+})
+
+export const emptyForeignKey = (): ForeignKey => ({
+  fkName: '',
+  referencedTable: '',
+  updateRule: 'NO ACTION',
+  deleteRule: 'NO ACTION',
+  fkColumns: [],
+})