qiushang
/
qasimBlog


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
							<!DOCTYPE html>
<html>
<head>
    @include('common.head')
</head>
<body>
<div class="header">
    @include('common.header')
</div>
<div id="app">
    <!-- 頭部導航 -->
    <div class="header">
        <!-- 导航栏 -->
        @include('common.nav')
    </div>

    <!--- 解决方案 --->
    <div class="index-about" style="padding-top: 40px;">
        <div class="width-1200">
            <div class="flex-start">
                <div class="about-list news-detail">
                    <p class="news-title overflow">{{$info->title}}</p>
                    <p class="news-time">发布日期：{{ date("Y-m-d H:i",$info->created_at)}}</p>

                    <div class="news-content" id="news-content">
                        {!! $info->content !!}
                    </div>
                </div>
                <div class="about-detail">
                    <div class="about-area">
                        <div class="about-title">栏目分类</div>
                        @foreach($category as $item)
                            <div class="news-item">
                                <a href="{{'/news/category/'.$item->mid}}">{{$item->name}}</a>
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>

        </div>
    </div>


    @include('common.footer')

</div>


</body>

<script type="text/javascript" src="/static/public/swiper/swiper-4.3.3.min.js"></script>
<script>
    var vm = new Vue({
        el: '#app',
        data: {
            imgUrl: 'https://audio.yososoft.com/static',
            target: 'https://audio.yososoft.com',
            newsInfo: [],
            categoryList: [],
        },
        mounted: function () {
            var mySwiper = new Swiper('.swiper-container', {
                loop: true,
                // 如果需要分页器
                pagination: {
                    el: '.swiper-pagination',
                }
            })
            this.init();
        },
        //方法
        methods: {
            init: function () {
                let _this = this;
                let mid = this.getQueryVariable('mid');
                axios.post(_this.target + '/api/index/m_news_info', {
                    mid: mid
                }).then(function (response) {
                    if (response.data.result) {
                        this.newsInfo = response.data.data;
                        this.newsInfo.created_at = new Date(this.newsInfo.created_at * 1000).toLocaleString();
                        let dom = document.getElementById('news-content');
                        dom.innerHTML = this.newsInfo.content;
                    }
                }.bind(_this)).catch(function (error) {
                    console.log(error);
                });


                axios.post(_this.target + '/api/index/m_category_list', {
                    size: 10,
                    page: 1
                }).then(function (response) {
                    if (response.data.result) {
                        this.categoryList = response.data.data.list;
                    }
                }.bind(_this)).catch(function (error) {
                    console.log(error);
                });
            },

            getQueryVariable: function (variable) {
                var query = window.location.search.substring(1);
                var vars = query.split("&");
                for (var i = 0; i < vars.length; i++) {
                    var pair = vars[i].split("=");
                    if (pair[0] == variable) {
                        return pair[1];
                    }
                }
                return (false);
            }
        },
    });
</script>
</html>