fm453/nocobase
1
0
Fork 0
mirror of https://gitee.com/nocobase/nocobase.git synced 2025-05-07 14:39:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: custom color

Browse Source
This commit is contained in:
chenos 2023-04-12 00:03:44 +08:00
parent 63b1b49b0f
commit 620c8ceba9
7 changed files with 28 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/core/client/src/block-provider/GanttBlockProvider.tsx
View File

@ -23,6 +23,7 @@ const formatData = (
progress: item[fieldNames.progress] * 100 || 0,
hideChildren: hideChildren,
project: projectId,
color: item.color,
});
formatData(item.children, fieldNames, tasks, item.id + '', hideChildren);
} else {
@ -34,6 +35,7 @@ const formatData = (
type: fieldNames.end ? 'task' : 'milestone',
progress: item[fieldNames.progress] * 100 || 0,
project: projectId,
color: item.color,
});
}
});

8
packages/core/client/src/schema-component/antd/gantt/components/gantt/gantt.tsx
View File

@ -66,12 +66,12 @@ export const Gantt: any = (props: any) => {
barCornerRadius = 2,
barProgressColor = '#1890ff',
barProgressSelectedColor = '#1890ff',
barBackgroundColor = '#82bdff',
barBackgroundSelectedColor = '#82bdff',
barBackgroundColor = '#1890ff',
barBackgroundSelectedColor = '#1890ff',
projectProgressColor = '#52c41a',
projectProgressSelectedColor = '#52c41a',
projectBackgroundColor = '#9cdc82',
projectBackgroundSelectedColor = '#9cdc82',
projectBackgroundColor = '#52c41a',
projectBackgroundSelectedColor = '#52c41a',
milestoneBackgroundColor = '#f1c453',
milestoneBackgroundSelectedColor = '#f29e4c',
rtl = false,

10
packages/core/client/src/schema-component/antd/gantt/components/task-item/bar/bar-display.tsx
View File

@ -1,10 +1,11 @@
import React from "react";
import { cx } from '@emotion/css';
import React from "react";
import { barBackground } from './style';
type BarDisplayProps = {
x: number;
y: number;
color?: string;
width: number;
height: number;
isSelected: boolean;
@ -23,6 +24,7 @@ type BarDisplayProps = {
export const BarDisplay: React.FC<BarDisplayProps> = ({
x,
y,
color,
width,
height,
isSelected,
@ -33,10 +35,16 @@ export const BarDisplay: React.FC<BarDisplayProps> = ({
onMouseDown,
}) => {
const getProcessColor = () => {
if (color) {
return color;
}
return isSelected ? styles.progressSelectedColor : styles.progressColor;
};
const getBarColor = () => {
if (color) {
return color;
}
return isSelected ? styles.backgroundSelectedColor : styles.backgroundColor;
};

9
packages/core/client/src/schema-component/antd/gantt/components/task-item/bar/bar.tsx
View File

@ -1,10 +1,10 @@
import React from "react";
import { cx } from '@emotion/css';
import React from "react";
import { getProgressPoint } from "../../../helpers/bar-helper";
import { BarDisplay } from "./bar-display";
import { BarDateHandle } from "./bar-date-handle";
import { BarProgressHandle } from "./bar-progress-handle";
import { TaskItemProps } from "../task-item";
import { BarDateHandle } from "./bar-date-handle";
import { BarDisplay } from "./bar-display";
import { BarProgressHandle } from "./bar-progress-handle";
import { barWrapper } from './style';
@ -27,6 +27,7 @@ export const Bar: React.FC<TaskItemProps> = ({
<BarDisplay
x={task.x1}
y={task.y}
color={task.color}
width={task.x2 - task.x1}
height={task.height}
progressX={task.progressX}

1
packages/core/client/src/schema-component/antd/gantt/components/task-item/bar/style.tsx
View File

@ -19,4 +19,5 @@ export const barWrapper = css`
export const barBackground = css`
user-select: none;
stroke-width: 0;
opacity: .6;
`;

10
packages/core/client/src/schema-component/antd/gantt/components/task-item/project/project.tsx
View File

@ -1,17 +1,19 @@
import React from 'react';
import { cx } from '@emotion/css';
import React from 'react';
import { TaskItemProps } from '../task-item';
import { projectWrapper, projectBackground } from './style';
import { projectBackground, projectWrapper } from './style';
export const Project: React.FC<TaskItemProps> = ({ task, isSelected }) => {
const barColor = isSelected ? task.styles.backgroundSelectedColor : task.styles.backgroundColor;
const processColor = isSelected ? task.styles.progressSelectedColor : task.styles.progressColor;
const projectWith = task.x2 - task.x1;
console.log('task', task);
return (
<g tabIndex={0} className={cx(projectWrapper)}>
<rect
fill={barColor}
fill={task.color || barColor}
x={task.x1}
width={projectWith}
y={task.y}
@ -27,7 +29,7 @@ export const Project: React.FC<TaskItemProps> = ({ task, isSelected }) => {
height={task.height}
ry={task.barCornerRadius}
rx={task.barCornerRadius}
fill={processColor}
fill={task.color || processColor}
/>
</g>
);

1
packages/core/client/src/schema-component/antd/gantt/types/bar-task.ts
View File

@ -12,6 +12,7 @@ export interface BarTask extends Task {
barCornerRadius: number;
handleWidth: number;
barChildren: BarTask[];
color?: string;
styles: {
backgroundColor: string;
backgroundSelectedColor: string;