From c9c263dc43ad90f95f24a036cee9e6b47afb596c Mon Sep 17 00:00:00 2001
From: skyouc
Date: 星期六, 21 十二月 2024 18:44:20 +0800
Subject: [PATCH] 新建盐城德森项目
---
uni_modules/uni-pagination/components/uni-pagination/uni-pagination.vue | 818 +++++++++++++++++++++++++++++-----------------------------
1 files changed, 409 insertions(+), 409 deletions(-)
diff --git a/uni_modules/uni-pagination/components/uni-pagination/uni-pagination.vue b/uni_modules/uni-pagination/components/uni-pagination/uni-pagination.vue
index c62150e..159fe4b 100644
--- a/uni_modules/uni-pagination/components/uni-pagination/uni-pagination.vue
+++ b/uni_modules/uni-pagination/components/uni-pagination/uni-pagination.vue
@@ -1,409 +1,409 @@
-<template>
- <view class="uni-pagination">
- <!-- #ifndef APP-NVUE -->
- <view class="uni-pagination__total is-phone-hide">鍏� {{ total }} 鏉�</view>
- <!-- #endif -->
- <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'">
- <uni-icons color="#666" size="16" type="left" />
- </template>
- <template v-else>
- <text class="uni-pagination__child-btn">{{ prevPageText }}</text>
- </template>
- </view>
- <view class="uni-pagination__num uni-pagination__num-flex-none">
- <view class="uni-pagination__num-current">
- <text class="uni-pagination__num-current-text is-pc-hide"
- style="color:#409EFF">{{ currentIndex }}</text>
- <text class="uni-pagination__num-current-text is-pc-hide">/{{ maxPage || 0 }}</text>
- <!-- #ifndef APP-NVUE -->
- <view v-for="(item, index) in paper" :key="index" :class="{ 'page--active': item === currentIndex }"
- class="uni-pagination__num-tag tag--active is-phone-hide" @click.top="selectPage(item, index)">
- <text>{{ item }}</text>
- </view>
- <!-- #endif -->
-
- </view>
- </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'">
- <uni-icons color="#666" size="16" type="right" />
- </template>
- <template v-else>
- <text class="uni-pagination__child-btn">{{ nextPageText }}</text>
- </template>
- </view>
- </view>
-</template>
-
-<script>
- /**
- * Pagination 鍒嗛〉鍣�
- * @description 鍒嗛〉鍣ㄧ粍浠讹紝鐢ㄤ簬灞曠ず椤电爜銆佽姹傛暟鎹瓑
- * @tutorial https://ext.dcloud.net.cn/plugin?id=32
- * @property {String} prevText 宸︿晶鎸夐挳鏂囧瓧
- * @property {String} nextText 鍙充晶鎸夐挳鏂囧瓧
- * @property {Number} current 褰撳墠椤�
- * @property {Number} total 鏁版嵁鎬婚噺
- * @property {Number} pageSize 姣忛〉鏁版嵁閲�
- * @property {Number} showIcon = [true|false] 鏄惁浠� icon 褰㈠紡灞曠ず鎸夐挳
- * @event {Function} change 鐐瑰嚮椤电爜鎸夐挳鏃惰Е鍙� ,e={type,current} current涓哄綋鍓嶉〉锛宼ype鍊间负锛歯ext/prev锛岃〃绀虹偣鍑荤殑鏄笂涓�椤佃繕鏄笅涓�涓�
- */
-
- import {
- initVueI18n
- } from '@dcloudio/uni-i18n'
- import messages from './i18n/index.js'
- const {
- t
- } = initVueI18n(messages)
- export default {
- name: 'UniPagination',
- emits: ['update:modelValue', 'input', 'change'],
- props: {
- value: {
- type: [Number, String],
- default: 1
- },
- modelValue: {
- type: [Number, String],
- default: 1
- },
- prevText: {
- type: String,
- },
- nextText: {
- type: String,
- },
- current: {
- type: [Number, String],
- default: 1
- },
- total: {
- // 鏁版嵁鎬婚噺
- type: [Number, String],
- default: 0
- },
- pageSize: {
- // 姣忛〉鏁版嵁閲�
- type: [Number, String],
- default: 10
- },
- showIcon: {
- // 鏄惁浠� icon 褰㈠紡灞曠ず鎸夐挳
- type: [Boolean, String],
- default: false
- },
- pagerCount: {
- type: Number,
- default: 7
- }
- },
- data() {
- return {
- currentIndex: 1,
- paperData: []
- }
- },
- computed: {
- prevPageText() {
- return this.prevText || t('uni-pagination.prevText')
- },
- nextPageText() {
- return this.nextText || t('uni-pagination.nextText')
- },
- maxPage() {
- let maxPage = 1
- let total = Number(this.total)
- let pageSize = Number(this.pageSize)
- if (total && pageSize) {
- maxPage = Math.ceil(total / pageSize)
- }
- return maxPage
- },
- paper() {
- const num = this.currentIndex
- // TODO 鏈�澶ч〉鏁�
- const pagerCount = this.pagerCount
- // const total = 181
- const total = this.total
- const pageSize = this.pageSize
- let totalArr = []
- let showPagerArr = []
- let pagerNum = Math.ceil(total / pageSize)
- for (let i = 0; i < pagerNum; i++) {
- totalArr.push(i + 1)
- }
- showPagerArr.push(1)
- const totalNum = totalArr[totalArr.length - (pagerCount + 1) / 2]
- totalArr.forEach((item, index) => {
- if ((pagerCount + 1) / 2 >= num) {
- if (item < pagerCount + 1 && item > 1) {
- showPagerArr.push(item)
- }
- } else if (num + 2 <= totalNum) {
- if (item > num - (pagerCount + 1) / 2 && item < num + (pagerCount + 1) / 2) {
- showPagerArr.push(item)
- }
- } else {
- if ((item > num - (pagerCount + 1) / 2 || pagerNum - pagerCount < item) && item < totalArr[
- totalArr.length - 1]) {
- showPagerArr.push(item)
- }
- }
- })
- if (pagerNum > pagerCount) {
- if ((pagerCount + 1) / 2 >= num) {
- showPagerArr[showPagerArr.length - 1] = '...'
- } else if (num + 2 <= totalNum) {
- showPagerArr[1] = '...'
- showPagerArr[showPagerArr.length - 1] = '...'
- } else {
- showPagerArr[1] = '...'
- }
- showPagerArr.push(totalArr[totalArr.length - 1])
- } else {
- if ((pagerCount + 1) / 2 >= num) {} else if (num + 2 <= totalNum) {} else {
- showPagerArr.shift()
- showPagerArr.push(totalArr[totalArr.length - 1])
- }
- }
-
- return showPagerArr
- }
- },
- watch: {
- current: {
- immediate: true,
- handler(val, old) {
- if (val < 1) {
- this.currentIndex = 1
- } else {
- this.currentIndex = val
- }
- }
- },
- value: {
- immediate: true,
- handler(val) {
- if (Number(this.current) !== 1) return
- if (val < 1) {
- this.currentIndex = 1
- } else {
- this.currentIndex = val
- }
- }
- }
- },
- methods: {
- // 閫夋嫨鏍囩
- selectPage(e, index) {
- if (parseInt(e)) {
- this.currentIndex = e
- this.change('current')
- } else {
- let pagerNum = Math.ceil(this.total / this.pageSize)
- // let pagerNum = Math.ceil(181 / this.pageSize)
- // 涓婁竴椤�
- if (index <= 1) {
- if (this.currentIndex - 5 > 1) {
- this.currentIndex -= 5
- } else {
- this.currentIndex = 1
- }
- return
- }
- // 涓嬩竴椤�
- if (index >= 6) {
- if (this.currentIndex + 5 > pagerNum) {
- this.currentIndex = pagerNum
- } else {
- this.currentIndex += 5
- }
- return
- }
- }
- },
- clickLeft() {
- if (Number(this.currentIndex) === 1) {
- return
- }
- this.currentIndex -= 1
- this.change('prev')
- },
- clickRight() {
- if (Number(this.currentIndex) >= this.maxPage) {
- return
- }
- this.currentIndex += 1
- this.change('next')
- },
- change(e) {
- this.$emit('input', this.currentIndex)
- this.$emit('update:modelValue', this.currentIndex)
- this.$emit('change', {
- type: e,
- current: this.currentIndex
- })
- }
- }
- }
-</script>
-
-<style lang="scss" scoped>
- $uni-primary: #2979ff;
- .uni-pagination {
- /* #ifndef APP-NVUE */
- display: flex;
- /* #endif */
- position: relative;
- overflow: hidden;
- flex-direction: row;
- justify-content: center;
- align-items: center;
- }
-
- .uni-pagination__total {
- font-size: 14px;
- color: #999;
- margin-right: 15px;
- }
-
- .uni-pagination__btn {
- /* #ifndef APP-NVUE */
- display: flex;
- cursor: pointer;
- /* #endif */
- padding: 0 8px;
- line-height: 30px;
- font-size: 12px;
- position: relative;
- background-color: #F0F0F0;
- flex-direction: row;
- justify-content: center;
- align-items: center;
- text-align: center;
- border-radius: 5px;
- // border-width: 1px;
- // border-style: solid;
- // border-color: $uni-border-color;
- }
-
- .uni-pagination__child-btn {
- /* #ifndef APP-NVUE */
- display: flex;
- /* #endif */
- font-size: 12px;
- position: relative;
- flex-direction: row;
- justify-content: center;
- align-items: center;
- text-align: center;
- color: #666;
- font-size: 12px;
- }
-
- .uni-pagination__num {
- /* #ifndef APP-NVUE */
- display: flex;
- /* #endif */
- flex: 1;
- flex-direction: row;
- justify-content: center;
- align-items: center;
- height: 30px;
- line-height: 30px;
- font-size: 12px;
- color: #666;
- margin: 0 5px;
- }
-
- .uni-pagination__num-tag {
- /* #ifdef H5 */
- cursor: pointer;
- min-width: 30px;
- /* #endif */
- margin: 0 5px;
- height: 30px;
- text-align: center;
- line-height: 30px;
- // border: 1px red solid;
- color: #999;
- border-radius: 4px;
- // border-width: 1px;
- // border-style: solid;
- // border-color: $uni-border-color;
- }
-
- .uni-pagination__num-current {
- /* #ifndef APP-NVUE */
- display: flex;
- /* #endif */
- flex-direction: row;
- }
-
- .uni-pagination__num-current-text {
- font-size: 15px;
- }
-
- .uni-pagination--enabled {
- color: #333333;
- opacity: 1;
- }
-
- .uni-pagination--disabled {
- opacity: 0.5;
- /* #ifdef H5 */
- cursor: default;
- /* #endif */
- }
-
- .uni-pagination--hover {
- color: rgba(0, 0, 0, 0.6);
- background-color: #eee;
- }
-
- .tag--active:hover {
- color: $uni-primary;
- }
-
- .page--active {
- color: #fff;
- background-color: $uni-primary;
- }
-
- .page--active:hover {
- color: #fff;
- }
-
- /* #ifndef APP-NVUE */
- .is-pc-hide {
- display: block;
- }
-
- .is-phone-hide {
- display: none;
- }
-
- @media screen and (min-width: 450px) {
- .is-pc-hide {
- display: none;
- }
-
- .is-phone-hide {
- display: block;
- }
-
- .uni-pagination__num-flex-none {
- flex: none;
- }
- }
-
- /* #endif */
-</style>
+<template>
+ <view class="uni-pagination">
+ <!-- #ifndef APP-NVUE -->
+ <view class="uni-pagination__total is-phone-hide">鍏� {{ total }} 鏉�</view>
+ <!-- #endif -->
+ <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'">
+ <uni-icons color="#666" size="16" type="left" />
+ </template>
+ <template v-else>
+ <text class="uni-pagination__child-btn">{{ prevPageText }}</text>
+ </template>
+ </view>
+ <view class="uni-pagination__num uni-pagination__num-flex-none">
+ <view class="uni-pagination__num-current">
+ <text class="uni-pagination__num-current-text is-pc-hide"
+ style="color:#409EFF">{{ currentIndex }}</text>
+ <text class="uni-pagination__num-current-text is-pc-hide">/{{ maxPage || 0 }}</text>
+ <!-- #ifndef APP-NVUE -->
+ <view v-for="(item, index) in paper" :key="index" :class="{ 'page--active': item === currentIndex }"
+ class="uni-pagination__num-tag tag--active is-phone-hide" @click.top="selectPage(item, index)">
+ <text>{{ item }}</text>
+ </view>
+ <!-- #endif -->
+
+ </view>
+ </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'">
+ <uni-icons color="#666" size="16" type="right" />
+ </template>
+ <template v-else>
+ <text class="uni-pagination__child-btn">{{ nextPageText }}</text>
+ </template>
+ </view>
+ </view>
+</template>
+
+<script>
+ /**
+ * Pagination 鍒嗛〉鍣�
+ * @description 鍒嗛〉鍣ㄧ粍浠讹紝鐢ㄤ簬灞曠ず椤电爜銆佽姹傛暟鎹瓑
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=32
+ * @property {String} prevText 宸︿晶鎸夐挳鏂囧瓧
+ * @property {String} nextText 鍙充晶鎸夐挳鏂囧瓧
+ * @property {Number} current 褰撳墠椤�
+ * @property {Number} total 鏁版嵁鎬婚噺
+ * @property {Number} pageSize 姣忛〉鏁版嵁閲�
+ * @property {Number} showIcon = [true|false] 鏄惁浠� icon 褰㈠紡灞曠ず鎸夐挳
+ * @event {Function} change 鐐瑰嚮椤电爜鎸夐挳鏃惰Е鍙� ,e={type,current} current涓哄綋鍓嶉〉锛宼ype鍊间负锛歯ext/prev锛岃〃绀虹偣鍑荤殑鏄笂涓�椤佃繕鏄笅涓�涓�
+ */
+
+ import {
+ initVueI18n
+ } from '@dcloudio/uni-i18n'
+ import messages from './i18n/index.js'
+ const {
+ t
+ } = initVueI18n(messages)
+ export default {
+ name: 'UniPagination',
+ emits: ['update:modelValue', 'input', 'change'],
+ props: {
+ value: {
+ type: [Number, String],
+ default: 1
+ },
+ modelValue: {
+ type: [Number, String],
+ default: 1
+ },
+ prevText: {
+ type: String,
+ },
+ nextText: {
+ type: String,
+ },
+ current: {
+ type: [Number, String],
+ default: 1
+ },
+ total: {
+ // 鏁版嵁鎬婚噺
+ type: [Number, String],
+ default: 0
+ },
+ pageSize: {
+ // 姣忛〉鏁版嵁閲�
+ type: [Number, String],
+ default: 10
+ },
+ showIcon: {
+ // 鏄惁浠� icon 褰㈠紡灞曠ず鎸夐挳
+ type: [Boolean, String],
+ default: false
+ },
+ pagerCount: {
+ type: Number,
+ default: 7
+ }
+ },
+ data() {
+ return {
+ currentIndex: 1,
+ paperData: []
+ }
+ },
+ computed: {
+ prevPageText() {
+ return this.prevText || t('uni-pagination.prevText')
+ },
+ nextPageText() {
+ return this.nextText || t('uni-pagination.nextText')
+ },
+ maxPage() {
+ let maxPage = 1
+ let total = Number(this.total)
+ let pageSize = Number(this.pageSize)
+ if (total && pageSize) {
+ maxPage = Math.ceil(total / pageSize)
+ }
+ return maxPage
+ },
+ paper() {
+ const num = this.currentIndex
+ // TODO 鏈�澶ч〉鏁�
+ const pagerCount = this.pagerCount
+ // const total = 181
+ const total = this.total
+ const pageSize = this.pageSize
+ let totalArr = []
+ let showPagerArr = []
+ let pagerNum = Math.ceil(total / pageSize)
+ for (let i = 0; i < pagerNum; i++) {
+ totalArr.push(i + 1)
+ }
+ showPagerArr.push(1)
+ const totalNum = totalArr[totalArr.length - (pagerCount + 1) / 2]
+ totalArr.forEach((item, index) => {
+ if ((pagerCount + 1) / 2 >= num) {
+ if (item < pagerCount + 1 && item > 1) {
+ showPagerArr.push(item)
+ }
+ } else if (num + 2 <= totalNum) {
+ if (item > num - (pagerCount + 1) / 2 && item < num + (pagerCount + 1) / 2) {
+ showPagerArr.push(item)
+ }
+ } else {
+ if ((item > num - (pagerCount + 1) / 2 || pagerNum - pagerCount < item) && item < totalArr[
+ totalArr.length - 1]) {
+ showPagerArr.push(item)
+ }
+ }
+ })
+ if (pagerNum > pagerCount) {
+ if ((pagerCount + 1) / 2 >= num) {
+ showPagerArr[showPagerArr.length - 1] = '...'
+ } else if (num + 2 <= totalNum) {
+ showPagerArr[1] = '...'
+ showPagerArr[showPagerArr.length - 1] = '...'
+ } else {
+ showPagerArr[1] = '...'
+ }
+ showPagerArr.push(totalArr[totalArr.length - 1])
+ } else {
+ if ((pagerCount + 1) / 2 >= num) {} else if (num + 2 <= totalNum) {} else {
+ showPagerArr.shift()
+ showPagerArr.push(totalArr[totalArr.length - 1])
+ }
+ }
+
+ return showPagerArr
+ }
+ },
+ watch: {
+ current: {
+ immediate: true,
+ handler(val, old) {
+ if (val < 1) {
+ this.currentIndex = 1
+ } else {
+ this.currentIndex = val
+ }
+ }
+ },
+ value: {
+ immediate: true,
+ handler(val) {
+ if (Number(this.current) !== 1) return
+ if (val < 1) {
+ this.currentIndex = 1
+ } else {
+ this.currentIndex = val
+ }
+ }
+ }
+ },
+ methods: {
+ // 閫夋嫨鏍囩
+ selectPage(e, index) {
+ if (parseInt(e)) {
+ this.currentIndex = e
+ this.change('current')
+ } else {
+ let pagerNum = Math.ceil(this.total / this.pageSize)
+ // let pagerNum = Math.ceil(181 / this.pageSize)
+ // 涓婁竴椤�
+ if (index <= 1) {
+ if (this.currentIndex - 5 > 1) {
+ this.currentIndex -= 5
+ } else {
+ this.currentIndex = 1
+ }
+ return
+ }
+ // 涓嬩竴椤�
+ if (index >= 6) {
+ if (this.currentIndex + 5 > pagerNum) {
+ this.currentIndex = pagerNum
+ } else {
+ this.currentIndex += 5
+ }
+ return
+ }
+ }
+ },
+ clickLeft() {
+ if (Number(this.currentIndex) === 1) {
+ return
+ }
+ this.currentIndex -= 1
+ this.change('prev')
+ },
+ clickRight() {
+ if (Number(this.currentIndex) >= this.maxPage) {
+ return
+ }
+ this.currentIndex += 1
+ this.change('next')
+ },
+ change(e) {
+ this.$emit('input', this.currentIndex)
+ this.$emit('update:modelValue', this.currentIndex)
+ this.$emit('change', {
+ type: e,
+ current: this.currentIndex
+ })
+ }
+ }
+ }
+</script>
+
+<style lang="scss" scoped>
+ $uni-primary: #2979ff;
+ .uni-pagination {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ position: relative;
+ overflow: hidden;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ }
+
+ .uni-pagination__total {
+ font-size: 14px;
+ color: #999;
+ margin-right: 15px;
+ }
+
+ .uni-pagination__btn {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ cursor: pointer;
+ /* #endif */
+ padding: 0 8px;
+ line-height: 30px;
+ font-size: 12px;
+ position: relative;
+ background-color: #F0F0F0;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ border-radius: 5px;
+ // border-width: 1px;
+ // border-style: solid;
+ // border-color: $uni-border-color;
+ }
+
+ .uni-pagination__child-btn {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ font-size: 12px;
+ position: relative;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ color: #666;
+ font-size: 12px;
+ }
+
+ .uni-pagination__num {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex: 1;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ height: 30px;
+ line-height: 30px;
+ font-size: 12px;
+ color: #666;
+ margin: 0 5px;
+ }
+
+ .uni-pagination__num-tag {
+ /* #ifdef H5 */
+ cursor: pointer;
+ min-width: 30px;
+ /* #endif */
+ margin: 0 5px;
+ height: 30px;
+ text-align: center;
+ line-height: 30px;
+ // border: 1px red solid;
+ color: #999;
+ border-radius: 4px;
+ // border-width: 1px;
+ // border-style: solid;
+ // border-color: $uni-border-color;
+ }
+
+ .uni-pagination__num-current {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: row;
+ }
+
+ .uni-pagination__num-current-text {
+ font-size: 15px;
+ }
+
+ .uni-pagination--enabled {
+ color: #333333;
+ opacity: 1;
+ }
+
+ .uni-pagination--disabled {
+ opacity: 0.5;
+ /* #ifdef H5 */
+ cursor: default;
+ /* #endif */
+ }
+
+ .uni-pagination--hover {
+ color: rgba(0, 0, 0, 0.6);
+ background-color: #eee;
+ }
+
+ .tag--active:hover {
+ color: $uni-primary;
+ }
+
+ .page--active {
+ color: #fff;
+ background-color: $uni-primary;
+ }
+
+ .page--active:hover {
+ color: #fff;
+ }
+
+ /* #ifndef APP-NVUE */
+ .is-pc-hide {
+ display: block;
+ }
+
+ .is-phone-hide {
+ display: none;
+ }
+
+ @media screen and (min-width: 450px) {
+ .is-pc-hide {
+ display: none;
+ }
+
+ .is-phone-hide {
+ display: block;
+ }
+
+ .uni-pagination__num-flex-none {
+ flex: none;
+ }
+ }
+
+ /* #endif */
+</style>
--
Gitblit v1.9.1