npm/wo-user-part-uniapp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

u

Browse Source
This commit is contained in:
陆柯 2020-03-24 09:54:52 +08:00
parent 6aba5c9076
commit a2df6120ec
7 changed files with 27 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
cPager/cPager.leftMost.png → cPager/cPager.leftend.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 985 B

After

Width:  |  Height:  |  Size: 985 B

0
cPager/cPager.leftMost.svg → cPager/cPager.leftend.svg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 671 B

After

Width:  |  Height:  |  Size: 671 B

0
cPager/cPager.previous.png → cPager/cPager.prev.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 702 B

After

Width:  |  Height:  |  Size: 702 B

0
cPager/cPager.previous.svg → cPager/cPager.prev.svg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 512 B

After

Width:  |  Height:  |  Size: 512 B

0
cPager/cPager.rightMost.png → cPager/cPager.rightend.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 994 B

After

Width:  |  Height:  |  Size: 994 B

0
cPager/cPager.rightMost.svg → cPager/cPager.rightend.svg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 672 B

After

Width:  |  Height:  |  Size: 672 B

54
cPager/cPager.vue
View File

@ -5,11 +5,11 @@
export default {
name: 'cPager',
props: {
prevText: {
leftText: {
type: String,
default: 'Prev'
},
nextText: {
rightText: {
type: String,
default: 'Next'
},
@ -59,30 +59,30 @@
this.currentIndex = +this.current
},
methods: {
clickLeftMost(){
clickLeftEnd(){
this.currentIndex = 1
this.change('leftMost')
this.change('LEFT_END')
},
clickLeft() {
if (Number(this.currentIndex) === 1) {
return
}
this.currentIndex -= 1
this.change('prev')
this.change('LEFT')
},
clickRight() {
if (Number(this.currentIndex) === this.maxPage) {
return
}
this.currentIndex += 1
this.change('next')
this.change('RIGHT')
},
clickRightMost() {
clickRightEnd() {
if (Number(this.currentIndex) === this.maxPage) {
return
}
this.currentIndex = this.maxPage
this.change('rightMost')
this.change('RIGHT_END')
},
change(e) {
this.$emit('change', {
@ -98,35 +98,35 @@
<view class="uni-pagination">
<view class="uni-pagination__btns">
<view v-if="(showEdge===true || showEdge==='true')" class="uni-pagination__btn" @click="clickLeftMost"> <!-- always enabled so as to refresh -->
<view v-if="(showEdge===true || showEdge==='true')" class="uni-pagination__btn" @click="clickLeftEnd"> <!-- always enabled so as to refresh -->
<template v-if="showIcon===true || showIcon === 'true'">
<view class="sLeftMostButton"></view>
<view class="sLeftEndButton"></view>
</template>
<template v-else><text class="uni-pagination__child-btn">{{ leftMostText }}</text></template>
<template v-else><text class="uni-pagination__child-btn">{{ leftEndText }}</text></template>
</view>
<view class="uni-pagination__btn" :class="currentIndex === 1 ? 'uni-pagination--disabled' : 'uni-pagination--enabled'"
:hover-class="currentIndex === 1 ? '' : 'uni-pagination--hover'" :hover-start-time="20" :hover-stay-time="70"
@click="clickLeft">
<template v-if="showIcon===true || showIcon === 'true'">
<view class="sPrevButton"></view>
<view class="sLeftButton"></view>
</template>
<template v-else><text class="uni-pagination__child-btn">{{ prevText }}</text></template>
<template v-else><text class="uni-pagination__child-btn">{{ leftText }}</text></template>
</view>
<view class="uni-pagination__btn" :class="currentIndex === maxPage ? 'uni-pagination--disabled' : 'uni-pagination--enabled'"
:hover-class="currentIndex === maxPage ? '' : 'uni-pagination--hover'" :hover-start-time="20" :hover-stay-time="70"
@click="clickRight">
<template v-if="showIcon===true || showIcon === 'true'">
<view class="sNextButton"></view>
<view class="sRightButton"></view>
</template>
<template v-else><text class="uni-pagination__child-btn">{{ nextText }}</text></template>
<template v-else><text class="uni-pagination__child-btn">{{ rightText }}</text></template>
</view>
<view v-if="(showEdge===true || showEdge==='true')" class="uni-pagination__btn" :class="currentIndex === maxPage ? 'uni-pagination--disabled' : 'uni-pagination--enabled'"
:hover-class="currentIndex === maxPage ? '' : 'uni-pagination--hover'" :hover-start-time="20" :hover-stay-time="70"
@click="clickRightMost">
@click="clickRightEnd">
<template v-if="showIcon===true || showIcon === 'true'">
<view class="sRightMostButton"></view>
<view class="sRightEndButton"></view>
</template>
<template v-else><text class="uni-pagination__child-btn">{{ rightMostText }}</text></template>
<template v-else><text class="uni-pagination__child-btn">{{ rightEndText }}</text></template>
</view>
</view>
@ -234,21 +234,21 @@
background-color: $uni-bg-color-hover;
}
.sLeftMostButton, .sPrevButton, .sNextButton, .sRightMostButton{
.sLeftEndButton, .sLeftButton, .sRightButton, .sRightEndButton{
width: 20px;
height: 20px;
background: no-repeat center center / contain;
}
.sLeftMostButton{
background-image: url(./cPager.leftMost.png)
.sLeftEndButton{
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTgyNTk4ODQwNzk3IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjUxMTciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNjQiIGhlaWdodD0iNjQiPjxkZWZzPjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PC9zdHlsZT48L2RlZnM+PHBhdGggZD0iTTMyMCA4OTZjMTkuMiAwIDMyLTEyLjggMzItMzJ2LTMwNy4ybDMyOS42IDMyOS42YzEyLjggMTIuOCAzMiAxMi44IDQ0LjggMHMxMi44LTMyIDAtNDQuOEwzOTYuOCA1MTIgNzI2LjQgMTgyLjRjMTIuOC0xMi44IDEyLjgtMzIgMC00NC44LTYuNC02LjQtMTIuOC05LjYtMjIuNC05LjZzLTE2IDMuMi0yMi40IDkuNkwzNTIgNDY3LjJWMTYwYzAtMTkuMi0xMi44LTMyLTMyLTMycy0zMiAxMi44LTMyIDMydjcwNGMwIDE5LjIgMTIuOCAzMiAzMiAzMnoiIHAtaWQ9IjUxMTgiIGZpbGw9IiMxODgxRUUiPjwvcGF0aD48L3N2Zz4=')
}
.sPrevButton{
background-image: url(./cPager.previous.png)
.sLeftButton{
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTgyNTk4OTIyMjQwIiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjU0ODkiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNjQiIGhlaWdodD0iNjQiPjxkZWZzPjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PC9zdHlsZT48L2RlZnM+PHBhdGggZD0iTTM0OC44IDUxMkw3NDIuNCAxMTguNGMxMi44LTEyLjggMTIuOC0zMiAwLTQ0LjhzLTMyLTEyLjgtNDQuOCAwbC00MTYgNDE2Yy0xMi44IDEyLjgtMTIuOCAzMiAwIDQ0LjhsNDE2IDQxNmM2LjQgNi40IDE2IDkuNiAyMi40IDkuNnMxNi0zLjIgMjIuNC05LjZjMTIuOC0xMi44IDEyLjgtMzIgMC00NC44TDM0OC44IDUxMnoiIHAtaWQ9IjU0OTAiIGZpbGw9IiMxODgxRUUiPjwvcGF0aD48L3N2Zz4=')
}
.sNextButton{
background-image: url(./cPager.next.png)
.sRightButton{
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTgyNTk4ODg5NzIyIiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjUzMDMiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNjQiIGhlaWdodD0iNjQiPjxkZWZzPjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PC9zdHlsZT48L2RlZnM+PHBhdGggZD0iTTc0Mi40IDQ4OS42bC00MTYtNDE2Yy0xMi44LTEyLjgtMzItMTIuOC00NC44IDBzLTEyLjggMzIgMCA0NC44TDY3NS4yIDUxMiAyODEuNiA5MDUuNmMtMTIuOCAxMi44LTEyLjggMzIgMCA0NC44IDYuNCA2LjQgMTIuOCA5LjYgMjIuNCA5LjZzMTYtMy4yIDIyLjQtOS42bDQxNi00MTZjMTIuOC0xMi44IDEyLjgtMzIgMC00NC44eiIgcC1pZD0iNTMwNCIgZmlsbD0iIzE4ODFFRSI+PC9wYXRoPjwvc3ZnPg==')
}
.sRightMostButton{
background-image: url(./cPager.rightMost.png)
.sRightEndButton{
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTgyNTk4ODIyNTUxIiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjQ5MzEiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNjQiIGhlaWdodD0iNjQiPjxkZWZzPjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PC9zdHlsZT48L2RlZnM+PHBhdGggZD0iTTcwNCAxMjhjLTE5LjIgMC0zMiAxMi44LTMyIDMydjMwNy4yTDM0Mi40IDEzNy42Yy0xMi44LTEyLjgtMzItMTIuOC00NC44IDBzLTEyLjggMzIgMCA0NC44TDYyNy4yIDUxMiAyOTcuNiA4NDEuNmMtMTIuOCAxMi44LTEyLjggMzIgMCA0NC44IDYuNCA2LjQgMTIuOCA5LjYgMjIuNCA5LjZzMTYtMy4yIDIyLjQtOS42TDY3MiA1NTYuOFY4NjRjMCAxOS4yIDEyLjggMzIgMzIgMzJzMzItMTIuOCAzMi0zMlYxNjBjMC0xOS4yLTEyLjgtMzItMzItMzJ6IiBwLWlkPSI0OTMyIiBmaWxsPSIjMTg4MUVFIj48L3BhdGg+PC9zdmc+')
}
</style>