<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
          content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <title>流量套餐管理</title>
    <link rel="stylesheet" href="${ctx}/css/plugin/bootstrap/bootstrap.min.css">
    <link rel="stylesheet" href="${ctx}/css/plugin/datatimepicker/bootstrap-datetimepicker.css">
    <link rel="stylesheet" href="${ctx}/css/plugin/fontawesome/font-awesome.min.css">
    <link rel="stylesheet" href="${ctx}/css/plugin/datatables/buttons.dataTables.min.css">
    <link rel="stylesheet" href="${ctx}/css/plugin/datatables/datatables.bootstrap.css">
    <link rel="stylesheet" href="${ctx}/css/basic.css">
    <style>
        .form-control {
            height: 22px;
            padding: 1px 5px;
        }

        .btn {
            padding: 1px 6px;
            font-size: 12px;
        }

    </style>
</head>
<body class="container-fluid">
<form class="form-horizontal" role="form" style="padding-top: 20px">

    <div class="form-group">
        <label class="col-xs-3 control-label" style="padding-right: 0px">套餐名</label>
        <div class="col-xs-9">
            <input class="form-control" id="fmName" type="text" placeholder="请输入套餐名">
        </div>
    </div>
    <div class="form-group">
        <label class="col-xs-3 control-label" style="padding-right: 0px">套餐流量</label>
        <div class="col-xs-9">
            <input class="form-control" id="fmNumber" type="text" placeholder="请输入套餐流量(单位为兆M)">
        </div>
    </div>
    <div class="form-group">
        <label class="col-xs-3 control-label" style="padding-right: 0px">套餐类型</label>
        <div class="col-xs-9">
            <select class="form-control" id="type">
                <option value="0">基础套餐</option>
                <option value="1">扩展套餐</option>
            </select>
        </div>
    </div>
    <div class="form-group">
        <label class="col-xs-3 control-label" style="padding-right: 0px">二级类型</label>
        <div class="col-xs-9">
            <select class="form-control" id="secondtype">

            </select>
        </div>
    </div>


    <footer class="navbar-fixed-bottom">

        <div class="col-xs-12 col-sm-12 mt10" style="text-align: center">
            <div class="form-group">
                <button type="button" class="btn btn-primary" id="save">保存</button>
            </div>
        </div>

    </footer>
</form>

