mashangyoujiu/Application/Agent/View/Merchant/merchant_plug.html

<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="__PUBLIC__/layui/css/layui.css">
    <title>代理商插件管理</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            border: 0;
            font: inherit;
            font-size: 100%;
            text-decoration: none;
            list-style: none;
            outline: none;
        }

        .label_radio {
            height: 18px;
            align-items: center;
            font-size: 14px;
            position: relative;
            cursor: pointer;
            line-height: 19px;
            color: #313131;
            margin-right: 20px;
        }

        .label_radio > input {
            width: 20px;
            height: 20px;
            opacity: 0;
            margin-right: 4px;
        }

        .label_radio > span {
            width: 20px;
            height: 20px;
            border-radius: 50%;
            border: 2px solid #ccc;
            position: absolute;
            top: 0;
            left: 0;
            cursor: pointer;
            box-sizing: border-box;
        }

        .label_radio > input:checked + span:after {
            background-color: #009688 !important;
        }

        .label_radio > input:checked + span {
            border-color: #009688 !important;
        }

        .label_radio > span::after {
            position: absolute;
            content: "";
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background-color: #ddd;
            top: 4px;
            left: 4px;
            transition: .5s;
        }

        table {
            word-break: break-all;
            word-wrap: break-word;
            table-layout: fixed;
            border-collapse: collapse;
            border-spacing: 0;
            text-align: center;
        }

        .Business_tb1 {
            width: 96%;
            border: 1px solid #ededed;
            border-radius: 5px;
            background: #fff;
            margin-left: 15px;
            text-align: center;
        }

        .Business_tb1 tr {
            height: 40px;
            line-height: 40px;
            font-size: 12px;
            color: #717171;
            text-align: center;
            padding: 0;
            margin: 0;
        }

        .Business_tb1 tr:first-child {
            width: 100%;
            height: 48px;
            line-height: 46px;
            border-bottom: 1px solid #ddd;
            z-index: 500;
            color: #4c4c4c;
        }

        .Business_tb1 tr:nth-child(2n+0) {
            background: #f9fafc;
        }

        .Business_tb1 tr th {
            width: 3%;
            border-bottom: 1px solid #ebecee;
            border-right: 1px solid #ebecee;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            text-align: center;
            font-style: normal;
            font-weight: 500;
        }

        .Business_tb1 tr td {
            border-right: 1px solid #ebecee;
            border-bottom: 1px solid #ebecee;
            line-height: 20px;
            padding: 4px;
        }
    </style>
</head>
<body style="padding: 30px 0;">
<div class="Business_tb1">
    <input type="hidden" id="id" value="{$merchant['id']}">
    <table border="0" cellspacing="0" cellpadding="0">
        <tr>
            <th>插件名称</th>
            <th>插件简介</th>
            <th>商户</th>
            <th>当前状态</th>
        </tr>
        <tbody class="tbody">
        <volist name="plugs" id="p">
            <tr>
                <td>{$p['plug_name']}</td>
                <td>{$p['information']}</td>
                <td>{$merchant['name']}</td>
                <td>
                    <label class="label_radio">
                        <input <if condition="$p['m_status'] AND ($p['m_status'] eq 1)">checked</if> class="open" type="radio" data-id="{$p['id']}" name="status-{$p['id']}" value="1">启用
                        <span></span>
                    </label>
                    <label class="label_radio">
                        <input <if condition="($p['m_status'] eq NULL) OR ($p['m_status'] eq 2)">checked</if> class="close" type="radio" data-id="{$p['id']}" name="status-{$p['id']}" value="2">不启用
                        <span></span>
                    </label>
                </td>
            </tr>
        </volist>
        </tbody>
    </table>
</div>
</body>
<script src="__PUBLIC__/jquery/js/jquery-3.2.1.min.js"></script>
<script src="__PUBLIC__/layui/layui.js"></script>
<script src="__PUBLIC__/js/tips.js"></script>
<script>
    layui.use('form', function() {
        var form = layui.form;
        $('.open').click(function () {
            var p_id = $(this).attr('data-id');
            layer.confirm("确认开启该插件吗？", function () {
                $.post("{:U('doChangePlug')}",{
                    id:$('#id').val(),
                    p_id:p_id,
                    type:1
                },function (res) {
                    layer.closeAll();
                    if(res.status==1){
                        showTips(res.msg,function () {

                        })
                    }else{
                        showTips(res.msg);
                    }
                })
            })
        })
        $('.close').click(function () {
            var p_id = $(this).attr('data-id');
            layer.confirm("确认关闭该插件吗？", function () {
                $.post("{:U('doChangePlug')}",{
                    id:$('#id').val(),
                    p_id:p_id,
                    type:2
                },function (res) {
                    layer.closeAll();
                    if(res.status==1){
                        showTips(res.msg,function () {

                        })
                    }else{
                        showTips(res.msg);
                    }
                })
            })
        })
    })
</script>
</html>