Merge branch 'main' of http://182.92.169.222:3000/dlsx/ContestPortal
significative
8 months ago
commit
7b6eeb880a
6 changed files with 3774 additions and 2837 deletions
File diff suppressed because it is too large
Load Diff
@ -1,75 +1,102 @@ |
||||
export const constRouter: any =
|
||||
{ |
||||
path: '/', |
||||
component: () => import('@/Layout/index.vue'), |
||||
name: 'Layout', |
||||
redirect: '/home', |
||||
meta: { |
||||
icon: '', |
||||
title: '', |
||||
hidden: false, |
||||
export const constRouter: any = |
||||
{ |
||||
path: '/', |
||||
component: () => import('@/Layout/index.vue'), |
||||
name: 'Layout', |
||||
redirect: '/home', |
||||
meta: { |
||||
icon: '', |
||||
title: '', |
||||
hidden: false, |
||||
}, |
||||
children: [ |
||||
{ |
||||
path: '/home', |
||||
name: 'Home', |
||||
component: () => import('@/views/home/index.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '首页', |
||||
hidden: false, |
||||
}, |
||||
}, |
||||
children: [ |
||||
{ |
||||
path: '/home', |
||||
name: 'Home', |
||||
component: () => import('@/views/home/index.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '首页', |
||||
hidden: false, |
||||
}, |
||||
{ |
||||
path: '/appraise', |
||||
name: 'Appraise', |
||||
component: () => import('@/views/appraise/index.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '竞赛评价', |
||||
hidden: false, |
||||
}, |
||||
{ |
||||
path: '/appraise', |
||||
name: 'Appraise', |
||||
component: () => import('@/views/appraise/index.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '竞赛评价', |
||||
hidden: false, |
||||
}, |
||||
}, |
||||
{ |
||||
path: '/navigation', |
||||
name: 'Navigation', |
||||
component: () => import('@/views/navigation/index.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '竞赛导航', |
||||
hidden: false, |
||||
}, |
||||
{ |
||||
path: '/navigation', |
||||
name: 'Navigation', |
||||
component: () => import('@/views/navigation/index.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '竞赛导航', |
||||
hidden: false, |
||||
}, |
||||
}, |
||||
{ |
||||
path: '/achievement', |
||||
name: 'Achievement', |
||||
component: () => import('@/views/achievement/index.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '竞赛成果', |
||||
hidden: false, |
||||
}, |
||||
{ |
||||
path: '/achievement', |
||||
name: 'Achievement', |
||||
component: () => import('@/views/achievement/index.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '竞赛成果', |
||||
hidden: false, |
||||
}, |
||||
}, |
||||
{ |
||||
path: '/competition', |
||||
name: 'Competition', |
||||
component: () => import('@/views/competition/index.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '年度赛事', |
||||
hidden: false, |
||||
}, |
||||
{ |
||||
path: '/competition', |
||||
name: 'Competition', |
||||
component: () => import('@/views/competition/index.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '年度赛事', |
||||
hidden: false, |
||||
}, |
||||
}, |
||||
{ |
||||
path: '/registration', |
||||
name: 'Registration', |
||||
component: () => import('@/views/registration/index.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '报名信息', |
||||
hidden: false, |
||||
}, |
||||
{ |
||||
path: '/registration', |
||||
name: 'Registration', |
||||
component: () => import('@/views/registration/index.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '报名信息', |
||||
hidden: false, |
||||
}, |
||||
}, |
||||
{ |
||||
path: '/news', |
||||
name: 'news', |
||||
component: () => import('@/views/news/index.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '竞赛新闻', |
||||
hidden: false, |
||||
}, |
||||
], |
||||
} |
||||
children: [ |
||||
{ |
||||
path: '', |
||||
name: 'newsList', |
||||
component: () => import('@/views/news/components/newsList.vue'), // 新闻列表组件
|
||||
}, |
||||
{ |
||||
path: '/newsDetail', |
||||
name: 'newsDetail', |
||||
component: () => import('@/views/news/components/newsDetail.vue'), |
||||
meta: { |
||||
icon: '', |
||||
title: '新闻内容详情', |
||||
hidden: true, |
||||
} |
||||
} |
||||
], |
||||
}, |
||||
], |
||||
} |
||||
|
||||
|
||||
@ -0,0 +1,47 @@ |
||||
<template> |
||||
<el-button @click="backHandle" type="success">返回</el-button> |
||||
<div style="margin-top: 20px;margin-left: 50px;margin-right: 50px"> |
||||
<p class="list-title">{{ data.title }}</p> |
||||
<p class="list-summary">{{ data.summary }}</p> |
||||
<div class="center-image"> |
||||
<img class="list-image" :src="data.imageUrl" alt="News Image"> |
||||
</div> |
||||
<p class="list-time">{{ data.date }}</p> |
||||
</div> |
||||
</template> |
||||
<script setup lang="ts"> |
||||
import {ref} from 'vue'; |
||||
import {useRoute, useRouter} from "vue-router"; |
||||
const router = useRouter(); |
||||
const route = useRoute(); |
||||
const backHandle = ()=>{ |
||||
router.go(-1); |
||||
} |
||||
const data = ref(route.query) |
||||
</script> |
||||
|
||||
<style scoped> |
||||
.list-title{ |
||||
font-size: 25px; |
||||
font-weight: 600; |
||||
} |
||||
.list-summary{ |
||||
font-size: 20px; |
||||
color: #8c8b8b; |
||||
margin-top: 10px; |
||||
} |
||||
.list-time{ |
||||
font-size: 16px; |
||||
color: #999999; |
||||
margin-top: 10px; |
||||
} |
||||
.center-image{ |
||||
display: flex; |
||||
justify-content: center; |
||||
margin-top: 20px; |
||||
} |
||||
.list-image{ |
||||
width: 500px; |
||||
margin-top: 20px; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,147 @@ |
||||
<template> |
||||
<ul> |
||||
<li v-for="newsItems in newsData" :key="newsItems.id"> |
||||
<div class="box-list" @click="handleClick(newsItems)"> |
||||
<div class="left-box-list"> |
||||
<p class="list-title">{{ newsItems.title }}</p> |
||||
<p class="list-summary">{{ newsItems.summary }}</p> |
||||
<p class="list-time">{{ newsItems.date }}</p> |
||||
</div> |
||||
<img class="news-image" :src="newsItems.imageUrl" alt="News Image"> |
||||
</div> |
||||
<el-divider/> |
||||
</li> |
||||
</ul> |
||||
</template> |
||||
|
||||
<script setup lang="ts"> |
||||
import { ref } from 'vue'; |
||||
import {useRouter} from "vue-router"; |
||||
const router = useRouter() |
||||
// 假新闻数据 |
||||
const newsData = ref([ |
||||
{ |
||||
id:1, |
||||
title: '科技新闻1', |
||||
date: '2024年9月23日', |
||||
summary: '你有没有想过，是否能用更轻量的方式开发出与Electron相同功能的桌面应用？毕竟，虽然Electron确实强大，但它那几百MB的安装包和资源消耗对许多小型项目来说太过头了。', |
||||
imageUrl: 'https://img1.xcarimg.com/exp/7971/8041/8084/8581/20130421003812814631.jpg' |
||||
}, |
||||
{ |
||||
id:2, |
||||
title: '体育新闻2', |
||||
date: '2024年9月22日', |
||||
summary: '你有没有想过，是否能用更轻量的方式开发出与Electron相同功能的桌面应用？毕竟，虽然Electron确实强大，但它那几百MB的安装包和资源消耗对许多小型项目来说太过头了。', |
||||
imageUrl: 'https://pic.rmb.bdstatic.com/50252becb3b391b2cb68ddde4a9c5d9b.jpeg' |
||||
}, |
||||
{ |
||||
id:3, |
||||
title: '科技新闻3', |
||||
date: '2024年9月23日', |
||||
summary: '你有没有想过，是否能用更轻量的方式开发出与Electron相同功能的桌面应用？毕竟，虽然Electron确实强大，但它那几百MB的安装包和资源消耗对许多小型项目来说太过头了。', |
||||
imageUrl: 'https://inews.gtimg.com/om_bt/OGlQWfsaAoKkuCcMZ2o9IVEPqd-72DQy5EAN02XBHUwfYAA/641' |
||||
}, |
||||
{ |
||||
id:4, |
||||
title: '科技新闻4', |
||||
date: '2024年9月23日', |
||||
summary: '你有没有想过，是否能用更轻量的方式开发出与Electron相同功能的桌面应用？毕竟，虽然Electron确实强大，但它那几百MB的安装包和资源消耗对许多小型项目来说太过头了。', |
||||
imageUrl: 'https://img1.baidu.com/it/u=655643694,820713725&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=729' |
||||
}, |
||||
{ |
||||
id:5, |
||||
title: '科技新闻5', |
||||
date: '2024年9月23日', |
||||
summary: '你有没有想过，是否能用更轻量的方式开发出与Electron相同功能的桌面应用？毕竟，虽然Electron确实强大，但它那几百MB的安装包和资源消耗对许多小型项目来说太过头了。', |
||||
imageUrl: 'https://desk-fd.zol-img.com.cn/t_s960x600c5/g2/M00/00/00/ChMlWV0v7jyIHLj_AAgsbG2bHDcAAL5lQE1rfYACCyE751.jpg' |
||||
}, |
||||
{ |
||||
id:6, |
||||
title: '科技新闻6', |
||||
date: '2024年9月23日', |
||||
summary: '你有没有想过，是否能用更轻量的方式开发出与Electron相同功能的桌面应用？毕竟，虽然Electron确实强大，但它那几百MB的安装包和资源消耗对许多小型项目来说太过头了。', |
||||
imageUrl: 'https://img2.woyaogexing.com/2023/05/05/1601bcb82e9858e21149cf64086a21db.jpg' |
||||
}, |
||||
{ |
||||
id:7, |
||||
title: '体育新闻7', |
||||
date: '2024年9月22日', |
||||
summary: '你有没有想过，是否能用更轻量的方式开发出与Electron相同功能的桌面应用？毕竟，虽然Electron确实强大，但它那几百MB的安装包和资源消耗对许多小型项目来说太过头了。', |
||||
imageUrl: 'https://img2.woyaogexing.com/2023/05/05/6280b93c7eb748a24466bd0d3021e3a9.jpg' |
||||
}, |
||||
{ |
||||
id:8, |
||||
title: '科技新闻8', |
||||
date: '2024年9月23日', |
||||
summary: '你有没有想过，是否能用更轻量的方式开发出与Electron相同功能的桌面应用？毕竟，虽然Electron确实强大，但它那几百MB的安装包和资源消耗对许多小型项目来说太过头了。', |
||||
imageUrl: 'https://img2.woyaogexing.com/2023/05/05/113da83a57b3661c3170c2571007f8e5.jpg' |
||||
}, |
||||
{ |
||||
id:9, |
||||
title: '科技新闻9', |
||||
date: '2024年9月23日', |
||||
summary: '你有没有想过，是否能用更轻量的方式开发出与Electron相同功能的桌面应用？毕竟，虽然Electron确实强大，但它那几百MB的安装包和资源消耗对许多小型项目来说太过头了。', |
||||
imageUrl: 'https://img1.baidu.com/it/u=515359320,1010066691&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=810' |
||||
}, |
||||
{ |
||||
id:10, |
||||
title: '科技新闻10', |
||||
date: '2024年9月23日', |
||||
summary: '你有没有想过，是否能用更轻量的方式开发出与Electron相同功能的桌面应用？毕竟，虽然Electron确实强大，但它那几百MB的安装包和资源消耗对许多小型项目来说太过头了。', |
||||
imageUrl: 'https://q6.itc.cn/images01/20240613/84d2e170b23b47be86f17ec5009febf9.jpeg' |
||||
}, |
||||
]); |
||||
const handleClick = (newsItems)=>{ |
||||
// router.push(`/news/${newsItems.id}`); |
||||
router.push({path:'/newsDetail',query:newsItems}) |
||||
} |
||||
</script> |
||||
|
||||
<style scoped> |
||||
.box-list{ |
||||
display: flex; |
||||
/*background: cornsilk;*/ |
||||
width: 95%; |
||||
height: 100px; |
||||
margin-left: 30px; |
||||
margin-bottom: 10px; |
||||
align-items: center; |
||||
cursor: pointer; /* 默认鼠标指针形状 */ |
||||
} |
||||
.box-list:hover { |
||||
background-color: lightgrey; /* 鼠标悬停时改变背景颜色 */ |
||||
} |
||||
.left-box-list { |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: space-between; |
||||
flex: 1; |
||||
padding-right: 10px; |
||||
} |
||||
.list-title{ |
||||
font-size: 22px; |
||||
margin-left: 60px; |
||||
} |
||||
.list-summary{ |
||||
font-size: 16px; |
||||
margin-left: 60px; |
||||
margin-top: 15px; |
||||
color: #999999; |
||||
display: -webkit-box; |
||||
-webkit-box-orient: vertical; |
||||
-webkit-line-clamp: 1 ; |
||||
overflow: hidden; |
||||
text-overflow: ellipsis; /* 溢出部分显示为省略号 */ |
||||
max-width: calc(100% - 130px); /* 减去右侧图片宽度和内边距 */ |
||||
} |
||||
.list-time{ |
||||
margin-left: 60px; |
||||
margin-top: 20px; |
||||
color: #999999; |
||||
} |
||||
.news-image { |
||||
width: 100px; |
||||
height: 80px; |
||||
margin-right: 30px; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,37 @@ |
||||
<template> |
||||
<div class="container"> |
||||
<el-card style="max-width: 70%;margin: auto"> |
||||
<template #header> |
||||
<div class="card-header"> |
||||
<span>新闻推荐</span> |
||||
</div> |
||||
</template> |
||||
<div class="content"> |
||||
<router-view></router-view> |
||||
</div> |
||||
</el-card> |
||||
</div> |
||||
</template> |
||||
<script setup lang="ts"> |
||||
|
||||
</script> |
||||
<style scoped> |
||||
.container{ |
||||
margin-top:100px; |
||||
} |
||||
.card-header{ |
||||
font-size: 20px; |
||||
font-weight: 600; |
||||
margin-left: 100px; |
||||
} |
||||
.content { |
||||
height: 89vh; |
||||
overflow-y: scroll; |
||||
padding: 0; |
||||
margin: 0; |
||||
display: block; |
||||
} |
||||
.content::-webkit-scrollbar { |
||||
width: 0; |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue