master

分支 (1)

管理

管理

master

operator-web
/
popular-package-yz.html

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="icon" href="img/favicon.ico">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
    <meta name="generator" content="Hugo 0.80.0">
    <link href="layui/css/layui.css" rel="stylesheet"/>
    <link href="js/step-lay/step.css" rel="stylesheet"/>
    <title> Register package data </title>
</head>

<style type="text/css">
    body {
        font-family: 'Phetsarath OT';
        background: rgb(99, 189, 228);
        background: radial-gradient(circle, rgba(99, 189, 228, 1) 0%, rgba(17, 14, 62, 1) 100%);
    }

    .loginBtn {
        box-sizing: border-box;
        position: relative;
        margin: 0.2em;
        /*padding: 0 15px 0 15px;*/
        border: none;
        text-align: left;
        line-height: 38px;
        width: 220px;
        white-space: nowrap;
        border-radius: 0.3em;
        font-size: 15px;
        color: #FFF;
        cursor: pointer;
        font-weight: bolder;
        text-align: center;
    }
    /*.loginBtn:before {*/
    /*    content: "";*/
    /*    box-sizing: border-box;*/
    /*    position: absolute;*/
    /*    top: 0;*/
    /*    left: 0;*/
    /*    width: 38px;*/
    /*    height: 100%;*/
    /*}*/
    .loginBtn:focus {
        outline: none;
    }
    .loginBtn:active {
        box-shadow: inset 0 0 0 32px rgba(0, 0, 0, 0.1);
    }
    .loginBtn--otp {
        background-color: #4C69BA;
        background-image: linear-gradient(#00acf7, #00a2e8);
        text-shadow: 0 -1px 0 #354C8C;
    }
    .loginBtn--otp:before {
        border-right: #8a8a8a 1px solid;
    }
    .loginBtn--otp:hover, .loginBtn--otp:focus {
        background-color: #5B7BD5;
        background-image: linear-gradient(#00a2e8, #00a2e8);
    }
    .center{
        text-align: center;display: flex;flex-direction: column;width: 50%;margin: auto;background-color: white;padding: 50px 0;border-radius: 10px;
    }
    .step-item-main{
        margin-left: 0;margin-right: 0;padding-left: 0;
    }
    .lay-step{
        padding-left: 0;
    }
</style>
<body>
<div class="container-fluid" id="grad1" style="margin-top: 50px;">
    <div class="row justify-content-center mt-0">
        <div class="col-11 col-sm-9 col-md-7 col-lg-6 text-center p-0 mt-3 mb-2">
            <div class="card px-0 pt-4 pb-0 mt-3 mb-3">
                <div class="card  mb-3"></div>
                <div class="center">
                    <div class="row justify-content-center">
                        <div class="col-5"><img src="img/logo.png" class="fit-image"></div>
                    </div>
                    <div>
                        <h3>
                            <strong id="name">套餐 ET4 </strong>
                        </h3>
                        <h5>
                            <strong id="detail">10GB/30日, 50,000 基普</strong>
                        </h5>
                    </div>
                    <div class="layui-carousel" id="stepForm" lay-filter="stepForm" style="margin: 0 auto;">
                        <div carousel-item>
                            <div>
                                <form id="baseInfo" class="layui-form" style="margin: 0 auto;max-width: 460px;padding-top: 40px;">
                                    <div class="layui-form-item">
                                        <label class="layui-form-label labelName">电话号码:</label>
                                        <div class="layui-input-block">
                                            <input type="text" id="examName" name="examName" placeholder="请填写电话号码" class="layui-input" required />
                                        </div>
                                    </div>
                                    <div>
                                        <button class="loginBtn loginBtn--otp">下一步</button>
                                    </div>
                                </form>
                            </div>
                            <div>
                                <form id="questionInfo" class="layui-form" style="margin: 0 auto;max-width: 90%;padding-top: 20px;">
                                    <div>
                                        <table style="max-width:1460px;border:1px solid #eee;height: 400px;vertical-align: baseline;" valign="top">
                                            <tr>
                                                <td style="border-right: 1px solid #eee;width:200px;vertical-align: baseline;" >
                                                    <div id="quesBankTree"></div>
                                                </td>
                                                <td style="border-right: 1px solid #eee;vertical-align: baseline;width:1260px; overflow-x:auto">
                                                    <table class="layui-table" id="quesTable" lay-filter="quesTable"></table>
                                                </td>
                                            </tr>
                                        </table>
                                    </div>
                                    <div class="layui-form-item">
                                        <div class="layui-inline" style="width: 100%">
                                            <div class="layui-input-block" style="text-align: center;">
                                                <span>已选择</span><span id="selectCount" style="color: red">0</span><span>道题</span>
                                            </div>
                                            <div class="layui-input-block" style="text-align: center;">
                                                <button type="button" class="layui-btn layui-btn-primary pre">上一步</button>
                                                <button class="layui-btn" lay-submit lay-filter="formStep2">
                                                    &emsp;确认选择&emsp;
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                            <div>
                                <div style="text-align: center;margin-top: 90px;">
                                    <i class="layui-icon layui-circle"
                                       style="color: white;font-size:30px;font-weight:bold;background: #52C41A;padding: 20px;line-height: 80px;">&#xe605;</i>
                                    <div style="font-size: 24px;color: #333;font-weight: 500;margin-top: 30px;">
                                        操作成功
                                    </div>
                                    <div style="font-size: 14px;color: #666;margin-top: 20px;"></div>
                                </div>
                                <div style="text-align: center;margin-top: 50px;">
                                    <button class="layui-btn next">再次添加</button>
                                    <button class="layui-btn layui-btn-primary" onclick="queryList()">查看列表</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script src="layui/layui.js"></script>
<script src="js/config.js"></script>
<script src="js/token.js"></script>
<script src="js/vendor.min.js"></script>
<script src="js/plugins.min.js"></script>
<script src="js/jquery.i18n.min.js"></script>
<script src="js/multi_lang_config.js"></script>
<script src="js/step-lay/step.js"></script>
<script type="text/javascript">

    var layer = layui.layer;
    var form = layui.form;

    var moduleName = "shop";
    var defaultLang = layui.data('langTab').langType;
    initLangConfig({
        defaultLang:defaultLang,
        filePath: "js/i18n/"+moduleName+"/",
        module:moduleName,
        base:"js/"
    })
    var i18np = null;
    function changeLang(lang) {
        defaultLang = lang;
        reloadI18n({
            defaultLang:lang,
            filePath: "js/i18n/"+moduleName+"/",
            module:moduleName,
        })
        i18np.loadProperties(moduleName);
    }

    layui.config({base: 'js/'})
        // 继承treetable.js插件
        .extend({i18np: 'i18n'}).use([ 'i18np','jquery'], function () {
        i18np = layui.i18np;
        i18np.loadProperties(moduleName);
    });

    var step = null;
    layui.config({
        base:'../js/step-lay/'
    }).use([ 'form', 'step','tree','table'], function () {
        step = layui.step;
        step.render({
            elem: '#stepForm',
            filter: 'stepForm',
            width: '100%', //设置容器宽度
            stepWidth: '750px',
            height: '600px',
            stepItems: [{
                title: '电话号码'
            }, {
                title: 'OTP'
            }, {
                title: '成功'
            }]
        });
    })

    $(".loginBtn").click(function () {
        step.next('#stepForm');
    })

    $(function () {
        $.ajax({
            url: HOST + "webapi/combo/getComboById?id="+GetQueryString("id"),
            type: "GET",
            success: function (res) {
                if (res.code == 200){
                    $("#name").html("套餐 "+res.data.comboName);
                    if (res.data.value > 1024){
                        $("#detail").html((res.data.value/1024).toFixed(1)+"GB/"+res.data.day+"日，"+res.data.price+"基普");
                    }else{
                        $("#detail").html(res.data.value+"MB/"+res.data.day+"日，"+res.data.price+"基普")
                    }
                }
            }
        })
    })
</script>