README

此模块提供了与产品相关的 AI 翻译功能。

安装

使用 Composer 安装所需的模块

composer require spryker-community/product-management-ai-translator spryker-community/open-ai-translator --no-interaction

此命令将安装总共 5 个模块

• spryker-community/product-management-ai-translator
• spryker-community/ai-translator
• spryker-community/open-ai-translator
• spryker-community/open-ai-client
• openai-php/client

配置

将新的 SprykerCommunity 命名空间添加到配置中

# config/Shared/config_default.php

$config[KernelConstants::CORE_NAMESPACES] = [
    ...
    'SprykerCommunity',
];

配置 OpenAI API 令牌和缓存控制

# config/Shared/config_default.php

use SprykerCommunity\Shared\AiTranslator\AiTranslatorConstants;
use SprykerCommunity\Shared\OpenAiClient\OpenAiClientConstants;

$config[OpenAiClientConstants::API_TOKEN] = 'OpenAI API token'; // Sets private OpenAI API token
$config[AiTranslatorConstants::ENABLE_CACHE] = true; // Controls Redis caching for translations

配置 Router

# src/Pyz/Zed/Router/RouterConfig.php

public function getControllerDirectories(): array
{
    ...
    $controllerDirectories[] = sprintf('%s/spryker-community/*/src/*/Zed/*/Communication/Controller/', APPLICATION_VENDOR_DIR);
    ...
}

配置 Zed 的前端构建器

创建一个新的 JavaScript 文件

# frontend/zed/build.js

const { mergeWithCustomize, customizeObject } = require('webpack-merge');
const oryxForZed = require('@spryker/oryx-for-zed');
const path = require('path');

const mergeWithStrategy = mergeWithCustomize({
    customizeObject: customizeObject({
        plugins: 'prepend'
    })
});

const myCustomZedSettings = mergeWithStrategy(oryxForZed.settings, {
    entry: {
        dirs: [path.resolve('./vendor/spryker-community/')], // Path for SprykerCommunity entry points
    }
});

oryxForZed.getConfiguration(myCustomZedSettings)
    .then(configuration => oryxForZed.build(configuration, oryxForZed.copyAssets))
    .catch(error => console.error('An error occurred while creating configuration', error));

以下方式调整根 package.json

"scripts": {
    ...
    "zed": "node ./frontend/zed/build",
    ...
},

集成

在项目级别调整以下 Twig 模板

# src/Pyz/Zed/ProductManagement/Presentation/Add/index.twig

{% block head_css %}
    ...
    <link rel="stylesheet" href="{{ assetsPath('css/spryker-zed-product-management-ai-translator.css') }}" />
{% endblock %}

{% block footer_js %}
    ...
    <script src="{{ assetsPath('js/spryker-zed-product-management-ai-translator.js') }}"></script>
{% endblock %}

# src/Pyz/Zed/ProductManagement/Presentation/AddVariant/index.twig

{% block head_css %}
    ...
    <link rel="stylesheet" href="{{ assetsPath('css/spryker-zed-product-management-ai-translator.css') }}" />
{% endblock %}

{% block footer_js %}
    ...
    <script src="{{ assetsPath('js/spryker-zed-product-management-ai-translator.js') }}"></script>
{% endblock %}

# src/Pyz/Zed/ProductManagement/Presentation/Edit/variant.twig

{% block head_css %}
    ...
    <link rel="stylesheet" href="{{ assetsPath('css/spryker-zed-product-management-ai-translator.css') }}" />
{% endblock %}

{% block footer_js %}
    ...
    <script src="{{ assetsPath('js/spryker-zed-product-management-ai-translator.js') }}"></script>
{% endblock %}

连接插件

<?php

namespace Pyz\Client\AiTranslator;

use SprykerCommunity\Client\AiTranslator\AiTranslatorDependencyProvider as SprykerCommunityAiTranslatorDependencyProviderAlias;
use SprykerCommunity\Client\AiTranslator\Dependency\Plugin\TranslatorEnginePluginInterface;
use SprykerCommunity\Client\OpenAiTranslator\Plugin\AiTranslator\OpenAiTranslatorEnginePlugin;

class AiTranslatorDependencyProvider extends SprykerCommunityAiTranslatorDependencyProviderAlias
{
    /**
     * @return \SprykerCommunity\Client\AiTranslator\Dependency\Plugin\TranslatorEnginePluginInterface
     */
    protected function getTranslatorEnginePlugin(): TranslatorEnginePluginInterface
    {
        return new OpenAiTranslatorEnginePlugin();
    }
}

生成传输并构建前端

vendor/bin/console transfer:generate
vendor/bin/console frontend:zed:build