Commit 56bff894 authored by chenyishuai@singsingenglish.com's avatar chenyishuai@singsingenglish.com
parents f3db5998 ce36b63a
...@@ -5,134 +5,133 @@ ...@@ -5,134 +5,133 @@
</template> </template>
<script type="text/ecmascript-6"> <script type="text/ecmascript-6">
import BScroll from 'better-scroll' import BScroll from "better-scroll";
export default { export default {
props: { props: {
probeType: { probeType: {
type: Number, type: Number,
default: 1 default: 1
},
click: {
type: Boolean,
default: true
},
listenScroll: {
type: Boolean,
default: false
},
data: {
type: Array,
default: null
},
pullup: {
type: Boolean,
default: false
},
pulldown: {
type: Boolean,
default: false
},
beforeScroll: {
type: Boolean,
default: false
},
refreshDelay: {
type: Number,
default: 100
},
bounce: {
type: Boolean,
default: true
},
scrollX: {
type: Boolean,
default: false
},
scrollY: {
type: Boolean,
default: true
}
}, },
mounted() { click: {
setTimeout(() => { type: Boolean,
this._initScroll() default: true
}, 20) },
}, listenScroll: {
methods: { type: Boolean,
_initScroll() { default: false
if (!this.$refs.wrapper) { },
return data: {
} type: Array,
this.scroll = new BScroll(this.$refs.wrapper, { default: null
probeType: this.probeType, },
click: this.click, pullup: {
bounce:this.bounce, type: Boolean,
scrollX:this.scrollX, default: false
scrollY:this.scrollY },
}) pulldown: {
type: Boolean,
default: false
},
beforeScroll: {
type: Boolean,
default: false
},
refreshDelay: {
type: Number,
default: 100
},
bounce: {
type: Boolean,
default: true
},
scrollX: {
type: Boolean,
default: false
},
scrollY: {
type: Boolean,
default: true
}
},
mounted() {
setTimeout(() => {
this._initScroll();
}, 20);
},
methods: {
_initScroll() {
if (!this.$refs.wrapper) {
return;
}
this.scroll = new BScroll(this.$refs.wrapper, {
probeType: this.probeType,
click: this.click,
bounce: this.bounce,
scrollX: this.scrollX,
scrollY: this.scrollY
});
if (this.listenScroll) { if (this.listenScroll) {
let me = this let me = this;
this.scroll.on('scroll', (pos) => { this.scroll.on("scroll", pos => {
me.$emit('scroll', pos) me.$emit("scroll", pos);
}) });
} }
if (this.pullup) { if (this.pullup) {
this.scroll.on('scrollEnd', () => { this.scroll.on("scrollEnd", () => {
if (this.scroll.y <= (this.scroll.maxScrollY + 10)) { if (this.scroll.y <= this.scroll.maxScrollY + 10) {
// 滚动到底部 // 滚动到底部
this.$emit('pullup') this.$emit("pullup");
} }
}) });
}
if (this.pulldown) {
this.scroll.on('touchend', (pos) => {
// 下拉动作
if (pos.y > 50) {
this.$emit('pulldown')
}
})
}
if (this.beforeScroll) {
this.scroll.on('beforeScrollStart', () => {
this.$emit('beforeScroll')
})
}
// if (this.pos) {
// // this.$emit('beforeScroll')
// this.scroll.scrollTo(this.pos.x,this.pos.y)
// }
},
disable() {
this.scroll && this.scroll.disable()
},
enable() {
this.scroll && this.scroll.enable()
},
refresh() {
this.scroll && this.scroll.refresh()
},
scrollTo(x,y,time) {
this.scroll && this.scroll.scrollTo(x,y,time)
},
scrollToElement(el,time){
this.scroll && this.scroll.scrollToElement(el,time)
},
scrollToElement() {
this.scroll && this.scroll.scrollToElement.apply(this.scroll, arguments)
} }
}, if (this.pulldown) {
watch: { this.scroll.on("touchend", pos => {
data() { // 下拉动作
setTimeout(() => { if (pos.y > 50) {
this.refresh() this.$emit("pulldown");
}, this.refreshDelay) }
});
}
if (this.beforeScroll) {
this.scroll.on("beforeScrollStart", () => {
this.$emit("beforeScroll");
});
} }
// if (this.pos) {
// // this.$emit('beforeScroll')
// this.scroll.scrollTo(this.pos.x,this.pos.y)
// }
},
disable() {
this.scroll && this.scroll.disable();
},
enable() {
this.scroll && this.scroll.enable();
},
refresh() {
this.scroll && this.scroll.refresh();
},
scrollTo(x, y, time) {
this.scroll && this.scroll.scrollTo(x, y, time);
},
scrollToElement(el, time) {
this.scroll && this.scroll.scrollToElement(el, time);
},
scrollToElement() {
this.scroll && this.scroll.scrollToElement.apply(this.scroll, arguments);
}
},
watch: {
data() {
setTimeout(() => {
this.refresh();
}, this.refreshDelay);
} }
} }
};
</script> </script>
<style scoped > <style scoped >
</style> </style>
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
<span class="line"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 还没有星星记录哦~ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="line"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 还没有星星记录哦~ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<span class="line"></span> <span class="line"></span>
</div> </div>
<div class="secTitle" v-if="starNum!=0&&starInfo.code!=500"> <div class="secTitle" v-if="starNum!=0&&starInfo.code!=500">
<div :class="{item:true}" @click="tabChange(1)"> <div :class="{item:true}" @click="tabChange(1)">
<span v-if="tabIndex==1" class="activity"> <span v-if="tabIndex==1" class="activity">
<img :src="starPage.star_img_title" alt> 星星活动 <img :src="starPage.star_img_title" alt> 星星活动
...@@ -44,12 +44,14 @@ ...@@ -44,12 +44,14 @@
ref="scrollItem" ref="scrollItem"
class="scrollItem" class="scrollItem"
:data="starList" :data="starList"
:bounce="false"> :bounce="false"
>
<div class="container"> <div class="container">
<div class="stageBox" v-if="starInfo.code!=2001"> <div class="stageBox" v-if="starInfo.code!=2001">
<div <div
class="result" class="result"
v-if="starInfo.code!=2003&&starInfo.code!=2004&&starInfo.activity_result&&starInfo.activity_result.result!=15&&starInfo.activity_result.result!=16"> v-if="starInfo.code!=2003&&starInfo.code!=2004&&starInfo.activity_result&&starInfo.activity_result.result!=15&&starInfo.activity_result.result!=16"
>
<div class="float">结果公示</div> <div class="float">结果公示</div>
<div v-if="starInfo.activity_result.result==11"> <div v-if="starInfo.activity_result.result==11">
<h2>恭喜两个阶段全勤挑战成功</h2> <h2>恭喜两个阶段全勤挑战成功</h2>
...@@ -93,7 +95,8 @@ ...@@ -93,7 +95,8 @@
</div> </div>
<div <div
v-if="starInfo.code!=2003&&starInfo.activity_result&&(starInfo.activity_result.result==15||starInfo.activity_result.result==16)" v-if="starInfo.code!=2003&&starInfo.activity_result&&(starInfo.activity_result.result==15||starInfo.activity_result.result==16)"
class="result fal"> class="result fal"
>
<div class="float">结果公示</div> <div class="float">结果公示</div>
<div v-if="starInfo.activity_result.result==15"> <div v-if="starInfo.activity_result.result==15">
<div class="fal_title">很抱歉第一阶段全勤挑战失败</div> <div class="fal_title">很抱歉第一阶段全勤挑战失败</div>
...@@ -338,7 +341,6 @@ export default { ...@@ -338,7 +341,6 @@ export default {
top + top +
"px"; "px";
} }
console.log(top);
}, 200); }, 200);
// if(this.$refs.unStart){ // if(this.$refs.unStart){
// floatBox // floatBox
...@@ -358,7 +360,7 @@ export default { ...@@ -358,7 +360,7 @@ export default {
} else if (index == 2) { } else if (index == 2) {
this.swiper.slideNext(); this.swiper.slideNext();
} }
console.log(document.querySelector('.scrollItem')) console.log(document.querySelector(".scrollItem"));
// if(index==1){ // if(index==1){
// console.log(11) // console.log(11)
// setTimeout(() => { // setTimeout(() => {
...@@ -393,7 +395,9 @@ export default { ...@@ -393,7 +395,9 @@ export default {
z-index: 100; z-index: 100;
// padding-bottom: 10 * @toVw; // padding-bottom: 10 * @toVw;
} }
.scrollItem{height: 100vh;} .scrollItem {
height: 100vh;
}
.head { .head {
height: 147 * @toVw; height: 147 * @toVw;
.bg { .bg {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment