{% extends 'base_layout.html' %}
{% load static %}
 {% load mytags %}

{% block title %}多年冻土区公路建设与养护技术交通行业重点实验室青海研究观测基地{% endblock %}
{% block content %}

    <div id="carousel-example-generic" class=" carousel slide" data-ride="carousel" style="top: -144px">
        <!-- Indicators -->
        <ol class="carousel-indicators">
            <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
            <li data-target="#carousel-example-generic" data-slide-to="1"></li>
            <li data-target="#carousel-example-generic" data-slide-to="2"></li>
        </ol>

        <!-- Wrapper for slides -->
        <div class="banner-inner carousel-inner" role="listbox">
            <div class="item active">
                <img src="{% static 'portal/image/b7.jpg' %}" alt="...">
            </div>
            <div class="item">
                <img src="{% static 'portal/image/b8.jpg' %}" alt="...">
            </div>
            <div class="item">
                <img src="{% static 'portal/image/b9.jpg' %}" alt="...">
            </div>
        </div>

        <!-- Controls -->
        <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
            <i class="iconfont jiantou-left icon-jiantou" aria-hidden="true"></i>
            <span class="sr-only">Previous</span>
        </a>
        <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
            <span class="iconfont jiantou-right icon-jiantou-copy" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
        </a>
    </div>



    <div class="display-panel container panel panel-default" style="margin-top: -144px">
        <div class="display-panel-title row panel-heading">
            <h3 class="panel-title col-md-12">工作状态</h3>
        </div>
        <div class="display-panel-content row panel-body">
            <div class="news-content col-md-4">
                <div class="attitude workstate-content jumbotron panel panel-default">
                    <h5 class="panel-heading">新闻动态</h5>
                    <div class="panel-body">
                        <ul>
                            {% for n in news1 %}
                                <li>
                                    <a href="{% url 'news_details' %}?id={{ n.id }}&&category={{ n.category }}"
                                            {% if n.title|length > 20 %} title="{{ n.title }}" {% endif %}>

                                        {% if n.title|length > 20 %}
                                            {{ n.title|slice:"20" }}...
                                        {% else %}
                                            {{ n.title }}


                                        {% endif %}

                                    </a>
                                </li>
                            {% endfor %}

                        </ul>
                        <p><a class="btn btn-learnmore btn-lg" href="{% url 'news' %}?category=1" role="button">更多</a>
                        </p>
                    </div>
                </div>
            </div>
            <div class="news-content col-md-4">
                <div class="attitude workstate-content jumbotron panel panel-default">
                    <h5 class="panel-heading">科技交流</h5>
                    <div class="panel-body">
                        <ul>
                            {% for n in news3 %}
                                <li>
                                    <a href="{% url 'news_details' %}?id={{ n.id }}&&category={{ n.category }}"
                                            {% if n.title|length > 20 %} title="{{ n.title }}" {% endif %}>

                                        {% if n.title|length > 20 %}
                                            {{ n.title|slice:"20" }}...
                                        {% else %}
                                            {{ n.title }}


                                        {% endif %}

                                    </a>
                                </li>
                            {% endfor %}

                        </ul>
                        <p><a class="btn btn-learnmore btn-lg" href="{% url 'news' %}?category=3" role="button">更多</a>
                        </p>
                    </div>
                </div>
            </div>
            <div class="news-content col-md-4">
                <div class="attitude workstate-content jumbotron panel panel-default">
                    <h5 class="panel-heading">通知公告</h5>
                    <div class="panel-body">
                        <ul>
                            {% for n in news2 %}
                                <li>
                                    <a href="{% url 'news_details' %}?id={{ n.id }}&&category={{ n.category }}"
                                            {% if n.title|length > 20 %} title="{{ n.title }}" {% endif %}>

                                        {% if n.title|length > 20 %}
                                            {{ n.title|slice:"20" }}...
                                        {% else %}
                                            {{ n.title }}


                                        {% endif %}

                                    </a>
                                </li>
                            {% endfor %}
                        </ul>
                        <p><a class="btn btn-learnmore btn-lg" href="{% url 'news' %}?category=2" role="button">更多</a>
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div style="background-color: #f0f0f0;padding-bottom: 20px;">
        <div class="display-panel container panel panel-default" style="background-color:transparent;margin-bottom: 0">
            <div>
            <div id="indicator-container"></div>
                <div class="display-panel-title row panel-heading">
                    <h3 class="panel-title col-md-12">数据</h3>
                    <div id="indicator-container"></div>

                    <!-- Nav tabs -->
                    <ul class="data-nav navbar-right nav nav-tabs" role="tablist">
                        <!--<h3 class="panel-title col-md-12">工作状态</h3>-->
                        <li role="presentation" class="active"><a href="#profile" aria-controls="profile" role="tab"
                                                   data-toggle="tab">最新数据</a>
                        </li>
                        <li role="presentation"><a href="#home" aria-controls="home" role="tab"
                                                                  data-toggle="tab">全部数据</a></li>
                        <li role="presentation"><a href="#messages" aria-controls="messages" role="tab"
                                                   data-toggle="tab">热门数据</a></li>
                    </ul>
                </div>

                <!-- Tab panes -->
                <div class="display-panel-content tab-content panel-body">
                    <div role="tabpanel" class="tab-content tab-pane active container data-content panel-body"
                         id="home">
                        <div class="row">
                            {% for m in metadatas %}
                                <div class="col-sm-6 col-md-3">
                                    <div class="display-panel-content-thumbnail thumbnail">

                                        <img width="150" height="150" alt="{{ m.title_cn }}"
                                             src="{% if m.thumbnail %} {{ m.thumbnail.url }} {% else %} /static/upload/images/wutu.jpg {% endif %}">
                                        <div class="caption">
                                            <a href="{% url 'metadata_detail' m.id %}" target="_blank"><h4 title="{{ m.title_cn }}">{% if m.title_cn|length > 13 %}
                                                {{ m.title_cn|slice:"13" }}...
                                            {% else %}
                                                {{ m.title_cn }}
                                            {% endif %}</h4></a>
                                            <p class="data-click">点击量：<span>{{ m.hit_count }}</span></p>
                                        </div>
                                    </div>
                                </div>
                            {% empty %}
                                <div>暂无数据.</div>
                            {% endfor %}


                        </div>
                    </div>
                    <div role="tabpanel" class="tab-content tab-pane container panel-body data-content" id="profile">
                        <div class="row">
                            {% for newest in newest_datas %}
                                <div class="col-sm-6 col-md-3">
                                    <div class="display-panel-content-thumbnail thumbnail">

                                        <img width="150" height="150" alt="{{ newest.title_cn }}"
                                             src="{% if newest.thumbnail %} {{ newest.thumbnail.url }} {% else %} /static/upload/images/wutu.jpg {% endif %}">
                                        <div class="caption">
                                            <a><h4 title="{{ newest.title_cn }}">{% if newest.title_cn|length > 13 %}
                                                {{ newest.title_cn|slice:"13" }}...
                                            {% else %}
                                                {{ newest.title_cn }}
                                            {% endif %}</h4></a>
                                            <p class="data-click">点击量：<span>{{ newest.hit_count }}</span></p>
                                        </div>
                                    </div>
                                </div>
                            {% empty %}
                                <div>暂无数据.</div>
                            {% endfor %}


                        </div>
                    </div>
                    <div role="tabpanel" class="tab-content tab-pane container panel-body data-content" id="messages">
                        <div class="row">
                            {% for hot in hot_datas %}
                                <div class="col-sm-6 col-md-3">
                                    <div class="display-panel-content-thumbnail thumbnail">

                                        <img width="150" height="150" alt="{{ hot.title_cn }}"
                                             src="{% if hot.thumbnail %} {{ hot.thumbnail.url }} {% else %} /static/upload/images/wutu.jpg {% endif %}">
                                        <div class="caption">
                                            <a><h4 title="{{ hot.title_cn }}">{% if hot.title_cn|length > 13 %}
                                                {{ hot.title_cn|slice:"13" }}...
                                            {% else %}
                                                {{ hot.title_cn }}
                                            {% endif %}</h4></a>
                                            <p class="data-click">点击量：<span>{{ hot.hit_count }}</span></p>
                                        </div>
                                    </div>
                                </div>
                            {% empty %}
                                <div>暂无数据.</div>
                            {% endfor %}

                        </div>
                    </div>
                    <a href="{% url 'metadata_index' %}" class="right-more">查看更多</a>
                </div>
            </div>

        </div>
    </div>

    <div class="container">
        <div class="row">
            <div class="display-panel panel panel-default  col-md-6" style="padding-right: 30px">
                <div class="display-panel-title row panel-heading">
                    <h3 class="panel-title title-inline">论文论著</h3>
                    <a href="{% url 'results' %}?category=1" class="right-more">更多</a>
                </div>
                <div class="row panel-body" style="padding-left: 0">
                    <div class="community-panel workstate-content jumbotron">
                        <ul>

                            {% for p in papers %}
                                <li>
                                    <a href="{% url 'results' %}?category=1">{{ p.result_name }}</a>
                                    <span class="data-time">{{ p.publication_time }}</span>
                                    <p class="data-time-label"><span
                                            class="data-time-label-type label label-info">{{ p.result_type }}</span><span
                                            class="author">{{ p.people }}</span></p>
                                </li>
                            {% endfor %}

                        </ul>
                    </div>
                </div>
            </div>

            <div class="display-panel panel panel-default  col-md-6" style="padding-left: 30px">
                <div class="display-panel-title row panel-heading">
                    <h3 class="panel-title title-inline">获奖成果</h3>
                    <a href="{% url 'results' %}?category=2" class="right-more">更多</a>

                </div>
                <div class="row panel-body" style="padding-left: 0">
                    <div class="community-panel workstate-content jumbotron">
                        <ul>

                            {% for win in win_results %}
                                <li>
                                    <a href="{% url 'results' %}?category=2">{{ win.result_name }}</a>
                                    <span class="data-time">{{ win.win_time }}</span>
                                    <p class="data-time-label"><span
                                            class="data-time-label-type label label-info
                                                {% if win.level|left:'-3' == '特等奖' %} grand-prize
                                                 {% elif win.level|left:'-3' == '一等奖' %} first-prize
                                                  {% elif win.level|left:'-3' == '二等奖' %} second-prize
                                                  {% endif %} ">
                                        {{ win.level|left:"-3" }}</span><span
                                            class="author">{{ win.people }}</span></p>
                                </li>
                            {% endfor %}

                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>








    <div style="background-color: #f0f0f0;padding-bottom: 20px;">
        <div class="display-panel container panel panel-default" style="background-color:transparent;margin-bottom: 0">
            <div class="display-panel-title row panel-heading">
                <h3 class="panel-title title-inline">工作剪影</h3>
                <a href="#" class="right-more">查看更多</a>
            </div>
            <div class="panel-body container" style="padding-left: 0">
                <div class="row">
                    <div class="col-xs-6 col-md-3">
                        <a href="#" class="work-photo thumbnail">
                            <img src="{% static "portal/image/p1.jpg" %}" alt="...">
                            <p>部科技司领导视察</p>
                        </a>
                    </div>
                    <div class="col-xs-6 col-md-3">
                        <a href="#" class="work-photo thumbnail">
                            <img src="{% static "portal/image/p2.jpg" %}" alt="...">
                            <p>基桩检测</p>
                        </a>
                    </div>
                    <div class="col-xs-6 col-md-3">
                        <a href="#" class="work-photo thumbnail">
                            <img src="{% static "portal/image/p3.jpg" %}" alt="...">
                            <p>科技宣传周</p>
                        </a>
                    </div>
                    <div class="col-xs-6 col-md-3">
                        <a href="#" class="work-photo thumbnail">
                            <img src="{% static "portal/image/p4.jpg" %}" alt="...">
                            <p>工程技术交流会</p>
                        </a>
                    </div>

                </div>
            </div>

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




