|
|
@ -1,6 +1,7 @@
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
<div :style="styleObj">
|
|
|
|
<div :style="styleObj">
|
|
|
|
<superslide v-if="hackReset" :options="options" class="txtScroll-top">
|
|
|
|
<superslide v-if="hackReset" :options="options" class="txtScroll-top">
|
|
|
|
|
|
|
|
<!--表头-->
|
|
|
|
<div class="title">
|
|
|
|
<div class="title">
|
|
|
|
<div
|
|
|
|
<div
|
|
|
|
v-for="(item, index) in header"
|
|
|
|
v-for="(item, index) in header"
|
|
|
@ -10,6 +11,7 @@
|
|
|
|
{{ item.name }}
|
|
|
|
{{ item.name }}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<!--数据-->
|
|
|
|
<div class="bd">
|
|
|
|
<div class="bd">
|
|
|
|
<ul class="infoList">
|
|
|
|
<ul class="infoList">
|
|
|
|
<li v-for="(item, index) in list" :key="index">
|
|
|
|
<li v-for="(item, index) in list" :key="index">
|
|
|
@ -29,6 +31,7 @@
|
|
|
|
<script>
|
|
|
|
<script>
|
|
|
|
import vue from "vue";
|
|
|
|
import vue from "vue";
|
|
|
|
import VueSuperSlide from "vue-superslide";
|
|
|
|
import VueSuperSlide from "vue-superslide";
|
|
|
|
|
|
|
|
|
|
|
|
vue.use(VueSuperSlide);
|
|
|
|
vue.use(VueSuperSlide);
|
|
|
|
export default {
|
|
|
|
export default {
|
|
|
|
props: {
|
|
|
|
props: {
|
|
|
@ -43,7 +46,7 @@ export default {
|
|
|
|
mainCell: ".bd ul",
|
|
|
|
mainCell: ".bd ul",
|
|
|
|
effect: "topLoop",
|
|
|
|
effect: "topLoop",
|
|
|
|
autoPage: true,
|
|
|
|
autoPage: true,
|
|
|
|
effect: "top",
|
|
|
|
//effect: "top",
|
|
|
|
autoPlay: true,
|
|
|
|
autoPlay: true,
|
|
|
|
vis: 5
|
|
|
|
vis: 5
|
|
|
|
},
|
|
|
|
},
|
|
|
@ -129,7 +132,6 @@ export default {
|
|
|
|
},
|
|
|
|
},
|
|
|
|
handlerData() {
|
|
|
|
handlerData() {
|
|
|
|
const tableData = this.optionsData;
|
|
|
|
const tableData = this.optionsData;
|
|
|
|
console.log(tableData);
|
|
|
|
|
|
|
|
tableData.dataType == "staticData"
|
|
|
|
tableData.dataType == "staticData"
|
|
|
|
? this.handlerStaticData(tableData.staticData)
|
|
|
|
? this.handlerStaticData(tableData.staticData)
|
|
|
|
: this.handlerDymaicData(tableData.dynamicData, tableData.refreshTime);
|
|
|
|
: this.handlerDymaicData(tableData.dynamicData, tableData.refreshTime);
|
|
|
@ -182,31 +184,38 @@ export default {
|
|
|
|
overflow: hidden;
|
|
|
|
overflow: hidden;
|
|
|
|
position: relative;
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.title {
|
|
|
|
.title {
|
|
|
|
display: flex;
|
|
|
|
display: flex;
|
|
|
|
flex-direction: row;
|
|
|
|
flex-direction: row;
|
|
|
|
width: 100%;
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.title > div {
|
|
|
|
.title > div {
|
|
|
|
height: 50px;
|
|
|
|
height: 50px;
|
|
|
|
line-height: 50px;
|
|
|
|
line-height: 50px;
|
|
|
|
width: 100%;
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.txtScroll-top .bd {
|
|
|
|
.txtScroll-top .bd {
|
|
|
|
width: 100%;
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.txtScroll-top .infoList li {
|
|
|
|
.txtScroll-top .infoList li {
|
|
|
|
height: 50px;
|
|
|
|
height: 50px;
|
|
|
|
line-height: 50px;
|
|
|
|
line-height: 50px;
|
|
|
|
display: flex;
|
|
|
|
display: flex;
|
|
|
|
flex-direction: row;
|
|
|
|
flex-direction: row;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.txtScroll-top .infoList li > div {
|
|
|
|
.txtScroll-top .infoList li > div {
|
|
|
|
width: 100%;
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.txtScroll-top .infoList li:nth-child(n) {
|
|
|
|
.txtScroll-top .infoList li:nth-child(n) {
|
|
|
|
background: rgb(0, 59, 81);
|
|
|
|
background: rgb(0, 59, 81);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.txtScroll-top .infoList li:nth-child(2n) {
|
|
|
|
.txtScroll-top .infoList li:nth-child(2n) {
|
|
|
|
background: rgb(10, 39, 50);
|
|
|
|
background: rgb(10, 39, 50);
|
|
|
|
}
|
|
|
|
}
|
|
|
|