wangpeng
/
integrated_traffic_vue
forked from integrated_whb/integrated_whb_vue
1
0
Fork 0
Code Pull Requests Activity

首页公告增加滚动

pull/1/head
LiuJiaNan 2024-02-26 17:17:20 +08:00
parent 28e6e12999
commit fbc858cdef
3 changed files with 45 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
package-lock.json generated
View File

@ -41,7 +41,8 @@
"vue-router": "^4.2.5",
"vue3-pdfjs": "^0.1.6",
"vue3-print-nb": "^0.1.4",
"vue3-puzzle-vcode": "^1.1.5"
"vue3-puzzle-vcode": "^1.1.5",
"vue3-seamless-scroll": "^2.0.1"
},
"devDependencies": {
"@our-patches/postcss-px-to-viewport": "^1.2.0",
@ -6018,6 +6019,14 @@
"resolved": "https://registry.npmmirror.com/vue3-puzzle-vcode/-/vue3-puzzle-vcode-1.1.7.tgz",
"integrity": "sha512-mW780dz7HKjrElnE60CeYSeHGidKBKHoMjTDYfqF21330rTkFOsfDK1FQKZ22MktgMtTEoS/imfpEDlM1cxY/g=="
},
"node_modules/vue3-seamless-scroll": {
"version": "2.0.1",
"resolved": "https://registry.npmmirror.com/vue3-seamless-scroll/-/vue3-seamless-scroll-2.0.1.tgz",
"integrity": "sha512-mI3BaDU3pjcPUhVSw3/xNKdfPBDABTi/OdZaZqKysx4cSdNfGRbVvGNDzzptBbJ5S7imv5T55l6x/SqgnxKreg==",
"dependencies": {
"throttle-debounce": "5.0.0"
}
},
"node_modules/web-streams-polyfill": {
"version": "3.3.2",
"resolved": "https://registry.npmmirror.com/web-streams-polyfill/-/web-streams-polyfill-3.3.2.tgz",

3
package.json
View File

@ -43,7 +43,8 @@
"vue-router": "^4.2.5",
"vue3-pdfjs": "^0.1.6",
"vue3-print-nb": "^0.1.4",
"vue3-puzzle-vcode": "^1.1.5"
"vue3-puzzle-vcode": "^1.1.5",
"vue3-seamless-scroll": "^2.0.1"
},
"devDependencies": {
"@our-patches/postcss-px-to-viewport": "^1.2.0",

49
src/views/index/components/announcement.vue
View File

@ -1,28 +1,44 @@
<template>
<el-tabs v-model="active">
<el-tab-pane label="平台公告" name="first">
<ul>
<li
v-for="(item, index) in platformAnnouncementList.splice(0, 5)"
<el-tab-pane label="平台公告" name="first" lazy>
<seamless-scroll
:list="platformAnnouncementList"
hover
class="scroll"
:step="0.5"
:single-wait-time="1000"
:single-height="24"
:model-value="!data.viewDialog.visible && active === 'first'"
>
<div
v-for="(item, index) in platformAnnouncementList"
:key="index"
class="line-1"
class="line-1 item"
@click="fnPlatformAnnouncementView(item.NOTICE_ID)"
>
{{ item.SYNOPSIS }}
</li>
</ul>
</div>
</seamless-scroll>
</el-tab-pane>
<el-tab-pane label="企业公告" name="second">
<ul>
<li
v-for="(item, index) in corporateAnnouncementList.splice(0, 5)"
<el-tab-pane label="企业公告" name="second" lazy>
<seamless-scroll
:list="corporateAnnouncementList"
hover
class="scroll"
:step="0.5"
:single-wait-time="1000"
:single-height="24"
:model-value="!data.viewDialog.visible && active === 'second'"
>
<div
v-for="(item, index) in corporateAnnouncementList"
:key="index"
class="line-1"
class="line-1 item"
@click="fnCorporateAnnouncementView(item.NOTICECORP_ID)"
>
{{ item.SYNOPSIS }}
</li>
</ul>
</div>
</seamless-scroll>
</el-tab-pane>
</el-tabs>
<announcement-view
@ -41,6 +57,7 @@ import {
} from "@/request/index.js";
import useListData from "@/assets/js/useListData.js";
import AnnouncementView from "./announcement_view.vue";
import { Vue3SeamlessScroll as SeamlessScroll } from "vue3-seamless-scroll";
const active = ref("first");
const { list: platformAnnouncementList } = useListData(
@ -70,11 +87,11 @@ const fnCorporateAnnouncementView = async (NOTICECORP_ID) => {
</script>
<style scoped lang="scss">
ul {
.scroll {
height: 120px;
overflow: hidden;
li {
.item {
padding: 4px 0;
font-size: 14px;
cursor: pointer;