Skip to main content

au-widget-design-editor/Commands/change-design-variant-command

Classes​

ChangeDesignVariantCommand​

A command that changes product design variants.

Here, we open the selected design variant.

{
  "type": "design-editor",
  "name": "editor",
  "params": {
    "initial": { ... },
    "changeDesignVariant": [{
        "designVariant": "{{ $['pim-design-selector']._ }}"
    }]
  }
}

Extends​

Methods​

execute()​
execute(params): Promise<void>;

Executes this command.

Parameters​
ParameterTypeDescription
paramsIChangeDesignVariantCommandDefinitionParameters for the command.
Returns​

Promise<void>

Overrides​

DesignEditorWidgetCommand.execute

Interfaces​

IChangeDesignVariantCommandDefinition​

Provides the after property to support a queue of commands.

The following example illustrates how you can run the setViewerSettings command after setPrintArea completes.

{
  "widgets": [{
    "type": "design-editor",
    "name": "editor",
    "params": {
      "inital": { ... },
      "setViewerSettings": "{{vars.zoomSettings[$['flyer-size']._.title]}}",
      "setPrintArea": {
        "data": {
          "designFile": "{{$['flyer-gallery']._.name}}"
        },
        "after": [
          "setViewerSettings"
        ]
      }
    }
  }]
}

Extends​

Indexable​

[key: string]: IUpdateSurfaceOptionsByDefinition
[key: number]: IUpdateSurfaceOptionsByDefinition
[key: symbol]: IUpdateSurfaceOptionsByDefinition

Properties​

after?​
optional after?: string | string[];

The next commands to be executed after this command completes.

Inherited from​

IDesignEditorCommandDefinition.after

autoCompile?​
optional autoCompile?: boolean;

If false, action will never execute automatically.

Inherited from​

IDesignEditorCommandDefinition.autoCompile

definition​
definition: IChangeDesignVariantProductDefinition;
designVariant​
designVariant: ProductInformationDesign;
executeOnce?​
optional executeOnce?: boolean;

If true, this command will be executed only once. You can use it for initial command. For example, we need to change surface depending on the option value. We write for initial and for updateSurfaces the same productDefinition with $['option]._ And set executeOnce = true for initial. And initial will be executed only once.

Inherited from​

IDesignEditorCommandDefinition.executeOnce

executeOnlyAfter?​
optional executeOnlyAfter?: string[];

Current command will be executed in a next update only after all commands executed in this param. The same example from executeOnce param. We need to execute updateSurface on all next updates, exclude the first one. And we set executeOnlyAfter = ['initial'] for updateSurface command.

Inherited from​

IDesignEditorCommandDefinition.executeOnlyAfter

lock?​
optional lock?: string[];

Name of widgets that show preloader when command executed.

Inherited from​

IDesignEditorCommandDefinition.lock

message?​
optional message?: string | string[];

The message for preloader.

Inherited from​

IDesignEditorCommandDefinition.message

onExecuted?​
optional onExecuted?: Function | Function[];

Functions that executed after command

Inherited from​

IDesignEditorCommandDefinition.onExecuted

showPreloader?​
optional showPreloader?: boolean;

If true, displays the preloader while executing this command.

Inherited from​

IDesignEditorCommandDefinition.showPreloader

timeout?​
optional timeout?: number;

The timeout for switching preloader messages.

Inherited from​

IDesignEditorCommandDefinition.timeout

IChangeDesignVariantProductDefinition​

Extends​

  • Omit<IProductDefinition, "surfaces">

Indexable​

[key: string]: IProductDefinition
[key: number]: IProductDefinition
[key: symbol]: IProductDefinition

Properties​

surfaces​
surfaces: IChangeDesignVariantSurfaceFromState[];

IChangeDesignVariantSurfaceFromState​

Extends​

  • Omit<ISurfaceFromState, "stateId">

Indexable​

[key: string]: ISurfaceFromState
[key: number]: ISurfaceFromState
[key: symbol]: ISurfaceFromState

Properties​

designVariant​
designVariant: ProductInformationDesign;
Was this page helpful?