<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" th:fragment="header">
<!-- th:fragment="header(title,keywords)" -->
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/>
    <meta name="renderer" content="webkit"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>


    <meta http-equiv="Cache-Control" content="no-transform"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <title><th:block th:text="${title ?: '首页'}+' - '+${commons.site_option('site_title','owlBlog')}"></th:block></title>

    <!--<link th:href="@{/admin/css/style.min.css}" rel="stylesheet" type="text/css"/>-->
    <link th:href="@{/user/css/owl.index.css}" rel="stylesheet"/>
    <link th:href="@{//cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css}" rel="stylesheet" type="text/css"/>

    <link th:href="@{//cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css}" rel="stylesheet"/>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
    <!-- 引入elementui样式 -->
    <link href="https://cdn.bootcss.com/element-ui/2.8.2/theme-chalk/index.css" rel="stylesheet">

    <!--[if lt IE 9]>
    <script src="//cdn.bootcss.com/html5shiv/r29/html5.min.js"></script>
    <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<!--[if lt IE 8]>
<div class="browsehappy" role="dialog">
    当前网页 <strong>不支持</strong> 你正在使用的浏览器. 为了正常的访问, 请 <a href="http://browsehappy.com/" target="_blank">升级你的浏览器</a>。
</div>
<![endif]-->
<header id="header" >
    <div id="navbar" class="navbar-container col-sm-12 col-lg-12 col-md-12">

        <ul class="nav navbar-nav">
            <li>
                <a th:href="@{/}" class="navbar-logo" >
                    <img th:src="@{/user/img/logo.png}" class="img-rounded" alt="首页" />
                </a>
            </li>
            <li class="navbar-menu"   v-for="site in sites" >
                <a :href ="uri+site.link" >
                    {{site.name}}
                </a>
            </li>
            <li>
                <div >
                    <span class="mini-stat-icon"><i class="fa fa-font-awesome" aria-hidden="true"></i></span> 在线人数<span class="counter" th:text="${application.online_number}">0</span>人
                </div>
            </li>
            <li>
                <i class="fa fa-rss" aria-hidden="true"> <a href="/rss">订阅网站rss</a></i>
            </li>

        </ul>

    </div>
    <script src="https://cdn.bootcss.com/vue/2.6.10/vue.common.dev.js"></script>
    <script src="https://cdn.bootcss.com/axios/0.18.0/axios.min.js"></script>
    <script th:inline="javascript">

        var vm2 = new Vue({
            el:"#navbar",
            data:{
                uri:/*[[@{/}]]*/'',
                sites: [
                    { name: '归档' ,link:'archives'},
                    { name: '友链' ,link:'links'},
                    { name: '关于' ,link:'about'}
                ]
            },
            created:function(){

            },
            mounted(){
                this.init()
            },
            methods:{
                init(){
                    console.log("初始化")
                    console.log(this.uri)
                }
            }
        })

    </script>
</header>

</body>
</html>