feat(scheme): 支持选择方案并处理空值,更新预览组件逻辑
This commit is contained in:
@@ -1,4 +1,4 @@
|
|||||||
import { ColorExpand, ColorShifting, SchemeSetting, WACGSetting } from 'color-module';
|
import { ColorExpand, ColorShifting, SchemeSelect, SchemeSetting, WACGSetting } from 'color-module';
|
||||||
import { includes, isEmpty, isNil } from 'lodash-es';
|
import { includes, isEmpty, isNil } from 'lodash-es';
|
||||||
import { useActionState, useCallback, useMemo, useState } from 'react';
|
import { useActionState, useCallback, useMemo, useState } from 'react';
|
||||||
import { useColorFunction } from '../../../ColorFunctionContext';
|
import { useColorFunction } from '../../../ColorFunctionContext';
|
||||||
@@ -58,6 +58,7 @@ export function Q2SchemeBuilder({ scheme, onBuildCompleted }: Q2SchemeBuilderPro
|
|||||||
),
|
),
|
||||||
scheme.schemeStorage.source?.setting?.expand_method ?? defaultValues.expand_method,
|
scheme.schemeStorage.source?.setting?.expand_method ?? defaultValues.expand_method,
|
||||||
scheme.schemeStorage.source?.setting?.wacg_follows ?? defaultValues.wacg_follows,
|
scheme.schemeStorage.source?.setting?.wacg_follows ?? defaultValues.wacg_follows,
|
||||||
|
scheme.schemeStorage.source?.setting?.scheme_select ?? defaultValues.scheme_select,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
return defaultValues;
|
return defaultValues;
|
||||||
@@ -150,6 +151,7 @@ export function Q2SchemeBuilder({ scheme, onBuildCompleted }: Q2SchemeBuilderPro
|
|||||||
),
|
),
|
||||||
Number(formData.get('expanding')) as ColorExpand,
|
Number(formData.get('expanding')) as ColorExpand,
|
||||||
Number(formData.get('wacg')) as WACGSetting,
|
Number(formData.get('wacg')) as WACGSetting,
|
||||||
|
Number(formData.get('scheme_select')) as SchemeSelect,
|
||||||
);
|
);
|
||||||
const dumpedSetting = schemeSetting.toJsValue() as QSchemeSetting;
|
const dumpedSetting = schemeSetting.toJsValue() as QSchemeSetting;
|
||||||
|
|
||||||
@@ -222,14 +224,18 @@ export function Q2SchemeBuilder({ scheme, onBuildCompleted }: Q2SchemeBuilderPro
|
|||||||
updateScheme((prev) => {
|
updateScheme((prev) => {
|
||||||
prev.schemeStorage.source = source;
|
prev.schemeStorage.source = source;
|
||||||
prev.schemeStorage.scheme = {
|
prev.schemeStorage.scheme = {
|
||||||
light: {
|
light: isNil(generatedScheme[0].light)
|
||||||
...generatedScheme[0].light,
|
? null
|
||||||
customColors: mapToObject(generatedScheme[0].light.customColors),
|
: {
|
||||||
},
|
...generatedScheme[0].light,
|
||||||
dark: {
|
customColors: mapToObject(generatedScheme[0].light.customColors),
|
||||||
...generatedScheme[0].dark,
|
},
|
||||||
customColors: mapToObject(generatedScheme[0].dark.customColors),
|
dark: isNil(generatedScheme[0].dark)
|
||||||
},
|
? null
|
||||||
|
: {
|
||||||
|
...generatedScheme[0].dark,
|
||||||
|
customColors: mapToObject(generatedScheme[0].dark.customColors),
|
||||||
|
},
|
||||||
};
|
};
|
||||||
prev.schemeStorage.cssVariables = generatedScheme[1];
|
prev.schemeStorage.cssVariables = generatedScheme[1];
|
||||||
prev.schemeStorage.cssAutoSchemeVariables = generatedScheme[2];
|
prev.schemeStorage.cssAutoSchemeVariables = generatedScheme[2];
|
||||||
|
|||||||
@@ -162,10 +162,10 @@ const Q2SchemePreview: FC<PreviewProps> = ({ scheme }) => {
|
|||||||
<ScrollArea enableY>
|
<ScrollArea enableY>
|
||||||
<div className={styles.preview_layout}>
|
<div className={styles.preview_layout}>
|
||||||
<div className={styles.preview_layout}>
|
<div className={styles.preview_layout}>
|
||||||
{scheme.schemeStorage.scheme?.light && (
|
{scheme.schemeStorage.scheme?.light !== null && (
|
||||||
<PreviewBlock baseline={scheme.schemeStorage.scheme.light} title="Light Scheme" />
|
<PreviewBlock baseline={scheme.schemeStorage.scheme.light} title="Light Scheme" />
|
||||||
)}
|
)}
|
||||||
{scheme.schemeStorage.scheme?.dark && (
|
{scheme.schemeStorage.scheme?.dark !== null && (
|
||||||
<PreviewBlock baseline={scheme.schemeStorage.scheme.dark} title="Dark Scheme" />
|
<PreviewBlock baseline={scheme.schemeStorage.scheme.dark} title="Dark Scheme" />
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
+2
-2
@@ -36,8 +36,8 @@ export type Q2Baseline = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export type Q2Scheme = {
|
export type Q2Scheme = {
|
||||||
light: Q2Baseline;
|
light: Q2Baseline | null;
|
||||||
dark: Q2Baseline;
|
dark: Q2Baseline | null;
|
||||||
};
|
};
|
||||||
|
|
||||||
export type Q2SchemeSource = {
|
export type Q2SchemeSource = {
|
||||||
|
|||||||
Reference in New Issue
Block a user