code/Goodgame_web
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
Files
c3f5f13bb39b40fd565c525a3165a056b98a4bc4
Goodgame_web/pages/news.vue
T
我是个攻城狮 c3f5f13bb3 all
2026-05-27 16:01:15 +08:00

365 lines
9.7 KiB
Vue
Raw Blame History

<template>
<Layout :index="-1" :banner="0" :img="'/static/img/about.jpg'" :titles="'关于我们'" :title_content="'寻找您心仪的游戏'">
<view class="bg ptm-80">
<view class="max-width d-b-s">
<view class="news_nav">
<view class="market-title pointer" :class="{'market-title-active':category_id==1}" @tap="active(1)">
平台简介
</view>
<block v-for="(item,index) in classData">
<view class="market-title pointer" :class="{'market-title-active':category_id==item.category_id}" @tap="active(item.category_id)" >
{{item.name}}
</view>
</block>
<!-- <view class="market-title pointer" :class="{'market-title-active':category_id==2}" @tap="active(2)">
新闻中心
</view>
<view class="market-title pointer" :class="{'market-title-active':category_id==3}" @tap="active(3)">
帮助中心
</view> -->
</view>
<view class="news_content text-wihte" v-if="category_id==1">
<rich-text :nodes="content"></rich-text>
</view>
<view class="news_content" v-if="category_id==2">
<a class="news-item" v-for="(item,index) in listData" :key="index" :href="'/articleDetails?index=2&id='+item.article_id">
<image class="news_fm" :src="item.image.file_path" v-if="item.image_id>0"></image>
<view class="news-item-content" :class="{'w100':!item.image_id}">
<view class="news-item-title pointer">
<text>{{item.form}}</text>
<view class="news-item-time">
<text>{{$mUtils.removeTime(item.create_time)}}</text>
</view>
</view>
<view class="news_desc">
{{item.article_title}}
</view>
<view class="news-xian">
<view class="news-item-text">{{item.dec}}
</view>
</view>
<view class="godetai">
查看详情
<view class="go_img"></view>
</view>
</view>
</a>
<view v-if="total==0" class="nocontent">
暂无数据
</view>
<el-pagination background layout="prev, pager, next" :total="total" :current-page="page" :page-size="list_rows" @size-change="handleSizeChange" @current-change="handleCurrentChange"></el-pagination>
</view>
<view class="news_content" v-if="category_id==3">
<a class="news-item" v-for="(item,index) in listData" :key="index" :href="'/articleDetails?index=3&id='+item.article_id">
<image class="news_fm" :src="item.image.file_path" v-if="item.image_id>0"></image>
<view class="news-item-content" :class="{'w100':!item.image_id}">
<view class="news-item-title pointer">
<text>{{item.form}}</text>
<view class="news-item-time">
<text>{{$mUtils.removeTime(item.create_time)}}</text>
</view>
</view>
<view class="news_desc">
{{item.article_title}}
</view>
<view class="news-xian">
<view class="news-item-text">{{item.dec}}
</view>
</view>
<view class="godetai">
查看详情
<view class="go_img"></view>
</view>
</view>
</a>
<view v-if="total==0" class="nocontent">
暂无数据
</view>
<el-pagination background layout="prev, pager, next" :total="total" :current-page="page" :page-size="list_rows" @size-change="handleSizeChange" @current-change="handleCurrentChange"></el-pagination>
</view>
<view class="news_content" v-if="category_id==4">
<a class="news-item" v-for="(item,index) in listData" :key="index" :href="'/articleDetails?index=4&id='+item.article_id">
<image class="news_fm" :src="item.image.file_path" v-if="item.image_id>0"></image>
<view class="news-item-content" :class="{'w100':!item.image_id}">
<view class="news-item-title pointer">
<text>{{item.form}}</text>
<view class="news-item-time">
<text>{{$mUtils.removeTime(item.create_time)}}</text>
</view>
</view>
<view class="news_desc">
{{item.article_title}}
</view>
<view class="news-xian">
<view class="news-item-text">{{item.dec}}
</view>
</view>
<view class="godetai">
查看详情
<view class="go_img"></view>
</view>
</view>
</a>
<view v-if="total==0" class="nocontent">
暂无数据
</view>
<el-pagination background layout="prev, pager, next" :total="total" :current-page="page" :page-size="list_rows" @size-change="handleSizeChange" @current-change="handleCurrentChange"></el-pagination>
</view>
<view class="news_content" v-if="category_id==5">
<a class="news-item" v-for="(item,index) in listData" :key="index" :href="'/articleDetails?index=5&id='+item.article_id">
<image class="news_fm" :src="item.image.file_path" v-if="item.image_id>0"></image>
<view class="news-item-content" :class="{'w100':!item.image_id}">
<view class="news-item-title pointer">
<text>{{item.form}}</text>
<view class="news-item-time">
<text>{{$mUtils.removeTime(item.create_time)}}</text>
</view>
</view>
<view class="news_desc">
{{item.article_title}}
</view>
<view class="news-xian">
<view class="news-item-text">{{item.dec}}
</view>
</view>
<view class="godetai">
查看详情
<view class="go_img"></view>
</view>
</view>
</a>
<view v-if="total==0" class="nocontent">
暂无数据
</view>
<el-pagination background layout="prev, pager, next" :total="total" :current-page="page" :page-size="list_rows" @size-change="handleSizeChange" @current-change="handleCurrentChange"></el-pagination>
</view>
</view>
</view>
</Layout>
</template>
<script>
import Layout from './part/layout.vue';
export default {
components:{
Layout
},
data(){
return {
page: 1,
list_rows: 10,
listData: [],
total: 0,
newData: [],
classData:[],
category_id: 1,
content:''
}
},
created() {
const width = window.innerWidth;
const height = window.innerHeight;
const mobileWidth = 768; // 可以根据需要调整这个值
const isMobile = width <= mobileWidth || height <= mobileWidth;
if(isMobile){
this.list_rows = 30;
}
let obj = this.$Route.query;
if(obj.hasOwnProperty('index')){
this.category_id = Number(obj.index);
console.log(this.category_id,222222222)
//this.banner = Number(obj.index);
}
this.getData();
this.getcData();
},
onShow() {
this.getData();
},
methods:{
active(index){
if(this.category_id==index)return;
this.category_id = index;
this.page = 1;
this.getData();
},
/*每页多少条*/
handleSizeChange(val){
this.list_rows = val;
this.getData();
},
/*选择第几页*/
handleCurrentChange(val){
this.page = val;
this.getData();
},
getcData(){
this._get('plus.article.article/category',{},res=>{
// console.log(res.data.category,222)
this.classData = res.data.category;
});
},
getData(){
this._get('plus.article.article/index',{
page: this.page,
list_rows: this.list_rows,
category_id: this.category_id,
},res=>{
if(this.category_id==1){
this.content = res.data.list.content;
}else{
this.listData = res.data.list.data;
this.total = res.data.list.total;
}
});
},
goDetail(e){
this.$router.push({
path: 'articleDetails',
query: {
id: e.article_id,
index: 3
}
})
},
}
}
</script>
<style lang="scss">
.nocontent{
height: 240px;color: #ffffff;text-align: center;margin-top: 10px;
}
.w100{
width: 100% !important;
}
.bg{
background-image: url('../static/img/index/gbgs.png');
background-size: 100%;
background-repeat: no-repeat;
padding-top: 79px;
min-height: 800px;
}
.news_content{
width: 1341px;
}
.text-wihte{
font-size: 21px;
font-weight: 400;
color: #9E9E9E;
line-height: 32px;
}
.news_nav{
display: flex;
flex-direction: column;
width: 168px;
height: 293px;
background: #383838;
border-radius: 8px;
padding: 32px 0;
}
.market-title{
width: 168px;
font-size: 21px;
font-weight: 400;
color: #FFFFFF;
text-align: center;
position: relative;
margin-bottom: 27px;
}
.market-title-active{
color: #F48612;
&::before{
content: '';
width: 2px;
height: 20px;
background: linear-gradient(to bottom,#F48612,#F48612);
position: absolute;
left: 0;
top: 4px;
}
// .shu{
// color: #F48612;
// }
}
@media screen and (max-width: 768px) {
.text-wihte{
line-height: 18px;
font-size: 10px !important;
width: 100%;
margin-top: 10px;
}
.market-title-active::before {
display: none;
}
.news_nav{
flex-direction: row;
width: 100%;
height: 30px;
line-height: 30px;
margin: 0 auto;
justify-content: center;
}
.market-title{
font-size: 16px;
width: 20%;
margin: 0 2%;
}
.d-b-s{
flex-direction: column;
margin: 0 auto;
}
.bg{
min-height: 400px;
background-repeat: repeat;
background-size: 100% 100%;
}
.news_content{
width: 100%;
margin-top: 20px;
}
.news-item{
width: 100%;
}
.news-item-content{
width: 70%;
margin-top: 8px;
}
.news-item-title{
font-size: 10px;
}
.news_desc{
font-size: 10px;
height: 12px;
line-height: 12px;
}
.news-item-text{
font-size: 8px;
height: 12px;
line-height: 12px;
}
.godetai{
width: 100%;
margin-top: 8px;
}
.news_fm{
width: 25%;
height: 70px;
}
.nocontent{
font-size: 12px;
margin-top: 60px;
}
.el-pagination{
display: none;
}
}
</style>
Reference in New Issue View Git Blame Copy Permalink