diff --git a/src/views/pageThree/index.vue b/src/views/pageThree/index.vue index d8352ff..f67ad36 100644 --- a/src/views/pageThree/index.vue +++ b/src/views/pageThree/index.vue @@ -34,7 +34,7 @@
  • 借阅数量
  • - - - + + @@ -93,7 +92,7 @@
  • 借阅数量
  • - - + + @@ -141,17 +140,17 @@ import LineChart from '@/components/echart/lineChart' import BarEcharts from '@/components/echart/barEcharts' import YearCircle from '@/components/echart/yearCircle' import TodayCircle from '@/components/echart/todayCircle' -import { swiper, swiperSlide } from 'vue-awesome-swiper' -import 'swiper/dist/css/swiper.css' +// import { swiper, swiperSlide } from 'vue-awesome-swiper' +// import 'swiper/dist/css/swiper.css' export default { name: 'PageThree', components: { LineChart, BarEcharts, YearCircle, - TodayCircle, - swiper, - swiperSlide + TodayCircle + // swiper, + // swiperSlide }, data() { return { @@ -305,10 +304,18 @@ export default { }) // 2. 根据JCC_YEAR的值进行降序排序 this.rankingYearData = newDataArray.sort((a, b) => b.JCC_YEAR - a.JCC_YEAR) - this.rankingYearWithPercentage = this.rankingDataComputed(this.rankingYearData, 'JCC_YEAR') + // this.rankingYearWithPercentage = this.rankingDataComputed(this.rankingYearData, 'JCC_YEAR') + // 不滚动只显示6条 + this.rankingYearWithPercentage = this.rankingDataComputed(this.rankingYearData, 'JCC_YEAR').splice(0, 6) // 3. 根据JCC_DAY的值进行降序排序 this.rankingTodayData = newDataArray.sort((a, b) => b.JCC_DAY - a.JCC_DAY) - this.rankingTodayWithPercentage = this.rankingDataComputed(this.rankingTodayData, 'JCC_DAY') + // this.rankingYearWithPercentage = this.rankingDataComputed(this.rankingYearData, 'JCC_YEAR') + // 不滚动只显示6条 + this.rankingTodayWithPercentage = this.rankingDataComputed(this.rankingTodayData, 'JCC_DAY').splice(0, 6) + // 不滚动只显示6条 + this.rankInterval = setInterval(() => { + this.currentHover = (this.currentHover + 1) % this.rankingYearWithPercentage.length + }, 1000) } }).catch(error => { console.error('Error', error) @@ -434,26 +441,26 @@ export default { @import "~@/assets/styles/index.scss"; @import "~@/assets/styles/font-some.css"; -.swiper { - width: 100%; - height: 3rem !important; +// .swiper { +// width: 100%; +// height: 3rem !important; - .swiper-slide { - height: .5rem !important; - } - .swiper-slide-active, - .swiper-slide-duplicate-active{ - // background-color: #142B76; - // border-radius: .05rem; - // animation: myListScale 1s forwards; - } -} +// .swiper-slide { +// height: .5rem !important; +// } +// .swiper-slide-active, +// .swiper-slide-duplicate-active{ +// // background-color: #142B76; +// // border-radius: .05rem; +// // animation: myListScale 1s forwards; +// } +// } -@keyframes myListScale { - to { - -webkit-transform: scaleX(1) scaleY(1); - transform: scaleX(1) scaleY(1); - } -} +// @keyframes myListScale { +// to { +// -webkit-transform: scaleX(1) scaleY(1); +// transform: scaleX(1) scaleY(1); +// } +// }