From 573183a40e4d8ce27cc2e9816d070e10f50e9c22 Mon Sep 17 00:00:00 2001 From: Nut He <18328704+hetao92@users.noreply.github.com> Date: Wed, 30 Mar 2022 18:09:51 +0800 Subject: [PATCH] fix: fix style --- app/components/Breadcrumb/index.less | 1 - app/components/CSVPreviewLink/index.tsx | 1 + app/components/ForceGraph/force-graph.js | 2 +- app/config/locale/en-US.json | 2 +- app/config/locale/zh-CN.json | 2 +- .../OutputBox/ForceGraph/Menu/index.tsx | 25 ++++++------------- app/pages/Console/OutputBox/index.less | 12 ++++----- app/pages/Console/OutputBox/index.tsx | 1 - app/pages/Console/index.less | 2 ++ app/pages/Doc/index.less | 1 + app/pages/Import/FileUpload/index.less | 5 ++-- .../TaskList/TaskItem/LogModal/index.less | 10 ++++++-- .../Import/TaskList/TemplateModal/index.less | 1 + app/pages/MainPage/Header/index.less | 2 +- .../Edit/CommonEdit/PropertiesRow.tsx | 2 ++ .../SchemaConfig/Edit/CommonEdit/TTLForm.tsx | 1 + .../SchemaConfig/Edit/CommonEdit/index.less | 3 +++ .../SchemaConfig/Edit/CommonEdit/index.tsx | 25 ++++++++++++------- .../Schema/SchemaConfig/List/Index/index.tsx | 2 +- .../SchemaConfig/List/SpaceStats/index.tsx | 8 +++--- app/stores/twoGraph.ts | 2 +- app/utils/http.ts | 5 ++-- 22 files changed, 63 insertions(+), 52 deletions(-) diff --git a/app/components/Breadcrumb/index.less b/app/components/Breadcrumb/index.less index 647b0813..84b294b0 100644 --- a/app/components/Breadcrumb/index.less +++ b/app/components/Breadcrumb/index.less @@ -32,7 +32,6 @@ align-items: center; } a, .ant-breadcrumb-link span { - font-weight: 300; word-break: break-all; text-overflow: ellipsis; overflow: hidden; diff --git a/app/components/CSVPreviewLink/index.tsx b/app/components/CSVPreviewLink/index.tsx index b6f81187..3b112e29 100644 --- a/app/components/CSVPreviewLink/index.tsx +++ b/app/components/CSVPreviewLink/index.tsx @@ -50,6 +50,7 @@ const CSVPreviewLink = (props: IProps) => { overlayClassName="popover-preview" visible={visible} trigger="click" + arrowPointAtCenter onVisibleChange={visible => setVisible(visible)} content={
adjustCanvasSize(state), triggerUpdate: false }, + width: { default: 1100, onChange: (_, state) => adjustCanvasSize(state), triggerUpdate: false }, height: { default: 400, onChange: (_, state) => adjustCanvasSize(state), triggerUpdate: false }, graphData: { default: { nodes: [], links: [] }, diff --git a/app/config/locale/en-US.json b/app/config/locale/en-US.json index c6a730dc..841f256c 100644 --- a/app/config/locale/en-US.json +++ b/app/config/locale/en-US.json @@ -161,7 +161,7 @@ "fileUploadRequired": "1. Please make sure all CSV data files are uploaded before import the YAML file. If not, please go to ", "fileUploadRequired2": " first.", "exampleDownload": "2. An example for the configuration file: ", - "uploadTemplateTip": "3. 3. Configure the Yaml file: please keep only the file name (retain the file extension) for all file paths (path, failDataPath, logPath) in the template, e.g. logPath: config.csv", + "uploadTemplateTip": "3. Configure the Yaml file: please keep only the file name (retain the file extension) for all file paths (path, failDataPath, logPath) in the template, e.g. logPath: config.csv", "reUpload": "Re-upload", "fileNotExist": "{name} file does not exist！", "importYaml": "Import the YAML file" diff --git a/app/config/locale/zh-CN.json b/app/config/locale/zh-CN.json index 11c30665..e07126cf 100644 --- a/app/config/locale/zh-CN.json +++ b/app/config/locale/zh-CN.json @@ -161,7 +161,7 @@ "fileUploadRequired": "1. 请确保在导入 YAML 文件之前上传所有 CSV 数据文件。 如果没有，请先前往", "fileUploadRequired2": "数据文件", "exampleDownload": "2. 配置文件示例:", - "uploadTemplateTip": "3.配置Yaml文件：模板中所有文件路径（path、failDataPath、logPath）请只保留文件名（保留文件扩展名），例如： 日志路径：config.csv", + "uploadTemplateTip": "3. 配置Yaml文件：模板中所有文件路径（path、failDataPath、logPath）请只保留文件名（保留文件扩展名），例如： 日志路径：config.csv", "reUpload": "重新上传", "fileNotExist": "文件 {name} 不存在", "importYaml": "导入 YAML 文件" diff --git a/app/pages/Console/OutputBox/ForceGraph/Menu/index.tsx b/app/pages/Console/OutputBox/ForceGraph/Menu/index.tsx index ebbc6665..2ee90669 100644 --- a/app/pages/Console/OutputBox/ForceGraph/Menu/index.tsx +++ b/app/pages/Console/OutputBox/ForceGraph/Menu/index.tsx @@ -1,4 +1,4 @@ -import React, { Fragment, useEffect } from 'react'; +import React, { Fragment } from 'react'; import './index.less'; import { observer } from 'mobx-react-lite'; import { useStore } from '@app/stores'; @@ -13,26 +13,15 @@ const Menu = (props: IProps) => { const { pointer: { left: x, top: y, showContextMenu }, } = graph; + if(!showContextMenu) { + return null; + } const hide = () => { graph.setPointer({ showContextMenu: false, }); }; - useEffect(() => { - const close = e => { - const path = e.path || (e.composedPath && e.composedPath()); // safari has no e.path - const isMenu = path.find(each => each.className === 'context-menu'); - if (isMenu) return; - hide(); - }; - const container = document.getElementById(id); - container?.addEventListener('click', close); - container?.addEventListener('contextmenu', close); - return () => { - container?.removeEventListener('click', close); - container?.removeEventListener('contextmenu', close); - }; - }, []); + const menuConfig = [ { component: , @@ -43,8 +32,8 @@ const Menu = (props: IProps) => { const width = document.getElementById(id)!.clientWidth; const height = document.getElementById(id)!.clientHeight; const style = { left: 0, top: 0, display: 'block' }; - style.left = width - x - 30 > containerWidth ? x + 30 : x - containerWidth; - style.top = height - y - 30 > containerHeight ? y + 30 : y - containerHeight; + style.left = width - x > containerWidth ? x : x - containerWidth; + style.top = height - y > containerHeight ? y : y - containerHeight; if (!showContextMenu) { style.display = 'none'; } diff --git a/app/pages/Console/OutputBox/index.less b/app/pages/Console/OutputBox/index.less index 2bb0eb4a..0bfef86b 100644 --- a/app/pages/Console/OutputBox/index.less +++ b/app/pages/Console/OutputBox/index.less @@ -46,10 +46,6 @@ &:not(:last-child) { margin-right: 22px; } - &.icon-toggle svg{ - width: 18px; - height: 18px; - } } span.btn-yellow svg{ fill: #F2C94C; @@ -88,6 +84,10 @@ color: @darkGray; .anticon { margin-right: 0; + svg { + width: 22px; + height: 22px; + } } } &.ant-tabs-tab-active { @@ -103,7 +103,7 @@ background-color: @lightBlue; } .ant-tabs-content { - .ant-table { + .ant-table, .ant-pagination { margin: 20px; } .ant-tabs-tabpane { @@ -133,7 +133,7 @@ width: 100%; height: 65px; border-top: 1px solid #E0E0E0; - font-family: Roboto-Regular, serif; + font-family: Roboto-Regular, sans-serif; font-size: 16px; color: @darkBlue; letter-spacing: 1.48px; diff --git a/app/pages/Console/OutputBox/index.tsx b/app/pages/Console/OutputBox/index.tsx index 45b855de..94c965aa 100644 --- a/app/pages/Console/OutputBox/index.tsx +++ b/app/pages/Console/OutputBox/index.tsx @@ -264,7 +264,6 @@ const OutputBox = (props: IProps) => { setVisible(!visible)} /> diff --git a/app/pages/Console/index.less b/app/pages/Console/index.less index 69662eed..ab0f18a8 100644 --- a/app/pages/Console/index.less +++ b/app/pages/Console/index.less @@ -125,6 +125,7 @@ } } .CodeMirror { + font-family: Roboto-Regular, sans-serif; .CodeMirror-gutters { background: @lightBlue; } @@ -135,6 +136,7 @@ } .CodeMirror-scroll { padding-bottom: 0; + margin-right: 0; overflow: auto !important; } } diff --git a/app/pages/Doc/index.less b/app/pages/Doc/index.less index 4c11aa88..3f5f55ae 100644 --- a/app/pages/Doc/index.less +++ b/app/pages/Doc/index.less @@ -57,6 +57,7 @@ padding: 20px; .doc-group { display: flex !important; + margin-bottom: 30px } .doc-item { height: 295px; diff --git a/app/pages/Import/FileUpload/index.less b/app/pages/Import/FileUpload/index.less index 2fb2c870..b7fc2153 100644 --- a/app/pages/Import/FileUpload/index.less +++ b/app/pages/Import/FileUpload/index.less @@ -16,12 +16,11 @@ } .operation { button { - width: 70px; - padding-left: 0; + padding: 0; justify-content: flex-start; } button:not(:last-child) { - margin-right: 15px; + margin-right: 30px; } } } \ No newline at end of file diff --git a/app/pages/Import/TaskList/TaskItem/LogModal/index.less b/app/pages/Import/TaskList/TaskItem/LogModal/index.less index 66bf2260..a28a4488 100644 --- a/app/pages/Import/TaskList/TaskItem/LogModal/index.less +++ b/app/pages/Import/TaskList/TaskItem/LogModal/index.less @@ -29,7 +29,7 @@ height: 91%; } .log-container { - width: 100%; + width: calc(100% - 200px); height: 100%; overflow: auto; padding: 10px 20px 120px; @@ -41,12 +41,18 @@ } } .log-tab { - max-height: 65vh; + height: 100%; .ant-tabs-nav { width: 200px; .ant-tabs-tab { background-color: @lightGray; color: @darkBlue; + .ant-tabs-tab-btn { + word-break: break-all; + width: 100%; + white-space: initial; + text-align: left; + } } .ant-tabs-tab-active { background-color: #0091FF; diff --git a/app/pages/Import/TaskList/TemplateModal/index.less b/app/pages/Import/TaskList/TemplateModal/index.less index e61d1c15..b8f2c4bd 100644 --- a/app/pages/Import/TaskList/TemplateModal/index.less +++ b/app/pages/Import/TaskList/TemplateModal/index.less @@ -23,6 +23,7 @@ .btn-add-file svg{ width: 95px; height: 95px; + padding: 24px; fill: @darkBlue; } .drag-tip { diff --git a/app/pages/MainPage/Header/index.less b/app/pages/MainPage/Header/index.less index 8c006213..7081338e 100644 --- a/app/pages/MainPage/Header/index.less +++ b/app/pages/MainPage/Header/index.less @@ -15,7 +15,7 @@ } .main-menu { flex: auto; - font-family: Roboto-Regular, serif; + font-family: Roboto-Regular, sans-serif; font-style: normal; font-size: 16px; .nav-link { diff --git a/app/pages/Schema/SchemaConfig/Edit/CommonEdit/PropertiesRow.tsx b/app/pages/Schema/SchemaConfig/Edit/CommonEdit/PropertiesRow.tsx index cf1893f8..7f99f79b 100644 --- a/app/pages/Schema/SchemaConfig/Edit/CommonEdit/PropertiesRow.tsx +++ b/app/pages/Schema/SchemaConfig/Edit/CommonEdit/PropertiesRow.tsx @@ -59,6 +59,7 @@ export const DisplayRow = (props: IProps) => { cancelText={intl.get('common.cancel')} > - {editName} + + setTempComment(e.target.value)} + /> {editKey !== 'comment' ? ( <> - {data.comment} diff --git a/app/pages/Schema/SchemaConfig/List/Index/index.tsx b/app/pages/Schema/SchemaConfig/List/Index/index.tsx index 375e122d..1e7e6216 100644 --- a/app/pages/Schema/SchemaConfig/List/Index/index.tsx +++ b/app/pages/Schema/SchemaConfig/List/Index/index.tsx @@ -7,7 +7,7 @@ import { observer } from 'mobx-react-lite'; import { useStore } from '@app/stores'; import { sortByFieldAndFilter } from '@app/utils/function'; import { IIndexList, IndexType, IJobStatus } from '@app/interfaces/schema'; -import { partition, groupBy } from 'lodash'; +import { groupBy } from 'lodash'; import Cookie from 'js-cookie'; import CommonLayout from '../CommonLayout'; diff --git a/app/pages/Schema/SchemaConfig/List/SpaceStats/index.tsx b/app/pages/Schema/SchemaConfig/List/SpaceStats/index.tsx index 9fe95ad4..476e7564 100644 --- a/app/pages/Schema/SchemaConfig/List/SpaceStats/index.tsx +++ b/app/pages/Schema/SchemaConfig/List/SpaceStats/index.tsx @@ -63,12 +63,12 @@ const SpaceStats = () => { } else if (stat) { const jobId = stat['Job Id']; setJobId(jobId); - getStatStatus(jobId); + getStatStatus(jobId, true); } } }; - const getStatStatus = async id => { + const getStatStatus = async (id, isInit?: boolean) => { const { code, data } = await getJobStatus(id); if (code === 0) { const job = data.tables[0]; @@ -76,11 +76,11 @@ const SpaceStats = () => { getData(); setUpdateTime(job['Stop Time']); setJobId(null); - message.success(intl.get('schema.statFinished')); + !isInit && message.success(intl.get('schema.statFinished')); } else if ([IJobStatus.Running, IJobStatus.Queue].includes(job.Status)) { timer.current = setTimeout(() => getStatStatus(id), 2000); } else if (job.Status === 'FAILED') { - message.warning(intl.get('schema.statError')); + !isInit && message.warning(intl.get('schema.statError')); setJobId(null); } } diff --git a/app/stores/twoGraph.ts b/app/stores/twoGraph.ts index ee6ebee8..dc5c5fca 100644 --- a/app/stores/twoGraph.ts +++ b/app/stores/twoGraph.ts @@ -44,7 +44,7 @@ class TwoGraph { Graph.d3Force('link')!.distance((d) => { return d.lineLength || LINE_LENGTH; }); - Graph.width(1060).height(400); + Graph.width(1100).height(400); Graph.onZoom((v) => { this.setTransform(v); graph.setPointer({ diff --git a/app/utils/http.ts b/app/utils/http.ts index 4cc61051..2ca64362 100644 --- a/app/utils/http.ts +++ b/app/utils/http.ts @@ -40,10 +40,11 @@ service.interceptors.request.use(config => { service.interceptors.response.use( (response: any) => { const { code, message: errMsg } = response.data; + const isConnectReq = /api-nebula\/db\/connect$/.test(response.config?.url); // if connection refused, login again if (code === -1 && new RegExp(subErrMsgStr.join('|')).test(errMsg)) { - message.warning(intl.get('warning.connectError')); - getRootStore().global.logout(); + message.warning(errMsg); + !isConnectReq && getRootStore().global.logout(); } else if (code === -1 && errMsg) { message.warning(errMsg); }