11.10门户前端修改

master
JayChou 2 weeks ago
parent 8a24ea2496
commit 3885b0326a
  1. 1
      jeecgboot-vue3/src/App.vue
  2. BIN
      jeecgboot-vue3/src/assets/images/bg.jpg
  3. 11
      jeecgboot-vue3/src/router/guard/permissionGuard.ts
  4. 32
      jeecgboot-vue3/src/views/demo/main-home/components/NewsList/index.vue
  5. 32
      jeecgboot-vue3/src/views/demo/main-home/components/expertManagement/index.vue
  6. 42
      jeecgboot-vue3/src/views/demo/main-home/components/homePage/index.vue
  7. 163
      jeecgboot-vue3/src/views/demo/main-home/components/instrumentInfo/index.vue
  8. 2
      jeecgboot-vue3/src/views/demo/main-home/components/newsInfo/index.vue
  9. 2
      jeecgboot-vue3/src/views/demo/main-home/components/projectDeclaration/index.vue
  10. 23
      jeecgboot-vue3/src/views/demo/main-home/index.vue

@ -7,6 +7,7 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { watch, ref } from 'vue'; import { watch, ref } from 'vue';
import { theme } from 'ant-design-vue'; import { theme } from 'ant-design-vue';
import { ConfigProvider } from 'ant-design-vue'; import { ConfigProvider } from 'ant-design-vue';

Binary file not shown.

After

Width:  |  Height:  |  Size: 47 KiB

