首次登录修改密码

1、index.html

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>XXXXXXX</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../layuiadmin/layui/css/layui.css" media="all">
</head>

<body class="layui-layout-body">
  <div id="LAY_app">
    <div class="layui-layout layui-layout-admin">
      <div class="layui-header">
        <!-- 头部区域 -->
        <ul class="layui-nav layui-layout-left">
          <li class="layui-nav-item layadmin-flexible" lay-unselect>
            <a href="javascript:;" layadmin-event="flexible" title="侧边伸缩">
              <i class="layui-icon layui-icon-shrink-right" id="LAY_app_flexible"></i>
            </a>
          </li>
          <li class="layui-nav-item layui-hide-xs" lay-unselect>
            <a href="../../index.html" target="_blank" title="前台">
              <i class="layui-icon layui-icon-website"></i>
            </a>
          </li>
          <li class="layui-nav-item" lay-unselect>
            <a href="javascript:;" layadmin-event="refresh" title="刷新">
              <i class="layui-icon layui-icon-refresh-3"></i>
            </a>
          </li>
        </ul>
        <ul class="layui-nav layui-layout-right" lay-filter="layadmin-layout-right">
          <!-- <li class="layui-nav-item layui-hide-xs" lay-unselect>
            <a href="javascript:;" layadmin-event="note">
              <i class="layui-icon layui-icon-note"></i>
            </a>
          </li> -->
          <li class="layui-nav-item layui-hide-xs" lay-unselect>
            <a href="javascript:;" layadmin-event="fullscreen">
              <i class="layui-icon layui-icon-screen-full"></i>
            </a>
          </li>
          <li class="layui-nav-item" lay-unselect>
            <a href="javascript:;">
              <cite id="userName"></cite>
            </a>
            <dl class="layui-nav-child">
              <dd><a lay-href="set/user/info.html">基本资料</a></dd>
              <dd><a lay-href="set/user/password.html">修改密码</a></dd>
              <hr>
              <dd layadmin-event="logout" style="text-align: center;"><a onclick="LogoutF()">退出</a></dd>
            </dl>
          </li>

          <li class="layui-nav-item layui-hide-xs" lay-unselect>
            <a href="javascript:;"><i class="layui-icon layui-icon-more-vertical"></i></a>
          </li>
          <li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-unselect>
            <a href="javascript:;"><i class="layui-icon layui-icon-more-vertical"></i></a>
          </li>
        </ul>
      </div>

      <!-- 侧边菜单 -->
      <div class="layui-side layui-side-menu">
        <div class="layui-side-scroll">
          <div class="layui-logo" lay-href="welcome.html">
            <span>电力大数据联盟</span>
          </div>

          <ul class="layui-nav layui-nav-tree" lay-shrink="all" id="LAY-system-side-menu"
            lay-filter="layadmin-system-side-menu">

            </ul>
         
        </div>
      </div>
      
      <div id='modalContent' class="layui-fluid" style="margin:0;width:400px;height:192px; top:30%;left:30%; display:none;">
            <div class="layui-row layui-col-space15">
              <div class="layui-col-md12">
                <div class="layui-card">
                  <div class="layui-card-header">请修改密码后重新登录</div>
                  <div class="layui-card-body" pad15>
                    
                    <div class="layui-form" lay-filter="">
                      <div class="layui-form-item">
                        <label class="layui-form-label">当前密码</label>
                        <div class="layui-input-inline">
                          <input type="password" name="oldPassword" lay-verify="required" lay-verType="tips" class="layui-input">
                        </div>
                      </div>
                      <div class="layui-form-item">
                        <label class="layui-form-label">新密码</label>
                        <div class="layui-input-inline">
                          <input type="password" name="password" lay-verify="pass" lay-verType="tips" autocomplete="off" id="LAY_password" class="layui-input">
                        </div>
                        <div class="layui-form-mid layui-word-aux">8到16个字符</div>
                      </div>
                      <div class="layui-form-item">
                        <label class="layui-form-label">确认新密码</label>
                        <div class="layui-input-inline">
                          <input type="password" name="repassword" lay-verify="repass" lay-verType="tips" autocomplete="off" class="layui-input">
                        </div>
                      </div>
                      <div class="layui-form-item">
                        <div class="layui-input-block">
                          <button class="layui-btn" lay-submit lay-filter="setmypass">确认修改</button>
                        </div>
                      </div>
                    </div>
                    
                  </div>
                </div>
              </div>
            </div>
      </div>
  
        <!-- 遮罩层DIV -->  
        <div id="overlay" class="overlay"></div>  
        <!-- 模拟模态窗口DIV -->  
        <div class="modal" id="modalDiv"></div> 

      <!-- 页面标签 -->
      <div class="layadmin-pagetabs" id="LAY_app_tabs">
        <div class="layui-icon layadmin-tabs-control layui-icon-prev" layadmin-event="leftPage"></div>
        <div class="layui-icon layadmin-tabs-control layui-icon-next" layadmin-event="rightPage"></div>
        <div class="layui-icon layadmin-tabs-control layui-icon-down">
          <ul class="layui-nav layadmin-tabs-select" lay-filter="layadmin-pagetabs-nav">
            <li class="layui-nav-item" lay-unselect>
              <a href="javascript:;"></a>
              <dl class="layui-nav-child layui-anim-fadein">
                <dd layadmin-event="closeThisTabs"><a href="javascript:;">关闭当前标签页</a></dd>
                <dd layadmin-event="closeOtherTabs"><a href="javascript:;">关闭其它标签页</a></dd>
                <dd layadmin-event="closeAllTabs"><a href="javascript:;">关闭全部标签页</a></dd>
              </dl>
            </li>
          </ul>
        </div>
        <div class="layui-tab" lay-unauto lay-allowClose="true" lay-filter="layadmin-layout-tabs">
          <ul class="layui-tab-title" id="LAY_app_tabsheader">
            <li lay-id="home/console.html" lay-attr="home/console.html" class="layui-this" style="display: none">
                <i class="layui-icon layui-icon-home"></i>
            </li>
          </ul>
        </div>
      </div>
      <!-- 主体内容 -->
      <div class="layui-body" id="LAY_app_body">
        <div class="layadmin-tabsbody-item layui-show">
          <iframe src="welcome.html" frameborder="0" class="layadmin-iframe"></iframe>
        </div>
      </div>

      <!-- 辅助元素,一般用于移动设备下遮罩 -->
      <div class="layadmin-body-shade" layadmin-event="shade"></div>
    </div>
  </div>
  <script src="../layuiadmin/layui/layui.js"></script>
  <script src="../layuiadmin/modules/index.js"></script>
  <script type="text/javascript" src="../froala_editor_2.8.5/jquery.min.js"></script
  <!--中文字体包,注意要放在最下面,不然会报错-->
  <script type="text/javascript" src="../froala_editor_2.8.5/languages/zh_cn.js"></script>
  <script type="text/javascript" src="../../front/js/crypto-js.js"></script>
  <script src="../layuiadmin/modules/common.js"></script>
  <script src="../views/set/user/password.js"></script>
  <script>
  </script>
