IO-1722 replaced hex to rgba

This commit is contained in:
swtmply
2023-05-06 02:56:02 +08:00
parent 08e5543536
commit 3988386c79
3 changed files with 12 additions and 11 deletions

View File

@@ -24,18 +24,15 @@ const cardColor = (ssbuckets, totalHrs) => {
bucket.gte <= totalHrs && (!!bucket.lt ? bucket.lt > totalHrs : true) bucket.gte <= totalHrs && (!!bucket.lt ? bucket.lt > totalHrs : true)
)[0]; )[0];
if (bucket.color) { if (bucket.color.rgb) {
return bucket.color.hex; return bucket.color.rgb;
} }
return ""; return bucket.color;
}; };
function getContrastYIQ(hexColor) { function getContrastYIQ(bgColor) {
const r = parseInt(hexColor.substr(1, 2), 16); const yiq = (bgColor.r * 299 + bgColor.g * 587 + bgColor.b * 114) / 1000;
const g = parseInt(hexColor.substr(3, 2), 16);
const b = parseInt(hexColor.substr(5, 2), 16);
const yiq = (r * 299 + g * 587 + b * 114) / 1000;
return yiq >= 128 ? "black" : "white"; return yiq >= 128 ? "black" : "white";
} }
@@ -85,7 +82,10 @@ export default function ProductionBoardCard(
className="react-kanban-card imex-kanban-card" className="react-kanban-card imex-kanban-card"
size="small" size="small"
style={{ style={{
backgroundColor: cardSettings && cardSettings.cardcolor && bgColor, backgroundColor:
cardSettings &&
cardSettings.cardcolor &&
`rgba(${bgColor.r},${bgColor.g},${bgColor.b},${bgColor.a})`,
color: color:
cardSettings && cardSettings.cardcolor && getContrastYIQ(bgColor), cardSettings && cardSettings.cardcolor && getContrastYIQ(bgColor),
}} }}

View File

@@ -396,7 +396,7 @@ export function ShopInfoROStatusComponent({ bodyshop, form }) {
); );
} }
const ColorPicker = ({ value, onChange, style, ...restProps }) => { export const ColorPicker = ({ value, onChange, style, ...restProps }) => {
const handleChange = (color) => { const handleChange = (color) => {
if (onChange) onChange(color.rgb); if (onChange) onChange(color.rgb);
}; };

View File

@@ -15,6 +15,7 @@ import { useTranslation } from "react-i18next";
import ColorpickerFormItemComponent from "../form-items-formatted/colorpicker-form-item.component"; import ColorpickerFormItemComponent from "../form-items-formatted/colorpicker-form-item.component";
import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component"; import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
import LayoutFormRow from "../layout-form-row/layout-form-row.component"; import LayoutFormRow from "../layout-form-row/layout-form-row.component";
import { ColorPicker } from "./shop-info.rostatus.component";
export default function ShopInfoSchedulingComponent({ form }) { export default function ShopInfoSchedulingComponent({ form }) {
const { t } = useTranslation(); const { t } = useTranslation();
@@ -283,7 +284,7 @@ export default function ShopInfoSchedulingComponent({ form }) {
key={`${index}color`} key={`${index}color`}
name={[field.name, "color"]} name={[field.name, "color"]}
> >
<ColorpickerFormItemComponent /> <ColorPicker />
</Form.Item> </Form.Item>
<Space wrap> <Space wrap>