|
|
|
@ -23018,7 +23018,8 @@
|
|
|
|
|
aligns: [],
|
|
|
|
|
animationIndex: 0,
|
|
|
|
|
animationHandler: '',
|
|
|
|
|
updater: 0
|
|
|
|
|
updater: 0,
|
|
|
|
|
needCalc: false
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
@ -23208,6 +23209,18 @@
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
async animation(start = false) {
|
|
|
|
|
const {
|
|
|
|
|
needCalc,
|
|
|
|
|
calcHeights,
|
|
|
|
|
calcRowsData
|
|
|
|
|
} = this;
|
|
|
|
|
|
|
|
|
|
if (needCalc) {
|
|
|
|
|
calcRowsData();
|
|
|
|
|
calcHeights();
|
|
|
|
|
this.needCalc = false;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
let {
|
|
|
|
|
avgHeight,
|
|
|
|
|
animationIndex,
|
|
|
|
@ -23232,7 +23245,7 @@
|
|
|
|
|
const animationNum = carousel === 'single' ? 1 : rowNum;
|
|
|
|
|
let rows = rowsData.slice(animationIndex);
|
|
|
|
|
rows.push(...rowsData.slice(0, animationIndex));
|
|
|
|
|
this.rows = rows.slice(0, rowNum + 1);
|
|
|
|
|
this.rows = rows.slice(0, carousel === 'page' ? rowNum * 2 : rowNum + 1);
|
|
|
|
|
this.heights = new Array(rowLength).fill(avgHeight);
|
|
|
|
|
await new Promise(resolve => setTimeout(resolve, 300));
|
|
|
|
|
if (updater !== this.updater) return;
|
|
|
|
@ -23270,16 +23283,13 @@
|
|
|
|
|
updateRows(rows, animationIndex) {
|
|
|
|
|
const {
|
|
|
|
|
mergedConfig,
|
|
|
|
|
calcRowsData,
|
|
|
|
|
calcHeights,
|
|
|
|
|
animationHandler,
|
|
|
|
|
animation
|
|
|
|
|
} = this;
|
|
|
|
|
this.mergedConfig = { ...mergedConfig,
|
|
|
|
|
data: [...rows]
|
|
|
|
|
};
|
|
|
|
|
calcRowsData();
|
|
|
|
|
calcHeights();
|
|
|
|
|
this.needCalc = true;
|
|
|
|
|
if (typeof animationIndex === 'number') this.animationIndex = animationIndex;
|
|
|
|
|
if (!animationHandler) animation(true);
|
|
|
|
|
}
|
|
|
|
@ -23393,7 +23403,7 @@
|
|
|
|
|
/* style */
|
|
|
|
|
const __vue_inject_styles__$z = function (inject) {
|
|
|
|
|
if (!inject) return
|
|
|
|
|
inject("data-v-056e9c2c_0", { source: ".dv-scroll-board {\n position: relative;\n width: 100%;\n height: 100%;\n color: #fff;\n}\n.dv-scroll-board .text {\n padding: 0 10px;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.dv-scroll-board .header {\n display: flex;\n flex-direction: row;\n font-size: 15px;\n}\n.dv-scroll-board .header .header-item {\n padding: 0 10px;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n transition: all 0.3s;\n}\n.dv-scroll-board .rows {\n overflow: hidden;\n}\n.dv-scroll-board .rows .row-item {\n display: flex;\n font-size: 14px;\n transition: all 0.3s;\n}\n.dv-scroll-board .rows .ceil {\n padding: 0 10px;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.dv-scroll-board .rows .index {\n border-radius: 3px;\n padding: 0px 3px;\n}\n", map: {"version":3,"sources":["main.vue"],"names":[],"mappings":"AAAA;EACE,kBAAkB;EAClB,WAAW;EACX,YAAY;EACZ,WAAW;AACb;AACA;EACE,eAAe;EACf,sBAAsB;EACtB,mBAAmB;EACnB,gBAAgB;EAChB,uBAAuB;AACzB;AACA;EACE,aAAa;EACb,mBAAmB;EACnB,eAAe;AACjB;AACA;EACE,eAAe;EACf,sBAAsB;EACtB,mBAAmB;EACnB,gBAAgB;EAChB,uBAAuB;EACvB,oBAAoB;AACtB;AACA;EACE,gBAAgB;AAClB;AACA;EACE,aAAa;EACb,eAAe;EACf,oBAAoB;AACtB;AACA;EACE,eAAe;EACf,sBAAsB;EACtB,mBAAmB;EACnB,gBAAgB;EAChB,uBAAuB;AACzB;AACA;EACE,kBAAkB;EAClB,gBAAgB;AAClB","file":"main.vue","sourcesContent":[".dv-scroll-board {\n position: relative;\n width: 100%;\n height: 100%;\n color: #fff;\n}\n.dv-scroll-board .text {\n padding: 0 10px;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.dv-scroll-board .header {\n display: flex;\n flex-direction: row;\n font-size: 15px;\n}\n.dv-scroll-board .header .header-item {\n padding: 0 10px;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n transition: all 0.3s;\n}\n.dv-scroll-board .rows {\n overflow: hidden;\n}\n.dv-scroll-board .rows .row-item {\n display: flex;\n font-size: 14px;\n transition: all 0.3s;\n}\n.dv-scroll-board .rows .ceil {\n padding: 0 10px;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.dv-scroll-board .rows .index {\n border-radius: 3px;\n padding: 0px 3px;\n}\n"]}, media: undefined });
|
|
|
|
|
inject("data-v-26e19f4c_0", { source: ".dv-scroll-board {\n position: relative;\n width: 100%;\n height: 100%;\n color: #fff;\n}\n.dv-scroll-board .text {\n padding: 0 10px;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.dv-scroll-board .header {\n display: flex;\n flex-direction: row;\n font-size: 15px;\n}\n.dv-scroll-board .header .header-item {\n padding: 0 10px;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n transition: all 0.3s;\n}\n.dv-scroll-board .rows {\n overflow: hidden;\n}\n.dv-scroll-board .rows .row-item {\n display: flex;\n font-size: 14px;\n transition: all 0.3s;\n}\n.dv-scroll-board .rows .ceil {\n padding: 0 10px;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.dv-scroll-board .rows .index {\n border-radius: 3px;\n padding: 0px 3px;\n}\n", map: {"version":3,"sources":["main.vue"],"names":[],"mappings":"AAAA;EACE,kBAAkB;EAClB,WAAW;EACX,YAAY;EACZ,WAAW;AACb;AACA;EACE,eAAe;EACf,sBAAsB;EACtB,mBAAmB;EACnB,gBAAgB;EAChB,uBAAuB;AACzB;AACA;EACE,aAAa;EACb,mBAAmB;EACnB,eAAe;AACjB;AACA;EACE,eAAe;EACf,sBAAsB;EACtB,mBAAmB;EACnB,gBAAgB;EAChB,uBAAuB;EACvB,oBAAoB;AACtB;AACA;EACE,gBAAgB;AAClB;AACA;EACE,aAAa;EACb,eAAe;EACf,oBAAoB;AACtB;AACA;EACE,eAAe;EACf,sBAAsB;EACtB,mBAAmB;EACnB,gBAAgB;EAChB,uBAAuB;AACzB;AACA;EACE,kBAAkB;EAClB,gBAAgB;AAClB","file":"main.vue","sourcesContent":[".dv-scroll-board {\n position: relative;\n width: 100%;\n height: 100%;\n color: #fff;\n}\n.dv-scroll-board .text {\n padding: 0 10px;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.dv-scroll-board .header {\n display: flex;\n flex-direction: row;\n font-size: 15px;\n}\n.dv-scroll-board .header .header-item {\n padding: 0 10px;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n transition: all 0.3s;\n}\n.dv-scroll-board .rows {\n overflow: hidden;\n}\n.dv-scroll-board .rows .row-item {\n display: flex;\n font-size: 14px;\n transition: all 0.3s;\n}\n.dv-scroll-board .rows .ceil {\n padding: 0 10px;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.dv-scroll-board .rows .index {\n border-radius: 3px;\n padding: 0px 3px;\n}\n"]}, media: undefined });
|
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
/* scoped */
|
|
|
|
@ -23482,7 +23492,14 @@
|
|
|
|
|
* @type {Boolean}
|
|
|
|
|
* @default sort = true
|
|
|
|
|
*/
|
|
|
|
|
sort: true
|
|
|
|
|
sort: true,
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* @description Value formatter
|
|
|
|
|
* @type {Function}
|
|
|
|
|
* @default valueFormatter = null
|
|
|
|
|
*/
|
|
|
|
|
valueFormatter: null
|
|
|
|
|
},
|
|
|
|
|
mergedConfig: null,
|
|
|
|
|
rowsData: [],
|
|
|
|
@ -23690,7 +23707,13 @@
|
|
|
|
|
}),
|
|
|
|
|
_vm._v(" "),
|
|
|
|
|
_c("div", { staticClass: "ranking-value" }, [
|
|
|
|
|
_vm._v(_vm._s(item.value + _vm.mergedConfig.unit))
|
|
|
|
|
_vm._v(
|
|
|
|
|
_vm._s(
|
|
|
|
|
_vm.mergedConfig.valueFormatter
|
|
|
|
|
? _vm.mergedConfig.valueFormatter(item)
|
|
|
|
|
: item.value + _vm.mergedConfig.unit
|
|
|
|
|
)
|
|
|
|
|
)
|
|
|
|
|
])
|
|
|
|
|
]),
|
|
|
|
|
_vm._v(" "),
|
|
|
|
@ -23716,7 +23739,7 @@
|
|
|
|
|
/* style */
|
|
|
|
|
const __vue_inject_styles__$A = function (inject) {
|
|
|
|
|
if (!inject) return
|
|
|
|
|
inject("data-v-66fbd7a7_0", { source: ".dv-scroll-ranking-board {\n width: 100%;\n height: 100%;\n color: #fff;\n overflow: hidden;\n}\n.dv-scroll-ranking-board .row-item {\n transition: all 0.3s;\n display: flex;\n flex-direction: column;\n justify-content: center;\n overflow: hidden;\n}\n.dv-scroll-ranking-board .ranking-info {\n display: flex;\n width: 100%;\n font-size: 13px;\n}\n.dv-scroll-ranking-board .ranking-info .rank {\n width: 40px;\n color: #1370fb;\n}\n.dv-scroll-ranking-board .ranking-info .info-name {\n flex: 1;\n}\n.dv-scroll-ranking-board .ranking-column {\n border-bottom: 2px solid rgba(19, 112, 251, 0.5);\n margin-top: 5px;\n}\n.dv-scroll-ranking-board .ranking-column .inside-column {\n position: relative;\n height: 6px;\n background-color: #1370fb;\n margin-bottom: 2px;\n border-radius: 1px;\n overflow: hidden;\n}\n.dv-scroll-ranking-board .ranking-column .shine {\n position: absolute;\n left: 0%;\n top: 2px;\n height: 2px;\n width: 50px;\n transform: translateX(-100%);\n background: radial-gradient(#28f8ff 5%, transparent 80%);\n animation: shine 3s ease-in-out infinite alternate;\n}\n@keyframes shine {\n80% {\n left: 0%;\n transform: translateX(-100%);\n}\n100% {\n left: 100%;\n transform: translateX(0%);\n}\n}\n", map: {"version":3,"sources":["main.vue"],"names":[],"mappings":"AAAA;EACE,WAAW;EACX,YAAY;EACZ,WAAW;EACX,gBAAgB;AAClB;AACA;EACE,oBAAoB;EACpB,aAAa;EACb,sBAAsB;EACtB,uBAAuB;EACvB,gBAAgB;AAClB;AACA;EACE,aAAa;EACb,WAAW;EACX,eAAe;AACjB;AACA;EACE,WAAW;EACX,cAAc;AAChB;AACA;EACE,OAAO;AACT;AACA;EACE,gDAAgD;EAChD,eAAe;AACjB;AACA;EACE,kBAAkB;EAClB,WAAW;EACX,yBAAyB;EACzB,kBAAkB;EAClB,kBAAkB;EAClB,gBAAgB;AAClB;AACA;EACE,kBAAkB;EAClB,QAAQ;EACR,QAAQ;EACR,WAAW;EACX,WAAW;EACX,4BAA4B;EAC5B,wDAAwD;EACxD,kDAAkD;AACpD;AACA;AACE;IACE,QAAQ;IACR,4BAA4B;AAC9B;AACA;IACE,UAAU;IACV,yBAAyB;AAC3B;AACF","file":"main.vue","sourcesContent":[".dv-scroll-ranking-board {\n width: 100%;\n height: 100%;\n color: #fff;\n overflow: hidden;\n}\n.dv-scroll-ranking-board .row-item {\n transition: all 0.3s;\n display: flex;\n flex-direction: column;\n justify-content: center;\n overflow: hidden;\n}\n.dv-scroll-ranking-board .ranking-info {\n display: flex;\n width: 100%;\n font-size: 13px;\n}\n.dv-scroll-ranking-board .ranking-info .rank {\n width: 40px;\n color: #1370fb;\n}\n.dv-scroll-ranking-board .ranking-info .info-name {\n flex: 1;\n}\n.dv-scroll-ranking-board .ranking-column {\n border-bottom: 2px solid rgba(19, 112, 251, 0.5);\n margin-top: 5px;\n}\n.dv-scroll-ranking-board .ranking-column .inside-column {\n position: relative;\n height: 6px;\n background-color: #1370fb;\n margin-bottom: 2px;\n border-radius: 1px;\n overflow: hidden;\n}\n.dv-scroll-ranking-board .ranking-column .shine {\n position: absolute;\n left: 0%;\n top: 2px;\n height: 2px;\n width: 50px;\n transform: translateX(-100%);\n background: radial-gradient(#28f8ff 5%, transparent 80%);\n animation: shine 3s ease-in-out infinite alternate;\n}\n@keyframes shine {\n 80% {\n left: 0%;\n transform: translateX(-100%);\n }\n 100% {\n left: 100%;\n transform: translateX(0%);\n }\n}\n"]}, media: undefined });
|
|
|
|
|
inject("data-v-f297519a_0", { source: ".dv-scroll-ranking-board {\n width: 100%;\n height: 100%;\n color: #fff;\n overflow: hidden;\n}\n.dv-scroll-ranking-board .row-item {\n transition: all 0.3s;\n display: flex;\n flex-direction: column;\n justify-content: center;\n overflow: hidden;\n}\n.dv-scroll-ranking-board .ranking-info {\n display: flex;\n width: 100%;\n font-size: 13px;\n}\n.dv-scroll-ranking-board .ranking-info .rank {\n width: 40px;\n color: #1370fb;\n}\n.dv-scroll-ranking-board .ranking-info .info-name {\n flex: 1;\n}\n.dv-scroll-ranking-board .ranking-column {\n border-bottom: 2px solid rgba(19, 112, 251, 0.5);\n margin-top: 5px;\n}\n.dv-scroll-ranking-board .ranking-column .inside-column {\n position: relative;\n height: 6px;\n background-color: #1370fb;\n margin-bottom: 2px;\n border-radius: 1px;\n overflow: hidden;\n}\n.dv-scroll-ranking-board .ranking-column .shine {\n position: absolute;\n left: 0%;\n top: 2px;\n height: 2px;\n width: 50px;\n transform: translateX(-100%);\n background: radial-gradient(#28f8ff 5%, transparent 80%);\n animation: shine 3s ease-in-out infinite alternate;\n}\n@keyframes shine {\n80% {\n left: 0%;\n transform: translateX(-100%);\n}\n100% {\n left: 100%;\n transform: translateX(0%);\n}\n}\n", map: {"version":3,"sources":["main.vue"],"names":[],"mappings":"AAAA;EACE,WAAW;EACX,YAAY;EACZ,WAAW;EACX,gBAAgB;AAClB;AACA;EACE,oBAAoB;EACpB,aAAa;EACb,sBAAsB;EACtB,uBAAuB;EACvB,gBAAgB;AAClB;AACA;EACE,aAAa;EACb,WAAW;EACX,eAAe;AACjB;AACA;EACE,WAAW;EACX,cAAc;AAChB;AACA;EACE,OAAO;AACT;AACA;EACE,gDAAgD;EAChD,eAAe;AACjB;AACA;EACE,kBAAkB;EAClB,WAAW;EACX,yBAAyB;EACzB,kBAAkB;EAClB,kBAAkB;EAClB,gBAAgB;AAClB;AACA;EACE,kBAAkB;EAClB,QAAQ;EACR,QAAQ;EACR,WAAW;EACX,WAAW;EACX,4BAA4B;EAC5B,wDAAwD;EACxD,kDAAkD;AACpD;AACA;AACE;IACE,QAAQ;IACR,4BAA4B;AAC9B;AACA;IACE,UAAU;IACV,yBAAyB;AAC3B;AACF","file":"main.vue","sourcesContent":[".dv-scroll-ranking-board {\n width: 100%;\n height: 100%;\n color: #fff;\n overflow: hidden;\n}\n.dv-scroll-ranking-board .row-item {\n transition: all 0.3s;\n display: flex;\n flex-direction: column;\n justify-content: center;\n overflow: hidden;\n}\n.dv-scroll-ranking-board .ranking-info {\n display: flex;\n width: 100%;\n font-size: 13px;\n}\n.dv-scroll-ranking-board .ranking-info .rank {\n width: 40px;\n color: #1370fb;\n}\n.dv-scroll-ranking-board .ranking-info .info-name {\n flex: 1;\n}\n.dv-scroll-ranking-board .ranking-column {\n border-bottom: 2px solid rgba(19, 112, 251, 0.5);\n margin-top: 5px;\n}\n.dv-scroll-ranking-board .ranking-column .inside-column {\n position: relative;\n height: 6px;\n background-color: #1370fb;\n margin-bottom: 2px;\n border-radius: 1px;\n overflow: hidden;\n}\n.dv-scroll-ranking-board .ranking-column .shine {\n position: absolute;\n left: 0%;\n top: 2px;\n height: 2px;\n width: 50px;\n transform: translateX(-100%);\n background: radial-gradient(#28f8ff 5%, transparent 80%);\n animation: shine 3s ease-in-out infinite alternate;\n}\n@keyframes shine {\n 80% {\n left: 0%;\n transform: translateX(-100%);\n }\n 100% {\n left: 100%;\n transform: translateX(0%);\n }\n}\n"]}, media: undefined });
|
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
/* scoped */
|
|
|
|
|