chengkun
2025-09-12 b21e53f16f228d3192eb54178f081395878b2406
app/home/view/blog/index.html
@@ -8,6 +8,34 @@
    <include file="common:title" />
    <include file="common:element-plus" />
    <include file="common:html-header" />
    <style>
        .cover_img {
            width: 360px;
            height: 240px;
            vertical-align: middle;
            object-fit: cover;
        }
        .blog-title {
            height: 53px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }
        .blog-desc {
            height: 77px;
            margin: 15px 0;
            padding: 0 0 0 0 !important;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
        }
    </style>
</head>
<body>
@@ -15,7 +43,7 @@
        <!-- 顶部 导航栏 -->
        <include file="common:top-header" />
        <!-- breadcumb area -->
        <!-- 背景图-->
        <div class="breadcumb-area">
            <div class="container">
                <div class="row">
@@ -35,9 +63,8 @@
                </div>
            </div>
        </div>
        <!-- End breadcumb area -->
        <!-- itpart blog area -->
        <!-- 内容 -->
        <div class="itpart_blog_area blog_grid_area">
            <div class="container">
                <div class="row">
@@ -45,134 +72,56 @@
                        <div class="witr_section_title">
                            <div class="witr_section_title_inner text-center">
                                <!-- title top -->
                                <h2>News &amp; blog</h2>
                                <h3>You Can Check Out Our Work. </h3>
                                <h2>{{ $t('message.header.blog') }}</h2>
                                <h3>{{ $t('message.blog.text-1') }}</h3>
                                <!-- title bottom -->
                                <h1>News &amp; Articles</h1>
                                <!-- <h1>News &amp; Articles</h1> -->
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12">
                        <!-- Blog Section -->
                        <div class="witr_blog_area12">
                            <div class="blog_active ">
                            <div class="blog_active">
                                <!-- single blog -->
                                <div class="witr_all_mb_30 col-md-12 col-xs-12 col-sm-12">
                                    <div class="busi_singleBlog">
                                        <!-- image -->
                                        <div class="witr_sb_thumb">
                                            <a href="#"> <img src="/static/home/assets/images/blog1.jpg" alt="image" /> </a>
                                            <div class="witr_top_category category_blog_grid">
                                                <!-- category -->
                                                <ul class="post-categories">
                                <volist name="list" id="item">
                                    <div class="witr_all_mb_30 col-md-12 col-xs-12 col-sm-12">
                                        <div class="busi_singleBlog">
                                            <!-- image -->
                                            <div class="witr_sb_thumb ">
                                                <a href="#"> <img src="{$item.cover_img}" alt="image" class="cover_img" /> </a>
                                                <div class="witr_top_category category_blog_grid">
                                                    <!-- category -->
                                                    <!-- <ul class="post-categories">
                                                    <li><a href="#">Developer</a></li>
                                                </ul>
                                                </ul> -->
                                                </div>
                                            </div>
                                        </div>
                                        <div class="all_blog_color">
                                            <div class="witr_blog_con bs5">
                                                <!-- title -->
                                                <h2><a href="single-blog.html">How investing in depended increasing to business.</a></h2>
                                                <!--  post meta -->
                                                <span><a href="#"><i class="icofont-user-alt-3"></i> Itpa</a></span>
                                                <span><a href="#"><i class="icofont-ui-clock"></i></a> 24 Aug 2021</span>
                                                <!-- content -->
                                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do</p>
                                                <div class="learn_more_adn">
                                                    <a class="learn_btn adnbtn2" href="#">Read More</a>
                                            <div class="all_blog_color">
                                                <div class="witr_blog_con bs5">
                                                    <!-- title -->
                                                    <h2>
                                                        <a href="javascript:void(0)" @click="gotoBlogDetail({$item.id})" class="blog-title">
                                                            <template v-if="language=='zh-cn'">{$item.title}</template>
                                                            <template v-else>{$item.en_title}</template>
                                                        </a>
                                                    </h2>
                                                    <!--  post meta -->
                                                    <!-- <span><a href="#"><i class="icofont-user-alt-3"></i> Itpa</a></span> -->
                                                    <span><a href="#"><i class="icofont-ui-clock"></i></a>{{formatDate({$item.create_time})}}</span>
                                                    <!-- content -->
                                                    <p class="blog-desc">
                                                        <template v-if="language=='zh-cn'">{$item.desc}</template>
                                                        <template v-else>{$item.en_desc}</template>
                                                    </p>
                                                    <!-- <div class="learn_more_adn">
                                                        <a class="learn_btn adnbtn2" href="javascript:void(0)" @click="gotoBlogDetail({$item.id})">Read More</a>
                                                    </div> -->
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- 02 single blog -->
                                <div class="witr_all_mb_30 col-md-12 col-xs-12 col-sm-12">
                                    <div class="busi_singleBlog">
                                        <!-- image -->
                                        <div class="witr_sb_thumb">
                                            <a href="#"> <img src="/static/home/assets/images/blog2.jpg" alt="image" /> </a>
                                            <div class="witr_top_category category_blog_grid">
                                                <!-- category -->
                                                <ul class="post-categories">
                                                    <li><a href="#">It Service</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                        <div class="all_blog_color">
                                            <div class="witr_blog_con bs5">
                                                <!-- title -->
                                                <h2><a href="single-blog.html">Email marketing tips that will increase your sales.</a></h2>
                                                <!--  post meta -->
                                                <span><a href="#"><i class="icofont-user-alt-3"></i> Itpa</a></span>
                                                <span><a href="#"><i class="icofont-ui-clock"></i></a> 29 Aug 2021</span>
                                                <!-- content -->
                                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do</p>
                                                <div class="learn_more_adn">
                                                    <a class="learn_btn adnbtn2" href="#">Read More</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- 03 single blog -->
                                <div class="witr_all_mb_30 col-md-12 col-xs-12 col-sm-12">
                                    <div class="busi_singleBlog">
                                        <!-- image -->
                                        <div class="witr_sb_thumb">
                                            <a href="#"> <img src="/static/home/assets/images/blog3.jpg" alt="image" /> </a>
                                            <div class="witr_top_category category_blog_grid">
                                                <!-- category -->
                                                <ul class="post-categories">
                                                    <li><a href="#">Management</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                        <div class="all_blog_color">
                                            <div class="witr_blog_con bs5">
                                                <!-- title -->
                                                <h2><a href="single-blog.html">Productivity tips to avoid burn out when working.</a></h2>
                                                <!--  post meta -->
                                                <span><a href="#"><i class="icofont-user-alt-3"></i> Itpa</a></span>
                                                <span><a href="#"><i class="icofont-ui-clock"></i></a>24 Jun 2021</span>
                                                <!-- content -->
                                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do</p>
                                                <div class="learn_more_adn">
                                                    <a class="learn_btn adnbtn2" href="#">Read More</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- 04 single blog -->
                                <div class="witr_all_mb_30 col-md-12 col-xs-12 col-sm-12">
                                    <div class="busi_singleBlog">
                                        <!-- image -->
                                        <div class="witr_sb_thumb">
                                            <a href="#"> <img src="/static/home/assets/images/blog11.jpg" alt="image" /> </a>
                                            <div class="witr_top_category category_blog_grid">
                                                <!-- category -->
                                                <ul class="post-categories">
                                                    <li><a href="#">Marketing</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                        <div class="all_blog_color">
                                            <div class="witr_blog_con bs5">
                                                <!-- title -->
                                                <h2><a href="single-blog.html">How investing in depended increasing to business.</a></h2>
                                                <!--  post meta -->
                                                <span><a href="#"><i class="icofont-user-alt-3"></i> Itpa</a></span>
                                                <span><a href="#"><i class="icofont-ui-clock"></i></a> 24 Aug 2021</span>
                                                <!-- content -->
                                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do</p>
                                                <div class="learn_more_adn">
                                                    <a class="learn_btn adnbtn2" href="#">Read More</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                </volist>
                            </div>
                        </div>
                    </div>
