Благодаря значительному обновлению интерфейса API количественной торговой платформы были скорректированы параметры интерфейса стратегии платформы, интерактивные элементы управления и другие функции, а также добавлено много новых функций. В предыдущей статье подробно были представлены обновления параметров интерфейса и интерактивных элементов управления. В этой статье продолжается изучение применения недавно представленной кнопки строки состояния FMZ.COM.

Каждый разработчик стратегии хочет создать пользовательский интерфейс, который был бы простым в использовании, мощным и простым в дизайне. Для достижения этого стандарта FMZ.COM прилагает все усилия для модернизации функций платформы и улучшения пользовательского опыта. Разработка интерактивных элементов управления непосредственно в строке состояния страницы стратегии — это модернизация, основанная на этом спросе.

Далее давайте рассмотрим его применение в сценарии многовариантной стратегии.

Сценарии многопродуктовой стратегии

Будь то полностью автоматическая многовариантная арбитражная стратегия или полуавтоматическая многовариантная стратегия тайминга. Интерфейс пользовательского интерфейса стратегии должен иметь несколько функциональных интерактивных кнопок, таких как «Тейк-профит», «Стоп-лосс», «Ликвида», «Запланированное поручение» и т. д. для определенного продукта.

Затем давайте рассмотрим новые функции кнопки строки состояния на простейшем примере использования. Предположим, что наша стратегия торгует несколькими символами:

BTC_USDT бессрочный контракт, ETH_USDT бессрочный контракт, LTC_USDT бессрочный контракт, BNB_USDT бессрочный контракт, SOL_USDT бессрочный контракт

Пока стратегия выполняет автоматическую торговлю, мы надеемся разработать кнопку открытия для каждого продукта в строке состояния интерфейса стратегии. Но эта кнопка открытого положения требует ряда подробных настроек, таких как:

• Тип ордера: Лимитный ордер/Рыночный ордер.
• Объем заказа: количество.
• Цена заказа: цена.
• Направление торговли: покупка (длинная), продажа (короткая).

До этого обновления платформы кнопка строки состояния просто вызывала сообщение о взаимодействии с кнопкой. Невозможно связать ряд элементов управления для настройки сложных сообщений. Это обновление взаимодействия решает эту потребность. Давайте взглянем на дизайн кода. Подробные комментарии добавлены в код, чтобы было легче понять, как построить такую ​​функцию.

Примеры дизайна:

// 设置操作的各个品种 BTC_USDT.swap 为FMZ平台定义的品种格式，表示BTC的U本位永续合约
var symbols = ["BTC_USDT.swap", "ETH_USDT.swap", "LTC_USDT.swap", "BNB_USDT.swap", "SOL_USDT.swap"]

// 根据按钮模板构造按钮
function createBtn(tmp, group) {
    var btn = JSON.parse(JSON.stringify(tmp))
    _.each(group, function(eleByGroup) {
        btn["group"].unshift(eleByGroup)
    })

    return btn
}

