<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">

<head>
    <meta charset="UTF-8">
    <title>BPM后台管理系统</title>
    <link rel="stylesheet" type="text/css" th:href="@{/js/plugins/bootstrapselect/css/piyc/index.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/bootstrap-dist/css/bootstrap.css}">
    <link href="https://yst-pjyc-server.oss-cn-beijing.aliyuncs.com/datas/image/20190307/20190307174527490118539.png" rel="icon" type="image/x-icon"/>
    <link rel="stylesheet" type="text/css" th:href="@{/css/common/models.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/css/common/main_style.css}">
    <link rel="stylesheet"  th:href="@{/font-awesome-4.7.0/css/font-awesome.min.css}">
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <style>
        .glyphicon-user{
            color: #007bff;
        }
        .mb-3{
            margin-bottom: 0!important;
        }
        .navbar{
            border-radius: 0;
            width: 100%;
            justify-content: flex-start;
            margin-bottom: 0;
        }
        #aside_nav{
            border-left:none;
            background:#343a40!important;
        }
        .nav-icon span{
            display: inline-block;
        }
         .nav-icon  i{
             width: 1.875rem;
             /*margin: 0 auto;*/
             text-align: center;
             display: inline-block;
             height: 1.875rem;
             line-height: 1.875rem;
             background-color: rgba(255,255,255,0.15);
             border-radius: .375rem;
         }
        .text-white{
          color: #fff!important;
        }
        .bg-gradient-red{
            background: linear-gradient(to bottom,#ff6b63 0%,#ff2317 100%)!important;
        }
        .bg-gradient-orange{
            background: linear-gradient(to bottom,#fa3 0%,#e68600 100%)!important
        }
        .bg-gradient-green{
            background: linear-gradient(to bottom,#29e148 0%,#17a730 100%)!important;
        }
        .bg-gradient-blue{
            background: linear-gradient(to bottom,#3395ff 0%,#006ee6 100%)!important;
        }
    </style>

    <script src="https://cdn.bootcss.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>

    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>
<body>
<!--首页-->
<div class="MainBox">

    <!--头部-->
    <!--<div class="navbar navbar-dark bg-dark box-shadow">-->
            <!--<div style="width: 90%;">-->
                <!--<a href="#" class="navbar-brand d-flex align-items-center" >-->
                    <!--<img  th:src="@{/images/bpmwh.png}"  alt="logo" style="width: 14%;">-->
                    <!--<strong>BPM后台管理系统</strong>-->
                <!--</a>-->
            <!--</div>-->


            <!--<div >-->
                <!--<span class="glyphicon glyphicon-user"><span th:text=" ${userName}"></span> &nbsp;</span>-->
                <!--<a class="navbar-toggler" href="/logout">Sign up</a>-->
            <!--</div>-->
    <!--</div>-->

    <div class="d-flex flex-column flex-md-row align-items-center p-3 px-md-4 mb-3 bg-white border-bottom box-shadow">

        <h4 class="my-0 mr-md-auto font-weight-normal">
            <img  th:src="@{/images/bpm.png}"  alt="logo" style="width: 14%;">BPM后台管理系统
        </h4>
        <span class="glyphicon glyphicon-user"><span th:text="${userName}"></span> &nbsp;</span>
        <a class="btn btn-outline-primary" href="/logout">Sign up</a>
    </div>


    <!--end 头部-->
    <!--左边导航-->
    <div class="main_wrap clearfix" >
        <ul id="aside_nav" class="navBox" style='width:140px;min-height: 680px;'>
            <li class="s_menu_item"><a   target="main_frame"   href="/web/bpm/user/toDeployment"><span class="nav-icon"><i class="fa fa-qrcode bg-gradient-red text-white"></i></span>查看流程</a></li>
            <li class="s_menu_item"><a   target="main_frame"   href="/model/createNew"><span class="nav-icon"><i class="fa fa-heart bg-gradient-orange text-white"></i></span>创建流程</a></li>
            <li class="s_menu_item"><a   target="main_frame"   href="/web/bpm/user/toOrganization"><span class="nav-icon"><i class="fa fa-table bg-gradient-green text-white"></i></span>组织结构</a></li>
            <li class="s_menu_item"><a   target="main_frame"   href="/web/bpm/user/toUserList"><span class="nav-icon"><i class="fa fa-map bg-gradient-blue text-white"></i></span>用户管理</a></li>
            <li class="s_menu_item"><a   target="main_frame"   href="/swagger-ui.html"><span class="nav-icon"><i class="fa fa-map bg-gradient-blue text-white"></i></span>API 文档</a></li>

        </ul>
    </div>

    <!--&lt;!&ndash;end 左边导航&ndash;&gt;-->
    <div class="mainContentBox">
        <iframe id="main_frame" width="100%"  height="100%" frameborder="0" onload="" name="main_frame"  src="/web/bpm/user/welcome"
                style="overflow:hidden; position:absolute;"></iframe>
    </div>

    <!--主体内容-->

    <!--end 主体内容-->
</div>


<!--end 修改密码弹窗-->
<script type="text/javascript" th:src="@{/js/common/jquery-1.11.1.min.js}"></script>
<!-- 验证 -->
<script type="text/javascript" th:src="@{/js/plugins/validat/jquery.validationEngine.js}"></script>
<script type="text/javascript" th:src="@{/js/plugins/validat/jquery.validationEngine-zh_CN.js}"></script>
<script type="text/javascript" th:src="@{/js/plugins/layer/layer.js}"></script>
<script type="text/javascript" th:src="@{/bootstrap-dist/js/bootstrap.js}"></script>

    <!--<script>-->
        <!--$(document).ready(function(){-->
            <!--$('.s_menu_item a').click(function () {-->
                <!--var dk = $(window.parent.document).find("#iframe_id").attr("src");-->
                 <!--dk = $(this).attr("name");-->

            <!--})-->
        <!--})-->
    <!--</script>-->
</body>
</html>