</body>
<script type="text/javascript">
    function LogoutF(){ 
        $.ajax({
            url: ENERGY_DATA_BACK_END_DOMAIN + "/log/logout",
            async: false,
            type: "get",
            headers: {
                'Authorization': localStorage.getItem("token"),
            },
            complete: function() {
                localStorage.removeItem('token')
                localStorage.removeItem('menu')
                window.parent.location = '/biosphereFront/login.html';
            }
        });
    }
</script>
</html>

2.index.js

function getParams(key) {
    var reg = new RegExp("(^|&)" + key + "=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) {
        return unescape(r[2]);
    }
    return null;
};
var TYPE = getParams("type") || "";
var QUERYPARAMS = {};
layui.use(['layer', 'form', 'jquery', 'laypage', 'table', 'laydate', 'upload', 'element'], function () {
    var form = layui.form,
        layer = parent.layer === undefined ? layui.layer : parent.layer,
        laypage = layui.laypage,
        table = layui.table,
        upload = layui.upload,
        laydate = layui.laydate,
        $ = layui.jquery;
    var element = layui.element; //导航的hover效果、二级菜单等功能,需要依赖element模块

    //监听导航点击
    element.on('nav(demo)', function (elem) {
        //console.log(elem)
        layer.msg(elem.text());
    });
    var MENU = JSON.parse(localStorage.getItem('menu')) || [];
    var USER;
    
    $.ajax({
        url: ENERGY_DATA_BACK_END_DOMAIN + "/log/me",
        async: false,
        type: "get",
        headers: {
            'Authorization': localStorage.getItem("token"),
        },
        success: function (result) {
            USER = result;
        },
        error: function (xhr, textStatus, errorThrown) {
            if (xhr.status == 401) {
                window.parent.location = ENERGY_FRONT_LOGIN_PAGE;
            }
        }
    });
    
    if (MENU.length == 0) {
//        initmenu();
    } else {
        renderMenu(MENU);
    }
    $("#userName").empty().html(USER.userName);
    function initmenu() {
        $.ajax({
            url: ENERGY_DATA_BACK_END_DOMAIN + "/end/menu/getSelfTree",
            dataType: "json",
            type: "POST",
            data: {
                roleId: USER.userRole
            },
            headers: {
                'Authorization': localStorage.getItem("token"),
            },
            success: function (result) {
                var data = result.data;
                if(data.length == 0) {
                    layer.alert("您没有权限访问任何页面,如需访问请联系管理员");
                }
                renderMenu(data);
            },
            error: function (xhr, textStatus, errorThrown) {
                if (xhr.status == 401) {
                    window.parent.location = '/biosphereFront/login.html';
                }
            }
        });
    }

    function renderMenu(data) {
        $('#LAY-system-side-menu').html("");
        var menuhtml = "";
        for (var i = 0; i < data.length; i++) {
            var npath = data[i].path || "";
            var name = data[i].id;

            if (data[i].children) {
                menuhtml += ' <li data-name="' + name + '" class="layui-nav-item ">' +
                    '<a href="javascript:;"  lay-tips="' + data[i].title + '" lay-direction="2">' +
                    '<i class="layui-icon ' + data[i].icon + '"></i>' +
                    '<cite>' + data[i].title + '</cite></a>';
                var child = data[i].children;
                menuhtml += '<dl class="layui-nav-child">';
                for (var j = 0; j < child.length; j++) {
                    var path = child[j].path || "";
                    menuhtml += '<dd data-name="' + name + '" >' +
                        '<a lay-href="' + path + '">' + child[j].title + '</a>' +
                        '</dd>';
                }
                menuhtml += '</dl>';
            } else {
                menuhtml += ' <li data-name="' + name + '" class="layui-nav-item ">' +
                    '<a href="javascript:;" lay-href="' + npath + '" lay-tips="' + data[i].title + '" lay-direction="2">' +
                    '<i class="layui-icon ' + data[i].icon + '"></i>' +
                    '<cite>' + data[i].title + '</cite></a>';
            }
            menuhtml += '</li>';
        }
        $('#LAY-system-side-menu').html(menuhtml);
        element.init();
    }
    
 // 浏览器兼容 取得浏览器可视区高度   
    function getWindowInnerHeight() {   
        var winHeight = window.innerHeight   
                || (document.documentElement && document.documentElement.clientHeight)   
                || (document.body && document.body.clientHeight);   
        return winHeight;   
           
    }   
      
    // 浏览器兼容 取得浏览器可视区宽度   
    function getWindowInnerWidth() {   
        var winWidth = window.innerWidth   
                || (document.documentElement && document.documentElement.clientWidth)   
                || (document.body && document.body.clientWidth);   
        return winWidth;   
           
    }   
    
    /**  
     * 显示遮罩层  
     */
    function showOverlay() {   
        // 遮罩层宽高分别为页面内容的宽高   
        $('.overlay').css({'height':$(document).height(),'width':$(document).width()});   
        $('.overlay').show();   
    }  
    
    $('.showModal').on('click', function () {
        // 调用父窗口方法模拟弹出模态窗口   
        showModal($('#modalContent').html());    
    })
    
    function checkIsFirstLogin(){
        var isFirstLogin = USER.isFirstLogin;
        if(isFirstLogin == 0){
            showModal(showModal($('#modalContent').html()));
        } else if(!USER.kennwortUpdate) {
            showModal(showModal($('#modalContent').html()));
        } else {
            //获取预警信息
            $.ajax({
                url: ENERGY_DATA_BACK_END_DOMAIN + "/end/health",
                async: false,
                type: "get",
                headers: {
                    'Authorization': localStorage.getItem("token"),
                },
                success: function (result) {
                    if(result && result.memoryUsage){
                        setTimeout(function(){
                            var nr = "";
                            var url ="~/rest/yjAndDbxx/findYjAndDbxx";
                             var getResult = {
                                 tdxxcdwhsj : 100
                             };                     
                             
                             var condition = "";
                             if(result.memoryUsage * 100 > 80) {
                                 condition = "<span style='color:red;'>危险</span>";
                             } else {
                                 condition = "<span style=''>正常</span>";
                             }
                             nr += "<p style='margin-top:20px;'>内存使用率" + Number(result.memoryUsage * 100).toFixed(2) + "%   " + condition + "</p>";
                            var $div =  $("<div id='tsxx' hidden='hidden' style='border-radius: 8px;z-index:999;width:360px;height:300px;position:fixed;border:1px solid #ccc;bottom:30px;padding:10px 10px 10px 10px;right:15px;background-color: rgb(90,152,222);'>" +
                                        "<div id='tstitle' style='position: relative;top:-7px;height:27px;width:100%;line-height:28px;font-size:18px;color:white;'>&nbsp;系统提示<input style='width: 40px;cursor: pointer;position: absolute;background:rgb(90,152,222);right: -8px;border: 0px solid #707070;color:white;' type='button' value='×' /></div>" +
                                        "<div id='tsbody' style='border-radius: 6px;padding-bottom: 10px;padding-right: 10px;padding-left:20px;position: relative;height:250px;width:92%;overflow: auto;background:white;font-size:18px;'>" +
                                        nr+               
                                        "</div>" +
                                        "</div>");
                            if(nr != ""){
                                $(document.body).append($div);
                            }
                            $("#tsxx").slideToggle(2000);
                            for ( var i = 0; i < document.querySelectorAll("a.yjhover").length; i++) {
                                 document.querySelectorAll("a.yjhover")[i].onmouseover=function(e){
                                     e.path[0].style='font-size:18px;color:red;';
                                 }
                                 document.querySelectorAll("a.yjhover")[i].onmouseout=function(e){
                                     e.path[0].style='font-size:18px;color:black;';
                                 }
                            }
                            $("#tsxx #tstitle input").on("click",function(){
                                $("#tsxx").hide();
                            });
                        },1000);
                    }
                },
                error: function() {
                    
                }
            });
        }
    }
    checkIsFirstLogin();
    
    $('.closeModal').on('click', function () {
        // 调用父窗口方法模拟关闭模态窗口   
         $('.overlay').hide();   
         $('#modalDiv').hide();   
         $('#modalDiv').html(''); 
    })
    
    function showModal(innerHtml) {   
        // 取得显示模拟模态窗口用DIV   
        var dialog = $('#modalDiv');   
           
        // 设置内容   
        dialog.html(innerHtml);   
           
        // 模态窗口DIV窗口居中   
        dialog.css({   
            'top' : (getWindowInnerHeight() - dialog.height()) / 2 + 'px',   
            'left' : (getWindowInnerWidth() - dialog.width()) / 2 + 'px'  
        });   
           
        // 窗口DIV圆角   
        dialog.find('.modal-container').css('border-radius','6px');   
           
        // 模态窗口关闭按钮事件   
        dialog.find('.btn-close').click(function(){   
            closeModal();   
        });   
           
        // 显示遮罩层   
        showOverlay();
           
        // 显示遮罩层   
        dialog.show();   
    } 
    
    /**  
     * 模拟关闭模态窗口DIV  
     */  
    function closeModal() {   
        $('.overlay').hide();   
        $('#modalDiv').hide();   
        $('#modalDiv').html('');   
    }   
    
});
function formatName(name) {
    let newStr;
    if (name.length === 4) {
    newStr = name.substr(0, 3) + '*';
    } else if (name.length > 4) {
      let char = '';
      for (let i = 0, len = name.length - 4; i < len; i=i+2) {
        char += '*';
      }
      newStr = name.substr(0, 2) + char + name.substr(-1, 3);
    } else {
      newStr = name;
    }

    return newStr;
 }

layui.config({
    base: '../layuiadmin/' //静态资源所在路径
}).extend({
    index: 'lib/index' //主入口模块
}).use('index');

 

posted @ 2020-08-06 09:52  why768  阅读(627)  评论(0)    收藏  举报