diff --git a/frontend/src/api/modules/system/resourcePool.ts b/frontend/src/api/modules/system/resourcePool.ts index 4a22d55181..5a4a7667f8 100644 --- a/frontend/src/api/modules/system/resourcePool.ts +++ b/frontend/src/api/modules/system/resourcePool.ts @@ -1,6 +1,7 @@ import MSR from '@/api/http/index'; import { PoolListUrl, UpdatePoolUrl, AddPoolUrl, DetailPoolUrl } from '@/api/requrls/system/resourcePool'; -import type { ResourcePoolItem, ResourcePoolInfo } from '@/models/system/resourcePool'; + +import type { ResourcePoolItem, AddResourcePoolParams } from '@/models/system/resourcePool'; import type { TableQueryParams } from '@/models/common'; // 获取资源池列表 @@ -14,7 +15,7 @@ export function updatePoolInfo(data: ResourcePoolItem) { } // 添加资源池 -export function addPool(data: ResourcePoolInfo) { +export function addPool(data: AddResourcePoolParams) { return MSR.post({ url: AddPoolUrl, data }); } diff --git a/frontend/src/assets/style/arco-reset.less b/frontend/src/assets/style/arco-reset.less index 5670c4228b..1c5173e4a9 100644 --- a/frontend/src/assets/style/arco-reset.less +++ b/frontend/src/assets/style/arco-reset.less @@ -100,6 +100,13 @@ } } +/** 气泡确认框 **/ +.ms-pop-confirm { + .arco-btn-secondary { + @apply hidden; + } +} + /** 按钮 **/ .arco-btn-primary { background-color: rgb(var(--primary-5)) !important; @@ -159,6 +166,7 @@ } } .arco-input-error, +.arco-select-view-error, .arco-input-tag-error { border-color: rgb(var(--danger-6)) !important; background-color: var(--color-bg-2) !important; @@ -188,9 +196,13 @@ border: 1px solid var(--color-text-input-border); border-radius: var(--border-radius-small) !important; - .btn-outline-sec-disabled(); .btn-outline-sec-hover(); .btn-outline-sec-active(); + &:disabled { + border: 1px solid var(--color-text-input-border) !important; + color: var(--color-text-4); + background-color: var(--color-text-n8) !important; + } } } } @@ -241,6 +253,52 @@ } } +/** radio **/ +.arco-radio-group-button { + padding: 1px; + background-color: var(--color-text-n8); + .arco-radio-button { + @apply bg-transparent; + + margin: 1px; + } + .arco-radio-checked { + @apply bg-white; + + color: rgb(var(--primary-4)); + } +} +.arco-radio { + .arco-radio-icon { + width: 16px; + height: 16px; + line-height: 16px; + border: 1px solid var(--color-text-input-border); + &::after { + width: 14px; + height: 14px; + } + } +} +.arco-radio-checked { + .arco-radio-icon { + @apply !bg-white; + + width: 16px; + height: 16px; + line-height: 16px; + border: 1px solid rgb(var(--primary-6)); + &::after { + top: 2px; + left: 2px; + width: 10px; + height: 10px; + background-color: rgb(var(--primary-6)) !important; + transform: scale(0.8) !important; + } + } +} + /** Message **/ .arco-message { border: 0.5px solid var(--color-text-n8); diff --git a/frontend/src/assets/style/var.less b/frontend/src/assets/style/var.less index f7dedd5775..3420f083ff 100644 --- a/frontend/src/assets/style/var.less +++ b/frontend/src/assets/style/var.less @@ -28,7 +28,7 @@ @apply !bg-white; border: 1px solid rgb(var(--primary-3)) !important; - color: rgb(var(--primary-3)); + color: rgb(var(--primary-3)) !important; } } .btn-outline-sec-hover() { diff --git a/frontend/src/hooks/useThemeVars.ts b/frontend/src/hooks/useThemeVars.ts new file mode 100644 index 0000000000..af52c51057 --- /dev/null +++ b/frontend/src/hooks/useThemeVars.ts @@ -0,0 +1,32 @@ +const bodyStyle = getComputedStyle(document.body); + +export const getSingleVar = (_var: string) => { + return bodyStyle.getPropertyValue(_var); +}; + +export const P9 = getSingleVar('--primary-9'); +export const P5 = getSingleVar('--primary-5'); +export const P4 = getSingleVar('--primary-4'); +export const P3 = getSingleVar('--primary-3'); +export const P2 = getSingleVar('--primary-2'); +export const P1 = getSingleVar('--primary-1'); + +export const primaryVars = { + P1, + P2, + P3, + P4, + P5, + P9, +}; + +export const allVars = { + ...primaryVars, +}; + +export const useThemeVars = () => { + return { + allVars, + getSingleVar, + }; +}; diff --git a/frontend/src/models/system/resourcePool.ts b/frontend/src/models/system/resourcePool.ts index 149a0bb3e3..33d77af350 100644 --- a/frontend/src/models/system/resourcePool.ts +++ b/frontend/src/models/system/resourcePool.ts @@ -1,20 +1,48 @@ -import type { OrganizationListItem } from './user'; - -export interface ResourcePoolItem { - id: string; - name: string; - type: string; - description: string; - enable: boolean; - createTime: number; - updateTime: number; - createUser: string; - apiTest: boolean; - loadTest: boolean; - uiTest: boolean; - serverUrl: string; - deleted: boolean; - configuration: string; - organizationList: OrganizationListItem[]; - resources: string[]; +// Node 类型资源信息 +export interface NodesListItem { + ip: string; + port: string; + monitor: string; + concurrentNumber: number; } + +// 资源池配置信息对象 +export interface TestResourceDTO { + loadTestImage: string; // 镜像 + loadTestHeap: string; // Jmeter heap + nodesList: NodesListItem[]; // node资源 + ip: string; // k8s ip + token: string; // k8s token + nameSpaces: string; // k8s 命名空间 + concurrentNumber: number; // k8s 最大并发数 + podThreads: number; // k8s 单pod最大线程数 + jobDefinition: string; // k8s job自定义模板 + apiTestImage: string; // k8s api测试镜像 + deployName: string; // k8s api测试部署名称 + uiGrid: string; // ui测试selenium-grid + orgIds: string[]; // 应用范围选择指定组织时的id集合 +} + +// 资源池信息对象 +export interface ResourcePoolInfo { + name: string; // 资源池名称 + description: string; // 资源池描述 + type: string; // 资源池类型 + enable: boolean; // 是否启用 + apiTest: boolean; // 是否支持api测试 + loadTest: boolean; // 是否支持性能测试 + uiTest: boolean; // 是否支持ui测试 + serverUrl: string; // 资源池地址 + allOrg: boolean; // 是否应用范围选择全部组织 + testResourceDTO: TestResourceDTO; // 测试资源信息对象 +} + +// 资源池列表项对象 +export interface ResourcePoolItem extends ResourcePoolInfo { + id: string; +} + +// 添加资源池参数对象 +export type AddResourcePoolParams = Omit & { + testResourceDTO?: Partial; +};