hookehuyr

新闻中心列表页接口联调

......@@ -11,9 +11,12 @@
"build_tar": "npm run build && npm run tar",
"scp-dev": "scp dist.tar.gz ipadbiz-inner:/opt/space-dev/f",
"dec-dev": "ssh ipadbiz-inner 'cd /opt/space-dev/f && tar -xzvf dist.tar.gz && rm -rf dist.tar.gz'",
"scp-oa": "scp dist.tar.gz ipadbiz-inner:/opt/hager/f",
"dec-oa": "ssh ipadbiz-inner 'cd /opt/hager/f && tar -xzvf dist.tar.gz && rm -rf dist.tar.gz'",
"remove_tar": "rm -rf dist.tar.gz",
"remove_dist": "rm -rf hager",
"dev_upload": "npm run build_tar && npm run scp-dev && npm run dec-dev && npm run remove_tar && npm run remove_dist"
"dev_upload": "npm run build_tar && npm run scp-dev && npm run dec-dev && npm run remove_tar && npm run remove_dist",
"oa_upload": "npm run build_tar && npm run scp-oa && npm run dec-oa && npm run remove_tar && npm run remove_dist"
},
"dependencies": {
"@babel/polyfill": "^7.12.1",
......
/*
* @Date: 2024-09-26 13:36:06
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-10-23 10:13:25
* @LastEditTime: 2024-10-23 11:00:04
* @FilePath: /hager/src/api/hager.js
* @Description: 文件描述
*/
......@@ -9,6 +9,8 @@ import { fn, fetch } from '@/api/fn';
const Api = {
HONOR: '/srv/?a=cate&type=honor',
NEWS: '/srv/?a=cate&type=news',
};
export const honorAPI = (params) => fn(fetch.get(Api.HONOR, params));
export const newsAPI = (params) => fn(fetch.get(Api.NEWS, params));
......
......@@ -625,8 +625,8 @@ export default {
display: flex;
align-items: center;
border-radius: 1rem;
border: 1px solid #f5f5f5;
background-color: #e3f1f7;
border: 1px solid #E3F1F7;
background-color: #E3F1F7;
padding: 0.5rem 1rem;
overflow: hidden;
width: 100%;
......
<!--
* @Date: 2024-10-18 12:05:44
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-10-22 15:02:54
* @LastEditTime: 2024-10-23 11:57:18
* @FilePath: /hager/src/views/news/index.vue
* @Description: 文件描述
-->
......@@ -22,29 +22,32 @@
<hager-box style="margin: 1rem 0;">
<div v-if="!is_xs" class="hager-news-list">
<div class="card" v-for="(item, index) in news_list" :key="index">
<img :src="item.src" alt="学校图片" class="card-image">
<img :src="item.cover" alt="学校图片" class="card-image">
<div class="news-item">
<div :class="news-item-title">{{ item.title }}</div>
<p class="news-item-sub" v-clamp="2">{{ item.sub }}</p>
<p class="news-item-content" v-clamp="3">{{ item.content }}</p>
<el-tooltip class="item" effect="dark" :content="item.post_title" placement="bottom">
<div class="news-item-title">{{ item.post_title }}</div>
</el-tooltip>
<!-- <div class="news-item-title">{{ item.post_title }}</div> -->
<p class="news-item-sub" v-clamp="2">{{ item.post_title_en }}</p>
<p class="news-item-content" v-clamp="3">{{ item.post_excerpt }}</p>
<div @click="goToNew(item)" class="news-item-more" style="margin-top: 3rem;">MORE</div>
</div>
</div>
</div>
<div v-else class="hager-news-list xs">
<div class="card" v-for="(item, index) in news_list" :key="index">
<img :src="item.src" alt="学校图片" class="card-image">
<img :src="item.cover" alt="学校图片" class="card-image">
<div class="news-item">
<div class="news-item-title xs">{{ item.title }}</div>
<p class="news-item-sub">{{ item.sub }}</p>
<p class="news-item-content">{{ item.content }}</p>
<div class="news-item-title xs">{{ item.post_title }}</div>
<p class="news-item-sub">{{ item.post_title_en }}</p>
<p class="news-item-content">{{ item.post_excerpt }}</p>
<div @click="goToNew(item)" class="news-item-more" style="margin-top: 3rem;">MORE</div>
</div>
</div>
</div>
</hager-box>
<hager-box>
<hager-load-more></hager-load-more>
<hager-load-more v-if="page <= max_page" @click.native="getMore"></hager-load-more>
</hager-box>
</div>
</template>
......@@ -53,34 +56,25 @@
import mixin from 'common/mixin';
import hagerBox from '@/components/common/hagerBox';
import hagerLoadMore from '@/components/hagerLoadMore.vue';
import { newsAPI } from "@/api/hager.js";
export default {
components: { hagerBox, hagerLoadMore },
mixins: [mixin.init],
data () {
return {
news_list: [{
id: '1',
src: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
title: '获奖+1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀',
content: '11月28-29日,2023汤点文旅住宿节在苏州国际会议酒店隆重开幕,作为酒店整11月28-29日,2023汤点文旅住宿节在苏州国际会议酒店隆重开幕,作为酒店整11月28-29日,2023汤点文旅住宿节在苏州国际会议酒店隆重开幕,作为酒店整11月28-29日,2023汤点文旅住宿节在苏州国际会议酒店隆重开幕,作为酒店整',
sub: 'o Ehe gy aha oid asto Ehe gy aha oid asto Ehe gy aha oid ast o Ehe gy aha oid asto Ehe gy aha oid asto Ehe gy aha oid astgy aha oid asto Ehe gy aha oid asto Ehe gy aha oid ast'
}, {
id: '2',
src: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
title: '获奖+1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀',
content: '11月28-29日,2023汤点文旅住宿节在苏州国际会议酒店隆重开幕,作为酒店整11月28-29日,2023汤点文旅住宿节在苏州国际会议酒店隆重开幕,作为酒店整11月28-29日,2023汤点文旅住宿节在苏州国际会议酒店隆重开幕,作为酒店整11月28-29日,2023汤点文旅住宿节在苏州国际会议酒店隆重开幕,作为酒店整',
sub: 'o Ehe gy aha oid asto Ehe gy aha oid asto Ehe gy aha oid ast'
}, {
id: '3',
src: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
title: '获奖+1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀国际标1!海格电气荣获2023酒店文旅优秀',
content: '11月28-29日,2023汤点文旅住宿节在苏州国际会议酒店隆重开幕,作为酒店整11月28-29日,2023汤点文旅住宿节在苏州国际会议酒店隆重开幕,作为酒店整11月28-29日,2023汤点文旅住宿节在苏州国际会议酒店隆重开幕,作为酒店整11月28-29日,2023汤点文旅住宿节在苏州国际会议酒店隆重开幕,作为酒店整',
sub: 'o Ehe gy aha oid asto Ehe gy aha oid asto Ehe gy aha oid ast'
}]
news_list: [],
max_page: 0,
page: 1,
limit: 10,
}
},
mounted () {
async mounted () {
const { code, data } = await newsAPI({ page: this.page, limit: this.limit });
if (code) {
this.news_list = data.list;
this.max_page = data.max_page;
}
},
methods: {
goToNew (v) {
......@@ -90,6 +84,13 @@ export default {
id: v.id
}
});
},
async getMore () {
this.page += 1;
const { code, data } = await newsAPI({ page: this.page, limit: this.limit });
if (code) {
this.news_list = this.news_list.concat(data.list);
}
}
}
}
......