<%--
  Created by IntelliJ IDEA.
  User: wuxuan
  Date: 2024/4/9
  Time: 16:08
  To change this template use File | Settings | File Templates.
--%>
<%@ page pageEncoding="UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ include file="../common/common.jsp" %>
<c:set var="basePage"><%=request.getContextPath() %>
</c:set>
<html>
<head>
    <title>ChatBot列表</title>
    <link rel="stylesheet" type="text/css" href="${basePage}/web/chatbot/static/css/noSignCustomerList.css">
</head>
<body>
<div class="page_container" id="app" style="overflow: auto">
    <div class="page_head">
        <h3>ChatBot列表</h3>
        <div class="breadcrumb">
            <a href="#">首页</a> > <a href="#">CSP业务</a> > ChatBot列表
        </div>
    </div>
    <div class="container-fluid bg-body-tertiary config-content">
        <div class="row row-panel form-panel">
            <form method="post" id="chatbot-form" action="${basePage}/chatbot/chatbotList.html">
                <div class="col-lg-3">
                    <label class="form-label"> 接口类型:
                        <select name="apiType" class="form_control form_white singleList">
                            <option value="">请选择</option>
                            <option <c:if test="${cspChatBot.apiType eq 'mobile5G'}">selected</c:if> value="mobile5G">移动</option>
                            <option <c:if test="${cspChatBot.apiType eq 'telecom5G'}">selected</c:if> value="telecom5G">电信</option>
                            <option <c:if test="${cspChatBot.apiType eq 'unicom5G'}">selected</c:if> value="unicom5G">联通</option>
                        </select>
                    </label>
                </div>
                <div class="col-lg-3">
                    <label class="form-label"> CSP代理商名称:
                        <input type="text" name="agentName" class="form_control form_white"
                               value="${cspChatBot.agentName}"
                               placeholder="请输入CSP代理商名称">
                    </label>
                </div>
                <div class="col-lg-3">
                    <label class="form-label"> ChatBot ID:
                        <input type="text" name="chatBotId" class="form_control form_white"
                               value="${cspChatBot.chatBotId}"
                               placeholder="请输入ChatBot ID">
                    </label>
                </div>
                <div class="col-lg-3">
                    <label class="form-label"> ChatBot 名称:
                        <input type="text" name="chatBotName" class="form_control form_white"
                               value="${cspChatBot.chatBotName}"
                               placeholder="请输入ChatBot 名称">
                    </label>
                </div>
                <div class="col-lg-3">
                    <label class="form-label"> 签名:
                        <input type="text" name="sign" class="form_control form_white" placeholder="请输入签名"
                               value="${cspChatBot.sign}">
                    </label>
                </div>
                <div class="col-lg-3">
                    <label class="form-label"> 状态:
                        <select name="status" class="form_control form_white singleList">
                            <option value="">请选择</option>
                            <c:forEach items="${chatbotStatus}" var="item">
                                <option
                                        <c:if test="${cspChatBot.status eq item.key}">selected</c:if>
                                        value="${item.key}">${item.key} ${item.value}</option>
                            </c:forEach>
                            <option
                                    <c:if test="${cspChatBot.status eq 9998}">selected</c:if>
                                    value="9998">9998 管控</option>
                        </select>
                    </label>
                </div>
                <div class="col-lg-3">
                    <div class="my-btn-group">
                        <button type="button" onclick="submitForm()" class="btn btn_blue">查询</button>
                        <a href="${basePage}/chatbot/chatbotConfigInfo.html" class="btn btn_green">添加ChatBot</a>
                        <button type="button" class="btn btn_red_btn_small" onclick="importChatBotFile()">批量导入电信chatbot</button>
                    </div>
                </div>
                <%--                <div class="col-lg-4" style="margin-top: 10px">--%>
                <%--                    <div class="my-btn-group">--%>
                <%--                        <button type="button" class="btn btn_small btn_blue">按条件导出</button>--%>
                <%--                        <button type="button" class="btn btn_small btn_blue">查询批量更新状态</button>--%>
                <%--                    </div>--%>
                <%--                </div>--%>
            </form>
        </div>

        <div class="row row-panel">
            <div class="col-12">
                <div class="my-table-container">
                    <table class="table table-hover datatable" style="table-layout: fixed;width: 100%">
                        <thead>
                        <tr>
                            <%--                            <th style="width: 40px">--%>
                            <%--                                <input type="checkbox" id="selectAll">--%>
                            <%--                            </th>--%>
                            <th style="width: 10%">代理商</th>
                            <th style="width: 10%">客户</th>
                            <th style="width: 10%">ChatBotID</th>
                            <th style="width: 10%">签名</th>
                            <th style="width: 10%">CspToken/appId</th>
                            <th style="width: 10%">管控Token/appKey</th>
