<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('修改呼入大模型配置')"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-inboundllm-edit" th:object="${ccInboundLlmAccount}">
        <input name="id" th:field="*{id}" type="hidden">

        <!-- 1. 别名 -->
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required" th:text="#{inboundllm.form.inboundAlias}"></label>
                <div class="col-sm-8">
                    <input name="inboundAlias" th:field="*{inboundAlias}" class="form-control" type="text" required>
                </div>
            </div>
        </div>

        <!-- 1. 被叫号码 -->
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required" th:text="#{inboundllm.form.callee}"></label>
                <div class="col-sm-8">
                    <input name="callee" th:field="*{callee}" class="form-control" type="text" required>
                </div>
            </div>
        </div>

        <!-- 2. 服务类型 -->
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required" th:text="#{inboundllm.form.serviceType}"></label>
                <div class="col-sm-8">
                    <select name="serviceType" th:field="*{serviceType}" class="form-control" id="serviceTypeSelect" required>
                        <option value="ai"   th:text="#{inboundllm.form.serviceTypeAI}"></option>
                        <option value="acd"  th:text="#{inboundllm.form.serviceTypeACD}"></option>
                        <option value="ivr"  th:text="#{inboundllm.form.serviceTypeIVR}"></option>
                    </select>
                </div>
            </div>
        </div>

        <!-- 3. 大模型底座 （仅 AI 可见）-->
        <div class="col-xs-12 ai-only">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required" th:text="#{inboundllm.form.llmAccountId}"></label>
                <div class="col-sm-8">
                    <select name="llmAccountId" th:field="*{llmAccountId}" class="form-control" required>
                        <option value="" th:text="#{inboundllm.form.llmAccountId.empty}"></option>
                    </select>
                </div>
            </div>
        </div>

        <!-- 4. ASR 提供商（仅 AI 可见） -->
        <div class="col-xs-12 ai-only">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required" th:text="#{inboundllm.form.asrProvider}"></label>
                <div class="col-sm-8">
                    <select name="asrProvider" id="asrProvider" th:field="*{asrProvider}" class="form-control" required>
                        <option value="" th:text="#{inboundllm.form.asrProvider.empty}"></option>
                    </select>
                </div>
            </div>
        </div>

        <!-- 5. 音色来源（仅 AI 可见） -->
        <div class="col-xs-12 ai-only">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required" th:text="#{inboundllm.form.voiceSource}"></label>
                <div class="col-sm-8">
                    <select name="voiceSource" id="voiceSource" th:field="*{voiceSource}" class="form-control" required>
                        <option value="" th:text="#{inboundllm.form.voiceSource.empty}"></option>
                    </select>
                </div>
            </div>
        </div>

        <!-- 6. 音色编码（仅 AI 可见） -->
        <div class="col-xs-12 ai-only">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required" th:text="#{inboundllm.form.voiceCode}"></label>
                <div class="col-sm-8">
                    <select name="voiceCode" th:field="*{voiceCode}" class="form-control" required>
                        <option value="" th:text="#{inboundllm.form.voiceCode.empty}"></option>
                    </select>
                </div>
            </div>
        </div>

        <!-- 7. AI 转接类型（仅 AI 可见） -->
        <div class="col-xs-12 ai-only" id="aiTransferTypeDiv">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required" th:text="#{inboundllm.form.aiTransferType}"></label>
                <div class="col-sm-8">
                    <select name="aiTransferType" th:field="*{aiTransferType}" id="aiTransferTypeSelect" class="form-control" required>
                        <option value="acd"      th:text="#{inboundllm.form.aiTransferTypeACD}"></option>
                        <option value="extension" th:text="#{inboundllm.form.aiTransferTypeExtension}"></option>
                        <option value="gateway"  th:text="#{inboundllm.form.aiTransferTypeGateway}"></option>
                    </select>
                </div>
            </div>
        </div>

        <!-- 8. IVR 下拉（仅 IVR 可见） -->
        <div class="col-xs-12 ivr-only">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required" th:text="#{inboundllm.form.ivrId}"></label>
                <div class="col-sm-8">
                    <select name="ivrId" th:field="*{ivrId}" class="form-control" required>
                        <option value="" th:text="#{inboundllm.form.ivrId.empty}"></option>
                    </select>
                </div>
            </div>
        </div>

        <!-- 9. 业务组（ACD / AI+ACD 可见） -->
        <div class="col-xs-12 transfer-field acd-only acd-transfer">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required" th:text="#{inboundllm.form.aiTransferGroupId}"></label>
                <div class="col-sm-8">
                    <select name="aiTransferGroupId" th:field="*{aiTransferGroupId}" class="form-control" required>
                        <option value="" th:text="#{inboundllm.form.aiTransferGroupId.empty}"></option>
                    </select>
                </div>
            </div>
        </div>

        <!-- 10. 网关（AI+Gateway 可见） -->
        <div class="col-xs-12 transfer-field gateway-transfer">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required" th:text="#{inboundllm.form.aiTransferGatewayId}"></label>
                <div class="col-sm-8">
                    <select name="aiTransferGatewayId" th:field="*{aiTransferGatewayId}" class="form-control" required>
                        <option value="" th:text="#{inboundllm.form.aiTransferGatewayId.empty}"></option>
                    </select>
                </div>
            </div>
        </div>

        <!-- 11. 网关目标号码（AI+Gateway 可见） -->
        <div class="col-xs-12 transfer-field gateway-transfer">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required" th:text="#{inboundllm.form.aiTransferGatewayDestNumber}"></label>
                <div class="col-sm-8">
                    <input name="aiTransferGatewayDestNumber" th:field="*{aiTransferGatewayDestNumber}" class="form-control" type="text" required>
                </div>
            </div>
        </div>

        <!-- 12. 分机号（AI+Extension 可见） -->
        <div class="col-xs-12 transfer-field extension-transfer">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required" th:text="#{inboundllm.form.aiTransferExtNumber}"></label>
                <div class="col-sm-8">
                    <input name="aiTransferExtNumber" th:field="*{aiTransferExtNumber}" class="form-control" type="text" required>
                </div>
            </div>
        </div>


        <!-- 13. 服务评价 下拉 -->
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label " th:text="#{inboundllm.form.satisfSurveyIvrId}"></label>
                <div class="col-sm-8">
                    <select name="satisfSurveyIvrId" th:field="*{satisfSurveyIvrId}" class="form-control" >
                        <option value="" th:text="#{inboundllm.form.satisfSurveyIvrId.empty}"></option>
                    </select>
                </div>
            </div>
        </div>

    </form>
