<template>
    <div class="container">
        <div class="row">
            <div class="col-lg-8 col-md-8 col-sm-12 col-sm-12">
                <!--图文信息固定条数展示组件2开始-->
                <div class="twinfo_show_fixrecord_pc_2"><!--使用此组件，请复制此div-->
                    <div class="notice-tab">
                        <div class="notice-tab-hd">
                            <ul style="display: flex">
                                <div v-for="(item,index) of catList.list" :key="index">
                                    <li v-if="index < 6" @click="chooseCatName(index,item.catId)"
                                        :class="{'on': catList.active === index}">{{item.catName}}
                                    </li>
                                    <span v-if="index < 5">/</span>
                                </div>
                            </ul>
                            <span class="sp1"><a href="/infolist?name=通知公告&type=tzgg">更多>></a></span>
                        </div>
                        <div class="notice-tab-bd">
                            <ul class="news-txtnews-ul">
                                <li v-for="(item,index) of newsList" :key="index"><a
                                        @click.prevent="goDetails(item.articleId)"
                                        href="">{{item.title}}</a><span>{{item.newsPubDate | format}}</span></li>
                            </ul>
                        </div>
                    </div>
                </div>
                <!--图文信息固定条数展示组件2结束-->
            </div>
        </div>
    </div>
</template>

<script type="text/babel">
    import formMixin from '../../../src/mixins/formMixin';
    import lenye_base from 'lenye_base';
    import $ from "fy-kit";

    export default {
        name: 'BreadcrumbNavigation',
        mixins: [formMixin],
        data() {
            return {
                //    站点数据
                siteData: '',
                //    用户数据
                userData: '',
                //新闻分类tabs切换的
                catList: {
                    active: 0,
                    list: []
                },
                // 获取新闻列表得请求数据
                getNewsList: {
                    catId: '',
                    siteId: '',
                    sorts: 'weightDate=0',
                    page: 1,
                    rows: 10
                },
                //    新闻列表数据
                newsList: []
            };
        },
        filters:{
            format(val){
                return $.date.moment(val).format('MM-DD');
            }
        },
        // 渲染之前，但此时的变量已经可用
        created() {
            this.siteData = lenye_base.site_data.getsiteData();
            console.log('站点信息', this.siteData);
            this.getNewsList.catId = this.siteData.siteId;
            if (lenye_base.user_data.getuserData()) {
                this.userData = lenye_base.user_data.getuserData();
            }
        },
        // 渲染完毕之后
        mounted() {
            this.getNewsClass();
        },
        methods: {
            // 跳转到更多
            more() {
                this.$message({
                    message: '暂未开通此功能！',
                    type: 'warning'
                });
            },
            // 详情
            goDetails(articleId) {
                window.open("/infodetail?id=" + articleId);
            },
            //切换分类类名
            chooseCatName(index, catId) {
                //通过下标进行判断
                this.catList.active = index;
                this.newsList2 = this.newsList[index];
                this.getNewsList.catId = catId;
                this.getNewsListData();
            },
            // 获取资讯分类
            getNewsClass() {
                const that = this;
                var obj = {
                    url: lenye_base.api_url.news.newsCategory,
                    data: {
                        siteId: this.siteData.siteId,
                        cascade: 1
                    },
                    Ajax: function (data) {
                        that.catList.list = data.data;
                        console.log('资讯分类', that.catList.list);
                        console.log('catId', that.catList.list[0].catId);
                        that.getNewsList.catId = that.catList.list[0].catId;
                        that.getNewsListData();
                    }
                };
                this.getData(obj);
            },
            // 获取列表数据
            getNewsListData() {
                const that = this;
                var obj = {
                    url: lenye_base.api_url.news.queryShowPage,
                    data: this.getNewsList,
                    Ajax: function (data) {
                        console.log('咨询列表', data.data);
                        that.newsList = data.data;
                    }
                };
                this.getData(obj);
            },
            //    获取数据
            getData(obj) {
                // 请求的api，格式为 lenye_base.api_url.setting.queryShowPage
                const url = obj.url;
                //请求的数据，类型是对象
                const data = obj.data;
                // 只能是箭头函数
                const Ajax = obj.Ajax;
                lenye_base.httpPost(lenye_base.base_data.getapiUrl() + url, lenye_base.base_data.getformatting(
                    data), Ajax);
            }
        }
    }
    ;
</script>