function main() {
    LogReset(1)

    var arrManager = []
    _.each(symbols, function(symbol) {
        arrManager.push({
            "symbol": symbol,
        })
    })

    // Btn
    var tmpBtnOpen = {
        "type": "button",
        "cmd": "open",
        "name": "开仓下单",
        "group": [{
            "type": "selected",
            "name": "tradeType",
            "label": "下单类型",
            "description": "市价单、限价单",
            "default": 0,
            "group": "交易设置",
            "settings": {
                "options": ["市价单", "限价单"],
                "required": true,
            }
        }, {
            "type": "selected",
            "name": "direction",
            "label": "交易方向",
            "description": "买入、卖出",
            "default": "buy",
            "group": "交易设置",
            "settings": {
                "render": "segment",
                "required": true,
                "options": [{"name": "买入", "value": "buy"}, {"name": "卖出", "value": "sell"}],
            }
        }, {
            "type": "number",
            "name": "price",
            "label": "价格",
            "description": "订单的价格",
            "group": "交易设置",
            "filter": "tradeType==1",
            "settings": {
                "required": true,
            }
        }, {
            "type": "number",
            "name": "amount",
            "label": "下单量",
            "description": "订单的下单量",
            "group": "交易设置",
            "settings": {
                "required": true,
            }
        }],
    }

    while (true) {
        var tbl = {"type": "table", "title": "dashboard", "cols": ["symbol", "actionOpen"], "rows": []}
        _.each(arrManager, function(m) {
            var btnOpen = createBtn(tmpBtnOpen, [{"type": "string", "name": "symbol", "label": "交易品种", "default": m["symbol"], "settings": {"required": true}}])
            tbl["rows"].push([m["symbol"], btnOpen])
        })
        
        var cmd = GetCommand()
        if (cmd) {
            Log("收到交互：", cmd)
            
            // 解析交互消息: open:{"symbol":"LTC_USDT.swap","tradeType":0,"direction":"buy","amount":111}
            // 根据第一个冒号:之前的指令判断是哪种按钮模板触发的消息
            var arrCmd = cmd.split(":", 2)
            if (arrCmd[0] == "open") {
                var msg = JSON.parse(cmd.slice(5))
                Log("交易品种：", msg["symbol"], "，交易方向：", msg["direction"], "，订单类型：", msg["tradeType"] == 0 ? "市价单" : "限价单", msg["tradeType"] == 0 ? "，订单价格：当前市价" : "，订单价格：" + msg["price"], "，订单数量：", msg["amount"])
            }
        }

        // 输出状态栏信息
        LogStatus(_D(), "\n", "`" + JSON.stringify(tbl) + "`")
        Sleep(1000)
    }
}

Давайте сначала рассмотрим эффект бега, а затем подробно объясним конструкцию кнопки управления. Код стратегии работает так, как показано ниже:

Нажмите кнопку, и появится всплывающее окно для настройки конкретной информации о заказе:

После заполнения вводной информации мы разработали дизайн.

Вы можете видеть, что стратегия получила сообщение, и в коде мы проанализировали сообщение и вывели различные настройки для заказа. Далее давайте рассмотрим, как устроена эта кнопка:

Сначала мы определяем шаблон кнопки, представляющий собой объект JSON, и назначаем его переменной tmpBtnOpen. Конкретные инструкции я включил прямо в комментарии к коду ниже.

    {
        "type": "button",       // 状态栏输出控件的类型，目前仅支持按钮
        "cmd": "open",          // 当按钮触发时，策略中GetCommand函数收到的消息前缀，例如这个例子：open:{"symbol":"LTC_USDT.swap","tradeType":0,"direction":"buy","amount":111}
        "name": "开仓下单",      // 策略界面，状态栏上的按钮上显示的内容，参考上图
        "group": [{             // 当按钮触发时，弹框中的控件配置设置，这一层的group字段值是一个数组，弹框中的控件根据这个数组顺序自上而下排列
            "type": "selected",               // 第一个控件类型是：selected ，下拉框 
            "name": "tradeType",              // 当状态栏按钮触发时，消息中包含该控件的设置内容，tradeType就是当前这个下拉框控件输入的值的键名。如果选择第一个选项「市价单」GetCommand函数收到的消息中就包含 "tradeType":0 的键值对信息。
            "label": "下单类型",               // 按钮触发时，弹框中当前控件的标题
            "description": "市价单、限价单",    // 当前控件的说明信息，鼠标放在控件右侧“小问号”图标上就会显示这个说明信息。
            "default": 0,                     // 当前控件的默认值，例如当前是下拉框控件，如果不做选择，默认为下拉框第一个选项，通常下拉框的默认值指的是下拉框选项的索引，即第一个是0，然后是1，以此类推。如果下拉框的选项options是key-value形式则默认值指的是value。
            "group": "交易设置",               // 弹框中的控件如果很多，可以分组，这个字段可以设置分组信息
            "settings": {                     // 当前这个下拉框的具体设置
                "options": ["市价单", "限价单"],   // options和下拉框相关的设置，用于设置下拉框中的选项，这个字段值是一个数组，依次排列下拉框中的选项。
                "required": true,                // required表示是否设置为必选（必填）内容。
            }
        }, {
            "type": "selected",         // 这也是一个下拉框类型
            "name": "direction",
            "label": "交易方向",
            "description": "买入、卖出",
            "default": "buy",
            "group": "交易设置",
            "settings": {
                "render": "segment",   // 和默认下拉框控件不同的是，通过render字段可以把下拉框替换为“分段选择器”，如上图中的“买入/卖出”控件。
                "required": true,
                "options": [{"name": "买入", "value": "buy"}, {"name": "卖出", "value": "sell"}],   // 使用 key-value方式设置options
            }
        }, {
            "type": "number",           // 数值输入框类型控件
            "name": "price",
            "label": "价格",
            "description": "订单的价格",
            "group": "交易设置",
            "filter": "tradeType==1",   // 过滤器，可以用于确定是否显示当前控件，当tradeType==1时，表示是市价单，所以不需要该控件设置价格，所以不显示。
            "settings": {
                "required": true,       // 当该控件激活显示时为必选（必填）
            }
        }, {
            "type": "number",
            "name": "amount",
            "label": "下单量",
            "description": "订单的下单量",
            "group": "交易设置",
            "settings": {
                "required": true,
            }
        }],
    }