</div>
<th:block th:include="include :: footer"/>
<script th:inline="javascript">
    var prefix = ctx + "aicall/inboundllm";
    $(function(){

        /* ---------- 通用下拉数据加载 ---------- */

        // 大模型底座
        $.ajax({
            url: ctx + "aicall/account/all",
            success: function(rsp) {
                var llmAccountSelect = $('select[name="llmAccountId"]');
                llmAccountSelect.empty();
                llmAccountSelect.append('<option value="">' + i18n('inboundllm.form.llmAccountId.empty') + '</option>');
                rsp.data.forEach(function(llmAccount) {
                    llmAccountSelect.append($("<option>").attr("value", llmAccount.id).text(llmAccount.name));
                });
                var llmAccountId = /*[[${ccInboundLlmAccount.llmAccountId}]]*/ '';
                if (llmAccountId) llmAccountSelect.val(llmAccountId);
            }
        });

        // ASR 提供商
        $.ajax({
            url: ctx + "aicall/ttsAliyun/asr/provider/all",
            success: function(rsp) {
                var providerSelect = $('#asrProvider');
                providerSelect.empty();
                Object.entries(rsp.data).forEach(function([key, value]) {
                    providerSelect.append($("<option>").attr("value", key).text(value));
                });
                var savedProvider = /*[[${ccInboundLlmAccount.asrProvider}]]*/ '';
                if (savedProvider) providerSelect.val(savedProvider);
            }
        });

        // 音色来源
        $.ajax({
            url: ctx + "aicall/ttsAliyun/tts/voiceSource/all",
            success: function(rsp) {
                var voiceSourceSelect = $('#voiceSource');
                voiceSourceSelect.empty();
                Object.entries(rsp.data).forEach(function([key, value]) {
                    voiceSourceSelect.append($("<option>").attr("value", key).text(value));
                });
                var savedVoiceSource = /*[[${ccInboundLlmAccount.voiceSource}]]*/ '';
                if (savedVoiceSource) {
                    voiceSourceSelect.val(savedVoiceSource);
                    loadVoicesByVoiceSource(savedVoiceSource);
                }
            }
        });

        // 业务组
        $.ajax({
            url: ctx + "cc/bizgroup/all",
            success: function(rsp) {
                var groupSelect = $('select[name="aiTransferGroupId"]');
                groupSelect.empty();
                groupSelect.append('<option value="">' + i18n('inboundllm.form.aiTransferGroupId.empty') + '</option>');
                rsp.data.forEach(function(bizGroup) {
                    groupSelect.append($("<option>").attr("value", bizGroup.groupId).text(bizGroup.bizGroupName));
                });
                var groupId = /*[[${ccInboundLlmAccount.aiTransferGroupId}]]*/ '';
                if (groupId) groupSelect.val(groupId);
            }
        });

        // 出局网关
        $.ajax({
            url: ctx + "cc/gateways/outbound",
            success: function(rsp) {
                var gatewaySelect = $('select[name="aiTransferGatewayId"]');
                gatewaySelect.empty();
                gatewaySelect.append('<option value="">' + i18n('inboundllm.form.aiTransferGatewayId.empty') + '</option>');
                rsp.data.forEach(function(gateway) {
                    gatewaySelect.append($("<option>").attr("value", gateway.id).text(gateway.gwDesc));
                });
                var aiTransferGatewayId = /*[[${ccInboundLlmAccount.aiTransferGatewayId}]]*/ '';
                if (aiTransferGatewayId) gatewaySelect.val(aiTransferGatewayId);
            }
        });

        // IVR 下拉
        $.ajax({
            url: ctx + "cc/ivr/all",
            success: function(rsp) {
                var ivrIdSelect = $('select[name="ivrId"]');
                ivrIdSelect.empty();
                ivrIdSelect.append('<option value="">' + i18n('inboundllm.form.ivrId.empty') + '</option>');
                rsp.data.forEach(function(ccIvr) {
                    ivrIdSelect.append($("<option>").attr("value", ccIvr.id).text(ccIvr.ivrNodeName));
                });
                var ivrId = /*[[${ccInboundLlmAccount.ivrId}]]*/ '';
                if (ivrId) ivrIdSelect.val(ivrId);
            }
        });

        // satisfSurveyIvrId 下拉
        $.ajax({
            url: ctx + "cc/ivr/all",
            success: function(rsp) {
                var satisfSurveyIvrIdSelect = $('select[name="satisfSurveyIvrId"]');
                satisfSurveyIvrIdSelect.empty();
                satisfSurveyIvrIdSelect.append('<option value="">' + i18n('inboundllm.form.satisfSurveyIvrId.empty') + '</option>');
                rsp.data.forEach(function(ccIvr) {
                    satisfSurveyIvrIdSelect.append($("<option>").attr("value", ccIvr.id).text(ccIvr.ivrNodeName));
                });
                var satisfSurveyIvrId = /*[[${ccInboundLlmAccount.satisfSurveyIvrId}]]*/ '';
                if (satisfSurveyIvrId) satisfSurveyIvrIdSelect.val(satisfSurveyIvrId);
            }
        });

        /* ---------- 事件绑定 ---------- */
        $(document).on('change', '#voiceSource', function() {
            loadVoicesByVoiceSource($(this).val());
        });
        $(document).on('change', '#serviceTypeSelect', function() {
            toggleFields();
            // 清空satisfSurveyIvrId
            $('select[name="satisfSurveyIvrId"]').val("");
        });
        $(document).on('change', '#aiTransferTypeSelect', function() {
            toggleFields();
        });

        /* ---------- 校验 ---------- */
        $('input[name="callee"]').rules('add', {
            remote: {
                url: prefix + '/checkCallee',
                type: 'get',
                data: {
                    id: function () { return $('input[name="id"]').val(); },
                    callee: function () { return $('input[name="callee"]').val(); }
                },
                dataFilter: function (resp) {
                    return JSON.parse(resp).data ? 'true' : '"该号码不可用"';
                }
            },
            messages: { remote: '该号码不可用' }
        });

        /* ---------- 初始化 ---------- */
        toggleFields();
    });

    $("#form-inboundllm-edit").validate({ focusCleanup: true });

    function submitHandler() {
        if ($.validate.form()) {
            $.operate.save(prefix + "/edit", $('#form-inboundllm-edit').serialize());
        }
    }

    /* ========== 工具函数 ========== */
    function loadVoicesByVoiceSource(voiceSource) {
        var voiceSelect = $('select[name="voiceCode"]');
        if (!voiceSource) {
            voiceSelect.empty().append('<option value="">' + i18n('inboundllm.form.voiceCode.empty') + '</option>');
            return;
        }
        $.ajax({
            url: ctx + "aicall/ttsAliyun/getByVoiceSource",
            data: { voiceSource: voiceSource },
            success: function(rsp) {
                voiceSelect.empty();
                rsp.data.forEach(function(voice) {
                    voiceSelect.append($("<option>")
                        .attr("value", voice.voiceCode)
                        .attr("data-source", voice.voiceSource)
                        .text(voice.voiceName));
                });
                var voiceCode = /*[[${ccInboundLlmAccount.voiceCode}]]*/ '';
                if (voiceCode) voiceSelect.val(voiceCode);
            }
        });
    }

    function toggleFields() {
        var serviceType = $('#serviceTypeSelect').val();
        var aiTransferType = $('#aiTransferTypeSelect').val();

        // 先全部隐藏
        $('.ai-only,.acd-only,.ivr-only,.transfer-field').hide();

        if (serviceType === 'ai') {
            $('.ai-only').show();
            if (aiTransferType === 'acd')      $('.acd-transfer').show();
            if (aiTransferType === 'gateway')  $('.gateway-transfer').show();
            if (aiTransferType === 'extension')$('.extension-transfer').show();
        } else if (serviceType === 'acd') {
            $('.acd-only').show();
        } else if (serviceType === 'ivr') {
            $('.ivr-only').show();
        }
    }
</script>
</body>
</html>