<%--                            <th style="width: 10%">签名</th>--%>
                            <th style="width: 10%">审核人</th>
                            <th style="width: 10%">审核信息</th>
                            <th style="width: 10%">状态</th>
                            <th style="width: 30%">操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <c:choose>
                        <c:when test="${empty chatBotList}">
                            <tr>
                                <td colspan="11" class="text-center">暂无数据</td>
                            </tr>
                        </c:when>
                        <c:otherwise>
                        <c:forEach items="${chatBotList}" var="item">
                            <tr>
                                    <%--                                <td>--%>
                                    <%--                                    <label>--%>
                                    <%--                                        <input type="checkbox" name="chatbot" data-chatbotid="${item.id}">--%>
                                    <%--                                    </label>--%>
                                    <%--                                </td>--%>
                                <td class="col-over-hide" title="代理商ID:${item.agentNumber} 名称:${item.agentName}">
                                        ${item.agentName}
                                </td>
                                <td class="col-over-hide" title="客户ID:${item.customerNum} 名称:${item.customerName}">
                                        ${item.customerName}
                                </td>
                                <td class="col-over-hide copy" title="${item.chatBotId}">
                                        ${item.chatBotId}
                                </td>
                                <td class="col-over-hide" title="${item.sign}">
                                        ${item.sign}
                                </td>
                                <td class="col-over-hide copy"
                                    title="${not empty item.apiType and item.apiType != 'mobile5G' ? item.appId : item.cspToken}">
                                    <c:choose>
                                        <c:when test="${not empty item.apiType and item.apiType != 'mobile5G'}">
                                            ${item.appId}
                                        </c:when>
                                        <c:otherwise>
                                            ${item.cspToken}
                                        </c:otherwise>
                                    </c:choose>
                                </td>
                                <td class="col-over-hide copy"
                                    title="${not empty item.apiType and item.apiType != 'mobile5G' ? item.appKey : item.devToken}">
                                    <c:choose>
                                        <c:when test="${not empty item.apiType and item.apiType != 'mobile5G'}">
                                            ${item.appKey}
                                        </c:when>
                                        <c:otherwise>
                                            ${item.devToken}
                                        </c:otherwise>
                                    </c:choose>
                                </td>
<%--                                <td class="col-over-hide">--%>
<%--                                        ${item.sign}--%>
<%--                                </td>--%>
                                <td class="col-over-hide" title="${item.auditer}">${item.auditer}</td>
                                <td class="col-over-hide" title="${item.auditerMsg}">${item.auditerMsg}</td>
                                <td class="col-over-hide"
                                    title="${item.status == null ? '待提交' : (item.status == 9998 ? '管控' : chatbotStatus.getOrDefault(item.status, '未知状态'))}">
                                    <c:choose>
                                        <c:when test="${item.status == null}">待提交</c:when>
                                        <c:when test="${item.status == 9998}">管控</c:when>
                                        <c:otherwise>
                                            ${chatbotStatus.getOrDefault(item.status, "未知状态")}
                                        </c:otherwise>
                                    </c:choose>

                                </td>
                                <td>
                                        <%--                                        <button type="button" class="btn btn_blue btn_small">固定菜单</button>--%>
