feat: ionet integrate (#2105)

* wip ionet integrate * wip ionet integrate * wip ionet integrate * ollama wip * wip * feat: ionet integration & ollama manage * fix merge conflict * wip * fix: test conn cors * wip * fix ionet * fix ionet * wip * fix model select * refactor: Remove `pkg/ionet` test files and update related Go source and web UI model deployment components. * feat: Enhance model deployment UI with styling improvements, updated text, and a new description component. * Revert "feat: Enhance model deployment UI with styling improvements, updated text, and a new description component." This reverts commit 8b75cb5bf0d1a534b339df8c033be9a6c7df7964.
2026-04-25 05:18:37 +00:00 · 2025-12-28 15:55:35 +08:00
parent 1a69a93d20
commit 725d61c5d3
51 changed files with 11895 additions and 369 deletions
--- a/web/src/components/table/model-deployments/modals/ColumnSelectorModal.jsx
+++ b/web/src/components/table/model-deployments/modals/ColumnSelectorModal.jsx
@@ -0,0 +1,127 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useMemo } from 'react';
+import { Modal, Button, Checkbox } from '@douyinfe/semi-ui';
+
+const ColumnSelectorModal = ({
+  visible,
+  onCancel,
+  visibleColumns,
+  onVisibleColumnsChange,
+  columnKeys,
+  t,
+}) => {
+  const columnOptions = useMemo(
+    () => [
+      { key: columnKeys.container_name, label: t('容器名称'), required: true },
+      { key: columnKeys.status, label: t('状态') },
+      { key: columnKeys.time_remaining, label: t('剩余时间') },
+      { key: columnKeys.hardware_info, label: t('硬件配置') },
+      { key: columnKeys.created_at, label: t('创建时间') },
+      { key: columnKeys.actions, label: t('操作'), required: true },
+    ],
+    [columnKeys, t],
+  );
+
+  const handleColumnVisibilityChange = (key, checked) => {
+    const column = columnOptions.find((option) => option.key === key);
+    if (column?.required) return;
+    onVisibleColumnsChange({
+      ...visibleColumns,
+      [key]: checked,
+    });
+  };
+
+  const handleSelectAll = (checked) => {
+    const updated = { ...visibleColumns };
+    columnOptions.forEach(({ key, required }) => {
+      updated[key] = required ? true : checked;
+    });
+    onVisibleColumnsChange(updated);
+  };
+
+  const handleReset = () => {
+    const defaults = columnOptions.reduce((acc, { key }) => {
+      acc[key] = true;
+      return acc;
+    }, {});
+    onVisibleColumnsChange({
+      ...visibleColumns,
+      ...defaults,
+    });
+  };
+
+  const allSelected = columnOptions.every(
+    ({ key, required }) => required || visibleColumns[key],
+  );
+  const indeterminate =
+    columnOptions.some(
+      ({ key, required }) => !required && visibleColumns[key],
+    ) && !allSelected;
+
+  const handleConfirm = () => onCancel();
+
+  return (
+    <Modal
+      title={t('列设置')}
+      visible={visible}
+      onCancel={onCancel}
+      footer={
+        <div className='flex justify-end gap-2'>
+          <Button onClick={handleReset}>{t('重置')}</Button>
+          <Button onClick={onCancel}>{t('取消')}</Button>
+          <Button type='primary' onClick={handleConfirm}>
+            {t('确定')}
+          </Button>
+        </div>
+      }
+    >
+      <div style={{ marginBottom: 20 }}>
+        <Checkbox
+          checked={allSelected}
+          indeterminate={indeterminate}
+          onChange={(e) => handleSelectAll(e.target.checked)}
+        >
+          {t('全选')}
+        </Checkbox>
+      </div>
+      <div
+        className='flex flex-wrap max-h-96 overflow-y-auto rounded-lg p-4'
+        style={{ border: '1px solid var(--semi-color-border)' }}
+      >
+        {columnOptions.map(({ key, label, required }) => (
+          <div key={key} className='w-1/2 mb-4 pr-2'>
+            <Checkbox
+              checked={!!visibleColumns[key]}
+              disabled={required}
+              onChange={(e) =>
+                handleColumnVisibilityChange(key, e.target.checked)
+              }
+            >
+              {label}
+            </Checkbox>
+          </div>
+        ))}
+      </div>
+    </Modal>
+  );
+};
+
+export default ColumnSelectorModal;