{{define "dashboard-default/server"}}
{{template "common/header" .}}
{{template "common/menu" .}}
<div class="nb-container">
    <div class="ui container">
        <div class="ui grid">
            <div class="right floated right aligned twelve wide column">
                <button class="ui right labeled nezha-primary-btn icon button" onclick="batchEditServerGroup()"><i
                        class="edit icon"></i> {{tr "BatchEditServerGroup"}}
                </button>
                <button class="ui right labeled nezha-primary-btn icon button" onclick="batchDeleteServer()"><i
                        class="trash icon"></i> {{tr "BatchDeleteServer"}}
                </button>
                <button class="ui right labeled nezha-primary-btn icon button" onclick="addOrEditServer()"><i
                        class="add icon"></i> {{tr "AddServer"}}
                </button>
                <button class="ui right labeled nezha-primary-btn icon button" onclick="forceUpdate()"><i
                        class="arrow alternate circle up outline icon"></i> {{tr "ForceUpdate"}}
                </button>
            </div>
        </div>
        <table class="ui basic table">
            <thead>
                <tr>
                    <th><button onclick="checkAllServer()" class="ui mini nezha-primary-btn button">{{tr "SelectAll"}}</button></th>
                    <th>ID({{tr "DisplayIndex"}})</th>
                    <th>{{tr "Name"}}</th>
                    <th>{{tr "ServerGroup"}}</th>
                    <th>IP</th>
                    <th>{{tr "VersionNumber"}}</th>
                    <th>{{tr "HideForGuest"}}</th>
                    <th>{{tr "EnableDDNS"}}</th>
                    <th>{{tr "Secret"}}</th>
                    <th>{{tr "OneKeyInstall"}}</th>
                    <th>{{tr "Note"}}</th>
                    <th>{{tr "PublicNote"}}</th>
                    <th>{{tr "Administration"}}</th>
                </tr>
            </thead>
            <tbody>
                {{range $server := .Servers}}
                <tr>
                    <td><input type="checkbox" class="nezha-servers" value="{{$server.ID}}" /></td>
                    <td>{{$server.ID}}({{$server.DisplayIndex}})</td>
                    <td>{{$server.Name}}</td>
                    <td>{{$server.Tag}}</td>
                    <td>{{$server.Host.IP}}</td>
                    <td>{{$server.Host.Version}}</td>
                    <td>{{$server.HideForGuest}}</td>
                    <td>{{$server.EnableDDNS}}</td>
                    <td>
                        <button class="ui icon green mini button" data-clipboard-text="{{$server.Secret}}" data-tooltip="{{tr "ClickToCopy"}}">
                            <i class="copy icon"></i>
                        </button>
                    </td>
                    <td>
                        <button class="ui icon green mini button"
                            data-clipboard-text="{{if $.Conf.GRPCHost}}{{if eq $.Conf.Language "zh-CN"}}curl -L https://raw.githubusercontent.com/naiba/nezha/master/script/install.sh{{else}}curl -L https://raw.githubusercontent.com/naiba/nezha/master/script/install_en.sh{{end}} -o nezha.sh && chmod +x nezha.sh && ./nezha.sh install_agent {{$.Conf.GRPCHost}} {{if $.Conf.ProxyGRPCPort}}{{$.Conf.ProxyGRPCPort}}{{else}}{{$.Conf.GRPCPort}}{{end}} {{$server.Secret}}{{if $.Conf.TLS}} --tls{{end}}{{else}}{{tr "NoDomainAlert"}}{{end}}"
                            data-tooltip="{{tr "ClickToCopy"}}">
                            <i class="linux icon"></i>
                        </button>
                        <button class="ui icon green mini button"
                            data-clipboard-text="{{if $.Conf.GRPCHost}}[Net.ServicePointManager]::SecurityProtocol = [Net.SecurityProtocolType]::Ssl3 -bor [Net.SecurityProtocolType]::Tls -bor [Net.SecurityProtocolType]::Tls11 -bor [Net.SecurityProtocolType]::Tls12;set-ExecutionPolicy RemoteSigned;Invoke-WebRequest https://raw.githubusercontent.com/naiba/nezha/master/script/install.ps1 -OutFile C:\install.ps1;powershell.exe C:\install.ps1 {{$.Conf.GRPCHost}}:{{if $.Conf.ProxyGRPCPort}}{{$.Conf.ProxyGRPCPort}}{{else}}{{$.Conf.GRPCPort}}{{end}} {{$server.Secret}}{{if $.Conf.TLS}} --tls{{end}}{{else}}{{tr "NoDomainAlert"}}{{end}}"
                            data-tooltip="{{tr "ClickToCopy"}}">
                            <i class="windows icon"></i>
                        </button>
                        <button class="ui icon green mini button"
                            data-clipboard-text="{{if $.Conf.GRPCHost}}curl -L https://raw.githubusercontent.com/naiba/nezha/master/script/install.command -o nezha.command && chmod +x nezha.command && sudo ./nezha.command install_agent {{$.Conf.GRPCHost}} {{if $.Conf.ProxyGRPCPort}}{{$.Conf.ProxyGRPCPort}}{{else}}{{$.Conf.GRPCPort}}{{end}} {{$server.Secret}}{{if $.Conf.TLS}} --tls{{end}}{{else}}{{tr "NoDomainAlert"}}{{end}}"
                            data-tooltip="{{tr "ClickToCopy"}}">
                            <i class="apple icon"></i>
                        </button>
                    </td>
                    <td>
                        {{if $server.Note}}
                            <button class="ui icon green mini button" title="{{ $server.Note }}" onclick="addOrEditServer({{$server.MarshalForDashboard}})"><i class="sticky note icon"></i></button>
                        {{end}}
                    </td>
                    <td>
                        {{if $server.PublicNote}}
                            <button class="ui icon green mini button" title="{{$server.PublicNote}}" onclick="addOrEditServer({{$server.MarshalForDashboard}})"><i class="sticky clipboard icon"></i></button>
                        {{end}}
                    </td>
                    <td>
                        <div class="ui mini icon buttons">
                            <button class="ui button" onclick="connectToServer({{$server.ID}})">
                                <i class="terminal icon"></i>
                            </button>
                            <button class="ui button" onclick="addOrEditServer({{$server.MarshalForDashboard}})">
                                <i class="edit icon"></i>
                            </button>
                            <button class="ui button"
                                onclick="showConfirm('{{tr "DeleteServer"}}','{{tr "ConfirmToDeleteServer"}}',deleteRequest,'/api/server/'+{{$server.ID}})">
                                <i class="trash alternate outline icon"></i>
                            </button>
                        </div>
                    </td>
                </tr>
                {{end}}
            </tbody>
        </table>
    </div>