<%--                                    <c:if test="${item.status != 9999 and item.status != 11}">--%>
<%--                                        <button type="button" class="btn btn_blue btn_small"--%>
<%--                                                onclick="editChatbot('${item.id}')">编辑--%>
<%--                                        </button>--%>
<%--                                    </c:if>--%>
                                    <c:choose>
                                        <c:when test="${item.status == 11}">
                                            <button type="button" class="btn btn_blue btn_small"
                                                    onclick="editChatbot('${item.id}')">重新提交
                                            </button>
                                        </c:when>
                                        <c:otherwise>
                                            <button type="button" class="btn btn_blue btn_small"
                                                    onclick="editChatbot('${item.id}')">编辑
                                            </button>
                                        </c:otherwise>
                                    </c:choose>

                                    <c:if test="${item.status == 30}">
                                        <c:if test="${item.apiType == null || item.apiType == 'mobile5G'}">
                                            <button type="button" class="btn btn_orange btn_small"
                                                    onclick="OfflineState('${item.id}')">下线
                                            </button>
                                        </c:if>
                                        <c:if test="${item.apiType != null && item.apiType != 'mobile5G'}">
                                            <button type="button" class="btn btn_orange btn_small"
                                                    onclick="OfflineTelecomState('${item.id}')">下线
                                            </button>
                                        </c:if>
                                    </c:if>
                                    <c:if test="${item.status == 31}">

                                        <c:if test="${item.apiType == null || item.apiType == 'mobile5G'}">
                                            <button type="button" class="btn btn_green btn_small"
                                                    onclick="OnlineState('${item.id}')">上线
                                            </button>
                                        </c:if>
                                        <c:if test="${item.apiType != null && item.apiType != 'mobile5G' && item.isOnLineFlag == '1'}">
                                            <button type="button" class="btn btn_green btn_small"
                                                    onclick="OnlineTelecomState('${item.id}')">上线
                                            </button>
                                        </c:if>

                                    </c:if>
                                    <c:if test="${item.status == 50}">
                                        <c:if test="${item.apiType == null || item.apiType == 'mobile5G'}">
                                            <button type="button" class="btn btn_blue btn_small"
                                                    onclick="onChatbot('${item.id}')">上架
                                            </button>
                                        </c:if>
                                        <c:if test="${item.apiType != null && item.apiType != 'mobile5G' && (item.isOnLineFlag == '0' || item.isOnLineFlag == null)}">
                                            <button type="button" class="btn btn_blue btn_small"
                                                    onclick="onlineTelecomFirstState('${item.id}')">上架
                                            </button>
                                        </c:if>
                                        <c:if test="${item.apiType == null || item.apiType == 'mobile5G'}">
                                            <button type="button" class="btn btn_blue btn_small"
                                                    onclick="editDebugInfo('${item.id}')">修改调试信息
                                            </button>
                                        </c:if>
                                        <c:if test="${item.apiType != null && item.apiType != 'mobile5G'}">
                                            <button type="button" class="btn btn_blue btn_small"
                                                    onclick="editDebugInfo('${item.id}')">配置手机号白名单
                                            </button>
                                        </c:if>
                                    </c:if>

                                        <%--                                        <button type="button" class="btn btn_blue btn_small"--%>
                                        <%--                                                onclick="copyChatBot('${item.chatBotId}')">复制--%>
                                        <%--                                        </button>--%>
                                        <%--                                        <button type="button" class="btn btn_blue btn_small"--%>
                                        <%--                                                onclick="editWhiteList('${item.chatBotId}')">白名单--%>
                                        <%--                                        </button>--%>
                                    <c:if test="${item.apiType != null && item.apiType != 'mobile5G'}">
                                        <button type="button" class="btn btn_red_btn_small" onclick="updateDeveloper('${item.id}')">开发者配置</button>
                                        <button type="button" class="btn btn_green btn_small" onclick="createTestExcel('${item.id}')">测试文件生成</button>
                                    </c:if>


                                    <c:if test="${item.status != 9999 and item.status != 11}">
                                        <c:if test="${item.apiType == null || item.apiType == 'mobile5G'}">
                                            <button type="button" class="btn btn_red btn_small"
                                                    onclick="logoutChatbot('${item.id}')">注销
                                            </button>
                                        </c:if>
                                        <c:if test="${item.apiType != null && item.apiType != 'mobile5G'}">
                                            <button type="button" class="btn btn_red btn_small"
                                                    onclick="logoutTelecomChatbot('${item.id}')">注销
                                            </button>
                                        </c:if>
                                    </c:if>
                                    <button type="button" class="btn btn_red_btn_small" onclick="deleteChatbot('${item.id}')">删除</button>
                                </td>
                            </tr>
                        </c:forEach>
                        </tbody>
                        <tfoot>
                            ${cspChatBot.page.pageStr}
                        </tfoot>
                        </c:otherwise>
                        </c:choose>
                    </table>
                </div>
            </div>
        </div>
    </div>

