Убраны лишние компоненты. Данные с метриками выводятся списоком
This commit is contained in:
Pavel Gnedov
parent
e4fb067ea9
commit
628412ffc5
1 changed files with 5 additions and 236 deletions
|
|
@ -3,7 +3,6 @@ import * as DashboardStoreNs from '../dashboard-store';
|
|||
import { observer } from 'mobx-react-lite';
|
||||
import { DebugInfo } from '../../misc-components/debug-info';
|
||||
import { Instance, onSnapshot, types } from 'mobx-state-tree';
|
||||
import { v4 as uuidv4 } from 'uuid';
|
||||
import { text2id } from '../../utils/text-to-id';
|
||||
|
||||
export const DailyEccmV2Data = types.model({
|
||||
|
|
@ -29,139 +28,6 @@ export const DailyEccmV2Store = types
|
|||
|
||||
export type IDailyEccmV2Store = Instance<typeof DailyEccmV2Store>;
|
||||
|
||||
const SimpleCounterViewComponent = (props: {
|
||||
id: string;
|
||||
label: string;
|
||||
count: number;
|
||||
issueIds?: number[];
|
||||
detailsLabel?: string;
|
||||
details?: Record<string, number>;
|
||||
}): JSX.Element => {
|
||||
let detailsHintComponent = <></>;
|
||||
if (props.details) {
|
||||
const parentKey = props.id
|
||||
? props.id
|
||||
: `simple-counter-component-${uuidv4()}`;
|
||||
const detailsKey = `${parentKey}-details`;
|
||||
detailsHintComponent = (
|
||||
<DetailsHintViewComponent
|
||||
key={detailsKey}
|
||||
id={detailsKey}
|
||||
mainLabel={props.detailsLabel ?? 'Details'}
|
||||
details={props.details}
|
||||
/>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<span key={props.id}>
|
||||
{props.label}: {props.count} {detailsHintComponent}
|
||||
</span>
|
||||
);
|
||||
};
|
||||
|
||||
const DetailsHintViewComponent = (props: {
|
||||
id: string;
|
||||
mainLabel: string;
|
||||
details: Record<string, number>;
|
||||
}): JSX.Element => {
|
||||
return (
|
||||
<span key={props.id} style={{ marginLeft: '10px', color: 'lightgray' }}>
|
||||
({props.mainLabel}: {JSON.stringify(props.details)})
|
||||
</span>
|
||||
);
|
||||
};
|
||||
|
||||
const ChangesCounterTotalViewComponent = (props: {
|
||||
id: string;
|
||||
data: Record<string, any>;
|
||||
}): JSX.Element => {
|
||||
if (!props.id) return <></>;
|
||||
const titles: Record<string, string> = {
|
||||
byIssue: 'По задачам',
|
||||
byStatus: 'По статусам',
|
||||
byVersion: 'По версиям',
|
||||
byUserName: 'По работникам',
|
||||
};
|
||||
const groups = Object.keys(titles);
|
||||
const details: JSX.Element[] = [];
|
||||
groups.forEach((groupName) => {
|
||||
const groupKey = `${props.id}-details-${groupName}`;
|
||||
const groupTitle = titles[groupName];
|
||||
const groupData = props.data[groupName];
|
||||
const cmp = (
|
||||
<ChangesCounterListViewComponent
|
||||
key={groupKey}
|
||||
id={groupKey}
|
||||
title={groupTitle}
|
||||
data={groupData}
|
||||
/>
|
||||
);
|
||||
details.push(cmp);
|
||||
});
|
||||
return (
|
||||
<ul>
|
||||
<li>Итого изменений: {props.data?.totalChanges ?? 0}</li>
|
||||
<li>Итого комментариев: {props.data?.totalComments ?? 0}</li>
|
||||
{details}
|
||||
</ul>
|
||||
);
|
||||
};
|
||||
|
||||
const ChangesCounterListViewComponent = (props: {
|
||||
id: string;
|
||||
title: string;
|
||||
data?: Record<string, { changes: number; comments: number }>;
|
||||
}): JSX.Element => {
|
||||
if (!props.data || !props.id) return <></>;
|
||||
const dataKeys = Object.keys(props.data ?? {});
|
||||
if (!dataKeys || dataKeys.length <= 0) return <></>;
|
||||
|
||||
const res: JSX.Element[] = [];
|
||||
|
||||
dataKeys.forEach((itemKey) => {
|
||||
const itemData = props.data && props.data[itemKey];
|
||||
if (!itemData) return;
|
||||
const key = `${props.id}-${text2id(props.title)}-${text2id(itemKey)}`;
|
||||
res.push(
|
||||
<li key={`${key}-li`}>
|
||||
<ChangesCounterItemViewComponent
|
||||
key={key}
|
||||
id={key}
|
||||
label={itemKey}
|
||||
type={itemKey === 'byIssue' ? 'issue' : 'other'}
|
||||
changes={itemData.changes}
|
||||
comments={itemData.comments}
|
||||
/>
|
||||
</li>,
|
||||
);
|
||||
});
|
||||
|
||||
return (
|
||||
<>
|
||||
{props.title}:<ul>{res}</ul>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
const ChangesCounterItemViewComponent = (props: {
|
||||
id: string;
|
||||
type: 'issue' | 'other';
|
||||
label: string;
|
||||
changes: number;
|
||||
comments: number;
|
||||
}): JSX.Element => {
|
||||
return (
|
||||
<span key={props.id}>
|
||||
<span>
|
||||
{props.type == 'issue' ? '#' : ''}
|
||||
{props.label}:
|
||||
</span>
|
||||
<span>все изменения - {props.changes}</span>,
|
||||
<span>комментарии - {props.comments}</span>
|
||||
</span>
|
||||
);
|
||||
};
|
||||
|
||||
const VerySimpleCounterViewComponent = (props: {
|
||||
id: string;
|
||||
title: string;
|
||||
|
|
@ -213,15 +79,6 @@ export const DailyEccmV2 = observer(
|
|||
|
||||
const keyPrefix = `dashboard-${dashboardId}-widget-${widgetId}`;
|
||||
|
||||
const issuesByStatusCount: Record<string, any> =
|
||||
props.store?.data?.issuesMetrics?.issuesByStatusCount ?? {};
|
||||
const issuesByVersionsCount: Record<string, any> =
|
||||
props.store?.data?.issuesMetrics?.issuesByVersionsCount ?? {};
|
||||
const issuesByUsername: Record<string, any> =
|
||||
props.store?.data?.issuesMetrics?.issuesByUsername ?? {};
|
||||
const changesCount: Record<string, any> =
|
||||
props.store?.data?.issuesMetrics?.changesCount ?? {};
|
||||
|
||||
const otherData: {
|
||||
title: string;
|
||||
value: number | string;
|
||||
|
|
@ -447,104 +304,16 @@ export const DailyEccmV2 = observer(
|
|||
);
|
||||
}
|
||||
|
||||
const byStatusLi: JSX.Element[] = [];
|
||||
|
||||
Object.keys(issuesByStatusCount).forEach((statusName) => {
|
||||
const byStatusData = issuesByStatusCount[statusName];
|
||||
const keyPrefixForCurrentStatusBlock = `${keyPrefix}-issuesByStatusCount-${statusName}`;
|
||||
byStatusLi.push(
|
||||
<li key={`${keyPrefixForCurrentStatusBlock}-li`}>
|
||||
<SimpleCounterViewComponent
|
||||
key={keyPrefixForCurrentStatusBlock}
|
||||
id={keyPrefixForCurrentStatusBlock}
|
||||
label={statusName}
|
||||
count={byStatusData.count}
|
||||
issueIds={byStatusData.issueIds}
|
||||
details={byStatusData.byVersion}
|
||||
detailsLabel="Версии"
|
||||
/>
|
||||
</li>,
|
||||
);
|
||||
});
|
||||
|
||||
const byVersionsLi: JSX.Element[] = [];
|
||||
|
||||
Object.keys(issuesByVersionsCount).forEach((versionName) => {
|
||||
const byVersionData = issuesByVersionsCount[versionName];
|
||||
const keyPrefixForCurrentVersionBlock = `${keyPrefix}-issuesByVersionCount-${versionName}`;
|
||||
byVersionsLi.push(
|
||||
<li key={`${keyPrefixForCurrentVersionBlock}-li`}>
|
||||
<SimpleCounterViewComponent
|
||||
key={keyPrefixForCurrentVersionBlock}
|
||||
id={keyPrefixForCurrentVersionBlock}
|
||||
label={versionName}
|
||||
count={byVersionData.count}
|
||||
issueIds={byVersionData.issueIds}
|
||||
details={byVersionData.byStatus}
|
||||
detailsLabel="Статусы"
|
||||
/>
|
||||
</li>,
|
||||
);
|
||||
});
|
||||
|
||||
const byUsersLi: JSX.Element[] = [];
|
||||
|
||||
Object.keys(issuesByUsername).forEach((username) => {
|
||||
const byUserNameData = issuesByUsername[username];
|
||||
const keyPrefixForCurrentUserBlock = `${keyPrefix}-issuesByUsername-${username}`;
|
||||
byUsersLi.push(
|
||||
<li key={`${keyPrefixForCurrentUserBlock}-li`}>
|
||||
<SimpleCounterViewComponent
|
||||
key={keyPrefixForCurrentUserBlock}
|
||||
id={keyPrefixForCurrentUserBlock}
|
||||
label={username}
|
||||
count={byUserNameData.count}
|
||||
issueIds={byUserNameData.issueIds}
|
||||
/>
|
||||
</li>,
|
||||
);
|
||||
});
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h1>Daily ECCM V2</h1>
|
||||
<p>Дата выгрузки: {props.store?.data?.datetimeFormatted}</p>
|
||||
<p>Метрики:</p>
|
||||
<ul>
|
||||
<li>
|
||||
Простые счётчики:
|
||||
<ul>
|
||||
<li>
|
||||
По статусам:
|
||||
<ul>{byStatusLi}</ul>
|
||||
</li>
|
||||
<li>
|
||||
По версиям:
|
||||
<ul>{byVersionsLi}</ul>
|
||||
</li>
|
||||
<li>
|
||||
По работникам:
|
||||
<ul>{byUsersLi}</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
По изменениям в задачах за период:
|
||||
<ChangesCounterTotalViewComponent
|
||||
key={`${keyPrefix}-changesCounterTotal`}
|
||||
id={`${keyPrefix}-changesCounterTotal`}
|
||||
data={changesCount}
|
||||
/>
|
||||
</li>
|
||||
<li>
|
||||
Другие счётчики:
|
||||
<VerySimpleCounterListViewComponent
|
||||
key={`${keyPrefix}-verySimpleCounterListViewComponent`}
|
||||
id={`${keyPrefix}-verySimpleCounterListViewComponent`}
|
||||
data={otherData || []}
|
||||
/>
|
||||
</li>
|
||||
</ul>
|
||||
<DebugInfo value={JSON.stringify(props.store?.data, null, 2)} />
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
Loading…
Reference in a new issue