Skip to content

Commit

Permalink
feat(binary-plan): refine
Browse files Browse the repository at this point in the history
  • Loading branch information
@baurine
baurine committed Jul 28, 2023
1 parent 4a1ce5a commit f20e7a5
Show file tree
Hide file tree
Showing 6 changed files with 79 additions and 70 deletions.
16 changes: 8 additions & 8 deletions pkg/apiserver/utils/binary_plan.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -505,9 +505,9 @@ func analyzeDurationNode(node *simplejson.Json, concurrency concurrency) (time.D

// cop task
if ts == "" {
ts = getCopTaskDuratuon(node, concurrency)
ts = getCopTaskDuration(node, concurrency)
} else {
ts = getOperatorDuratuon(ts, concurrency)
ts = getOperatorDuration(ts, concurrency)
}

operator := getOperatorType(node)
Expand Down Expand Up @@ -773,11 +773,11 @@ func getConcurrency(node *simplejson.Json, operator operator, concurrency concur
}

case Shuffle:
tmpSuffleConcurrencyStr := rootGroupInfo.GetIndex(i).Get("ShuffleConcurrency").MustString()
tmpSuffleConcurrency, _ := strconv.Atoi(tmpSuffleConcurrencyStr)
tmpShuffleConcurrencyStr := rootGroupInfo.GetIndex(i).Get("ShuffleConcurrency").MustString()
tmpShuffleConcurrency, _ := strconv.Atoi(tmpShuffleConcurrencyStr)

Check warning on line 777 in pkg/apiserver/utils/binary_plan.go

View check run for this annotation

Codecov / codecov/patch

pkg/apiserver/utils/binary_plan.go#L776-L777 

Added lines #L776 - L777 were not covered by tests

if tmpSuffleConcurrency > 0 {
concurrency.shuffleConcurrency = tmpSuffleConcurrency * concurrency.shuffleConcurrency
if tmpShuffleConcurrency > 0 {
concurrency.shuffleConcurrency = tmpShuffleConcurrency * concurrency.shuffleConcurrency

Check warning on line 780 in pkg/apiserver/utils/binary_plan.go

View check run for this annotation

Codecov / codecov/patch

pkg/apiserver/utils/binary_plan.go#L779-L780 

Added lines #L779 - L780 were not covered by tests
}
}

Expand All @@ -792,7 +792,7 @@ func getConcurrency(node *simplejson.Json, operator operator, concurrency concur
return concurrency
}

func getCopTaskDuratuon(node *simplejson.Json, concurrency concurrency) string {
func getCopTaskDuration(node *simplejson.Json, concurrency concurrency) string {
storeType := node.GetPath(StoreType).MustString()
// task == 1
ts := node.GetPath(CopExecInfo, fmt.Sprintf("%s_task", storeType), "time").MustString()
Expand Down Expand Up @@ -842,7 +842,7 @@ func getCopTaskDuratuon(node *simplejson.Json, concurrency concurrency) string {
return ts
}

func getOperatorDuratuon(ts string, concurrency concurrency) string {
func getOperatorDuration(ts string, concurrency concurrency) string {
t, err := time.ParseDuration(ts)
if err != nil {
return "0s"
Expand Down
19 changes: 9 additions & 10 deletions ui/packages/tidb-dashboard-lib/src/apps/SlowQuery/pages/Detail/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,8 +74,8 @@ function DetailPage() {
setDetailExpand((prev) => ({ ...prev, prev_query: !prev.prev_query }))
const toggleQuery = () =>
setDetailExpand((prev) => ({ ...prev, query: !prev.query }))
const togglePlan = () =>
setDetailExpand((prev) => ({ ...prev, plan: !prev.plan }))
// const togglePlan = () =>
// setDetailExpand((prev) => ({ ...prev, plan: !prev.plan }))

const [isVpVisible, setIsVpVisable] = useState(false)
const toggleVisualPlan = (action: 'open' | 'close') => {
Expand Down Expand Up @@ -186,24 +186,23 @@ function DetailPage() {
<Descriptions>
<Descriptions.Item
span={2}
multiline={detailExpand.plan}
multiline={true}
// multiline={detailExpand.plan}
label={
<Space size="middle">
<Expand.Link
{/* <Expand.Link
expanded={detailExpand.plan}
onClick={togglePlan}
/>
/> */}
<CopyLink
data={data.binary_plan_text ?? data.plan ?? ''}
/>
</Space>
}
>
<Expand expanded={detailExpand.plan}>
<Pre noWrap>
{data.binary_plan_text ?? data.plan}
</Pre>
</Expand>
{/* <Expand expanded={detailExpand.plan}>
</Expand> */}
<Pre noWrap>{data.binary_plan_text ?? data.plan}</Pre>
</Descriptions.Item>
</Descriptions>
</Tabs.TabPane>
Expand Down
81 changes: 47 additions & 34 deletions ui/packages/tidb-dashboard-lib/src/apps/Statement/pages/Detail/PlanDetail.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { Space, Tabs, Modal } from 'antd'
import { useTranslation } from 'react-i18next'
import {
AnimatedSkeleton,
BinaryPlanTable,
Card,
CopyLink,
Descriptions,
Expand Down Expand Up @@ -84,8 +85,8 @@ function PlanDetail({ query }: IPlanDetailProps) {
setDetailExpand((prev) => ({ ...prev, prev_query: !prev.prev_query }))
const toggleQuery = () =>
setDetailExpand((prev) => ({ ...prev, query: !prev.query }))
const togglePlan = () =>
setDetailExpand((prev) => ({ ...prev, plan: !prev.plan }))
// const togglePlan = () =>
// setDetailExpand((prev) => ({ ...prev, plan: !prev.plan }))

let titleKey
if (query.allPlans === 1) {
Expand Down Expand Up @@ -178,18 +179,56 @@ function PlanDetail({ query }: IPlanDetailProps) {
</Space>

<Tabs
defaultActiveKey={
binaryPlan && !binaryPlan.main.discardedDueToTooLong
? 'binary_plan'
: 'text_plan'
}
defaultActiveKey="text_plan"
onTabClick={(key) =>
telemetry.clickPlanTabs(key, data.digest!)
}
>
<Tabs.TabPane
tab={t('statement.pages.detail.desc.plans.execution.text')}
key="text_plan"
>
<Descriptions>
<Descriptions.Item
span={2}
// multiline={detailExpand.plan}
multiline={true}
label={
<Space size="middle">
{/* <Expand.Link
expanded={detailExpand.plan}
onClick={togglePlan}
/> */}
<CopyLink
data={data.binary_plan_text ?? data.plan ?? ''}
/>
</Space>
}
>
{/* <Expand expanded={detailExpand.plan}>
</Expand> */}
<Pre noWrap>{data.binary_plan_text ?? data.plan}</Pre>
</Descriptions.Item>
</Descriptions>
</Tabs.TabPane>

{binaryPlan && !binaryPlan.discardedDueToTooLong && (
<Tabs.TabPane
tab={t(
'statement.pages.detail.desc.plans.execution.table'
)}
key="binary_plan_table"
>
<BinaryPlanTable data={binaryPlan} />
<div style={{ height: 24 }} />
</Tabs.TabPane>
)}

{binaryPlan && !binaryPlan.main.discardedDueToTooLong && (
<Tabs.TabPane
tab={t('slow_query.detail.plan.visual')}
tab={t(
'statement.pages.detail.desc.plans.execution.visual'
)}
key="binary_plan"
>
<Modal
Expand All @@ -216,32 +255,6 @@ function PlanDetail({ query }: IPlanDetailProps) {
</Descriptions>
</Tabs.TabPane>
)}
<Tabs.TabPane
tab={t('statement.pages.detail.desc.plans.execution.text')}
key="text_plan"
>
<Descriptions>
<Descriptions.Item
span={2}
multiline={detailExpand.plan}
label={
<Space size="middle">
<Expand.Link
expanded={detailExpand.plan}
onClick={togglePlan}
/>
<CopyLink
data={data.binary_plan_text ?? data.plan ?? ''}
/>
</Space>
}
>
<Expand expanded={detailExpand.plan}>
<Pre noWrap>{data.binary_plan_text ?? data.plan}</Pre>
</Expand>
</Descriptions.Item>
</Descriptions>
</Tabs.TabPane>
</Tabs>
</>
)}
Expand Down
3 changes: 2 additions & 1 deletion ui/packages/tidb-dashboard-lib/src/apps/Statement/translations/en.yaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,8 +26,9 @@ statement:
some: 'Execution Detail of Selected {{n}} Plans'
execution:
title: Execution Plan
visual: Visual
text: Text
table: Table
visual: Visual
modal_title: Visual Plan
tabs:
basic: Basic
Expand Down
3 changes: 2 additions & 1 deletion ui/packages/tidb-dashboard-lib/src/apps/Statement/translations/zh.yaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,8 +26,9 @@ statement:
some: '{{n}} 个执行计划的执行详情'
execution:
title: 执行计划
visual: 图形
text: 文本
table: 表格
visual: 图形
modal_title: 执行计划可视化
tabs:
basic: 基本信息
Expand Down
27 changes: 11 additions & 16 deletions ui/packages/tidb-dashboard-lib/src/components/BinaryPlanTable/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -132,7 +132,7 @@ export const BinaryPlanTable: React.FC<BinaryPlanTableProps> = ({ data }) => {
minWidth: 100,
maxWidth: 120,
onRender: (row: BinaryPlanItem) => {
return <span>{row.estRows.toFixed(2)}</span>
return row.estRows.toFixed(2)
}
},
{
Expand All @@ -141,7 +141,7 @@ export const BinaryPlanTable: React.FC<BinaryPlanTableProps> = ({ data }) => {
minWidth: 100,
maxWidth: 120,
onRender: (row: BinaryPlanItem) => {
return <span>{(row.cost ?? 0).toFixed(2)}</span>
return (row.cost ?? 0).toFixed(2)
}
},
{
Expand All @@ -150,7 +150,7 @@ export const BinaryPlanTable: React.FC<BinaryPlanTableProps> = ({ data }) => {
minWidth: 100,
maxWidth: 120,
onRender: (row: BinaryPlanItem) => {
return <span>{row.actRows.toFixed(2)}</span>
return row.actRows.toFixed(2)
}
},
{
Expand All @@ -160,10 +160,10 @@ export const BinaryPlanTable: React.FC<BinaryPlanTableProps> = ({ data }) => {
maxWidth: 100,
onRender: (row: BinaryPlanItem) => {
let task = row.taskType
if (row.storeType !== 'tidb') {
if (task !== 'root') {
task += `[${row.storeType}]`
}
return <span>{task}</span>
return task
}
},
{
Expand All @@ -173,9 +173,8 @@ export const BinaryPlanTable: React.FC<BinaryPlanTableProps> = ({ data }) => {
maxWidth: 120,
onRender: (row: BinaryPlanItem) => {
const tableName = getTableName(row)
let content = ''

return tableName && <span>table: {tableName}</span>
let content = !!tableName ? `table: ${tableName}` : ''
return content && <Tooltip title={content}>{content}</Tooltip>
}
},
{
Expand All @@ -195,7 +194,7 @@ export const BinaryPlanTable: React.FC<BinaryPlanTableProps> = ({ data }) => {
</>
}
>
<span>{execInfo.join(', ')}</span>
{execInfo.join(', ')}
</Tooltip>
)
}
Expand All @@ -206,11 +205,7 @@ export const BinaryPlanTable: React.FC<BinaryPlanTableProps> = ({ data }) => {
minWidth: 100,
maxWidth: 300,
onRender: (row: BinaryPlanItem) => {
return (
<Tooltip title={row.operatorInfo}>
<span>{row.operatorInfo}</span>
</Tooltip>
)
return <Tooltip title={row.operatorInfo}>{row.operatorInfo}</Tooltip>
}
},
{
Expand All @@ -219,7 +214,7 @@ export const BinaryPlanTable: React.FC<BinaryPlanTableProps> = ({ data }) => {
minWidth: 60,
maxWidth: 100,
onRender: (row: BinaryPlanItem) => {
return <span>{getMemorySize(row)}</span>
return getMemorySize(row)
}
},
{
Expand All @@ -228,7 +223,7 @@ export const BinaryPlanTable: React.FC<BinaryPlanTableProps> = ({ data }) => {
minWidth: 60,
maxWidth: 100,
onRender: (row: BinaryPlanItem) => {
return <span>{getDiskSize(row)}</span>
return getDiskSize(row)
}
}
]
Expand Down

0 comments on commit f20e7a5

Please sign in to comment.