@@ -186,22 +135,52 @@
    <!-- Vue App -->
    <script src="/static/vue/mixin.js"></script>
    <script>
        var language = localStorage.getItem('changjiang-park-lang') || 'zh-cn';
        const App = {
            mixins: [sharedMixin],
            data() {
                return {
                    language: language,
                    list: [],
                };
            },
            computed: {
            },
            mounted() {
                // this.getBlogList();
            },
            created() {
            },
            methods: {
                formatDate(time) {
                    return moment(time * 1000).format("YYYY-MM-DD");
                },
                /////进入博客详情/////
                gotoBlogDetail(id) {
                    window.location.href = '/home/blog/detail/id/' + id + '.html';
                },
                // 获取公告列表
                getBlogList() {
                    let that = this;
                    const loading = this.$loading({
                        lock: true,
                        text: '获取中',
                        spinner: 'el-icon-loading',
                        background: 'rgba(0, 0, 0, 0.2)'
                    });
                    let url = "/home/blog/get_blog_list.html"
                    postRequest(url, {}).then(res => {
                        loading.close();
                        if (res.data.code == 200) {
                            that.list = res.data.data;
                        }
                    }).catch(() => {
                        //取消,不做处理
                    });
                },
            },
        };
        const app = Vue.createApp(App);
@@ -214,8 +193,8 @@
        app.use(i18n);
        app.mount("#vue_item");
    </script>
    <include file="common:html-css-js" />
</body>
<include file="common:html-css-js" />
</html>