• group Поскольку это всего лишь пример, при фактическом проектировании и использовании могут быть дополнительные требования, не ограничивающиеся направлением ордера, ценой, количеством и типом ордера, установленными при открытии позиции. Также могут быть разработаны правила выхода, такие как приказы о тейк-профите и стоп-лоссе. Итак, новый пользовательский интерфейс поддерживаетgroupПоле, которое позволяет удобно группировать группы элементов управления во всплывающем окне для отображения, например, свернутая настройка «Настройки транзакции» на снимке экрана выше.

• required Структура кнопкиgroupКонтроль, установленный на местах, был усиленrequiredПоле настройки используется для установки того, является ли оно обязательным (требуемым). Если оно установлено как обязательное (требуемое), но не заполнено (не выбрано) во время использования, вы не можете нажать кнопку OK, чтобы отправить интерактивную информацию, и красный отображается сообщение с подсказкой.

• filter ДобавленfilterПоле используется для установки зависимостей фильтра. Например, в приведенном выше примере, если выбран тип рыночного ордера, цена ордера необязательна.typeэто “число”,nameЭлементы управления «ценой» скрыты.

• render Для этих основных типов элементов управления (параметры полей типа): число, строка, выбранное, логическое значение. Добавлены поляrenderИспользуется для настройки рендеринга элемента управления. Каждый элемент управления имеет свои собственные компоненты рендеринга. Например, в приведенном выше примере более целесообразно отобразить выбранный элемент управления раскрывающегося списка как «селектор сегмента», поскольку раскрывающийся список необходимо щелкнуть дважды (первый раз, чтобы развернуть раскрывающийся список , и второй раз, чтобы выбрать вариант). Используйте компонент выбора сегмента, просто щелкните и выберите нужный вариант.

Наконец, внимательные читатели могут спросить: на скриншоте выше я не вижу контрольной информации во всплывающем окне, где вы написали «Тип торговли», и этот «Тип торговли» не принадлежит к группе «Настройки торговли». (т.е.:"group": "交易设置"Эта настройка реализует).

Ниже представлена ​​демонстрация дизайна, который привязывает кнопки в таблице строки состояния к другой информации в строке состояния.createBtnФункция на основе шаблонаtmpBtnOpenСоздайте окончательную структуру кнопки и запишите в нее другую информацию во время построения.

// 构造按钮的时候，绑定当前行的品种名称等信息，给按钮的弹框增加一个控件，并排在首位
var btnOpen = createBtn(tmpBtnOpen, [{"type": "string", "name": "symbol", "label": "交易品种", "default": m["symbol"], "settings": {"required": true}}])

Итак, конечный эффект заключается в том, что когда вы нажимаете на строку состояния в интерфейсе стратегии,symbolдляBNB_USDT.swapПри нажатии кнопки в этой строке поле ввода «Тип торговли» во всплывающем окне будет заполнено автоматически.BNB_USDT.swap。

В этой статье представлена ​​лишь небольшая часть применения новой версии пользовательского интерфейса. Поскольку общая длина не может быть слишком большой, мы продолжим обсуждение дизайна других сценариев спроса в следующей статье.

Спасибо за вашу поддержку!