<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('腾讯ASR1参数配置')" />
    <th:block th:include="include :: layout-latest-css" />
    <th:block th:include="include :: ztree-css" />
    <style>
    </style>
</head>

<body>
<div class="main-content">
    <div class="h4 form-header" th:text="#{switchconf.asr.tx1.header}"></div>
    <div class="alert alert-info">
        `tx_asr1` 采样率与音频格式需保持和腾讯 DEMO 一致：`16000 Hz -> packet-format=1`，`8000 Hz -> packet-format=2`。
    </div>
    <div id="baseConfigs"></div>

    <div class="row"></div>
    <div class="row">
        <div class="col-sm-offset-5 col-sm-10">
            <button id="saveConfig" type="button" class="btn btn-sm btn-primary" onclick="submitHandler()"><i class="fa fa-check"></i><span th:text="#{switchconf.btn.save}"></span></button>&nbsp;
        </div>
    </div>
</div>

<th:block th:include="include :: footer" />
<th:block th:include="include :: layout-latest-js" />
<script>
    var prefix = ctx + "cc/fsconf";

    function buildConfigInput(config) {
        if (config.name === 'sample-rate') {
            return '<select class="config-value form-control" id="' + config.name + '">' +
                '<option value="16000"' + (config.value === '16000' ? ' selected' : '') + '>16000 Hz</option>' +
                '<option value="8000"' + (config.value === '8000' ? ' selected' : '') + '>8000 Hz</option>' +
                '</select>' +
                '<small class="text-muted">腾讯 DEMO 最新约定：16K 音频使用 format=1，8K 音频使用 format=2。</small>';
        }
        if (config.name === 'packet-format') {
            return '<select class="config-value form-control" id="' + config.name + '">' +
                '<option value="1"' + (config.value === '1' ? ' selected' : '') + '>1 (16K)</option>' +
                '<option value="2"' + (config.value === '2' ? ' selected' : '') + '>2 (8K)</option>' +
                '</select>' +
                '<small class="text-muted">建议不要手工改错，保存时会校验并和采样率联动。</small>';
        }
        return '<input class="config-value form-control" type="text" id="' + config.name + '" value="' + config.value + '" />';
    }

    function syncPacketFormatBySampleRate() {
        var sampleRate = $('#sample-rate').val();
        if (!sampleRate || $('#packet-format').length === 0) {
            return;
        }
        if (sampleRate === '16000') {
            $('#packet-format').val('1');
        } else if (sampleRate === '8000') {
            $('#packet-format').val('2');
        }
    }

    function validateTxAsr1FormatMapping() {
        var sampleRate = $('#sample-rate').val();
        var packetFormat = $('#packet-format').val();
        if (!sampleRate || !packetFormat) {
            return true;
        }
        if (sampleRate === '16000' && packetFormat !== '1') {
            $.modal.msgError('腾讯 ASR1 配置不匹配：16000 Hz 必须对应 packet-format=1');
            return false;
        }
        if (sampleRate === '8000' && packetFormat !== '2') {
            $.modal.msgError('腾讯 ASR1 配置不匹配：8000 Hz 必须对应 packet-format=2');
            return false;
        }
        return true;
    }

    $(function() {
        $.ajax({
            url: prefix + '/getTxBridgeAsr1Conf',
            type: 'GET',
            success: function(_data) {
                var baseConfigsHtml = '';
                var data = _data.data;

                $.each(data, function(index, config) {
                    baseConfigsHtml += '<div className="row">';
                    baseConfigsHtml += '<div class="col-sm-12">';
                    baseConfigsHtml += '<label class="col-sm-2 control-label">' + config.aliasName + '</label><div class="col-sm-10">' + buildConfigInput(config) + '</div>';
                    baseConfigsHtml += '</div>';
                    baseConfigsHtml += '</div>';
                });
                $('#baseConfigs').html(baseConfigsHtml);
                syncPacketFormatBySampleRate();
                $('#sample-rate').on('change', syncPacketFormatBySampleRate);
            },
            error: function(error) {
                console.error('Error fetching configuration:', error);
            }
        });
    });

    $('#saveConfig').click(function() {
        syncPacketFormatBySampleRate();
        if (!validateTxAsr1FormatMapping()) {
            return;
        }
        var configs = [];
        $('.config-value').each(function() {
            var config = {
                name: $(this).attr('id'),
                value: $(this).val().trim()
            };
            configs.push(config);
        });
        $.ajax({
            url: prefix + '/setTxBridgeAsr1Conf',
            type: 'POST',
            contentType: 'application/json',
            data: JSON.stringify(configs),
            beforeSend: function () {
                $.modal.loading(i18n("common.tip.loading"));
                $.modal.disable();
            },
            success: function(response) {
                processAjaxReponseJson(response);
            },
            error: function(error) {
            }
        });
    });

</script>

</body>
</html>