</div>
</body>
<script type="text/javascript" src="${basePage}/js/layui/layui.js"></script>
<script>
    function submitForm() {
        $("#chatbot-form").submit()
    }

    $(function () {
        $(".singleSelect").select()

        $(".copy").click(function () {
            const that = this;
            Dialog.confirm('是否需要复制内容?', function () {
                let text = $(that).text();
                if (text) {
                    let input = document.createElement("input");
                    input.value = text.trim();
                    document.body.appendChild(input);
                    input.select();
                    document.execCommand("Copy");
                    document.body.removeChild(input);
                    layer.msg('复制成功');
                } else {
                    layer.msg('未获取到内容,复制失败');
                }
            })
        })
    })

    function doSubmitBindSp(val) {

    }

    function editChatbot(id) {
        window.location.href = "${basePage}/chatbot/chatbotConfigInfo.html?id=" + id
    }

    function logoutChatbot(id) {
        Dialog.confirm('是否确定需要注销Chatbot?', function () {
            $.ajax({
                url: '${basepage}/chatbot/logoutChatBot.html',
                type: 'post',
                data: {
                    id: id
                },
                success: res => {
                    if (res.code === 0) {
                        layer.msg(res.msg, {icon: 1});
                        setTimeout(function () {
                            window.location.reload()
                        }, 1000)
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                },
                error: res => {
                    layer.msg('请求失败', {icon: 2})
                }
            })
        })
    }

    function logoutTelecomChatbot(id) {
        Dialog.confirm('是否确定需要注销Chatbot?', function () {
            $.ajax({
                url: '${basepage}/chatbot/logoutTelecomChatbot.html',
                type: 'post',
                data: {
                    id: id
                },
                success: res => {
                    if (res.code === 0) {
                        layer.msg(res.msg, {icon: 1});
                        setTimeout(function () {
                            window.location.reload()
                        }, 1000)
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                },
                error: res => {
                    layer.msg('请求失败', {icon: 2})
                }
            })
        })
    }

    function OfflineState(id) {
        Dialog.confirm('是否确定需要下线Chatbot?', function () {
            $.ajax({
                url: '${basepage}/chatbot/offlineChatbotState.html',
                type: 'post',
                data: {
                    id: id,
                },
                success: res => {
                    if (res.code === 0) {
                        layer.msg(res.msg, {icon: 1});
                        setTimeout(function () {
                            window.location.reload()
                        }, 1000)
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                }
            })
        })
    }

    function OfflineTelecomState(id) {
        Dialog.confirm('是否确定需要下线Chatbot?', function () {
            $.ajax({
                url: '${basepage}/chatbot/offlineTelecomChatbotState.html',
                type: 'post',
                data: {
                    id: id,
                },
                success: res => {
                    if (res.code === 0) {
                        layer.msg(res.msg, {icon: 1});
                        setTimeout(function () {
                            window.location.reload()
                        }, 1000)
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                }
            })
        })
    }

    function OnlineState(id) {
        Dialog.confirm('是否确定需要上线Chatbot?', function () {
            $.ajax({
                url: '${basepage}/chatbot/onlineChatbotState.html',
                type: 'post',
                data: {
                    id: id,
                },
                success: res => {
                    if (res.code === 0) {
                        layer.msg(res.msg, {icon: 1});
                        setTimeout(function () {
                            window.location.reload()
                        }, 1000)
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                },
                error: res => {
                    layer.msg('请求失败', {icon: 2})
                }
            })
        })
    }

    function OnlineTelecomState(id) {
        Dialog.confirm('是否确定需要上线Chatbot?', function () {
            $.ajax({
                url: '${basepage}/chatbot/onlineTelecomChatbotState.html',
                type: 'post',
                data: {
                    id: id,
                },
                success: res => {
                    if (res.code === 0) {
                        layer.msg(res.msg, {icon: 1});
                        setTimeout(function () {
                            window.location.reload()
                        }, 1000)
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                },
                error: res => {
                    layer.msg('请求失败', {icon: 2})
                }
            })
        })
    }



    function onChatbot(id) {
        Dialog.confirm('是否确定需要上线Chatbot?', function () {
            $.ajax({
                url: '${basepage}/chatbot/onChatBot.html',
                type: 'post',
                data: {
                    id: id,
                },
                success: res => {
                    if (res.code === 0) {
                        layer.msg(res.msg, {icon: 1});
                        setTimeout(function () {
                            window.location.reload()
                        }, 1000)
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                }
            })
        })
    }

    function editDebugInfo(id) {
        Dialog.ajaxOpen('${basepage}/chatbot/editDebugInfo.html?id=' + id, '编辑调试手机号', me => {
            let newDebugInfo = $('#editDebugInfo').val()
            if (!newDebugInfo) {
                layer.msg('请输入调试手机号', {icon: 2})
                return
            }

            let apiType = $('#apiType').val().trim();
            let requestUrl = '${basepage}/chatbot/editDebugInfoApi.html';
            if (apiType && apiType !== 'mobile5G') {
                requestUrl = '${basepage}/chatbot/editDebugInfoTelecomApi.html';
            }
            $.ajax({
                url: requestUrl,
                type: 'post',
                data: {
                    id: id,
                    debugPhone: newDebugInfo
                },
                success: res => {
                    if (res.code === 0) {
                        layer.msg(res.msg, {icon: 1});
                        me.close();
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                },
                error: res => {
                    layer.msg('请求失败', {icon: 2})
                }
            })
        })
    }

    function updateDeveloper(id) {
        Dialog.ajaxOpen('${basepage}/chatbot/toUpdateDeveloper.html?id=' + id, '开发者配置', me => {
            let requestUrl = '${basepage}/chatbot/updateDeveloper.html';
            let agreement = $('#agreement').val();
            let url = $('#url').val().trim();
            $.ajax({
                url: requestUrl,
                type: 'post',
                data: {
                    id: id,
                    agreement: agreement,
                    url: url
                },
                success: res => {
                    if (res.code === 0) {
                        layer.msg(res.msg, {icon: 1});
                        // setTimeout(function () {
                        //     window.location.reload()
                        // }, 1000)
                        me.close();
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                },
                error: res => {
                    layer.msg('请求失败', {icon: 2})
                }
            })
        })
    }

    function createTestExcel(id) {
        document.location = "${basepage}/chatbot/createTestExcel.html?id=" + id;
    }

    function onlineTelecomFirstState(id) {
        Dialog.ajaxOpen('${basepage}/chatbot/toOnlineTelecomFirstState.html?id=' + id, 'chatbot首次上线申请', me => {
            let requestUrl = '${basepage}/chatbot/onlineTelecomFirstState.html';
            const fileInput = $('#fileSelect')[0];
            if (!fileInput) {
                layer.msg('文件选择器不存在', {icon: 2});
                return;
            }
            const selectedFile = fileInput.files[0];
            if (!selectedFile) {
                layer.msg('请先选择文件', {icon: 2});
                return;
            }
            let agentId = $('#agentId').val();
            let accessTagNo = $('#accessTagNo').val();
            let id = $('#id').val();
            const formData = new FormData();
            formData.append('file', selectedFile);
            formData.append('agentId', agentId);
            formData.append('accessTagNo', accessTagNo);
            formData.append('id', id);
            $.ajax({
                url: requestUrl,
                type: 'post',
                data: formData,
                contentType: false,
                processData: false,
                success: res => {
                    if (res.code === 0) {
                        layer.msg(res.msg, {icon: 1});
                        // 运营-艾力说这里不需要完成后刷新
                        // setTimeout(function () {
                        //     window.location.reload()
                        // }, 1000)
                        // 艾力又说这里要关闭 回到页面
                        me.close();
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                },
                error: res => {
                    layer.msg('请求失败', {icon: 2})
                }
            })
        })
    }

    function deleteChatbot(id) {
        Dialog.confirm('是否确定删除该Chatbot?', function () {
            $.ajax({
                url: '${basepage}/chatbot/deleteChatbot.html',
                type: 'post',
                data: {
                    id: id
                },
                success: res => {
                    if (res.code === 0) {
                        layer.msg(res.msg, {icon: 1});
                        setTimeout(function () {
                            window.location.reload()
                        }, 1000)
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                }
            })
        })
    }

    function importChatBotFile(){
        Dialog.ajaxOpen('${basepage}/chatbot/jumpToImportChatBot.html', '开发者配置', me => {
            let requestUrl = '${basepage}/chatbot/importChatBotFile.html';
            let fileInput = $('#fileInfo')[0];
            let file = fileInput.files[0];

            // 校验：未选择文件时提示
            if (!file) {
                layer.msg('请选择要上传的文件', {icon: 2});
                return;
            }
            let formData = new FormData();
            formData.append('file', file);
            $.ajax({
                url: requestUrl,
                type: 'post',
                data: formData,
                processData: false,
                contentType: false,
                success: res => {
                    if (res.returnCode === 200) {
                        layer.msg(res.msg, {icon: 1});
                        me.close();
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                },
                error: res => {
                    layer.msg('请求失败', {icon: 2})
                }
            })
        })
    }
</script>
</html>
