mashangyoujiu/Application/Super/View/Template/index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>网点-婷小姐纸巾管理系统</title>
    <link href="/Public/logo.ico" type="image/x-icon" rel="shortcut icon">
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/paper/css/index.css"/>
    <link rel="stylesheet" href="__PUBLIC__/paper/layui/css/layui.css" />
    <script src="__PUBLIC__/paper/js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="__PUBLIC__/paper/layui/layui.js"></script>
    <style>
        body,html{
            width:100%;
            height: 100%;
        }
        .layui-table-body .layui-table-cell{
            height: 100px;
            line-height: 100px;
        }
        .m {
            width: 960px;
            height: 100%;
            margin: 10px auto;
        }
        .alert_imgbox{
            display: none;
        }
        .alert_img{
            display: none;
            box-sizing: border-box;
            padding: 20px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .template{
            width:100%;
            display: flex;
            /*justify-content: center;*/
            flex-wrap: wrap;

        }
        .template-con {
            width: 16%;
            margin: 10px 1%;
        }
        .layui-btn {
            display: inline-block;
            height: 38px;
            line-height: 38px;
            padding: 0 18px;
            color: #fff;
            white-space: nowrap;
            text-align: center;
            font-size: 14px;
            border: none;
            border-radius: 2px;
            cursor: pointer;
        }
    </style>
</head>
<body>
<div class="container">
    <div class='content'>
        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
            <legend>模板管理</legend>
        </fieldset>
        <div class="layui-form-item">
            <div class="layui-input-inline" style="margin-left: 1%">
                <button class="layui-btn" type="button" id="addtemplate" >添加模板</button>
            </div>
        </div>
        <div  >
            <div class="template" style="display: flex">
                <volist name="templateinfo" id="templateinfos">
                    <div class="template-con">
                        <img style="width: 100%;" class="template-style" src="{$templateinfos['img']}" alt="">
                        <div class="Choice" style="text-align: center;margin-top: 8px;margin-bottom: 10px;">
                            <label class="label">
                                <label for="icon"></label>
                                <span>{$templateinfos['name']}</span>
                            </label>
                        </div>
                        <div style="display:flex;justify-content: center">
                            <button class="layui-btn" type="button" onclick="test({$templateinfos['id']})">编辑</button>
                            <button class="layui-btn" type="button" onclick="dele({$templateinfos['id']})">删除</button>
                        </div>
                    </div>
                </volist>
            </div>
        </div>
    </div>
</div>

</body>
<script>
    layui.use(['form','table','layer'], function(){
        var form = layui.form;
        var table = layui.table;
        var layer = layui.layer;
        $('#addtemplate').click(function () {
            layer.open({
                type: 2,
                content: "{:U('addtemplate')}",
                title: "添加模板",
                area: ["80%","80%"],
                end:function () {
                    window.location.reload();
                }
            })
        })

    });
    //编辑
    function test(id)
    {
        layer.open({
            type: 2,
            content: "{:U('addtemplate')}?id=" + id,
            title: "添加模板",
            area: ["80%","80%"],
            end:function () {
                window.location.reload();
            }
        })
    }
    //删除
    function dele(id)
    {
        layer.confirm("确定删除?",function(){
            $.ajax({
                url:"{:U('deletemplate')}",
                type:"post",
                data:{id:id},
                success:function(res)
                {
                    if(res.status == 1)
                    {
                        layer.msg(res.msg,{time:1500},function(){
                            window.location.reload();
                        })
                    }else
                    {
                        layer.msg(res.msg,{time:1500},function(){
                            window.location.reload();
                        })
                    }
                }
            })
        })
    }

</script>
</html>