<input type="hidden" id="username" value="${username}">
<script src="${ctx}/js/plugin/jquery/jquery.min.js"></script>
<script src="${ctx}/js/plugin/layui/layer.js"></script>
<script src="${ctx}/js/plugin/bootstrap/bootstrap.min.js"></script>
<script src="${ctx}/jspJS/utils/loading.js"></script>
<script src="${ctx}/js/plugin/xss/xss.js"></script>
<script src="${ctx}/jspJS/utils/judgeAjaxStatus.js"></script>
<script src="${ctx}/jspJS/utils/common.js"></script>
<script src="${ctx}/jspJS/confirmIndentity.js"></script>
<script src="${ctx}/js/plugin/xss/aes.js"></script>
<script src="${ctx}/jspJS/sm2.js"></script>
<script src="${ctx}/jspJS/sm3.js"></script>
<script>
    var indexi;
    var fmIndex;
    var types;
    $(function () {

        types = getQueryString('types')
        if (types == 1) {
            //新增
            toOption($('#type').val())
        } else if (types == 2) {
            fmIndex = getQueryString('fmIndex')
            //修改
            $.ajax({
                type: "get",
                url: "/pqs9900/flow/getFlowMeal",
                dataType: "json",
                data: {fmIndex: fmIndex},
                beforeSend: function () {
                    indexi = ityzl_SHOW_LOAD_LAYER();
                },
                success: function (data) {
                    if (data.code === 200) {
                        //初始化表格
                        let da = data.body
                        $('#fmName').val(da.fmName)
                        $('#fmNumber').val(da.fmNumber)
                        $('#type').val(da.type)
                        toOption(da.type)
                        $('#secondtype').val(da.secondType)
                    } else {
                        layer.msg('获取失败', {icon: 2})
                    }
                    ityzl_CLOSE_LOAD_LAYER(indexi);
                }
            })

        } else {
            $('#save').hide()
            $('#fmName').attr('disabled', true)
            $('#fmNumber').attr('disabled', true)
            $('#type').attr('disabled', true)
            $('#secondtype').attr('disabled', true)
            //查看只查看不可操作
            fmIndex = getQueryString('fmIndex')
            $.ajax({
                type: "get",
                url: "/pqs9900/flow/getFlowMeal",
                dataType: "json",
                data: {fmIndex: fmIndex},
                beforeSend: function () {
                    indexi = ityzl_SHOW_LOAD_LAYER();
                },
                success: function (data) {
                    if (data.code === 200) {
                        //初始化表格
                        let da = data.body
                        $('#fmName').val(da.fmName)
                        $('#fmNumber').val(da.fmNumber)
                        $('#type').val(da.type)
                        toOption(da.type)
                        $('#secondtype').val(da.secondType)

                    } else {
                        layer.msg('获取失败', {icon: 2})
                    }
                    ityzl_CLOSE_LOAD_LAYER(indexi);
                }
            })
        }


        $('body').on('change', '#type', function () {
            $('#secondtype').empty()
            let ty = $('#type').val()
            let html = ''
            if (ty == 0) {
                html = '<option value="0">默认套餐</option><option value="1">其他</option>'
            } else {
                html = '<option value="0">当月生效</option><option value="1">连续生效</option>'
            }
            $('#secondtype').append(html)
        })
    })


    $('#save').click(function () {
        let fmName = $('#fmName').val()
        let fmNumber = $('#fmNumber').val()
        let type = $('#type').val()
        let secondType = $('#secondtype').val()

        fmName = filterXSS(fmName);
        fmNumber = filterXSS(fmNumber);
        valiteLength(fmName)
        if (fmName == null || fmName == "") {
            layer.tips('名称不可为空', '#fmName', {
                tips: [1, 'red'] //还可配置颜色
            });
            return
        } else if (!/^[\u4E00-\u9FA5A-Za-z0-9_]+$/gi.test(fmName)) {
            layer.tips('名称含有非汉字字符', '#fmName', {
                tips: [1, 'red'] //还可配置颜色
            });
            return;
        }

        if (fmNumber == null || fmNumber == 0) {
            layer.tips('套餐不可为空', '#fmNumber', {
                tips: [1, 'red'] //还可配置颜色
            });
            return;
        } else if (!/^[1-9]+[0-9]*$/.test(fmNumber)) {
            layer.tips('套餐为正整数', '#fmNumber', {
                tips: [1, 'red'] //还可配置颜色
            });
            return;
        }
        let username = $('#username').val()
        let resetName = '二次'
        passwordIndentityForEd(username, resetName, function () {
            layer.confirm('确认提交吗', function () {
                let map = {
                    fmName: fmName,
                    fmNumber: fmNumber,
                    type: type,
                    secondType: secondType
                }

                if (types == 1) {
                    $.ajax({
                        type: "post",
                        url: "/pqs9900/flow/addFlowMeal",
                        dataType: "json",
                        contentType: 'application/json;charset=UTF-8',
                        data: JSON.stringify(map),
                        beforeSend: function () {
                            indexi = ityzl_SHOW_LOAD_LAYER();
                        },
                        success: function (data) {
                            if (data.code === 200) {
                                layer.msg(data.message, {icon: 1}, function () {
                                    var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                                    parent.layer.close(index); //再执行关闭
                                    window.parent.refreshs()
                                })
                            } else {
                                layer.msg(data.message, {icon: 2})
                            }
                            ityzl_CLOSE_LOAD_LAYER(indexi);
                        }
                    })
                } else {
                    map.fmIndex = fmIndex
                    $.ajax({
                        type: "post",
                        url: "/pqs9900/flow/updateFlowMeal",
                        dataType: "json",
                        contentType: 'application/json;charset=UTF-8',
                        data: JSON.stringify(map),
                        beforeSend: function () {
                            indexi = ityzl_SHOW_LOAD_LAYER();
                        },
                        success: function (data) {
                            if (data.code === 200) {
                                //初始化表格
                                layer.msg(data.message, {icon: 1}, function () {
                                    var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                                    parent.layer.close(index); //再执行关闭
                                    window.parent.refreshs()
                                })
                            } else {
                                layer.msg(data.message, {icon: 2})
                            }
                            ityzl_CLOSE_LOAD_LAYER(indexi);
                        }
                    })
                }
            })
        })
    })


    //根据套餐类型初始化二级下拉框
    function toOption(type) {
        let htm;
        $('#secondtype').empty()
        if (type == 0) {
            htm = '<option value="0">默认套餐</option><option value="1">其他</option>'
        } else {
            htm = '<option value="0">当月生效</option><option value="1">连续生效</option>'
        }
        $('#secondtype').append(htm)
    }

</script>
</body>
</html>

