suojin
/
physical_distribution
15
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改轮播样式

Browse Source
main
jinna 3 years ago
parent 292d079da3
commit dd046c8321
1 changed files with 45 additions and 38 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 83
      src/views/dashboard/homepage.vue

83
src/views/dashboard/homepage.vue
Unescape View File

@ -30,25 +30,26 @@
</div> </div>
</div> </div>
<div class="cen_con"> <div class="cen_con">
<div class="table_con">
<div class="table_line">
<div class="table_item"></div>
<div class="table_item">排名</div>
<div class="table_item">乡镇</div>
<div class="table_item">运单量</div>
</div>
</div>
<div class="swiper-container swiper1"> <div class="swiper-container swiper1">
<div class="swiper-wrapper"> <div class="swiper-wrapper">
<div class="swiper-slide" v-for="(item, index) in slideList" :key="index"> <div class="swiper-slide" v-for="(item, index) in slideList" :key="index">
<!-- <table> --> <!-- <table> -->
<div class="table_con">
<div class="table_line"> <div class="table_line" v-for="item1 in item.arr" :key="item1.no">
<div class="table_item"></div> <div class="table_item" :class="item1.no <= 3 ? 'ac_no' : ''">
<div class="table_item">排名</div> {{ item1.no <= 3 ? "top" : "" }}
<div class="table_item">乡镇</div>
<div class="table_item">运单量</div>
</div>
<div class="table_line" v-for="item1 in item.arr" :key="item1.no">
<div class="table_item" :class="item1.no <= 3 ? 'ac_no' : ''">
{{ item1.no <= 3 ? "top" : "" }}
</div>
<div class="table_item">{{ item1.no }}</div>
<div class="table_item">{{ item1.name }}</div>
<div class="table_item">{{ item1.count }}</div>
</div> </div>
<div class="table_item">{{ item1.no }}</div>
<div class="table_item">{{ item1.name }}</div>
<div class="table_item">{{ item1.count }}</div>
</div> </div>
<!-- </table> --> <!-- </table> -->
</div> </div>
@ -62,20 +63,20 @@
<div class="tit">村点信息</div> <div class="tit">村点信息</div>
</div> </div>
<div class="table_box"> <div class="table_box">
<div class="table_con">
<div class="table_line">
<div class="table_item">站点名称</div>
<div class="table_item">上行</div>
<div class="table_item">下行</div>
</div>
</div>
<div class="swiper-container swiper2"> <div class="swiper-container swiper2">
<div class="swiper-wrapper"> <div class="swiper-wrapper">
<div class="swiper-slide" v-for="(item, index) in villList" :key="index"> <div class="swiper-slide" v-for="(item, index) in villList" :key="index">
<div class="table_con"> <div class="table_line" v-for="item1 in item.arr" :key="item1.name">
<div class="table_line"> <div class="table_item">{{ item1.name }}</div>
<div class="table_item">站点名称</div> <div class="table_item">{{ item1.upData }}</div>
<div class="table_item">上行</div> <div class="table_item">{{ item1.downData }}</div>
<div class="table_item">下行</div>
</div>
<div class="table_line" v-for="item1 in item.arr" :key="item1.name">
<div class="table_item">{{ item1.name }}</div>
<div class="table_item">{{ item1.upData }}</div>
<div class="table_item">{{ item1.downData }}</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -288,10 +289,10 @@ export default {
run() { run() {
this.mySwiper = new Swiper(".swiper1", { this.mySwiper = new Swiper(".swiper1", {
loop: true, // 循环模式选项 loop: true, // 循环模式选项
autoplay:{ autoplay: {
delay: 10000,//10秒切换一次 delay: 10000, //10秒切换一次
disableOnInteraction: false, disableOnInteraction: false,
} },
}); });
}, },
@ -299,10 +300,10 @@ export default {
this.mySwiper = new Swiper(".swiper2", { this.mySwiper = new Swiper(".swiper2", {
loop: true, // 循环模式选项 loop: true, // 循环模式选项
// autoplay: true, //可选选项，自动滑动 // autoplay: true, //可选选项，自动滑动
autoplay:{ autoplay: {
delay: 10000,//10秒切换一次 delay: 10000, //10秒切换一次
disableOnInteraction: false, disableOnInteraction: false,
} },
}); });
}, },
@ -1103,11 +1104,14 @@ export default {
height: 89%; height: 89%;
.swiper1 { .swiper1 {
width: 100%;
height: 100%; height: 100%;
.swiper-wrapper { .swiper-wrapper {
width: 100%;
height: 100%; height: 100%;
.swiper-slide { .swiper-slide {
width: 100%;
height: 100%; height: 100%;
} }
} }
@ -1115,7 +1119,7 @@ export default {
.table_con { .table_con {
width: 100%; width: 100%;
height: 100%; // height: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
@ -1205,13 +1209,16 @@ export default {
height: 88%; height: 88%;
// overflow-y: auto; // overflow-y: auto;
.swiper2{ .swiper2 {
width: 100%;
height: 100%; height: 100%;
.swiper-wrapper{ .swiper-wrapper {
width: 100%;
height: 100%; height: 100%;
.swiper-slide{ .swiper-slide {
width: 100%;
height: 100%; height: 100%;
} }
} }
@ -1219,7 +1226,7 @@ export default {
.table_con { .table_con {
width: 100%; width: 100%;
height: 100%; // height: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;

Write Preview
Loading…
Cancel
Save