</div>
{{template "component/server" .}}
{{template "common/footer" .}}
<script src="https://unpkg.com/clipboard@2.0.11/dist/clipboard.min.js"></script>
<script>
    var clipboard = new ClipboardJS('.ui.icon.green.mini.button');
    const checkBoxList = document.querySelectorAll('tbody > tr > td > input.nezha-servers[type=checkbox]')
    function checkAllServer() {
        checkBoxList.forEach(cb => {
            cb.checked = true
        })
    }
    function forceUpdate() {
        const servers = []
        checkBoxList.forEach(cb => {
            if (cb.checked) {
                servers.push(parseInt(cb.value))
            }
        })
        if (servers.length == 0) {
            $.suiAlert({
                title: '{{tr "NoServerSelected"}}',
                description: '',
                type: 'warning',
                time: '2',
                position: 'top-center',
            });
            return
        }
        $.post('/api/force-update', JSON.stringify(servers))
            .then((resp) => {
                if (resp.code == 200) {
                    $.suiAlert({
                        title: '{{tr "ExecutionResults"}}',
                        description: resp.message,
                        type: 'success',
                        time: '3',
                        position: 'top-center',
                    });
                } else {
                    $.suiAlert({
                        title: '',
                        description: resp.message,
                        type: 'error',
                        time: '3',
                        position: 'top-center',
                    });
                }
            }).catch(err => {
                $.suiAlert({
                    title: '',
                    description: err,
                    type: 'error',
                    time: '3',
                    position: 'top-center',
                });
            })
    }
    function batchEditServerGroup() {
        let groupName = prompt('{{tr "InputServerGroupName"}}')
        if (groupName === null) {
            return
        }
        const servers = []
        checkBoxList.forEach(cb => {
            if (cb.checked) {
                servers.push(parseInt(cb.value))
            }
        })
        if (servers.length == 0) {
            $.suiAlert({
                title: '{{tr "NoServerSelected"}}',
                description: '',
                type: 'warning',
                time: '2',
                position: 'top-center',
            });
            return
        }
        $.post('/api/batch-update-server-group', JSON.stringify({ servers: servers, group: groupName }))
            .then((resp) => {
                if (resp.code == 200) {
                    $.suiAlert({
                        title: '{{tr "ExecutionResults"}}',
                        description: resp.message,
                        type: 'success',
                        time: '3',
                        position: 'top-center',
                    });
                    window.location.reload()
                } else {
                    $.suiAlert({
                        title: '',
                        description: resp.message,
                        type: 'error',
                        time: '3',
                        position: 'top-center',
                    });
                }
            }).catch(err => {
                $.suiAlert({
                    title: '',
                    description: err,
                    type: 'error',
                    time: '3',
                    position: 'top-center',
                });
            })
    }
    function batchDeleteServer() {
        const servers = []
        checkBoxList.forEach(cb => {
            if (cb.checked) {
                servers.push(parseInt(cb.value))
            }
        })
        if (servers.length == 0) {
            $.suiAlert({
                title: '{{tr "NoServerSelected"}}',
                description: '',
                type: 'warning',
                time: '2',
                position: 'top-center',
            });
            return
        }
        showConfirm('{{tr "DeleteServer"}}', '{{tr "ConfirmToDeleteServer"}}', () => postJson('/api/batch-delete-server', servers), '')
    }
</script>
{{end}}