{% endblock %}

{% block add_script %}
    <script src="{% static "bower_components/jquery.template/jquery.template.js" %}"></script>
    <script>
        $("a#favorite").click(function (e) {
            e.preventDefault();
            var id = $(this).data("id");
            //console.log(id);
            $.post("{% url 'favorite' %}", {
                csrfmiddlewaretoken: '{{ csrf_token }}',
                metadata_id: id
            }, function (data) {
                var code = data.code;
                var category = 'alert-success';
                var result = '操作成功！';
                var message = data.message;
                if (code == 0) {
                    category = 'alert-warning';
                    result = "用户未登录！";

                }
                showAlert(category, result, message, '#indicator-container');
            });
        });

        $("a#cart").click(function (e) {
            e.preventDefault();
            var id = $(this).data("id");
            //console.log(id);
            $.post("{% url 'cart' %}", {
                csrfmiddlewaretoken: '{{ csrf_token }}',
                metadata_id: id
            }, function (data) {
                //console.log(data)
                var code = data.code;
                var category = 'alert-success';
                var result = '操作成功！';
                var message = data.message;
                if (code == 0) {
                    category = 'alert-warning';
                    result = "用户未登录！";
                }
                $("#cart-count").html(data.count);
                showAlert(category, result, message, '#indicator-container');

            });
        });


    </script>

{% endblock %}