layui.use('table', function(){
    var table = layui.table;
    var layer = layui.layer;
    var laytpl = layui.laytpl;
    var form = layui.form;

    //告警汇总
    table.render({
        elem: '#homeicon'
        ,url: '/hxzkuwb/findHomeIcon'
        ,size:'sm'
        ,height:600
        ,toolbar:'#toolbarDemo' //开启工具栏，此处显示默认图标，可以自定义模板，详见文档
        ,cols: [[ //表头
            {type:'checkbox',sort: true,fixed: "left"}
            ,{field: 'id', title: '序号', sort: true}
            ,{ field: 'icon', title: '默认图标',templet: '#titleTpl1'}
            ,{field: 'name', title: '图标名称' }
            ,{field: 'namecolor', title: '名称颜色',templet: '#titleTplcolor' }
            ,{field: 'hvoer', title: '选中图标',templet: '#titleTpl2'}
            ,{field: 'none', title: '是否显示',templet: '#titleTpl'}

        ]]
    });

    table.on('toolbar(homeicon)', function(obj) {
        var checkStatus = table.checkStatus(obj.config.id);
        switch(obj.event) {
            case 'getadd' :
                $(".add").show();
                $(".heimu").show();
                break;
            case 'getUpdate':
                var data = checkStatus.data;
                if(data.length>1){
                    layer.alert("一次只能选中一个进行修改")
                }else if(data.length == 0){
                    layer.alert("请选中一条数据")
                }else{
                    $("#pd0").val(data[0].id)
                    $("#pd2").val(data[0].name)
                    $(".update").show();
                    $(".heimu").show();
                    var mrtb = data[0].icon
                    var xztb = data[0].hvoer;
                    var mrtbs = mrtb.split(".")
                    var xztbs = xztb.split(".")
                    var ishow = data[0].none
                    var colors = data[0].namecolor

                    if (ishow != 0){
                        console.log("设置")
                        document.getElementById("ishows").checked = false;
                    }else{
                        document.getElementById("ishows").checked = true;

                    }
                    var  coo =document.getElementById("colo")
                    coo.innerHTML = "";
                    if(colors == "rgb(255,255,255)"){

                        $("#colo").append('<option value="rgb(255,255,255)">白色</option>')
                        $("#colo").append('<option value="rgb(0,0,0)">黑色</option>')
                        $("#colo").append('<option value="rgb(0,255,0)">绿色</option>')
                        $("#colo").append('<option value="rgb(255,0,0)">红色</option>')
                        $("#colo").append('<option value="rgb(8,182,245)">蓝色</option>')
                    }
                    if(colors == "rgb(0,0,0)"){
                        $("#colo").append('<option value="rgb(0,0,0)">黑色</option>')
                        $("#colo").append('<option value="rgb(255,255,255)">白色</option>')
                        $("#colo").append('<option value="rgb(0,255,0)">绿色</option>')
                        $("#colo").append('<option value="rgb(255,0,0)">红色</option>')
                        $("#colo").append('<option value="rgb(8,182,245)">蓝色</option>')
                    }
                    if(colors == "rgb(0,255,0)"){
                        $("#colo").append('<option value="rgb(0,255,0)">绿色</option>')
                        $("#colo").append('<option value="rgb(0,0,0)">黑色</option>')
                        $("#colo").append('<option value="rgb(255,255,255)">白色</option>')
                        $("#colo").append('<option value="rgb(255,0,0)">红色</option>')
                        $("#colo").append('<option value="rgb(8,182,245)">蓝色</option>')
                    }
                    if(colors == "rgb(255,0,0)"){
                        $("#colo").append('<option value="rgb(255,0,0)">红色</option>')
                        $("#colo").append('<option value="rgb(0,255,0)">绿色</option>')
                        $("#colo").append('<option value="rgb(0,0,0)">黑色</option>')
                        $("#colo").append('<option value="rgb(255,255,255)">白色</option>')
                        $("#colo").append('<option value="rgb(8,182,245)">蓝色</option>')
                    }
                    if(colors == "rgb(8,182,245)"){
                        $("#colo").append('<option value="rgb(8,182,245)">蓝色</option>')
                        $("#colo").append('<option value="rgb(0,255,0)">绿色</option>')
                        $("#colo").append('<option value="rgb(0,0,0)">黑色</option>')
                        $("#colo").append('<option value="rgb(255,255,255)">白色</option>')
                        $("#colo").append('<option value="rgb(255,0,0)">红色</option>')
                    }



                    $.get("/hxzkuwb/findImage", function (data) {
                        var selectData = [];
                        for (var i = 0; i < data.data.length; i++) {
                            var option = {
                                value: data.data[i].image,
                                title: '<img width="40" src="../../Icon/' + data.data[i].image + '"/>图标名称:'+data.data[i].name+''
                            };
                            selectData.push(option);
                        }

                        // 动态生成下拉框选项
                        var selectElem = document.getElementById('mrimg');
                        var selectElem1 = document.getElementById('xzimg');
                        selectElem.innerHTML = '';
                        selectElem1.innerHTML = '';
                        var optionElem = document.createElement('option');
                        optionElem.value = mrtb;
                        optionElem.innerHTML = "图标名称:"+mrtbs[0]; // 使用 innerHTML 属性来设置 HTML 内容
                        selectElem.appendChild(optionElem);

                        var optionElem1 = document.createElement('option');
                        optionElem1.value = xztb;
                        optionElem1.innerHTML = "图标名称:"+xztbs[0]; // 使用 innerHTML 属性来设置 HTML 内容
                        selectElem1.appendChild(optionElem1);
                        for (var i = 0; i < selectData.length; i++) {
                            var optionElem = document.createElement('option');
                            optionElem.value = selectData[i].value;
                            optionElem.innerHTML = selectData[i].title; // 使用 innerHTML 属性来设置 HTML 内容
                            selectElem.appendChild(optionElem);
                        }
                        for (var i = 0; i < selectData.length; i++) {
                            var optionElem = document.createElement('option');
                            optionElem.value = selectData[i].value;
                            optionElem.innerHTML = selectData[i].title; // 使用 innerHTML 属性来设置 HTML 内容
                            selectElem1.appendChild(optionElem);
                        }
                        form.render();
                    });
                }
                break;
            case 'getdelete':
                var data = checkStatus.data;
                if(data<1){
                    layer.alert("请选中一条数据")
                }else{
                    for (var i = 0; i<data.length;i++){
                        var ds = "id="+data[i].tagId
                        $.get("/hxzkuwb/deletetag",ds,function (data){

                        })
                    }
                    layer.msg('操作成功')
                }
                break;
            case 'getshuaxin':
                layer.msg('刷新成功')
                setTimeout(function (){
                    location.reload();
                },500)
                break;
            case 'getsearch':
                var seah = $("#seah").val();
                var whereParams = {
                    tagId: seah
                };
                table.reload('tag', {
                    url: "/hxzkuwb/findtableSearch",
                    method:'post',
                    page: {
                        curr: 1 // 重新从第 1 页开始
                    }
                    ,where: whereParams
                });
                layer.msg('搜索成功')
                break;
        }
    })

    // $.get("/hxzkuwb/findImage", function (data) {
    //     var selectData = [];
    //
    //     for (var i = 0; i < data.data.length; i++) {
    //         var option = {
    //             value: data.data[i].image,
    //             title: '<img width="40" src="../../Icon/' + data.data[i].image + '"/>图标名称:'+data.data[i].name+''
    //         };
    //         selectData.push(option);
    //     }
    //
    //     // 动态生成下拉框选项
    //     var selectElem = document.getElementById('mrimg');
    //     var selectElem1 = document.getElementById('xzimg');
    //
    //     for (var i = 0; i < selectData.length; i++) {
    //         var optionElem = document.createElement('option');
    //         optionElem.value = selectData[i].value;
    //         optionElem.innerHTML = selectData[i].title; // 使用 innerHTML 属性来设置 HTML 内容
    //         selectElem.appendChild(optionElem);
    //     }
    //
    //     for (var i = 0; i < selectData.length; i++) {
    //         var optionElem = document.createElement('option');
    //         optionElem.value = selectData[i].value;
    //         optionElem.innerHTML = selectData[i].title; // 使用 innerHTML 属性来设置 HTML 内容
    //         selectElem1.appendChild(optionElem);
    //     }
    //
    //     // 重新渲染下拉框
    //     form.render('select');
    // });
});
function quxiao(){
    layer.msg('操作成功')
    setTimeout(function() {
        $(".add").hide();
        $(".update").hide()
        $(".heimu").hide();
    }, 500);
}