Merge branch 'dev-4.3.1' of https://code.alipay.com/oceanbase/oceanba…

…se-developer-center into dev-4.3.1
oceanbase · Jul 26, 2024 · eeef88b · eeef88b
2 parents 36b9517 + 9cb8839
commit eeef88b
Show file tree

Hide file tree

Showing 14 changed files with 42 additions and 29 deletions.
diff --git a/src/component/ExecuteSqlDetailModal/index.less b/src/component/ExecuteSqlDetailModal/index.less
@@ -49,7 +49,7 @@
       white-space: nowrap;
       text-overflow: ellipsis;
       flex-shrink: 0;
-      max-width: 300px;
+      max-width: 640px;
     }
     .flexBetween {
       display: flex;

diff --git a/src/component/ProfileFlow/customComponents/DetailBox.tsx b/src/component/ProfileFlow/customComponents/DetailBox.tsx
@@ -88,7 +88,7 @@ export default ({ dataSource, topNodes, initialNodes, globalInfo }: Iprops) => {
 
   function getProfileNodeDetail(data) {
     return (
-      <div style={{ width: '332px' }} className={styles.customDetailBox}>
+      <div style={{ width: '336px' }} className={styles.customDetailBox}>
         <div>
           {top5Render()}
           {topNodesList.length ? <Divider /> : null}
@@ -152,7 +152,7 @@ export default ({ dataSource, topNodes, initialNodes, globalInfo }: Iprops) => {
                         ></span>
                         {key}
                       </span>
-                      <span>
+                      <span className={styles.value}>
                         {formatTimeTemplate(
                           BigNumber(value as any)
                             .div(1000000)
@@ -163,7 +163,7 @@ export default ({ dataSource, topNodes, initialNodes, globalInfo }: Iprops) => {
                   ) : (
                     <>
                       <span>{key}</span>
-                      <span>{value}</span>
+                      <span className={styles.value}>{value}</span>
                     </>
                   )}
                 </div>
@@ -182,7 +182,7 @@ export default ({ dataSource, topNodes, initialNodes, globalInfo }: Iprops) => {
                 return (
                   <div className={styles.keyValueBox}>
                     <span>{key}</span>
-                    <span>{value}</span>
+                    <span className={styles.value}>{value}</span>
                   </div>
                 );
               })}
@@ -328,7 +328,7 @@ export default ({ dataSource, topNodes, initialNodes, globalInfo }: Iprops) => {
                 </div>
                 <div style={{ color: 'var(--profile-text-color)' }}>[{i?.id}]</div>
               </div>
-              <span>
+              <span className={styles.value}>
                 {' '}
                 {formatTimeTemplate(BigNumber(i?.data?.duration).div(1000000).toNumber())}{' '}
               </span>
@@ -371,12 +371,14 @@ export default ({ dataSource, topNodes, initialNodes, globalInfo }: Iprops) => {
                           ></span>
                           {key}
                         </span>
-                        <span>{formatTimeTemplate(BigNumber(value).div(1000000).toNumber())} </span>
+                        <span className={styles.value}>
+                          {formatTimeTemplate(BigNumber(value).div(1000000).toNumber())}{' '}
+                        </span>
                       </>
                     ) : (
                       <>
                         <span>{key}</span>
-                        <span>{value}</span>
+                        <span className={styles.value}>{value}</span>
                       </>
                     )}
                   </div>
@@ -395,7 +397,7 @@ export default ({ dataSource, topNodes, initialNodes, globalInfo }: Iprops) => {
                   return (
                     <div className={styles.keyValueBox}>
                       <span>{key}</span>
-                      <span>{value}</span>
+                      <span className={styles.value}>{value}</span>
                     </div>
                   );
                 })}

diff --git a/src/component/ProfileFlow/customComponents/Edge.tsx b/src/component/ProfileFlow/customComponents/Edge.tsx
@@ -11,10 +11,10 @@ const CustomEdge = ({ id, sourceX, sourceY, targetX, targetY, style = {}, data }
 
   const edgeEndPointY = targetY - TURNNG_LINE_GAP;
 
-  // 根据tartget与source的x位置计算xOffset, 1.左边 2.右边 和 3.中间的区别
-  const xOffset = sourceX - targetX > 4 ? -16 : sourceX - targetX < -4 ? 16 : 0;
-  // 根据tartget与source的x位置计算yOffset, 1.左边/右边 2.中间的区别
-  let yOffset = Math.abs(sourceX - targetX) < 4 ? 25 : 10;
+  // 根据是否有一个以上子节点tartget与source的x位置计算xOffset
+  const xOffset = data?.isSingleChild ? 0 : sourceX - targetX > 4 ? -16 : 16;
+  // 根据tartget与source的x位置计算yOffset
+  let yOffset = data?.isSingleChild ? 25 : 10;
   // 有子节点的再单独计算
   yOffset = data.isOverlap ? yOffset + 8 : yOffset;
 

diff --git a/src/component/ProfileFlow/customComponents/Node.tsx b/src/component/ProfileFlow/customComponents/Node.tsx
@@ -81,7 +81,7 @@ function TextUpdaterNode({ data, id, isConnectable }) {
         {data?.hasChild ? (
           <div
             className={styles.icon}
-            style={{ bottom: data?.subNodes ? '-33px' : '-25px' }}
+            style={{ top: data?.subNodes ? 'calc(100% + 8px)' : '100%' }}
             onClick={(e) => {
               e.preventDefault();
               e.stopPropagation();

diff --git a/src/component/ProfileFlow/customComponents/index.less b/src/component/ProfileFlow/customComponents/index.less
@@ -3,13 +3,16 @@
 .customDetailBox {
   position: absolute;
   right: 16px;
-  width: 332px;
+  width: 336px;
   background-color: var(--profile-secondry-background-color);
   border: 1px solid var(--profile-border-color);
   border-left: none;
   height: calc(100% - 151px);
   overflow-y: auto;
   padding: 12px 8px;
+  .value {
+    color: var(--profile-text-color);
+  }
   .customDetailBoxItem {
     display: flex;
     justify-content: space-between;
@@ -133,7 +136,9 @@
     }
     .icon {
       position: absolute;
-      left: 129px;
+      left: 50%;
+      top: 100%;
+      transform: translateX(-50%);
       padding: 4px;
       color: var(--profile-icon-color);
     }

diff --git a/src/component/ProfileFlow/index.less b/src/component/ProfileFlow/index.less
@@ -4,7 +4,7 @@
   overflow-x: auto;
   background-color: var(--profile-primary-background-color);
   border: 1px solid var(--profile-border-color);
-  width: calc(100% - 332px);
+  width: calc(100% - 336px);
   :global {
     .react-flow__attribution {
       display: none;

diff --git a/src/component/ProfileFlow/utils.ts b/src/component/ProfileFlow/utils.ts
@@ -224,6 +224,7 @@ export function transformDataForReactFlow(
           data: {
             weight: node?.data.inEdges?.[0]?.weight,
             isOverlap: isParantOverlap,
+            isSingleChild: node?.parent?.data?.outEdges?.length === 1,
           },
         };
         edges.push(reactFlowEdge);

diff --git a/src/component/Task/component/TableSelecter/index.tsx b/src/component/Task/component/TableSelecter/index.tsx
@@ -250,7 +250,7 @@ const TableSelecter: React.ForwardRefRenderFunction<TableSelecterRef, IProps> =
     const filtedDataSource = [];
     for (const datasource of databaseWithTableList) {
       let { tableList, name } = datasource;
-      if (name.includes(sourceSearchValue)) {
+      if (name?.toLowerCase().includes(sourceSearchValue?.toLowerCase())) {
         filtedDataSource.push(datasource);
       } else {
         const targetTableList = tableList.filter((item) => item?.name?.includes(sourceSearchValue));

diff --git a/src/component/Toolbar/index.tsx b/src/component/Toolbar/index.tsx
@@ -150,7 +150,12 @@ function TButton({
 
   if (tip) {
     return (
-      <Tooltip placement={'topLeft'} title={tip} overlayInnerStyle={tipStyle} color="white">
+      <Tooltip
+        placement={'topLeft'}
+        title={tip}
+        overlayInnerStyle={tipStyle}
+        color="var(--background-primary-color)"
+      >
         <Badge dot={true} color="blue" style={{ top: 12, right: 6 }}>
           {content}
         </Badge>

diff --git a/src/page/Workspace/components/DDLResultSet/index.tsx b/src/page/Workspace/components/DDLResultSet/index.tsx
@@ -685,7 +685,7 @@ const DDLResultSet: React.FC<IProps> = function (props) {
     if (guideCacheStore?.[guideCacheStore.cacheEnum.executePlan]) return null;
     return (
       <div style={{ color: 'var(--text-color-secondary)' }}>
-        <div>
+        <div style={{ fontSize: 14, color: 'var(--text-color-primary)', fontWeight: 500 }}>
           {formatMessage({
             id: 'src.page.Workspace.components.DDLResultSet.E32AB474',
             defaultMessage: 'SQL 执行画像',
@@ -712,8 +712,10 @@ const DDLResultSet: React.FC<IProps> = function (props) {
         })}
         icon={<Icon component={SqlProfile} />}
         onClick={() => {
-          updateExecutePlanGuideCache();
           onOpenExecutingDetailModal?.(traceId, originSql, null, traceEmptyReason);
+          setTimeout(() => {
+            updateExecutePlanGuideCache();
+          }, 1000);
         }}
         tip={executeGuideTipContent()}
         overlayInnerStyle={{ width: 300 }}

diff --git a/src/page/Workspace/components/SQLResultSet/index.tsx b/src/page/Workspace/components/SQLResultSet/index.tsx
@@ -484,7 +484,7 @@ const SQLResultSet: React.FC<IProps> = function (props) {
                       stopRunning={stopRunning}
                       onOpenExecutingDetailModal={onOpenExecutingDetailModal}
                       loading={sqlStore.logLoading}
-                      isSupportProfile={isSupportProfile && set?.withQueryProfile}
+                      isSupportProfile={isSupportProfile}
                     />
                   ),
                 };

diff --git a/src/page/Workspace/components/Trace/TraceTable.tsx b/src/page/Workspace/components/Trace/TraceTable.tsx
@@ -67,25 +67,25 @@ const TraceTable: React.FC<{
             <div
               className={styles.timeStepItem}
               style={{
-                left: `${142 * 1}px`,
+                left: `25%`,
               }}
             ></div>
             <div
               className={styles.timeStepItem}
               style={{
-                left: `${143 * 2}px`,
+                left: `calc(50% - 1px)`,
               }}
             ></div>
             <div
               className={styles.timeStepItem}
               style={{
-                left: `${143 * 3 + 1}px`,
+                left: `calc(75% - 2px)`,
               }}
             ></div>
             <div
               className={styles.timeStepItem}
               style={{
-                left: `${143 * 4 + 3}px`,
+                left: `100%`,
               }}
             ></div>
             <div

diff --git a/src/page/Workspace/components/Trace/index.less b/src/page/Workspace/components/Trace/index.less
@@ -78,7 +78,6 @@
         display: flex;
         box-sizing: border-box;
         flex: 0 0 144px;
-        width: 144px;
         flex-shrink: 0;
         justify-content: space-between;
         align-items: center;
@@ -124,7 +123,6 @@
     border-left: none;
     position: relative;
     .timeStepItem {
-      flex: 0 0 144px;
       position: absolute;
       height: 20px;
       border-left: 1px solid transparent;

diff --git a/src/style/theme/white.less b/src/style/theme/white.less
@@ -144,7 +144,7 @@
   --profile-secondry-background-color: var(--neutral-White100-color);
   --profile-border-color: var(--neutral-grey7-color);
   --profile-line-color: var(--neutral-grey7-color);
-  --profile-icon-color: var(--neutral-black45-color);
+  --profile-icon-color: var(--text-color-secondary);
   --profile-text-color: var(--neutral-black45-color);
   --profile-progress-primary-color: var(--progress-blue-color);
   --profile-progress-secondry-color: var(--progress-green-color);