@ -44,15 +44,18 @@ export function createPermissionGuard(router: Router) {
const settingStore = useSettingStore(); const settingStore = useSettingStore();
const routerList = mainOutRoutes[1].children?.filter((item) => !item.meta?.hidden); const routerList = mainOutRoutes[1].children?.filter((item) => !item.meta?.hidden);
let index = routerList.findIndex((item) => item.path === to.path); let index = routerList.findIndex((item) => item.path === to.path);
if(index === -1) { if (to.path === '/main-home/instrumentInfo') {
index = 4 index = 1;
console.log(index); console.log(index);
settingStore.serIndex(index); settingStore.serIndex(index);
}else{ } else if (to.path === '/main-home/newsInfo') {
index = 4;
console.log(index);
settingStore.serIndex(index);
} else {
console.log(index); console.log(index);
settingStore.serIndex(index); settingStore.serIndex(index);
} }
} }
if ( if (
// #6861 // #6861

@ -21,7 +21,7 @@
<div class="title">栏目列表</div> <div class="title">栏目列表</div>
<div class="list"> <div class="list">
<div class="item" @click="getindexallarticleEvent">全部</div> <div class="item" @click="getindexallarticleEvent">全部</div>
<div class="item" v-for="i in newColumnList" :key="i.id" @click="getMyNewsList(i)">{{ i.name }}</div> <div :class="columnId === i.id ? 'item active' : 'item'" v-for="i in newColumnList" :key="i.id" @click="getMyNewsList(i)">{{ i.name }}</div>
<!-- <div class="item">项目申报</div> <!-- <div class="item">项目申报</div>
<div class="item">新闻列表</div> --> <div class="item">新闻列表</div> -->
</div> </div>
@ -34,8 +34,8 @@
import { getindexcolumn, getindexarticle, getindexallarticle } from '@/api/mainHome'; import { getindexcolumn, getindexarticle, getindexallarticle } from '@/api/mainHome';
import { ref } from 'vue'; import { ref } from 'vue';
import { useRouter } from 'vue-router'; import { useRouter, useRoute } from 'vue-router';
const route = useRoute();
const router = useRouter(); const router = useRouter();
const current = ref(1); const current = ref(1);
const total = ref(0); const total = ref(0);
@ -43,14 +43,24 @@
pageSize: 10, pageSize: 10,
pageNo: 1, pageNo: 1,
}); });
console.log(route.query, 'route.query');
const columnId = ref('');
const newColumnList = ref([]); const newColumnList = ref([]);
const getindexcolumnEvent = async () => { const getindexcolumnEvent = async () => {
const res = await getindexcolumn(); const res = await getindexcolumn();
console.log(res); console.log(res);
newColumnList.value = res; newColumnList.value = res;
if (Object.keys(route.query).length) {
getindexarticleEvent(route.query.id);
columnId.value = route.query.id;
} else {
console.log(1111);
getindexallarticleEvent();
}
}; };
getindexcolumnEvent(); getindexcolumnEvent();
const getMyNewsList = (item) => { const getMyNewsList = (item) => {
console.log(item); console.log(item);
getindexarticleEvent(item.id); getindexarticleEvent(item.id);
@ -63,7 +73,7 @@
newList.value = res.records; newList.value = res.records;
total.value = res.total; total.value = res.total;
}; };
const columnId = ref('');
const onChange = (page) => { const onChange = (page) => {
console.log(page); console.log(page);
page.pageNo = page; page.pageNo = page;
@ -79,7 +89,6 @@
newList.value = res.records; newList.value = res.records;
total.value = res.total; total.value = res.total;
}; };
getindexallarticleEvent();
// //
const onGetInfo = (item) => { const onGetInfo = (item) => {
@ -89,8 +98,8 @@
query: { query: {
id: item.id, id: item.id,
}, },
}) });
} };
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
@ -192,10 +201,11 @@
border-bottom: 1px solid #d9d9d9; border-bottom: 1px solid #d9d9d9;
cursor: pointer; cursor: pointer;
} }
.item:hover { .active{
color: #002e97; color: #002e97;
} }
} }
} }
} }
.pagination { .pagination {

@ -7,7 +7,7 @@
</div> </div>
<div class="user-list"> <div class="user-list">
<div class="item" v-for="i in expertList" :key="i.id"> <div class="item" v-for="i in expertList" :key="i.id">
<div class="avater"></div> <div class="avater"> <img style="width: 100%;height: 100%;" :src="setImageUrl(i.avatar)" alt="" /> </div>
<div class="name">{{ i.realname }}</div> <div class="name">{{ i.realname }}</div>
<div class="description">{{ i.expinfo || '暂无' }}</div> <div class="description">{{ i.expinfo || '暂无' }}</div>
</div> </div>
@ -19,7 +19,7 @@
<script setup> <script setup>
import { ref } from 'vue'; import { ref } from 'vue';
import { getindexexpert ,getindexexperttype} from '@/api/mainHome'; import { getindexexpert, getindexexperttype } from '@/api/mainHome';
import { Pagination } from 'ant-design-vue'; import { Pagination } from 'ant-design-vue';
const activeIndex = ref(0); const activeIndex = ref(0);
@ -31,15 +31,15 @@
const page = ref({ const page = ref({
pageSize: 8, pageSize: 8,
pageNo: 1, pageNo: 1,
directioncal:'' directioncal: '',
}); });
const getList = async () => { const getList = async () => {
const data = page.value const data = page.value;
for (const key in data) { for (const key in data) {
if (!data[key]) { if (!data[key]) {
delete data[key]; delete data[key];
}
} }
}
const res = await getindexexpert(data); const res = await getindexexpert(data);
expertList.value = res.records; expertList.value = res.records;
total.value = res.total; total.value = res.total;
@ -48,7 +48,7 @@
const onChange = (pageIndex) => { const onChange = (pageIndex) => {
console.log(pageIndex); console.log(pageIndex);
page.value.pageNo = pageIndex; page.value.pageNo = pageIndex;
getList() getList();
}; };
const typeList = ref([]); const typeList = ref([]);
const getTypeList = async () => { const getTypeList = async () => {
@ -59,15 +59,20 @@
getTypeList(); getTypeList();
const filterType = (id, index) => { const filterType = (id, index) => {
if(id === 0) { if (id === 0) {
page.value.directioncal = ''; page.value.directioncal = '';
getList(); getList();
return return;
} }
activeIndex.value = index; activeIndex.value = index;
page.value.directioncal = id; page.value.directioncal = id;
getList(); getList();
} };
const setImageUrl = (url) => {
if (url) {
return import.meta.env.VITE_GLOB_DOMAIN_URL + '/' + url;
}
};
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
@ -141,6 +146,7 @@
} }
.pagination { .pagination {
// background-color: #fff; // background-color: #fff;
margin-top: 20px;
height: 70px; height: 70px;
display: flex; display: flex;
justify-content: center; justify-content: center;

@ -37,6 +37,7 @@
<div class="rightt"> <div class="rightt">
<div class="tell"> <div class="tell">
<div class="fl">通知通告</div> <div class="fl">通知通告</div>
<div class="right" @click="router.push('/main-home/columnManagement')">更多</div>
</div> </div>
<div class="inner"> <div class="inner">
<ul> <ul>
@ -51,7 +52,8 @@
<div class="box4"> <div class="box4">
<div class="inner1"> <div class="inner1">
<div class="tell"> <div class="tell">
<div class="fl">新闻快讯</div> <div class="fl" @click="router.push('/main-home/newsList')">新闻快讯</div>
<div class="right">更多</div>
</div> </div>
<div class="inner"> <div class="inner">
<ul> <ul>
@ -61,7 +63,8 @@
</div> </div>
<div class="inner2"> <div class="inner2">
<div class="tell"> <div class="tell">
<div class="fl">工作动态</div> <div class="fl" @click="router.push('/main-home/articleManagement')">工作动态</div>
<div class="right">更多</div>
</div> </div>
<div class="inner"> <div class="inner">
<ul> <ul>
@ -111,13 +114,13 @@
</div> </div>
</div> </div>
<div class="share2"> <div class="share2">
<div class="a">科研仪器入网</div> <div class="a" @click="router.push('/')">科研仪器入网</div>
<div class="a">仪器信息查询</div> <div class="a" @click="router.push('/main-home/instrumentSharing')">仪器信息查询</div>
<div class="b"> <div class="b">
<div class="bb1">技术交流</div> <div class="bb1" @click="router.push('/main-home/newsList?id=' + columnId)">技术交流</div>
<div class="bb2">数据上报</div> <div class="bb2" @click="router.push('/')">数据上报</div>
</div> </div>
<div class="c">在线预约</div> <div class="c" @click="router.push('/instrument/InstrumentList')">在线预约</div>
</div> </div>
</div> </div>
</div> </div>
@ -126,7 +129,7 @@
<script setup> <script setup>
import { ref, reactive } from 'vue'; import { ref, reactive } from 'vue';
import { vue3ScrollSeamless } from 'vue3-scroll-seamless'; import { vue3ScrollSeamless } from 'vue3-scroll-seamless';
import { getindexnews, getindexnotice, getindexnewskx, getindexgzdt, getindexcomp } from '/@/api/mainHome'; import { getindexnews, getindexnotice, getindexnewskx, getindexgzdt, getindexcomp ,getindexcolumn} from '/@/api/mainHome';
import { useRoute, useRouter } from 'vue-router'; import { useRoute, useRouter } from 'vue-router';
import SvgIcon from '/@/components/Icon/src/SvgIcon.vue'; import SvgIcon from '/@/components/Icon/src/SvgIcon.vue';
import { LeftCircleOutlined, RightCircleOutlined } from '@ant-design/icons-vue'; import { LeftCircleOutlined, RightCircleOutlined } from '@ant-design/icons-vue';
@ -191,12 +194,20 @@
}; };
getcompList(); getcompList();
const setImageUrl = (url) => { const setImageUrl = (url) => {
if (url) { if (url) {
return import.meta.env.VITE_GLOB_DOMAIN_URL + '/' + url; return import.meta.env.VITE_GLOB_DOMAIN_URL + '/' + url;
} }
}; };
// id
const columnId = ref('');
const getindexcolumnEvent = async () => {
const res = await getindexcolumn();
columnId.value = res.find((item) => item.name === '技术交流').id;
console.log(columnId.value);
};
getindexcolumnEvent();
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
@ -279,6 +290,16 @@
width: 100%; width: 100%;
height: 50px; height: 50px;
background-color: #e9f3fd; background-color: #e9f3fd;
display: flex;
justify-content: space-between;
align-items: center;
padding-right: 20px;
.right{
cursor: pointer;
}
.right:hover{
color: #003cb9;
}
} }
.tell .fl { .tell .fl {
width: 120px; width: 120px;
@ -406,6 +427,9 @@
right: 0; right: 0;
width: 400px; width: 400px;
height: 370px; height: 370px;
div{
cursor: pointer;
}
} }
.a { .a {
width: 100%; width: 100%;

@ -44,59 +44,30 @@
<div class="box2">{{ info.notice || '暂无信息' }}</div> <div class="box2">{{ info.notice || '暂无信息' }}</div>
</div> </div>
<div class="btn"> <div class="btn">
<div class="btnTop"> <div class="news-list">
<h3>留言交流</h3> <div class="item" v-for="i in newList" :key="i">
<button>我要留言</button> <div class="left"
</div> ><div class="year">{{ i.publishTime.split('-')[0] }}-{{ i.publishTime.split('-')[1] }}</div
<div class="btnBtn"> ><div class="day">{{ i.publishTime.split(' ')[0].split('-')[2] }}</div></div
<div class="left"> >
<div class="box"> <div class="right">
<img width="90px" src="@/assets/images/mainHome/h.png" alt="" /> <div class="title">{{ i.title }}</div>
</div> <div class="editor">{{ i.source }}</div>
游客123456 <div class="description"><div v-html="i.info"></div></div>
</div> <div class="get-info" @click="onGetInfo(i)">查看详情</div>
<div class="right">
<p>什么时候仪器空闲</p>
<p>麻烦联系123456789谢谢</p>
<div class="time">发布时间2024.10.16&nbsp&nbsp17:26</div>
</div>
</div>
<div class="btnBtn">
<div class="left">
<div class="box">
<img width="90px" src="@/assets/images/mainHome/h.png" alt="" />
</div>
游客123456
</div>
<div class="right">
<p>什么时候仪器空闲</p>
<p>麻烦联系123456789谢谢</p>
<div class="time">发布时间2024.10.16&nbsp&nbsp17:26</div>
</div>
</div>
<div class="btnBtn">
<div class="left">
<div class="box">
<img width="90px" src="@/assets/images/mainHome/h.png" alt="" />
</div> </div>
游客123456
</div>
<div class="right">
<p>什么时候仪器空闲</p>
<p>麻烦联系123456789谢谢</p>
<div class="time">发布时间2024.10.16&nbsp&nbsp17:26</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script setup> <script setup>
import { getindexnew } from '@/api/mainHome/index'; import { getindexnew, getindexcolumn, getindexarticle } from '@/api/mainHome/index';
import { ref } from 'vue'; import { ref } from 'vue';
import { useRoute } from 'vue-router'; import { useRoute,useRouter } from 'vue-router';
import aredData from 'china-area-data'; import aredData from 'china-area-data';
const router = useRouter();
const route = useRoute(); const route = useRoute();
const info = ref({}); const info = ref({});
const cityName = ref(''); const cityName = ref('');
@ -104,11 +75,34 @@
const res = await getindexnew({ id: route.query.id }); const res = await getindexnew({ id: route.query.id });
info.value = res.records[0]; info.value = res.records[0];
// console.log(aredData ); // console.log(aredData );
console.log(aredData[86][info.value.address.substring(0, 2) + '0000'] ); console.log(aredData[86][info.value.address.substring(0, 2) + '0000']);
cityName.value = aredData[86][info.value.address.substring(0, 2) + '0000'] + aredData[info.value.address.substring(0, 4) + '00'][info.value.address]; cityName.value =
aredData[86][info.value.address.substring(0, 2) + '0000'] + aredData[info.value.address.substring(0, 4) + '00'][info.value.address];
}; };
getInfo(); getInfo();
const columnId = ref('');
const getindexcolumnEvent = async () => {
const res = await getindexcolumn();
console.log(res);
columnId.value = res.find((item) => item.name === '技术交流').id;
getindexarticleEvent();
};
getindexcolumnEvent();
const newList = ref([]);
const getindexarticleEvent = async () => {
const res = await getindexarticle({ columnId: columnId.value });
newList.value = res.records;
};
const onGetInfo = (item) => {
console.log(item);
router.push({
path: '/main-home/newsInfo',
query: {
id: item.id,
},
})
}
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.container { .container {
@ -191,7 +185,7 @@
.center { .center {
width: 100%; width: 100%;
height: 1050px; // height: 1050px;
background-color: #ffffff; background-color: #ffffff;
padding: 50px; padding: 50px;
border-top: #ebebeb 1px solid; border-top: #ebebeb 1px solid;
@ -210,7 +204,7 @@
} }
.btn { .btn {
height: 500px; // height: 500px;
padding: 20px 0px 10px 30px; padding: 20px 0px 10px 30px;
.btnTop { .btnTop {
@ -258,4 +252,75 @@
} }
} }
} }
.news-list {
position: relative;
width: calc(1200px - 415px);
margin-right: 30px;
min-height: 755px;
padding-bottom: 80px;
.item {
display: flex;
width: 100%;
border-bottom: 2px solid #ccc;
padding-bottom: 45px;
margin-top: 40px;
.left {
width: 100px;
height: 100px;
border: 1px solid #ccc;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.year {
font-size: 16px;
color: #333;
}
.day {
font-size: 40px;
font-weight: 600;
color: #333;
}
}
.right {
margin-left: 30px;
.title {
font-size: 22px;
color: #000;
font-weight: 600;
}
.editor {
position: relative;
font-size: 14px;
color: #999;
font-size: 14px;
margin-top: 10px;
}
.editor::before {
content: '';
display: block;
position: absolute;
width: 53px;
bottom: -15px;
height: 4px;
background-color: #d9d9d9;
}
.description {
margin-top: 30px;
width: 660px;
}
.get-info {
color: #fff;
width: 132px;
height: 40px;
text-align: center;
line-height: 40px;
margin-top: 30px;
background-color: #002e97;
cursor: pointer;
}
}
}
}
</style> </style>

@ -1,7 +1,7 @@
<template> <template>
<div class="container"> <div class="container">
<div class="news-list"> <div class="news-list">
<div style="display: flex; cursor: pointer;"><div @click="$router.push('/main-home/NewsList')">新闻列表</div>><div>新闻详情</div></div> <!-- <div style="display: flex; cursor: pointer;"><div @click="$router.push('/main-home/NewsList')">新闻列表</div>><div>新闻详情</div></div> -->
<div class="item"> <div class="item">
<div class="right"> <div class="right">
<div class="title">{{ info.title }}</div> <div class="title">{{ info.title }}</div>

@ -4,7 +4,7 @@
<div class="mainTop"> <div class="mainTop">
<div class="resultShow"> <div class="resultShow">
<div class="top"> <div class="top">
<div class="a">结果公示</div> <div class="a">项目咨询</div>
<div class="aa">更多</div> <div class="aa">更多</div>
</div> </div>
<div class="buttom"> <div class="buttom">

@ -12,16 +12,16 @@
</ul> </ul>
</div> </div>
<div class="fr"> <div class="fr">
<ul> <!-- <ul>
<li><a href="#">繁体</a></li> <li><a href="#">繁体</a></li>
<li><a href="#">简体</a></li> <li><a href="#">简体</a></li>
<li><a href="#" style="border: none">微信公众号</a></li> <li><a href="#" style="border: none">微信公众号</a></li>
</ul> </ul> -->
</div> </div>
</div> </div>
</div> </div>
<div class="header"> <div class="header">
<div class="inner"> <!-- <div class="inner">
<div class="fl"> <div class="fl">
<div class="box1"></div> <div class="box1"></div>
</div> </div>
@ -31,7 +31,8 @@
<button>搜索</button> <button>搜索</button>
</div> </div>
</div> </div>
</div> </div> -->
<img src="@/assets/images/bg.jpg" alt="">
</div> </div>
<div class="shortcut"> <div class="shortcut">
<div class="wrapper"> <div class="wrapper">
@ -72,14 +73,14 @@
</div> </div>
<div class="fr"> <div class="fr">
<h2> <h2>
主办河南省科学技术厅 承办:河南省科学器材供应中心 承办单位驻马店市科技信息研究所
<br /> <br />
地址河南省郑州市金水区政六街2号5楼 邮编450003 电话0371-65957129 邮箱hnisscn@163.com 地址河南省驻马店市泰山路广安大厦 主办单位驻马店市科技局
</h2> </h2>
<div class="aaa"> <div class="aaa">
<a href="">Copyright@2016</a> <a href="">邮箱zmdsti@sina.com</a>
<a href="">www.hniss.cn All Rights Reserved</a> <a href="">网站标识码:4117000033</a>
<a href="">豫ICP备16019691-1</a> <a href="">豫ICP备20008331号-1</a>
<a href="">访问统计5929773</a> <a href="">访问统计5929773</a>
</div> </div>
</div> </div>
@ -446,7 +447,7 @@ watch(() => settingStore.activeIndex, (newVal: number) => {
} }
.header { .header {
height: 150px; height: 200px;
background-color: #f8f8f8; background-color: #f8f8f8;
} }
.header .inner { .header .inner {
@ -455,7 +456,7 @@ watch(() => settingStore.activeIndex, (newVal: number) => {
} }
.header .box1 { .header .box1 {
width: 350px; width: 350px;
height: 67px; height: 200px;
background-color: #999999; background-color: #999999;
} }
.search { .search {

Loading…
Cancel
Save