优化bug
This commit is contained in:
parent
45ee64cf47
commit
91007730ad
19
app.vue
19
app.vue
@ -14,12 +14,21 @@ import { useStore } from '~/store'
|
|||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
const { locale } = useI18n()
|
const { locale } = useI18n()
|
||||||
useSeoMeta({
|
useSeoMeta({
|
||||||
title: '中国共产主义青年团洛阳市委员会',
|
title: '洛阳青年之家 | 共青团洛阳市委员会 - 引领青年成长，服务洛阳发展',
|
||||||
ogTitle: '中国共产主义青年团洛阳市委员会',
|
ogTitle: '共青团洛阳市委员会官网 | 洛阳青年工作动态与服务平台',
|
||||||
description: '中国共产主义青年团洛阳市委员会',
|
description: '共青团洛阳市委员会权威平台，发布青年政策、志愿服务、就业创业指南、主题活动资讯，助力洛阳青年发展与城市建设。',
|
||||||
ogDescription: '中国共产主义青年团洛阳市委员会',
|
ogDescription: '获取洛阳共青团最新工作动态、青年活动报名入口、权益维护服务及社会实践机会，加入洛阳青年成长社区。',
|
||||||
ogImage: 'https://example.com/image.png',
|
ogImage: 'https://tsw.hschool.com.cn/web/img/index/logo.png',
|
||||||
twitterCard: 'summary_large_image',
|
twitterCard: 'summary_large_image',
|
||||||
|
// 补充关键元标签
|
||||||
|
keywords: '洛阳共青团,青年志愿服务,洛阳就业创业,青少年权益保护,青年大学习,洛阳青年活动'
|
||||||
|
})
|
||||||
|
// 补充企业微信专用标签
|
||||||
|
useHead({
|
||||||
|
meta: [
|
||||||
|
{ name: 'wechat:image', content: 'https://tsw.hschool.com.cn/web/img/index/logo.png' },
|
||||||
|
{ name: 'x5:image', content: 'https://tsw.hschool.com.cn/web/img/index/logo.png' },
|
||||||
|
]
|
||||||
})
|
})
|
||||||
const store = useStore();
|
const store = useStore();
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
|||||||
@ -24,7 +24,7 @@
|
|||||||
<!-- @click="getMesList(null)" 新闻动态总 -->
|
<!-- @click="getMesList(null)" 新闻动态总 -->
|
||||||
<div class="lef_boxitem1">
|
<div class="lef_boxitem1">
|
||||||
<div class="lef_boxitem1_shu"></div>
|
<div class="lef_boxitem1_shu"></div>
|
||||||
<div class="lef_boxitem1_title">关于我们</div>
|
<div class="lef_boxitem1_title">组织机构</div>
|
||||||
</div>
|
</div>
|
||||||
<div :class="['lef_boxitem2', { 'active': cateid == item.id }]" v-for="(item, index) in newsListtyp"
|
<div :class="['lef_boxitem2', { 'active': cateid == item.id }]" v-for="(item, index) in newsListtyp"
|
||||||
:key="index" @click="getMesList(item.id, 1)">
|
:key="index" @click="getMesList(item.id, 1)">
|
||||||
@ -144,6 +144,7 @@ const getNewstypeList = async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.top_search {
|
.top_search {
|
||||||
|
margin: 0 auto;
|
||||||
margin-top: 50px;
|
margin-top: 50px;
|
||||||
height: 70px;
|
height: 70px;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
@ -407,4 +408,18 @@ const getNewstypeList = async () => {
|
|||||||
width: 700px;
|
width: 700px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media (max-width: 1280px) {
|
||||||
|
.top_search {
|
||||||
|
width: 800px;
|
||||||
|
margin-left: 357px;
|
||||||
|
|
||||||
|
}
|
||||||
|
.News_box{
|
||||||
|
width: 900px;
|
||||||
|
margin-left: 250px;
|
||||||
|
}
|
||||||
|
.rig_box{
|
||||||
|
width: 700px;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
@ -10,13 +10,13 @@
|
|||||||
<div style="width: 350px;">
|
<div style="width: 350px;">
|
||||||
<img @click="toMore(0)" :src="`/img/index/dlogo.png`" style="cursor: pointer;;width: 100%;height: 100%;object-fit: cover;">
|
<img @click="toMore(0)" :src="`/img/index/dlogo.png`" style="cursor: pointer;;width: 100%;height: 100%;object-fit: cover;">
|
||||||
</div>
|
</div>
|
||||||
<!-- <div class="inputform">
|
<div class="inputform">
|
||||||
<input v-model="inputSearch" class="contactInput w-full md:w-[337px]" type="text"
|
<input v-model="inputSearch" class="contactInput w-full md:w-[337px]" type="text"
|
||||||
placeholder="请输入搜索关键字" />
|
placeholder="请输入搜索关键字" />
|
||||||
<div class="search_rinput">
|
<div class="search_rinput" @click="toSearch">
|
||||||
<img src="/img/index/hmsearch.png" alt="">
|
<img src="/img/index/hmsearch.png" alt="">
|
||||||
</div>
|
</div>
|
||||||
</div> -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class=" w-full h-full left-msg">
|
<div class=" w-full h-full left-msg">
|
||||||
|
|
||||||
@ -126,6 +126,14 @@ const getLiuyanList = async () => {
|
|||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
getLiuyanList();
|
getLiuyanList();
|
||||||
})
|
})
|
||||||
|
const toSearch = () => {
|
||||||
|
// emit('toSwpe',9);
|
||||||
|
// emitter.emit('inputSea', {
|
||||||
|
// keywords:inputSearch.value,
|
||||||
|
// type: 1,
|
||||||
|
// });
|
||||||
|
window.open(`/search_info?type=1&keywords=${inputSearch.value}`)
|
||||||
|
}
|
||||||
const emit = defineEmits(['toSwpe'])
|
const emit = defineEmits(['toSwpe'])
|
||||||
const toMore = (index:number) => {
|
const toMore = (index:number) => {
|
||||||
emit('toSwpe', index);
|
emit('toSwpe', index);
|
||||||
@ -198,6 +206,7 @@ const submitForm = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.top_search {
|
.top_search {
|
||||||
|
margin: 0 auto;
|
||||||
margin-top: 50px;
|
margin-top: 50px;
|
||||||
height: 70px;
|
height: 70px;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
@ -209,7 +218,6 @@ const submitForm = () => {
|
|||||||
.inputform {
|
.inputform {
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 340px;
|
width: 340px;
|
||||||
margin-right: 319px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.contactInput {
|
.contactInput {
|
||||||
@ -232,7 +240,7 @@ const submitForm = () => {
|
|||||||
.search_rinput {
|
.search_rinput {
|
||||||
width: 68px;
|
width: 68px;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
background: #E6E6E6;
|
background: #338CDE;
|
||||||
border-radius: 0px 8px 8px 0px;
|
border-radius: 0px 8px 8px 0px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
@ -321,7 +329,7 @@ const submitForm = () => {
|
|||||||
// right: 30px;
|
// right: 30px;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
margin-left: 50px;
|
margin-left: 60px;
|
||||||
background: linear-gradient(0deg, #338CDE 0%, #469CE2 100%);
|
background: linear-gradient(0deg, #338CDE 0%, #469CE2 100%);
|
||||||
border: none;
|
border: none;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
@ -388,11 +396,16 @@ const submitForm = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 1440px) {
|
@media (max-width: 1440px) {
|
||||||
|
.top_search {
|
||||||
|
width: 920px;
|
||||||
|
margin-left: 370px;
|
||||||
|
|
||||||
|
}
|
||||||
.left-msg {
|
.left-msg {
|
||||||
width: 1018px;
|
width: 1018px;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
margin-left: 270px;
|
margin-left: 270px;
|
||||||
margin-top: 40px;
|
margin-top: 60px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#myTextarea {
|
#myTextarea {
|
||||||
@ -413,4 +426,34 @@ const submitForm = () => {
|
|||||||
width: 41px;
|
width: 41px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media (max-width: 1280px) {
|
||||||
|
.top_search {
|
||||||
|
width: 800px;
|
||||||
|
margin-left: 357px;
|
||||||
|
}
|
||||||
|
.left-msg {
|
||||||
|
width: 900px;
|
||||||
|
margin: 0;
|
||||||
|
margin-left: 260px;
|
||||||
|
margin-top: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#myTextarea {
|
||||||
|
width: 658px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contactInputs {
|
||||||
|
width: 165px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.inputforms {
|
||||||
|
display: flex;
|
||||||
|
justify-content: start !important;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contactForm .inputforms span {
|
||||||
|
width: 41px;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
<!-- PC端布局 -->
|
<!-- PC端布局 -->
|
||||||
<div class="group_30 flex-col pc-footer">
|
<div class="group_30 flex-col pc-footer">
|
||||||
<div class="text-wrapper_13 flex-row">
|
<div class="text-wrapper_13 flex-row">
|
||||||
<div class="fly1s" style="margin-top: 40px;">
|
<div class="fly1s" style="margin-top: 40px;width: 100%;">
|
||||||
<div class="db-flex">
|
<div class="db-flex">
|
||||||
<div class="b1" @click="openT()">中央人民政府</div>
|
<div class="b1" @click="openT()">中央人民政府</div>
|
||||||
<div style="display: flex;">
|
<div style="display: flex;">
|
||||||
@ -38,7 +38,7 @@
|
|||||||
<img :src="`/img/index/bi.png`" style="height: 45px;width: 45px;cursor: pointer;"></img>
|
<img :src="`/img/index/bi.png`" style="height: 45px;width: 45px;cursor: pointer;"></img>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex;">
|
<!-- <div style="display: flex;">
|
||||||
<div class="b1" style="padding: 0;">
|
<div class="b1" style="padding: 0;">
|
||||||
<select @change="getSelect" style="width: 100%;height: 41px;padding-left:15px;">
|
<select @change="getSelect" style="width: 100%;height: 41px;padding-left:15px;">
|
||||||
<option value="0">办公入口</option>
|
<option value="0">办公入口</option>
|
||||||
@ -48,7 +48,7 @@
|
|||||||
<div>
|
<div>
|
||||||
<img :src="`/img/index/bi.png`" style="height: 45px;width: 45px;cursor: pointer;"></img>
|
<img :src="`/img/index/bi.png`" style="height: 45px;width: 45px;cursor: pointer;"></img>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div> -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- <span class="text_66">友情链接:</span>
|
<!-- <span class="text_66">友情链接:</span>
|
||||||
@ -239,7 +239,7 @@ const openT = () => {
|
|||||||
color: #323232;
|
color: #323232;
|
||||||
height: 45px;
|
height: 45px;
|
||||||
line-height: 45px;
|
line-height: 45px;
|
||||||
width: 200px;
|
width: 220px;
|
||||||
background: #FFFFFF;
|
background: #FFFFFF;
|
||||||
border: 1px solid #EEEEEE;
|
border: 1px solid #EEEEEE;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
@ -254,7 +254,8 @@ const openT = () => {
|
|||||||
|
|
||||||
@media (max-width: 1440px) {
|
@media (max-width: 1440px) {
|
||||||
.group_30 {
|
.group_30 {
|
||||||
width: 1000px;
|
width: 920px;
|
||||||
|
margin-left: 380px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.db-flex {
|
.db-flex {
|
||||||
@ -268,5 +269,31 @@ const openT = () => {
|
|||||||
.image_29 {
|
.image_29 {
|
||||||
margin-right: 0px;
|
margin-right: 0px;
|
||||||
}
|
}
|
||||||
|
.image_30{
|
||||||
|
width: 70px;
|
||||||
|
height: 70px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (max-width: 1280px) {
|
||||||
|
.group_30 {
|
||||||
|
width: 800px;
|
||||||
|
margin-left: 357px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.db-flex {
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.b1 {
|
||||||
|
width: 180px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.image_29 {
|
||||||
|
margin-right: 0px;
|
||||||
|
}
|
||||||
|
.image_30{
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -1,41 +1,49 @@
|
|||||||
<template>
|
<template>
|
||||||
<!-- 左边导航栏 -->
|
<!-- 左边导航栏 -->
|
||||||
<div class="bgimg">
|
<div class="bgimg">
|
||||||
<div class="pc-nav">
|
<div class="pc-nav">
|
||||||
|
|
||||||
<div class="pc-nav-item" @click="gotoList(1)">
|
<div class="pc-nav-item" @click="gotoList(1)">
|
||||||
<img :src="crrent==1?'/img/index/home1.png':'/img/index/home.png'" alt=""></img>
|
<img :src="crrent == 1 ? '/img/index/home1.png' : '/img/index/home.png'" alt=""></img>
|
||||||
<span :class="['span',{'active': crrent==1}]">官网首页</span>
|
<span :class="['span', { 'active': crrent == 1 }]">官网首页</span>
|
||||||
<img v-if="crrent==1" src="/img/index/arrow.png" alt="" style="width: 9px;height: 12px;margin-left: 10px;">
|
<img v-if="crrent == 1" src="/img/index/arrow.png" alt=""
|
||||||
|
style="width: 9px;height: 12px;margin-left: 10px;">
|
||||||
</div>
|
</div>
|
||||||
<div class="pc-nav-item" @click="gotoList(2)">
|
<div class="pc-nav-item" @click="gotoList(2)">
|
||||||
<img :src="crrent==2?'/img/index/aboutus1.png':'/img/index/aboutus.png'" alt=""></img>
|
<img :src="crrent == 2 ? '/img/index/aboutus1.png' : '/img/index/aboutus.png'" alt=""></img>
|
||||||
<span :class="['span',{'active': crrent==2}]">关于我们</span>
|
<span :class="['span', { 'active': crrent == 2 }]">组织机构</span>
|
||||||
<img v-if="crrent==2" src="/img/index/arrow.png" alt="" style="width: 9px;height: 12px;margin-left: 10px;">
|
<img v-if="crrent == 2" src="/img/index/arrow.png" alt=""
|
||||||
|
style="width: 9px;height: 12px;margin-left: 10px;">
|
||||||
</div>
|
</div>
|
||||||
<div class="pc-nav-item" @click="gotoList(3)">
|
<div class="pc-nav-item" @click="gotoList(3)">
|
||||||
<img :src="crrent==3?'/img/index/news1.png':'/img/index/news.png'" alt=""></img>
|
<img :src="crrent == 3 ? '/img/index/news1.png' : '/img/index/news.png'" alt=""></img>
|
||||||
<span :class="['span',{'active': crrent==3}]">新闻动态</span>
|
<span :class="['span', { 'active': crrent == 3 }]">新闻动态</span>
|
||||||
<img v-if="crrent==3" src="/img/index/arrow.png" alt="" style="width: 9px;height: 12px;margin-left: 10px;">
|
<img v-if="crrent == 3" src="/img/index/arrow.png" alt=""
|
||||||
|
style="width: 9px;height: 12px;margin-left: 10px;">
|
||||||
</div>
|
</div>
|
||||||
<div class="pc-nav-item" @click="gotoList(4)">
|
<div class="pc-nav-item" @click="gotoList(4)">
|
||||||
<img :src="crrent==4?'/img/index/ly1.png':'/img/index/ly.png'" alt=""></img>
|
<img :src="crrent == 4 ? '/img/index/ly1.png' : '/img/index/ly.png'" alt=""></img>
|
||||||
<span :class="['span',{'active': crrent==4}]">青春洛阳</span>
|
<span :class="['span', { 'active': crrent == 4 }]">青春洛阳</span>
|
||||||
<img v-if="crrent==4" src="/img/index/arrow.png" alt="" style="width: 9px;height: 12px;margin-left: 10px;">
|
<img v-if="crrent == 4" src="/img/index/arrow.png" alt=""
|
||||||
|
style="width: 9px;height: 12px;margin-left: 10px;">
|
||||||
</div>
|
</div>
|
||||||
<div class="pc-nav-item" @click="gotoList(5)">
|
<div class="pc-nav-item" @click="gotoList(5)">
|
||||||
<img :src="crrent==5?'/img/index/news1.png':'/img/index/news.png'" alt=""></img>
|
<img :src="crrent == 5 ? '/img/index/news1.png' : '/img/index/news.png'" alt=""></img>
|
||||||
<span :class="['span',{'active': crrent==5}]">服务青年</span>
|
<span :class="['span', { 'active': crrent == 5 }]">服务青年</span>
|
||||||
<img v-if="crrent==5" src="/img/index/arrow.png" alt="" style="width: 9px;height: 12px;margin-left: 10px;">
|
<img v-if="crrent == 5" src="/img/index/arrow.png" alt=""
|
||||||
|
style="width: 9px;height: 12px;margin-left: 10px;">
|
||||||
</div>
|
</div>
|
||||||
<div class="pc-nav-item" @click="gotoList(6)">
|
<div class="pc-nav-item" @click="gotoList(6)">
|
||||||
<img :src="crrent==6?'/img/index/message1.png':'/img/index/message.png'" alt=""></img>
|
<img :src="crrent == 6 ? '/img/index/message1.png' : '/img/index/message.png'" alt=""></img>
|
||||||
<span :class="['span',{'active': crrent==6}]">信息公开</span>
|
<span :class="['span', { 'active': crrent == 6 }]">信息公开</span>
|
||||||
<img v-if="crrent==6" src="/img/index/arrow.png" alt="" style="width: 9px;height: 12px;margin-left: 10px;">
|
<img v-if="crrent == 6" src="/img/index/arrow.png" alt=""
|
||||||
|
style="width: 9px;height: 12px;margin-left: 10px;">
|
||||||
</div>
|
</div>
|
||||||
<div class="pc-nav-item" @click="gotoList(7)">
|
<div class="pc-nav-item" @click="gotoList(7)">
|
||||||
<img :src="crrent==7?'/img/index/tt1.png':'/img/index/tt.png'" alt=""></img>
|
<img :src="crrent == 7 ? '/img/index/tt1.png' : '/img/index/tt.png'" alt=""></img>
|
||||||
<span :class="['span',{'active': crrent==7}]">团团留言板</span>
|
<span :class="['span', { 'active': crrent == 7 }]">团团留言板</span>
|
||||||
<img v-if="crrent==7" src="/img/index/arrow.png" alt="" style="width: 9px;height: 12px;margin-left: 10px;">
|
<img v-if="crrent == 7" src="/img/index/arrow.png" alt=""
|
||||||
|
style="width: 9px;height: 12px;margin-left: 10px;">
|
||||||
</div>
|
</div>
|
||||||
<!-- <div class="pc-nav-item" @click="gotoList(8)">
|
<!-- <div class="pc-nav-item" @click="gotoList(8)">
|
||||||
<img :src="crrent==8?'/img/index/gx1.png':'/img/index/gx.png'" alt=""></img>
|
<img :src="crrent==8?'/img/index/gx1.png':'/img/index/gx.png'" alt=""></img>
|
||||||
@ -49,38 +57,42 @@
|
|||||||
<div class="box_1" id='assist-open'>无障碍阅读</div>
|
<div class="box_1" id='assist-open'>无障碍阅读</div>
|
||||||
<!-- <div class="box_2" @click="openOldMode">{{ isOld ? '退出适老模式' : '进入适老模式' }}</div> -->
|
<!-- <div class="box_2" @click="openOldMode">{{ isOld ? '退出适老模式' : '进入适老模式' }}</div> -->
|
||||||
</div>
|
</div>
|
||||||
|
<div style="margin-top: 50px;margin-left: 35px;">
|
||||||
|
<iframe allowtransparency="true" frameborder="0" width="220" height="28" scrolling="no"
|
||||||
|
src="//tianqi.2345.com/plugin/widget/index.htm?s=3&z=1&t=0&v=0&d=1&bd=0&k=000000&f=ffffff<f=ffffff&htf=ffffff&q=0&e=0&a=0&c=57073&w=200&h=28&align=left"></iframe>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref,defineEmits,defineProps} from 'vue'
|
import { ref, defineEmits, defineProps } from 'vue'
|
||||||
import '@/assets/assist/assist-entry.js'
|
import '@/assets/assist/assist-entry.js'
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
crrentNum:Number,
|
crrentNum: Number,
|
||||||
isOld:Boolean
|
isOld: Boolean
|
||||||
});
|
});
|
||||||
const crrent = ref(0);
|
const crrent = ref(0);
|
||||||
const emit = defineEmits(['crrentTop'])
|
const emit = defineEmits(['crrentTop'])
|
||||||
const goBack = () => {
|
const goBack = () => {
|
||||||
if(router.currentRoute.value.path != '/' ){
|
if (router.currentRoute.value.path != '/') {
|
||||||
window.open(`/`, '_blank');
|
window.open(`/`, '_blank');
|
||||||
}
|
}
|
||||||
emit('crrentTop',0)
|
emit('crrentTop', 0)
|
||||||
}
|
}
|
||||||
|
|
||||||
const openOldMode = () => {
|
const openOldMode = () => {
|
||||||
emit('openOldMode')
|
emit('openOldMode')
|
||||||
}
|
}
|
||||||
|
|
||||||
const gotoList = (index:number) => {
|
const gotoList = (index: number) => {
|
||||||
console.log(router.currentRoute);
|
console.log(router.currentRoute);
|
||||||
if(router.currentRoute.value.path != '/' ){
|
if (router.currentRoute.value.path != '/') {
|
||||||
window.open(`/`, '_blank');
|
window.open(`/`, '_blank');
|
||||||
localStorage.setItem('index_detail',index)
|
localStorage.setItem('index_detail', index)
|
||||||
}
|
}
|
||||||
crrent.value = index
|
crrent.value = index
|
||||||
emit('crrentTop',index)
|
emit('crrentTop', index)
|
||||||
|
|
||||||
}
|
}
|
||||||
//更新当前索引值
|
//更新当前索引值
|
||||||
@ -92,62 +104,44 @@ onMounted(() => {
|
|||||||
crrent.value = props.crrentNum;
|
crrent.value = props.crrentNum;
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import '@/assets/index.scss';
|
@import '@/assets/index.scss';
|
||||||
.bgimg{
|
|
||||||
|
.pc-nav {
|
||||||
|
margin-left: 60px;
|
||||||
|
margin-top: 80px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bgimg {
|
||||||
width: 350px;
|
width: 350px;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
background-image: url('/img/index/leftHead.png');
|
background-image: url('/img/index/leftHead.png');
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
.pc-nav {
|
|
||||||
margin-left: 60px;
|
.line_h {
|
||||||
margin-top: 115px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.pc-nav-item {
|
|
||||||
width: 100%;
|
|
||||||
// height: 18px;
|
|
||||||
font-family: Microsoft YaHei UI;
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 18px;
|
|
||||||
color: #FFFFFF;
|
|
||||||
text-shadow: 0px 1px 0px rgba(0,0,64,0.4);
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 25px;
|
|
||||||
&:hover{
|
|
||||||
cursor: pointer;
|
|
||||||
color: #FFA234;
|
|
||||||
}
|
|
||||||
.span{
|
|
||||||
margin-left: 20px;
|
|
||||||
&.active{
|
|
||||||
color: #FFA234;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.line_h{
|
|
||||||
width: 220px;
|
width: 220px;
|
||||||
height: 1px;
|
height: 1px;
|
||||||
background: #FFFFFF;
|
background: #FFFFFF;
|
||||||
opacity: 0.2;
|
opacity: 0.2;
|
||||||
margin-left: 40px;
|
margin-left: 40px;
|
||||||
}
|
}
|
||||||
.goback{
|
|
||||||
|
.goback {
|
||||||
width: 72px;
|
width: 72px;
|
||||||
height: 17px;
|
height: 17px;
|
||||||
font-family: Microsoft YaHei UI;
|
font-family: Microsoft YaHei UI;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
color: #FFFFFF;
|
color: #FFFFFF;
|
||||||
margin-left:114px ;
|
margin-left: 114px;
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
.box_1{
|
|
||||||
|
.box_1 {
|
||||||
width: 200px;
|
width: 200px;
|
||||||
height: 58px;
|
height: 58px;
|
||||||
line-height: 58px;
|
line-height: 58px;
|
||||||
@ -159,7 +153,8 @@ onMounted(() => {
|
|||||||
color: #FFFFFF;
|
color: #FFFFFF;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
.box_2{
|
|
||||||
|
.box_2 {
|
||||||
width: 200px;
|
width: 200px;
|
||||||
height: 58px;
|
height: 58px;
|
||||||
line-height: 58px;
|
line-height: 58px;
|
||||||
@ -172,7 +167,43 @@ onMounted(() => {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pc-nav-item {
|
||||||
|
width: 100%;
|
||||||
|
// height: 18px;
|
||||||
|
font-family: Microsoft YaHei UI;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
text-shadow: 0px 1px 0px rgba(0, 0, 64, 0.4);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
cursor: pointer;
|
||||||
|
color: #FFA234;
|
||||||
|
}
|
||||||
|
|
||||||
|
.span {
|
||||||
|
margin-left: 20px;
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
color: #FFA234;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 768px) {}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1280px) {
|
||||||
|
.pc-nav-item {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pc-nav {
|
||||||
|
margin-top: 60px;
|
||||||
}
|
}
|
||||||
@media screen and (max-width: 768px) {
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
@ -7,8 +7,10 @@
|
|||||||
<div class="rightcon" id="homeid" @scroll="hmScroll">
|
<div class="rightcon" id="homeid" @scroll="hmScroll">
|
||||||
<div class="flex top_search ">
|
<div class="flex top_search ">
|
||||||
<div style="width: 350px;">
|
<div style="width: 350px;">
|
||||||
<img @click="toMore(0)" :src="`/img/index/dlogo.png`" style="cursor: pointer;;width: 100%;height: 100%;object-fit: cover;">
|
<img @click="toMore(0)" :src="`/img/index/dlogo.png`"
|
||||||
|
style="cursor: pointer;;width: 100%;height: 100%;object-fit: cover;">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="inputform">
|
<div class="inputform">
|
||||||
<input v-model="inputSearch" class="contactInput w-full md:w-[337px]" type="text"
|
<input v-model="inputSearch" class="contactInput w-full md:w-[337px]" type="text"
|
||||||
placeholder="请输入搜索关键字" />
|
placeholder="请输入搜索关键字" />
|
||||||
@ -64,14 +66,15 @@
|
|||||||
<div style="width: 65%;background-color: #ffffff;">
|
<div style="width: 65%;background-color: #ffffff;">
|
||||||
<div class="no-wrap"
|
<div class="no-wrap"
|
||||||
style="padding: 15px;display: flex;justify-content: space-between;align-items: center;">
|
style="padding: 15px;display: flex;justify-content: space-between;align-items: center;">
|
||||||
<div style="display: flex;align-items: center;gap: 55px;">
|
<div class="dddccc">
|
||||||
<div v-for="(item, index) in listType" :key="index"
|
<div v-for="(item, index) in listType" :key="index"
|
||||||
:class="listIndex == item.id ? 't2' : 't1'" @click="changeListIndex(item.id)">
|
:class="listIndex == item.id ? 't2' : 't1'" @click="changeListIndex(item.id)">
|
||||||
<div>{{ item.name }}</div>
|
<div>{{ item.name }}</div>
|
||||||
<div v-if="listIndex == item.id" class="t_line"></div>
|
<div v-if="listIndex == item.id" class="t_line"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="pr-[20px]" @click="toMore(3)" style="display: flex;align-items: center;cursor: pointer;">
|
<div class="pr-[20px]" @click="toMore(3)"
|
||||||
|
style="display: flex;align-items: center;cursor: pointer;">
|
||||||
<span style="color: #999999;">更多</span>
|
<span style="color: #999999;">更多</span>
|
||||||
<img src="/img/index/more_j.png" alt=""
|
<img src="/img/index/more_j.png" alt=""
|
||||||
style="width: 8px;height: 13px;margin-left: 5px;"></img>
|
style="width: 8px;height: 13px;margin-left: 5px;"></img>
|
||||||
@ -104,7 +107,8 @@
|
|||||||
通知公告
|
通知公告
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="pr-[20px]" @click="toMore(3)" style="display: flex;align-items: center;cursor: pointer;">
|
<div class="pr-[20px]" @click="toMore(3)"
|
||||||
|
style="display: flex;align-items: center;cursor: pointer;">
|
||||||
<span style="color: #999999;">更多</span>
|
<span style="color: #999999;">更多</span>
|
||||||
<img src="/img/index/more_j.png" alt=""
|
<img src="/img/index/more_j.png" alt=""
|
||||||
style="width: 8px;height: 13px;margin-left: 5px;"></img>
|
style="width: 8px;height: 13px;margin-left: 5px;"></img>
|
||||||
@ -327,31 +331,20 @@ const toSearch = () => {
|
|||||||
window.open(`/search_info?type=1&keywords=${inputSearch.value}`)
|
window.open(`/search_info?type=1&keywords=${inputSearch.value}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
const openWeb = (item) =>{
|
const openWeb = (item) => {
|
||||||
//out 外链 in内部
|
//out 外链 in内部
|
||||||
if(item.type=='out'){
|
if (item.type == 'out') {
|
||||||
window.open(item.url);
|
window.open(item.url);
|
||||||
}else{
|
} else {
|
||||||
window.open(`/info/${item.url}?type=1`)
|
window.open(`/info/${item.url}?type=1`)
|
||||||
}
|
}
|
||||||
console.log(item)
|
console.log(item)
|
||||||
}
|
}
|
||||||
|
|
||||||
// 查看更多
|
// 查看更多
|
||||||
const toMore = (index:number) => {
|
const toMore = (index: number) => {
|
||||||
emit('toSwpe', index);
|
emit('toSwpe', index);
|
||||||
}
|
}
|
||||||
const bstList = ref([
|
|
||||||
{ title: "中国共产主义青年团的性质是什么?", id: 5969 },
|
|
||||||
{ title: "中国共产主义青年团的行动指南是什么?", id: 5970 },
|
|
||||||
{ title: "为什么说共青团是中国共产党的助手和后备军?", id: 5971 },
|
|
||||||
{ title: "中国共产主义青年团在新时代的基本任务是什么?", id: 5972 },
|
|
||||||
{ title: "怎样加入中国共产主义青年团?", id: 5973 },
|
|
||||||
{ title: "团员必须履行哪些义务?", id: 5974 },
|
|
||||||
{ title: "团员享有哪些权利?", id: 5975 },
|
|
||||||
{ title: "团旗、团徽和团歌分别是什么?", id: 5976 }
|
|
||||||
])
|
|
||||||
|
|
||||||
const openUrl = (id: number) => {
|
const openUrl = (id: number) => {
|
||||||
window.open(`/info/${id}?type=1`)
|
window.open(`/info/${id}?type=1`)
|
||||||
}
|
}
|
||||||
@ -390,7 +383,7 @@ const getNewstypeList = async () => {
|
|||||||
listIndex.value = list[0].id;
|
listIndex.value = list[0].id;
|
||||||
listType.value = list;
|
listType.value = list;
|
||||||
list.map((item: any) => {
|
list.map((item: any) => {
|
||||||
if (item.name == '平台公告') {
|
if (item.name == '通知公告') {
|
||||||
ptggid = item.id;
|
ptggid = item.id;
|
||||||
}
|
}
|
||||||
// if (item.name == '基层动态') {
|
// if (item.name == '基层动态') {
|
||||||
@ -503,6 +496,7 @@ const changeListIndex = async (id: number) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.top_search {
|
.top_search {
|
||||||
|
margin: 0 auto;
|
||||||
width: 1200px;
|
width: 1200px;
|
||||||
margin-left: 400px;
|
margin-left: 400px;
|
||||||
margin-top: 50px;
|
margin-top: 50px;
|
||||||
@ -781,6 +775,7 @@ const changeListIndex = async (id: number) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.t1 {
|
.t1 {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
font-family: PingFang SC;
|
font-family: PingFang SC;
|
||||||
@ -830,21 +825,14 @@ const changeListIndex = async (id: number) => {
|
|||||||
width: 400px;
|
width: 400px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.dddccc {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 55px;
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 1440px) {
|
@media (max-width: 1440px) {
|
||||||
|
|
||||||
.home_con2,
|
|
||||||
.home_con1,
|
|
||||||
.home_con {
|
|
||||||
width: 920px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.top_search {
|
|
||||||
width: 920px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.fly1s {
|
|
||||||
width: 900px;
|
|
||||||
}
|
|
||||||
.tz-span {
|
.tz-span {
|
||||||
width: 180px;
|
width: 180px;
|
||||||
}
|
}
|
||||||
@ -864,5 +852,66 @@ const changeListIndex = async (id: number) => {
|
|||||||
.lx-span {
|
.lx-span {
|
||||||
width: 310px;
|
width: 310px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.dddccc {
|
||||||
|
gap: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.top_search {
|
||||||
|
width: 920px;
|
||||||
|
margin-left: 380px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home_con {
|
||||||
|
width: 920px;
|
||||||
|
margin-left: 380px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home_con1 {
|
||||||
|
width: 920px;
|
||||||
|
margin-left: 380px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1280px) {
|
||||||
|
.top_search {
|
||||||
|
width: 800px;
|
||||||
|
margin-left: 357px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home_con {
|
||||||
|
width: 800px;
|
||||||
|
margin-left: 357px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home_con1 {
|
||||||
|
width: 800px;
|
||||||
|
margin-left: 357px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.t1 {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.t2 {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dddccc {
|
||||||
|
gap: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lx-span {
|
||||||
|
width: 265px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jc-span {
|
||||||
|
width: 375px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tz-span {
|
||||||
|
width: 153px;
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -8,7 +8,8 @@
|
|||||||
<div class="rightcon" id="luoyangid" @scroll="hmScroll">
|
<div class="rightcon" id="luoyangid" @scroll="hmScroll">
|
||||||
<div class="flex top_search ">
|
<div class="flex top_search ">
|
||||||
<div style="width: 350px;">
|
<div style="width: 350px;">
|
||||||
<img @click="toMore(0)" :src="`/img/index/dlogo.png`" style="cursor: pointer;;width: 100%;height: 100%;object-fit: cover;">
|
<img @click="toMore(0)" :src="`/img/index/dlogo.png`"
|
||||||
|
style="cursor: pointer;;width: 100%;height: 100%;object-fit: cover;">
|
||||||
</div>
|
</div>
|
||||||
<div class="inputform">
|
<div class="inputform">
|
||||||
<input v-model="inputSearch" class="contactInput w-full md:w-[337px]" type="text"
|
<input v-model="inputSearch" class="contactInput w-full md:w-[337px]" type="text"
|
||||||
@ -20,7 +21,7 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="News_box">
|
<div class="News_box">
|
||||||
<div class="lef_box" style="margin-top: 50px;">
|
<div class="lef_box">
|
||||||
<div>
|
<div>
|
||||||
<img src="/img/luoyang.png" style="width: 100%;">
|
<img src="/img/luoyang.png" style="width: 100%;">
|
||||||
</div>
|
</div>
|
||||||
@ -40,11 +41,11 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px;">
|
<div style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px;">
|
||||||
<div v-for="item in MesList" class="ly_list" @mousemove="showCodeDo(item)" @mouseleave="showCodeDo(0)"
|
<div v-for="item in MesList" class="ly_list" @mousemove="showCodeDo(item)"
|
||||||
@click="showCodeDo(item)">
|
@mouseleave="showCodeDo(0)" @click="showCodeDo(item)">
|
||||||
<div>
|
<div>
|
||||||
<img class="ly_list_img" :src="item.image">
|
<img class="ly_list_img" :src="item.image">
|
||||||
<div class="ly_list_text">{{item.title }}</div>
|
<div class="ly_list_text">{{ item.title }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="showCode == item"
|
<div v-if="showCode == item"
|
||||||
style="display: flex;justify-content: center;align-items: center;position: absolute;bottom: 0;left: 0;right: 0;width: 100%;height:100%;background: rgba(0,0,0,0.5);">
|
style="display: flex;justify-content: center;align-items: center;position: absolute;bottom: 0;left: 0;right: 0;width: 100%;height:100%;background: rgba(0,0,0,0.5);">
|
||||||
@ -118,7 +119,7 @@ const hmScroll = () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
const emit = defineEmits(['toSwpe'])
|
const emit = defineEmits(['toSwpe'])
|
||||||
const toMore = (index:number) => {
|
const toMore = (index: number) => {
|
||||||
emit('toSwpe', index);
|
emit('toSwpe', index);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -139,7 +140,7 @@ const getMesList = async (id: number) => {
|
|||||||
{
|
{
|
||||||
cate_id: cateid.value,
|
cate_id: cateid.value,
|
||||||
page: page.value,
|
page: page.value,
|
||||||
limit:9
|
limit: 9
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
total.value = res.data.data.count;
|
total.value = res.data.data.count;
|
||||||
@ -173,6 +174,7 @@ const getNewstypeList = async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.top_search {
|
.top_search {
|
||||||
|
margin: 0 auto;
|
||||||
margin-top: 50px;
|
margin-top: 50px;
|
||||||
height: 70px;
|
height: 70px;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
@ -219,13 +221,12 @@ const getNewstypeList = async () => {
|
|||||||
.News_box {
|
.News_box {
|
||||||
width: 1300px;
|
width: 1300px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
.lef_box {
|
.lef_box {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
margin-top: 40px;
|
margin-top: 40px;
|
||||||
margin-left: 100px;
|
margin-left: 100px;
|
||||||
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.le1 {
|
.le1 {
|
||||||
@ -295,7 +296,8 @@ const getNewstypeList = async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.pages_tsw {
|
.pages_tsw {
|
||||||
padding:30px 0px 0px 270px;
|
padding: 30px 0px 0px 270px;
|
||||||
|
|
||||||
:deep(.n-pagination .n-pagination-item:not(.n-pagination-item--disabled).n-pagination-item--active) {
|
:deep(.n-pagination .n-pagination-item:not(.n-pagination-item--disabled).n-pagination-item--active) {
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
background-color: #388FDF;
|
background-color: #388FDF;
|
||||||
@ -330,6 +332,7 @@ const getNewstypeList = async () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 1440px) {
|
@media (max-width: 1440px) {
|
||||||
.top_search {
|
.top_search {
|
||||||
width: 920px;
|
width: 920px;
|
||||||
@ -347,8 +350,8 @@ const getNewstypeList = async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.ly_list {
|
.ly_list {
|
||||||
width: 208px;
|
width: 209px;
|
||||||
height: 208px;
|
height: 209px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ly_list_img {
|
.ly_list_img {
|
||||||
@ -367,4 +370,38 @@ const getNewstypeList = async () => {
|
|||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1280px) {
|
||||||
|
.top_search {
|
||||||
|
width: 800px;
|
||||||
|
margin-left: 357px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.News_box {
|
||||||
|
width: 900px;
|
||||||
|
margin-left: 250px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ly_list {
|
||||||
|
width: 165px;
|
||||||
|
height: 165px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ly_list_img {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ly_list_img_act {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ly_list_text {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -37,7 +37,7 @@
|
|||||||
@click="openUrl(item.id)">
|
@click="openUrl(item.id)">
|
||||||
<div class="re_title">
|
<div class="re_title">
|
||||||
<div class="dian"></div>
|
<div class="dian"></div>
|
||||||
<span class="one-line-ellipsis">{{ item.title }}</span>
|
<span class="one-line-ellipsis d_span">{{ item.title }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="re_date">
|
<div class="re_date">
|
||||||
<div class="shu"></div>
|
<div class="shu"></div>
|
||||||
@ -180,6 +180,7 @@ const getNewstypeList = async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.top_search {
|
.top_search {
|
||||||
|
margin: 0 auto;
|
||||||
margin-top: 50px;
|
margin-top: 50px;
|
||||||
height: 70px;
|
height: 70px;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
@ -228,7 +229,7 @@ const getNewstypeList = async () => {
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
width: 1300px;
|
width: 1300px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
gap: 20px;
|
||||||
.lef_box {
|
.lef_box {
|
||||||
width: 260px;
|
width: 260px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
@ -445,5 +446,28 @@ const getNewstypeList = async () => {
|
|||||||
.rig_box {
|
.rig_box {
|
||||||
width: 650px !important;
|
width: 650px !important;
|
||||||
}
|
}
|
||||||
|
.d_span{
|
||||||
|
width: 468px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (max-width: 1280px) {
|
||||||
|
.top_search {
|
||||||
|
width: 800px;
|
||||||
|
margin-left: 357px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.News_box {
|
||||||
|
width: 900px;
|
||||||
|
margin-left: 260px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.rig_box {
|
||||||
|
width: 650px !important;
|
||||||
|
}
|
||||||
|
.d_span{
|
||||||
|
width: 328px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -37,7 +37,7 @@
|
|||||||
@click="openUrl(item.id)">
|
@click="openUrl(item.id)">
|
||||||
<div class="re_title">
|
<div class="re_title">
|
||||||
<div class="dian"></div>
|
<div class="dian"></div>
|
||||||
<span class="one-line-ellipsis">{{ item.title }}</span>
|
<span class="one-line-ellipsis d_span">{{ item.title }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="re_date">
|
<div class="re_date">
|
||||||
<div class="shu"></div>
|
<div class="shu"></div>
|
||||||
@ -181,6 +181,7 @@ const getNewstypeList = async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.top_search {
|
.top_search {
|
||||||
|
margin: 0 auto;
|
||||||
margin-top: 50px;
|
margin-top: 50px;
|
||||||
height: 70px;
|
height: 70px;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
@ -229,7 +230,7 @@ const getNewstypeList = async () => {
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
width: 1300px;
|
width: 1300px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
gap: 20px;
|
||||||
.lef_box {
|
.lef_box {
|
||||||
width: 260px;
|
width: 260px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
@ -446,5 +447,28 @@ const getNewstypeList = async () => {
|
|||||||
.rig_box {
|
.rig_box {
|
||||||
width: 650px !important;
|
width: 650px !important;
|
||||||
}
|
}
|
||||||
|
.d_span{
|
||||||
|
width: 468px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (max-width: 1280px) {
|
||||||
|
.top_search {
|
||||||
|
width: 800px;
|
||||||
|
margin-left: 357px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.News_box {
|
||||||
|
width: 900px;
|
||||||
|
margin-left: 260px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.rig_box {
|
||||||
|
width: 650px !important;
|
||||||
|
}
|
||||||
|
.d_span{
|
||||||
|
width: 328px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -6,7 +6,8 @@
|
|||||||
<div class="rightcon" id="regid" @scroll="hmScroll">
|
<div class="rightcon" id="regid" @scroll="hmScroll">
|
||||||
<div class="flex top_search ">
|
<div class="flex top_search ">
|
||||||
<div style="width: 350px;">
|
<div style="width: 350px;">
|
||||||
<img @click="toHome(0)" :src="`/img/index/dlogo.png`" style="cursor: pointer;;width: 100%;height: 100%;object-fit: cover;">
|
<img @click="toHome(0)" :src="`/img/index/dlogo.png`"
|
||||||
|
style="cursor: pointer;;width: 100%;height: 100%;object-fit: cover;">
|
||||||
</div>
|
</div>
|
||||||
<div class="inputform">
|
<div class="inputform">
|
||||||
<input v-model="inputSearch" class="contactInput w-full md:w-[337px]" type="text"
|
<input v-model="inputSearch" class="contactInput w-full md:w-[337px]" type="text"
|
||||||
@ -47,7 +48,8 @@
|
|||||||
热门百科
|
热门百科
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="pr-[5px]" @click="toMore()" style="display: flex;align-items: center;cursor: pointer;">
|
<div class="pr-[5px]" @click="toMore()"
|
||||||
|
style="display: flex;align-items: center;cursor: pointer;">
|
||||||
<span style="color: #999999;">更多</span>
|
<span style="color: #999999;">更多</span>
|
||||||
<img src="/img/index/more_j.png" alt=""
|
<img src="/img/index/more_j.png" alt=""
|
||||||
style="width: 8px;height: 13px;margin-left: 5px;"></img>
|
style="width: 8px;height: 13px;margin-left: 5px;"></img>
|
||||||
@ -61,10 +63,11 @@
|
|||||||
<div class="dian"></div>
|
<div class="dian"></div>
|
||||||
<span class="one-line-ellipsis rm-span">{{ item.title }}</span>
|
<span class="one-line-ellipsis rm-span">{{ item.title }}</span>
|
||||||
</div>
|
</div>
|
||||||
<span class="one-line-ellipsis" style="color: #999999;">{{ item.release_time_text.slice(5, 10) }}</span>
|
<span class="one-line-ellipsis" style="color: #999999;">{{
|
||||||
|
item.release_time_text.slice(5, 10) }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="index < MesList.length-1"
|
<div v-if="index < MesList.length - 1"
|
||||||
style="width: 95%;height: 1px;background-color: #EEEEEE;margin: 0 auto;"></div>
|
style="width: 95%;height: 1px;background-color: #EEEEEE;margin: 0 auto;"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -80,7 +83,8 @@
|
|||||||
国务院百事通
|
国务院百事通
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="pr-[20px]" @click="toMore()" style="display: flex;align-items: center;cursor: pointer;">
|
<div class="pr-[20px]" @click="toMore()"
|
||||||
|
style="display: flex;align-items: center;cursor: pointer;">
|
||||||
<span style="color: #999999;">更多</span>
|
<span style="color: #999999;">更多</span>
|
||||||
<img src="/img/index/more_j.png" alt=""
|
<img src="/img/index/more_j.png" alt=""
|
||||||
style="width: 8px;height: 13px;margin-left: 5px;"></img>
|
style="width: 8px;height: 13px;margin-left: 5px;"></img>
|
||||||
@ -92,11 +96,11 @@
|
|||||||
<div class="re_title">
|
<div class="re_title">
|
||||||
<div class="flex align-center">
|
<div class="flex align-center">
|
||||||
<div class="dian"></div>
|
<div class="dian"></div>
|
||||||
<span class="one-line-ellipsis gw-span">{{ item.title}}</span>
|
<span class="one-line-ellipsis gw-span">{{ item.title }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="index < YwList.length-1"
|
<div v-if="index < YwList.length - 1"
|
||||||
style="width: 95%;height: 1px;background-color: #EEEEEE;margin: 0 auto;"></div>
|
style="width: 95%;height: 1px;background-color: #EEEEEE;margin: 0 auto;"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -149,7 +153,7 @@ onMounted(() => {
|
|||||||
const hmScroll = () => {
|
const hmScroll = () => {
|
||||||
let home = document.getElementById('regid');
|
let home = document.getElementById('regid');
|
||||||
if (home.scrollTop + home.clientHeight >= home.scrollHeight) {
|
if (home.scrollTop + home.clientHeight >= home.scrollHeight) {
|
||||||
emit('toSwpe',6);
|
emit('toSwpe', 6);
|
||||||
}
|
}
|
||||||
if (home.scrollTop == 0) {
|
if (home.scrollTop == 0) {
|
||||||
emit('toSwpe', 4);
|
emit('toSwpe', 4);
|
||||||
@ -161,11 +165,11 @@ const getFwImg = async () => {
|
|||||||
const res = await $api.get('/api/index/images?page=1&limit=9&status=2')
|
const res = await $api.get('/api/index/images?page=1&limit=9&status=2')
|
||||||
fwImg.value = res.data.data.list;
|
fwImg.value = res.data.data.list;
|
||||||
}
|
}
|
||||||
const openWeb = (item) =>{
|
const openWeb = (item) => {
|
||||||
//out 外链 in内部
|
//out 外链 in内部
|
||||||
if(item.type=='out'){
|
if (item.type == 'out') {
|
||||||
window.open(item.url);
|
window.open(item.url);
|
||||||
}else{
|
} else {
|
||||||
window.open(`/info/${item.url}?type=1`)
|
window.open(`/info/${item.url}?type=1`)
|
||||||
}
|
}
|
||||||
console.log(item)
|
console.log(item)
|
||||||
@ -175,7 +179,7 @@ const emit = defineEmits(['toSwpe'])
|
|||||||
const toMore = () => {
|
const toMore = () => {
|
||||||
window.open(`/messageBoard`)
|
window.open(`/messageBoard`)
|
||||||
}
|
}
|
||||||
const toHome = (index:number) => {
|
const toHome = (index: number) => {
|
||||||
emit('toSwpe', index);
|
emit('toSwpe', index);
|
||||||
}
|
}
|
||||||
//跳转详情
|
//跳转详情
|
||||||
@ -204,18 +208,18 @@ const toSearch = () => {
|
|||||||
const getMesList = async () => {
|
const getMesList = async () => {
|
||||||
const res = await $api.post('/api/home.encyclopedia/index',
|
const res = await $api.post('/api/home.encyclopedia/index',
|
||||||
{
|
{
|
||||||
cate_id:'102',
|
cate_id: '102',
|
||||||
limit: 7,
|
limit: 7,
|
||||||
page: 1,
|
page: 1,
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
MesList.value = res.data.data.list;
|
MesList.value = res.data.data.list;
|
||||||
}
|
}
|
||||||
const YwList =ref([]);
|
const YwList = ref([]);
|
||||||
const getYwList = async () => {
|
const getYwList = async () => {
|
||||||
const res = await $api.post('/api/home.encyclopedia/index',
|
const res = await $api.post('/api/home.encyclopedia/index',
|
||||||
{
|
{
|
||||||
cate_id:'103',
|
cate_id: '103',
|
||||||
limit: 7,
|
limit: 7,
|
||||||
page: 1,
|
page: 1,
|
||||||
}
|
}
|
||||||
@ -249,6 +253,7 @@ const getNewstypeList = async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.top_search {
|
.top_search {
|
||||||
|
margin: 0 auto;
|
||||||
margin-top: 50px;
|
margin-top: 50px;
|
||||||
height: 70px;
|
height: 70px;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
@ -396,9 +401,11 @@ const getNewstypeList = async () => {
|
|||||||
.rm-span {
|
.rm-span {
|
||||||
width: 550px;
|
width: 550px;
|
||||||
}
|
}
|
||||||
.gw-span{
|
|
||||||
|
.gw-span {
|
||||||
width: 350px;
|
width: 350px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 1440px) {
|
@media (max-width: 1440px) {
|
||||||
.top_search {
|
.top_search {
|
||||||
width: 920px;
|
width: 920px;
|
||||||
@ -418,8 +425,33 @@ const getNewstypeList = async () => {
|
|||||||
.rm-span {
|
.rm-span {
|
||||||
width: 450px;
|
width: 450px;
|
||||||
}
|
}
|
||||||
.gw-span{
|
|
||||||
width:280px;
|
.gw-span {
|
||||||
|
width: 280px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@media (max-width: 1280px) {
|
||||||
|
.top_search {
|
||||||
|
width: 800px;
|
||||||
|
margin-left: 357px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.News_box {
|
||||||
|
width: 900px;
|
||||||
|
margin-left: 260px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rig_box {
|
||||||
|
width: 700px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rm-span {
|
||||||
|
width: 385px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gw-span {
|
||||||
|
width: 225px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -1,5 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div style="width: 100%;height: 100%;">
|
<div style="width: 100%;height: 100%;">
|
||||||
|
<img :src="`/img/index/logo.ong`" alt="LOGO" style="display: none;">
|
||||||
<!-- Swiper 容器 -->
|
<!-- Swiper 容器 -->
|
||||||
<div :class="['group_666', { 'isOldfont': isOldfont }]" style="position: relative;height: 100vh;">
|
<div :class="['group_666', { 'isOldfont': isOldfont }]" style="position: relative;height: 100vh;">
|
||||||
<AppHeader v-if="swiper_exp > 0" @crrentTop="toswiper" @openOldMode="openOldMode" :is-old="isOldfont"
|
<AppHeader v-if="swiper_exp > 0" @crrentTop="toswiper" @openOldMode="openOldMode" :is-old="isOldfont"
|
||||||
@ -251,18 +252,17 @@ const router = useRouter()
|
|||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
|
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
|
||||||
|
|
||||||
if (coMobile) {
|
// if (coMobile) {
|
||||||
// window.location.href="/web/phone_index/";
|
// router.push('/phone_index/')
|
||||||
router.push('/phone_index/')
|
// } else {
|
||||||
} else {
|
// router.push('/')
|
||||||
router.push('/')
|
// }
|
||||||
}
|
// let indexs_to = localStorage.getItem('index_detail')
|
||||||
let indexs_to = localStorage.getItem('index_detail')
|
// if (indexs_to) {
|
||||||
if (indexs_to) {
|
// toswiper(Number(indexs_to));
|
||||||
toswiper(Number(indexs_to));
|
// swiper_exp.value = Number(indexs_to);
|
||||||
swiper_exp.value = Number(indexs_to);
|
// localStorage.removeItem('index_detail')
|
||||||
localStorage.removeItem('index_detail')
|
// }
|
||||||
}
|
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
// 初始化 ScrollReveal
|
// 初始化 ScrollReveal
|
||||||
// setTimeout(() => {
|
// setTimeout(() => {
|
||||||
|
|||||||
@ -114,7 +114,7 @@
|
|||||||
<p class="p2 flex justify-between items-center">
|
<p class="p2 flex justify-between items-center">
|
||||||
<span>{{ item.source }}</span>
|
<span>{{ item.source }}</span>
|
||||||
<span class="flex items-center">
|
<span class="flex items-center">
|
||||||
<img src="/img/views.png" alt="" style="padding-right: 10px;">
|
<img src="/img/views.png" alt="" style="height: 13px;padding-right: 10px;">
|
||||||
{{ item.views }}
|
{{ item.views }}
|
||||||
</span>
|
</span>
|
||||||
</p>
|
</p>
|
||||||
@ -560,4 +560,32 @@ onMounted(() => {
|
|||||||
right: 138px!important;
|
right: 138px!important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media (max-width: 1280px) {
|
||||||
|
.top_search {
|
||||||
|
width: 800px;
|
||||||
|
margin-left: 357px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.News_box {
|
||||||
|
width: 900px;
|
||||||
|
margin-left: 260px;
|
||||||
|
}
|
||||||
|
.rig_box{
|
||||||
|
width: 340px!important;
|
||||||
|
}
|
||||||
|
.lef_box{
|
||||||
|
width: 505px!important;
|
||||||
|
}
|
||||||
|
.topding {
|
||||||
|
right: 120px!important;
|
||||||
|
}
|
||||||
|
:deep(.n-tabs-tab-wrapper){
|
||||||
|
width: 170px!important;
|
||||||
|
}
|
||||||
|
.top_bar {
|
||||||
|
margin: 0px;
|
||||||
|
width: 900px;
|
||||||
|
margin-left: 260px;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -282,8 +282,8 @@ const getNewstypeList = async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
background: linear-gradient(0deg, rgba(51, 140, 222, 0.12) 0%, rgba(61, 146, 224, 0.12) 100%);
|
background: #388FDF;
|
||||||
color: #3A91DF;
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -451,4 +451,25 @@ const getNewstypeList = async () => {
|
|||||||
margin-left: 270px;
|
margin-left: 270px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media (max-width: 1280px) {
|
||||||
|
.top_search {
|
||||||
|
width: 800px;
|
||||||
|
margin-left: 357px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.News_box {
|
||||||
|
width: 900px;
|
||||||
|
margin-left: 260px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rig_box {
|
||||||
|
width: 520px !important;
|
||||||
|
}
|
||||||
|
.top_bar {
|
||||||
|
margin: 0px;
|
||||||
|
width: 900px;
|
||||||
|
margin-left: 260px;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -52,7 +52,7 @@
|
|||||||
<p class="p2 flex justify-between items-center">
|
<p class="p2 flex justify-between items-center">
|
||||||
<span>{{ item.source }}</span>
|
<span>{{ item.source }}</span>
|
||||||
<span class="flex items-center">
|
<span class="flex items-center">
|
||||||
<img src="/img/views.png" alt="" style="padding-right: 10px;">
|
<img src="/img/views.png" alt="" style="height: 13px;padding-right: 10px;">
|
||||||
{{ item.views }}
|
{{ item.views }}
|
||||||
</span>
|
</span>
|
||||||
</p>
|
</p>
|
||||||
@ -73,7 +73,7 @@
|
|||||||
<p class="p2 flex justify-between items-center">
|
<p class="p2 flex justify-between items-center">
|
||||||
<span>{{ item.source }}</span>
|
<span>{{ item.source }}</span>
|
||||||
<span class="flex items-center">
|
<span class="flex items-center">
|
||||||
<img src="/img/views.png" alt="" style="padding-right: 10px;">
|
<img src="/img/views.png" alt="" style="height: 13px;padding-right: 10px;">
|
||||||
{{ item.views }}
|
{{ item.views }}
|
||||||
</span>
|
</span>
|
||||||
</p>
|
</p>
|
||||||
@ -465,4 +465,21 @@ onMounted(() => {
|
|||||||
width: 700px;
|
width: 700px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media (max-width: 1280px) {
|
||||||
|
.top_search {
|
||||||
|
width: 800px;
|
||||||
|
margin-left: 357px;
|
||||||
|
|
||||||
|
}
|
||||||
|
.News_box{
|
||||||
|
width: 900px;
|
||||||
|
margin-left: 260px;
|
||||||
|
}
|
||||||
|
.rig_box{
|
||||||
|
width: 340px!important;
|
||||||
|
}
|
||||||
|
:deep(.n-tabs-tab-wrapper){
|
||||||
|
width: 170px!important;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Binary file not shown.
|
Before Width: | Height: | Size: 37 KiB After Width: | Height: | Size: 30 KiB |
BIN
public/img/index/logo.png
Normal file
BIN
public/img/index/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 161 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.5 KiB After Width: | Height: | Size: 1.5 KiB |
Loading…
x
Reference in New Issue
Block a user