20 changed files with 837 additions and 1245 deletions
Unified View
Diff Options
-
+88 -99README.md
-
+7 -0api/model/index.js
-
+1 -1components/base/navbar.vue
-
+0 -251components/sn-swiper/esc-swiper-item/index.vue
-
+0 -21components/sn-swiper/esc-swiper/helper.js
-
+0 -198components/sn-swiper/esc-swiper/index.vue
-
+0 -303components/sn-swiper/esc-swiper/mixins/base.mixin.js
-
+0 -91components/sn-swiper/esc-swiper/mixins/bindingx.js
-
+0 -143components/sn-swiper/esc-swiper/mixins/index.wxs
-
+0 -62components/sn-swiper/esc-swiper/mixins/mpother.js
-
+0 -7components/sn-swiper/esc-swiper/mixins/mpwxs.js
-
+0 -15components/utils/style.js
-
+0 -3pages.json
-
+2 -0pages_order/components/address/addressList.vue
-
+227 -0pages_order/components/address/redactAddressForm.vue
-
+0 -3pages_order/mine/memberCenter.vue
-
+4 -3pages_order/order/giftList.vue
-
+2 -2pages_order/order/instantGift.vue
-
+505 -41pages_order/order/receiveGift.vue
-
+1 -2pages_order/product/productDetail.vue
+ 88
- 99
README.md
View File
+ 7
- 0
api/model/index.js
View File
+ 1
- 1
components/base/navbar.vue
View File
+ 0
- 251
components/sn-swiper/esc-swiper-item/index.vue
View File
| @ -1,251 +0,0 @@ | |||||
| <template> | |||||
| <view class="swiper-item" ref="swiper_item" :style="itemStyle"> | |||||
| <view class="item-cntent" bubble="true" @click.stop="onClick"><slot></slot></view> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import { getStyleStr } from '../../utils/style.js'; | |||||
| // #ifdef APP-NVUE | |||||
| const animation = uni.requireNativePlugin('animation'); | |||||
| // #endif | |||||
| /** | |||||
| * esc-swiper-item | |||||
| * @description esc-swiper-item (不支持使用class) | |||||
| * @property {Number} index 索引(必填) | |||||
| * @property {Boolean} clickAny 可以点击任意项 | |||||
| * @event {Function} click 点击事件 | |||||
| */ | |||||
| export default { | |||||
| name: 'esc-swiper-item', | |||||
| inject: ['config'], | |||||
| props: { | |||||
| index: { | |||||
| type: Number, | |||||
| default: 0 | |||||
| }, | |||||
| clickAny: { | |||||
| type: Boolean, | |||||
| default: false | |||||
| } | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| isAnimated: false, | |||||
| timingFunction: 'cubic-bezier(0.25, 0.46, 0.45, 0.94)', | |||||
| duration: 0, | |||||
| current: 0, | |||||
| position: 0, | |||||
| mScale: 0, | |||||
| canClick: true | |||||
| }; | |||||
| }, | |||||
| created() {}, | |||||
| computed: { | |||||
| size() { | |||||
| return this.config.size; | |||||
| }, | |||||
| width() { | |||||
| return this.config.width; | |||||
| }, | |||||
| height() { | |||||
| return this.config.height; | |||||
| }, | |||||
| itemWidth() { | |||||
| return this.config.itemWidth; | |||||
| }, | |||||
| itemHeight() { | |||||
| return this.config.itemHeight; | |||||
| }, | |||||
| space() { | |||||
| return this.config.space; | |||||
| }, | |||||
| itemStyle() { | |||||
| if (this.index == this.size - 1) { | |||||
| return this.rightSpaceStyle(); | |||||
| } else if (this.index == this.size - 2) { | |||||
| return this.centerSpaceStyle(); | |||||
| } else { | |||||
| return this.leftSpaceStyle(); | |||||
| } | |||||
| }, | |||||
| scale() { | |||||
| if (!this.config.is3D) { | |||||
| return 1; | |||||
| } | |||||
| if (this.myCurrent == this.current) { | |||||
| return this.mScale || this.config.scale; | |||||
| } else { | |||||
| return this.mScale || 1; | |||||
| } | |||||
| }, | |||||
| // 当前swiper-item所属current索引 | |||||
| myCurrent() { | |||||
| if (!this.config.isCircular) { | |||||
| return this.index; | |||||
| } | |||||
| const p = this.index; | |||||
| const plus = this.config.plus; | |||||
| const actSize = this.size - plus * 2; | |||||
| let current = 0; | |||||
| if (p < plus) { | |||||
| current = p + (actSize - plus); | |||||
| } else if (p >= this.size - plus) { | |||||
| current = p - (actSize + plus); | |||||
| } else { | |||||
| current = p - plus; | |||||
| } | |||||
| return current; | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| itemSize() { | |||||
| let style = { | |||||
| width: this.itemWidth + 'rpx', | |||||
| height: (this.itemHeight || this.height) + 'rpx' | |||||
| }; | |||||
| if (this.config.is3D) { | |||||
| // #ifndef APP-NVUE | |||||
| if (this.isAnimated) { | |||||
| style.transition = 'transform ' + this.duration + 'ms ' + this.timingFunction; | |||||
| } else { | |||||
| style.transition = ''; | |||||
| } | |||||
| style.transform = 'scale(' + this.scale + ')'; | |||||
| // #endif | |||||
| // #ifdef APP-NVUE | |||||
| const isIOS = uni.getSystemInfoSync().platform == 'ios'; | |||||
| if (isIOS) { | |||||
| style.transform = 'scale(' + this.scale + ')'; | |||||
| } else { | |||||
| if (!this.isAnimated) style.transform = 'scale(' + this.scale + ')'; | |||||
| } | |||||
| // #endif | |||||
| } | |||||
| return style; | |||||
| }, | |||||
| leftSpaceStyle() { | |||||
| return getStyleStr({ | |||||
| ...this.itemSize(), | |||||
| marginLeft: this.space + 'rpx' | |||||
| }); | |||||
| }, | |||||
| centerSpaceStyle() { | |||||
| return getStyleStr({ | |||||
| ...this.itemSize(), | |||||
| marginLeft: this.space + 'rpx', | |||||
| marginRight: this.space + 'rpx' | |||||
| }); | |||||
| }, | |||||
| rightSpaceStyle() { | |||||
| return getStyleStr({ | |||||
| ...this.itemSize(), | |||||
| marginRight: this.space + 'rpx' | |||||
| }); | |||||
| }, | |||||
| onClick(e) { | |||||
| if (!this.canClick) { | |||||
| return; | |||||
| } | |||||
| // #ifdef APP-NVUE | |||||
| e.stopPropagation(); | |||||
| // #endif | |||||
| // 点击任意项 | |||||
| if (this.clickAny) { | |||||
| this.$emit('click', e); | |||||
| return; | |||||
| } | |||||
| // 只能点击当前项 | |||||
| if (this.myCurrent == this.current) { | |||||
| this.$emit('click', e); | |||||
| } | |||||
| }, | |||||
| restoreScale(duration) { | |||||
| if (!this.config.is3D) { | |||||
| return; | |||||
| } | |||||
| // #ifndef APP-NVUE | |||||
| this.duration = duration; | |||||
| this.isAnimated = true; | |||||
| this.mScale = 0; | |||||
| setTimeout(() => { | |||||
| this.duration = 0; | |||||
| this.isAnimated = false; | |||||
| }, duration); | |||||
| // #endif | |||||
| // #ifdef APP-NVUE | |||||
| this.isAnimated = true; | |||||
| this.mScale = 0; | |||||
| animation.transition( | |||||
| this.$refs['swiper_item'].ref, | |||||
| { | |||||
| styles: { | |||||
| transform: 'scale(' + this.scale + ')' | |||||
| }, | |||||
| duration, //ms | |||||
| timingFunction: this.timingFunction, | |||||
| needLayout: false, | |||||
| delay: 0 //ms | |||||
| }, | |||||
| () => { | |||||
| this.isAnimated = false; | |||||
| } | |||||
| ); | |||||
| // #endif | |||||
| }, | |||||
| restoreToScale(scale, duration) { | |||||
| if (!this.config.is3D) { | |||||
| return; | |||||
| } | |||||
| // #ifndef APP-NVUE | |||||
| this.duration = duration; | |||||
| this.isAnimated = true; | |||||
| this.mScale = scale; | |||||
| setTimeout(() => { | |||||
| this.duration = 0; | |||||
| this.isAnimated = false; | |||||
| this.mScale = 0; | |||||
| }, duration); | |||||
| // #endif | |||||
| // #ifdef APP-NVUE | |||||
| this.isAnimated = true; | |||||
| animation.transition( | |||||
| this.$refs['swiper_item'].ref, | |||||
| { | |||||
| styles: { | |||||
| transform: 'scale(' + scale + ')' | |||||
| }, | |||||
| duration, //ms | |||||
| timingFunction: this.timingFunction, | |||||
| needLayout: false, | |||||
| delay: 0 //ms | |||||
| }, | |||||
| () => { | |||||
| this.isAnimated = false; | |||||
| this.mScale = 0; | |||||
| } | |||||
| ); | |||||
| // #endif | |||||
| } | |||||
| } | |||||
| }; | |||||
| </script> | |||||
| <style scoped> | |||||
| .swiper-item { | |||||
| position: relative; | |||||
| } | |||||
| .item-cntent { | |||||
| position: absolute; | |||||
| top: 0; | |||||
| right: 0; | |||||
| bottom: 0; | |||||
| left: 0; | |||||
| /* #ifndef APP-NVUE */ | |||||
| display: flex; | |||||
| /* #endif */ | |||||
| } | |||||
| </style> | |||||
+ 0
- 21
components/sn-swiper/esc-swiper/helper.js
View File
| @ -1,21 +0,0 @@ | |||||
| /** | |||||
| * getSwiperList | |||||
| * @description 获取Swiper数据 | |||||
| * @param {Array} list 原数据 | |||||
| * @param {Object} options 配置 | |||||
| * @param {Boolean} options.circular 是否循环 | |||||
| * @param {Number} options.plus 左右追加个数(开启循环必填，至少为2) | |||||
| * @return {Array} | |||||
| */ | |||||
| export function getSwiperList(list, options = { | |||||
| circular: true, | |||||
| plus: 2 | |||||
| }) { | |||||
| if (!options.circular) { | |||||
| return list | |||||
| } | |||||
| const plus = options.plus || 2 | |||||
| const leftPlusList = [...list].reverse().slice(0, plus).reverse(); | |||||
| const rightPlusList = [...list].slice(0, plus); | |||||
| return [].concat(leftPlusList).concat(list).concat(rightPlusList); | |||||
| } | |||||
+ 0
- 198
components/sn-swiper/esc-swiper/index.vue
View File
| @ -1,198 +0,0 @@ | |||||
| <template> | |||||
| <!-- #ifdef APP-VUE || H5 --> | |||||
| <view class="box" :style="boxStyle"> | |||||
| <view | |||||
| ref="container" | |||||
| class="container" | |||||
| :change:prop="swipe.changeData" | |||||
| :prop="wxsData" | |||||
| @touchstart.stop="swipe.touchstart" | |||||
| @touchmove.stop="swipe.touchmove" | |||||
| @touchend.stop="swipe.touchend" | |||||
| :style="containerStyle" | |||||
| > | |||||
| <slot></slot> | |||||
| </view> | |||||
| </view> | |||||
| <!-- #endif --> | |||||
| <!-- #ifdef MP-WEIXIN --> | |||||
| <view class="box" :style="boxStyle"> | |||||
| <view | |||||
| ref="container" | |||||
| class="container" | |||||
| :change:prop="swipe.changeData" | |||||
| :prop="wxsData" | |||||
| @touchstart="swipe.touchstart" | |||||
| @touchmove="swipe.touchmove" | |||||
| @touchend="swipe.touchend" | |||||
| :style="containerStyle" | |||||
| > | |||||
| <slot></slot> | |||||
| </view> | |||||
| </view> | |||||
| <!-- #endif --> | |||||
| <!-- #ifdef APP-NVUE --> | |||||
| <view class="box" :style="boxStyle"> | |||||
| <view ref="container" class="container" @horizontalpan="touchstart" :style="containerStyle"><slot></slot></view> | |||||
| </view> | |||||
| <!-- #endif --> | |||||
| <!-- 其他平台使用 js ，长列表性能可能会有影响--> | |||||
| <!-- #ifndef APP-PLUS || MP-WEIXIN || H5 --> | |||||
| <view class="box" @touchstart="touchstart" @touchmove="touchmove" @touchend="touchend" :style="boxStyle"> | |||||
| <view ref="container" class="container" :style="containerStyle"><slot></slot></view> | |||||
| </view> | |||||
| <!-- #endif --> | |||||
| </template> | |||||
| <script src="./mixins/index.wxs" module="swipe" lang="wxs"></script> | |||||
| <script> | |||||
| import SwiperMixin from './mixins/base.mixin.js'; | |||||
| // #ifdef APP-VUE || MP-WEIXIN || H5 | |||||
| import MpMixin from './mixins/mpwxs.js'; | |||||
| // #endif | |||||
| // #ifdef APP-NVUE | |||||
| import BindingxMixin from './mixins/bindingx.js'; | |||||
| // #endif | |||||
| // #ifndef APP-PLUS || MP-WEIXIN || H5 | |||||
| import OtherMixin from './mixins/mpother.js'; | |||||
| // #endif | |||||
| const mixins = [ | |||||
| // #ifdef APP-VUE || MP-WEIXIN || H5 | |||||
| MpMixin, | |||||
| // #endif | |||||
| // #ifdef APP-NVUE | |||||
| BindingxMixin, | |||||
| // #endif | |||||
| // #ifndef APP-PLUS || MP-WEIXIN || H5 | |||||
| OtherMixin, | |||||
| // #endif | |||||
| SwiperMixin | |||||
| ]; | |||||
| /** | |||||
| * esc-swiper | |||||
| * @description 自定义swiper (不支持使用class) | |||||
| * @property {String} mode = [normal|3d] 模式 | |||||
| * @property {Number} scale 3D模式选中项的scale | |||||
| * @property {Number} width 宽 | |||||
| * @property {Number} height 高 | |||||
| * @property {Number} itemWidth 项宽 | |||||
| * @property {Number} itemHeight 项高 | |||||
| * @property {Number} space 间距 | |||||
| * @property {Number} plus 左右追加个数(开启循环必填，至少为2) | |||||
| * @property {Number} current 选中项索引 | |||||
| * @property {Boolean} autoplay 自动轮播 | |||||
| * @property {Boolean} circular 是否循环,如果开启，至少需要3项 | |||||
| * @property {Boolean} bounce 阻尼效果 | |||||
| * @event {Function} change 索引变化 | |||||
| */ | |||||
| export default { | |||||
| name: 'esc-swiper', | |||||
| mixins, | |||||
| props: { | |||||
| mode: { | |||||
| type: String, | |||||
| default: 'normal' | |||||
| }, | |||||
| scale: Number, | |||||
| width: Number, | |||||
| height: Number, | |||||
| itemWidth: { | |||||
| type: Number, | |||||
| default: 0 | |||||
| }, | |||||
| itemHeight: { | |||||
| type: Number, | |||||
| default: 0 | |||||
| }, | |||||
| space: { | |||||
| type: Number, | |||||
| default: 0 | |||||
| }, | |||||
| plus: { | |||||
| type: Number, | |||||
| default: 0 | |||||
| }, | |||||
| autoplay: { | |||||
| type: Boolean, | |||||
| default: false | |||||
| }, | |||||
| current: { | |||||
| type: Number, | |||||
| default: 0 | |||||
| }, | |||||
| interval: { | |||||
| type: Number, | |||||
| default: 5000 | |||||
| }, | |||||
| duration: { | |||||
| type: Number, | |||||
| default: 500 | |||||
| }, | |||||
| circular: { | |||||
| type: Boolean, | |||||
| default: false | |||||
| }, | |||||
| bounce: { | |||||
| type: Boolean, | |||||
| default: true | |||||
| }, | |||||
| size: { | |||||
| type: Number, | |||||
| default: 0 | |||||
| } | |||||
| }, | |||||
| provide() { | |||||
| return { | |||||
| config: { | |||||
| is3D: this.is3D, | |||||
| isCircular: this.circular, | |||||
| scale: this.scale, | |||||
| size: this._size, | |||||
| width: this.width, | |||||
| height: this.height, | |||||
| itemWidth: this.itemWidth, | |||||
| itemHeight: this.itemHeight, | |||||
| space: this.space, | |||||
| plus: this.plus | |||||
| } | |||||
| }; | |||||
| }, | |||||
| mounted() { | |||||
| if (this.autoplay) { | |||||
| this.autoplayInterval = setInterval(() => { | |||||
| this.next(); | |||||
| }, this.interval); | |||||
| } | |||||
| }, | |||||
| watch: { | |||||
| autoplay(newV) { | |||||
| if (!newV) { | |||||
| clearInterval(this.autoplayInterval); | |||||
| } else { | |||||
| this.autoplayInterval = setInterval(() => { | |||||
| this.next(); | |||||
| }, this.interval); | |||||
| } | |||||
| } | |||||
| }, | |||||
| methods: {} | |||||
| }; | |||||
| </script> | |||||
| <style scoped> | |||||
| .box { | |||||
| position: relative; | |||||
| overflow: hidden; | |||||
| } | |||||
| .container { | |||||
| position: absolute; | |||||
| top: 0; | |||||
| /* #ifndef APP-NVUE */ | |||||
| display: flex; | |||||
| /* #endif */ | |||||
| flex-direction: row; | |||||
| align-items: center; | |||||
| } | |||||
| </style> | |||||
+ 0
- 303
components/sn-swiper/esc-swiper/mixins/base.mixin.js
View File
| @ -1,303 +0,0 @@ | |||||
| import { | |||||
| getStyleStr | |||||
| } from '../../../utils/style.js'; | |||||
| // #ifdef APP-NVUE | |||||
| const animation = uni.requireNativePlugin('animation') | |||||
| // #endif | |||||
| export default { | |||||
| data() { | |||||
| return { | |||||
| timingFunction: 'cubic-bezier(0.25, 0.46, 0.45, 0.94)', | |||||
| isAnimated: false, | |||||
| isScrolling: false, | |||||
| customDuration: 0, | |||||
| left: 0, | |||||
| mCurrent: this.current | |||||
| }; | |||||
| }, | |||||
| created() {}, | |||||
| mounted() { | |||||
| // #ifdef MP | |||||
| this.swiperViews = this.$children | |||||
| // #endif | |||||
| // #ifdef APP-PLUS || H5 | |||||
| this.swiperViews = this.$slots.default.map(it => it.child) | |||||
| // #endif | |||||
| this._setLeft(); | |||||
| this.mCurrent = this.current | |||||
| this._notifyCurrentForItems(this.current, this.position) | |||||
| }, | |||||
| watch: { | |||||
| mCurrent() { | |||||
| let current = this.mCurrent | |||||
| if (this.circular) { | |||||
| if (this.position == 1) { | |||||
| current = this.actualSize - (this.plus - 1) | |||||
| // console.log('最前了', current) | |||||
| } else if (this.position == this._size - 2) { | |||||
| current = this.plus - 2; | |||||
| // console.log('最后了', current) | |||||
| } | |||||
| if (current < 0) { | |||||
| current = this.position + 1 | |||||
| } | |||||
| current %= this.actualSize | |||||
| } | |||||
| // console.log('position', this.position, current) | |||||
| this.$emit('update:current', current) | |||||
| this.$emit('change', current) | |||||
| this._notifyCurrentForItems(current, this.position) | |||||
| } | |||||
| }, | |||||
| computed: { | |||||
| is3D() { | |||||
| return this.mode == '3d' | |||||
| }, | |||||
| position() { | |||||
| return this.circular ? (this.mCurrent + this.plus) : this.mCurrent | |||||
| }, | |||||
| manualDuration() { | |||||
| if (this.customDuration > 0) | |||||
| return this.customDuration | |||||
| return this.isAnimated ? this.duration : 0 | |||||
| }, | |||||
| boxStyle() { | |||||
| return getStyleStr({ | |||||
| width: this.width + 'rpx', | |||||
| height: this.height + 'rpx' | |||||
| }); | |||||
| }, | |||||
| containerStyle() { | |||||
| const style = { | |||||
| height: this.height + 'rpx' | |||||
| }; | |||||
| // #ifdef APP-NVUE | |||||
| // FIXME: 理论isAnimated=false应该不设置transform,但是ios有个奇怪的问题，top不为0导致布局错位 | |||||
| const isIOS = uni.getSystemInfoSync().platform == 'ios' | |||||
| if (isIOS) { | |||||
| style.transform = 'translate(' + uni.upx2px(this.left) + 'px' + ',0px)' | |||||
| } else { | |||||
| if (this.isAnimated == false) { | |||||
| style.transform = 'translate(' + uni.upx2px(this.left) + 'px' + ',0px)' | |||||
| } | |||||
| } | |||||
| // #endif | |||||
| // #ifndef APP-NVUE | |||||
| style.left = this.left + 'rpx' | |||||
| style.transition = 'left ' + this.manualDuration + 'ms ' + this.timingFunction | |||||
| // #endif | |||||
| return getStyleStr(style); | |||||
| }, | |||||
| _size() { | |||||
| return (this.$slots && this.$slots.default && this.$slots.default.length) || this.size; | |||||
| }, | |||||
| // plus * 2 | |||||
| plusSize() { | |||||
| return this.circular ? this.plus * 2 : 0; | |||||
| }, | |||||
| // 真实长度 | |||||
| actualSize() { | |||||
| return this._size - this.plusSize; | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| prev() { | |||||
| if (this.isAnimated) return; | |||||
| if (this.isScrolling) return; | |||||
| if (this.mCurrent == 0 && this.circular == false) return | |||||
| this.mCurrent--; | |||||
| this._run() | |||||
| }, | |||||
| next() { | |||||
| if (this.isAnimated) return; | |||||
| if (this.isScrolling) return; | |||||
| if (this.circular == true) { | |||||
| this.mCurrent++; | |||||
| if (this.mCurrent == this._size) { | |||||
| this.mCurrent = 0; | |||||
| } | |||||
| } else { | |||||
| if (this.mCurrent == this._size - 1) return | |||||
| this.mCurrent++; | |||||
| } | |||||
| this._run() | |||||
| }, | |||||
| moveTo(e) { | |||||
| if (this.isAnimated) return | |||||
| const { | |||||
| deltaX, | |||||
| left | |||||
| } = e | |||||
| this.isScrolling = true | |||||
| if (!this.circular) { | |||||
| if ( | |||||
| // 第一项，不能向右滑(上一项) | |||||
| (deltaX > 0 && this.mCurrent == 0) || | |||||
| // 最后一项，不能向左滑(下一项) | |||||
| (deltaX < 0 && this.mCurrent == this._size - 1) | |||||
| ) { | |||||
| if (!this.bounce) return | |||||
| // 添加阻尼滑动 | |||||
| const _left = this._left || this.wxsData.left | |||||
| this.left = _left + (deltaX * (1 - Math.abs(deltaX) * 3 / (this.width * 5))) | |||||
| this._set3DScale(deltaX) | |||||
| return | |||||
| } | |||||
| } | |||||
| this.left = left | |||||
| this._set3DScale(deltaX) | |||||
| }, | |||||
| moveEnd(e) { | |||||
| const { | |||||
| velocity, | |||||
| deltaX, | |||||
| deltaY | |||||
| } = e | |||||
| this.isScrolling = false | |||||
| if (!this.circular) { | |||||
| // 第一项，不能向右滑(上一项) | |||||
| if (deltaX > 0 && this.mCurrent == 0) { | |||||
| this._restoreStartTouch() | |||||
| return | |||||
| } | |||||
| // 最后一项，不能向左滑(下一项) | |||||
| if (deltaX < 0 && this.mCurrent == this._size - 1) { | |||||
| this._restoreStartTouch() | |||||
| return | |||||
| } | |||||
| } | |||||
| const isTurnPage = Math.abs(deltaX) > this.itemWidth / 2 | |||||
| if (isTurnPage || velocity > 0.2) { | |||||
| if (deltaX < 0) { | |||||
| this.customDuration = 350 | |||||
| this.next() | |||||
| } else if (deltaX > 0) { | |||||
| this.customDuration = 350 | |||||
| this.prev() | |||||
| } | |||||
| } else { | |||||
| this._restoreStartTouch() | |||||
| } | |||||
| }, | |||||
| _set3DScale(deltaX) { | |||||
| if (this.is3D) { | |||||
| const min = Math.min | |||||
| const maxScale = Math.abs(this.scale - 1) | |||||
| const mScale = deltaX * maxScale / this.width | |||||
| const mRealScale = min(this.scale, this.scale - Math.abs(mScale)) | |||||
| this.swiperViews[this.position].mScale = mRealScale < 1 ? 1 : mRealScale | |||||
| if (this.position - 1 > -1) { | |||||
| this.swiperViews[this.position - 1].mScale = mScale > 0 ? min(this.scale, 1 + mScale) : min(1, 1 + mScale) | |||||
| } | |||||
| if (this.position + 1 < this._size) { | |||||
| this.swiperViews[this.position + 1].mScale = mScale > 0 ? min(1, 1 - mScale) : min(this.scale, 1 - mScale) | |||||
| } | |||||
| } | |||||
| }, | |||||
| _restoreStartTouch() { | |||||
| const self = this | |||||
| this.customDuration = 300 | |||||
| // #ifdef APP-VUE || MP-WEIXIN || H5 | |||||
| this.left = this.wxsData.left | |||||
| // #endif | |||||
| // #ifndef APP-PLUS || MP-WEIXIN || H5 | |||||
| this.left = this._left | |||||
| // #endif | |||||
| this._run(false) | |||||
| if (this.is3D) { | |||||
| this.swiperViews[this.position].restoreScale(this.manualDuration) | |||||
| if (this.position - 1 > -1) { | |||||
| this.swiperViews[this.position - 1].restoreScale(this.manualDuration) | |||||
| } | |||||
| if (this.position + 1 < this._size) { | |||||
| this.swiperViews[this.position + 1].restoreScale(this.manualDuration) | |||||
| } | |||||
| } | |||||
| }, | |||||
| _notifyCurrentForItems(current, position) { | |||||
| this.swiperViews && this.swiperViews.forEach(it => { | |||||
| it.current = current | |||||
| it.position = position | |||||
| }) | |||||
| }, | |||||
| _run(isSet = true) { | |||||
| this.isAnimated = true; | |||||
| if (isSet) | |||||
| this._setLeft(); | |||||
| const self = this; | |||||
| if (this.is3D) { | |||||
| this.swiperViews[this.position].restoreToScale(this.scale, this.manualDuration) | |||||
| if (this.position - 1 > -1) { | |||||
| this.swiperViews[this.position - 1].restoreToScale(1, this.manualDuration) | |||||
| } | |||||
| if (this.position + 1 < this._size) { | |||||
| this.swiperViews[this.position + 1].restoreToScale(1, this.manualDuration) | |||||
| } | |||||
| } | |||||
| // #ifdef APP-NVUE | |||||
| animation.transition(this.$refs.container, { | |||||
| styles: { | |||||
| transform: 'translate(' + uni.upx2px(this.left) + 'px' + ',0px)', | |||||
| }, | |||||
| duration: this.manualDuration, //ms | |||||
| timingFunction: this.timingFunction, | |||||
| needLayout: false, | |||||
| delay: 0 //ms | |||||
| }, function() { | |||||
| self._reset(); | |||||
| }) | |||||
| // #endif | |||||
| // #ifndef APP-NVUE | |||||
| setTimeout(() => { | |||||
| this._reset(); | |||||
| }, this.manualDuration); | |||||
| // #endif | |||||
| }, | |||||
| _setLeft() { | |||||
| if (this.circular == true) { | |||||
| const s1 = (this.width - this.itemWidth - this.space * 2) / 2; | |||||
| let left = (this.plus + this.mCurrent) * (this.space + this.itemWidth) - s1; | |||||
| this.left = -left; | |||||
| } else { | |||||
| this.left = -(this.itemWidth + this.space) * this.mCurrent | |||||
| } | |||||
| // #ifdef APP-VUE || MP-WEIXIN || H5 | |||||
| this.wxsData = { | |||||
| left: this.left, | |||||
| bounce: this.bounce | |||||
| } | |||||
| // #endif | |||||
| }, | |||||
| _reset() { | |||||
| this.isScrolling = false | |||||
| this.isAnimated = false | |||||
| this.customDuration = 0 | |||||
| if (this.circular == true) { | |||||
| if (this.position == 1) { | |||||
| this.mCurrent = this.actualSize - (this.plus - 1); | |||||
| this._setLeft(); | |||||
| this._restoreScale() | |||||
| } | |||||
| // -2：原数组索引-1 + plus数组索引-1 | |||||
| if (this.position == this._size - 2) { | |||||
| this.mCurrent = this.plus - 2; | |||||
| this._setLeft(); | |||||
| this._restoreScale() | |||||
| } | |||||
| } | |||||
| }, | |||||
| _restoreScale() { | |||||
| if (this.is3D) { | |||||
| this.swiperViews[this.position].restoreToScale(this.scale, 0) | |||||
| if (this.position - 1 > -1) { | |||||
| this.swiperViews[this.position - 1].restoreToScale(1, 0) | |||||
| } | |||||
| if (this.position + 1 < this._size) { | |||||
| this.swiperViews[this.position + 1].restoreToScale(1, 0) | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
+ 0
- 91
components/sn-swiper/esc-swiper/mixins/bindingx.js
View File
| @ -1,91 +0,0 @@ | |||||
| const BindingX = uni.requireNativePlugin('bindingx'); | |||||
| const animation = uni.requireNativePlugin('animation'); | |||||
| export default { | |||||
| mounted() { | |||||
| this.container = this.getEl(this.$refs['container']) | |||||
| }, | |||||
| methods: { | |||||
| _notifyTouchChangeForItems(isTouchEnd) { | |||||
| this.swiperViews && this.swiperViews.forEach(it => { | |||||
| it.canClick = isTouchEnd | |||||
| }) | |||||
| }, | |||||
| touchstart(e) { | |||||
| if (this.isAnimated) return; | |||||
| if (this.stop) return | |||||
| this.isScrolling = true | |||||
| this._notifyTouchChangeForItems(false) | |||||
| this.stop = true | |||||
| this.startTime = new Date().getTime() | |||||
| const props = [{ | |||||
| element: this.container, | |||||
| property: 'transform.translateX', | |||||
| expression: uni.upx2px(this.left) + '+x' | |||||
| }] | |||||
| if (this.is3D) { | |||||
| const deltaScale = `${this.scale}/${this.width}*x` | |||||
| const currentScale = `${this.scale}-abs(x)/${this.width}*1` | |||||
| const realScale = `min(${currentScale},${this.scale})` | |||||
| const currentCardExp = `${realScale} < 1 ? 1 : ${realScale}`; | |||||
| const leftCardExp = `${deltaScale} > 0 ? min(${this.scale},(1 + ${deltaScale})) : min(1,(1 + ${deltaScale}))`; | |||||
| const rightCardExp = `${deltaScale} > 0 ? min(1,(1 - ${deltaScale})) : min(${this.scale},(1 - ${deltaScale}))`; | |||||
| props.push({ | |||||
| element: this.getSwipteItemEl(this.position), | |||||
| property: 'transform.scale', | |||||
| expression: currentCardExp | |||||
| }) | |||||
| if (this.position - 1 > -1) { | |||||
| props.push({ | |||||
| element: this.getSwipteItemEl(this.position - 1), | |||||
| property: 'transform.scale', | |||||
| expression: leftCardExp | |||||
| }) | |||||
| } | |||||
| if (this.position + 1 > this._size) { | |||||
| props.push({ | |||||
| element: this.getSwipteItemEl(this.position + 1), | |||||
| property: 'transform.scale', | |||||
| expression: rightCardExp | |||||
| }) | |||||
| } | |||||
| } | |||||
| this.eventpan = BindingX.bind({ | |||||
| anchor: this.container, | |||||
| eventType: 'pan', | |||||
| props | |||||
| }, (e) => { | |||||
| if (e.state === 'end' || | |||||
| e.state === 'exit') { | |||||
| setTimeout(() => { | |||||
| this._notifyTouchChangeForItems(true) | |||||
| }, 10) | |||||
| const timing = new Date().getTime() - this.startTime | |||||
| const velocity = Math.abs(e.deltaX / timing) | |||||
| this.stop = false | |||||
| this.isScrolling = false | |||||
| if (this.eventpan && this.eventpan.token) { | |||||
| BindingX.unbind({ | |||||
| token: this.eventpan.token, | |||||
| eventType: 'pan' | |||||
| }) | |||||
| } | |||||
| this.moveEnd({ | |||||
| velocity, | |||||
| deltaX: e.deltaX, | |||||
| deltaY: e.deltaY | |||||
| }) | |||||
| } | |||||
| }) | |||||
| }, | |||||
| getSwipteItemEl(idx) { | |||||
| return this.swiperViews[idx].$el.ref | |||||
| }, | |||||
| /** | |||||
| * 获取ref | |||||
| * @param {Object} el | |||||
| */ | |||||
| getEl(el) { | |||||
| return el.ref | |||||
| } | |||||
| } | |||||
| } | |||||
+ 0
- 143
components/sn-swiper/esc-swiper/mixins/index.wxs
View File
| @ -1,143 +0,0 @@ | |||||
| var MIN_DISTANCE = 10; | |||||
| function changeData(newValue, oldValue, ownerInstance, instance) { | |||||
| var state = instance.getState(); | |||||
| if (newValue.left != undefined) { | |||||
| state.left = newValue.left | |||||
| } | |||||
| if (newValue.bounce != undefined) { | |||||
| state.bounce = newValue.bounce | |||||
| } | |||||
| // console.log('changeData', JSON.stringify(newValue)) | |||||
| } | |||||
| /** | |||||
| * 开始触摸操作 | |||||
| * @param {Object} e | |||||
| * @param {Object} ins | |||||
| */ | |||||
| function touchstart(e, ins) { | |||||
| var instance = e.instance; | |||||
| // 计算滑动开始位置 | |||||
| stopTouchStart(e, ins) | |||||
| } | |||||
| /** | |||||
| * 开始滑动操作 | |||||
| * @param {Object} e | |||||
| * @param {Object} ownerInstance | |||||
| */ | |||||
| function touchmove(e, ownerInstance) { | |||||
| var instance = e.instance; | |||||
| // 是否可以滑动页面 | |||||
| stopTouchMove(e); | |||||
| if (e.preventDefault) { | |||||
| // 阻止页面滚动 | |||||
| e.preventDefault() | |||||
| } | |||||
| // var state = instance.getState(); | |||||
| // && state.bounce | |||||
| move(instance, ownerInstance) | |||||
| return false | |||||
| } | |||||
| /** | |||||
| * 结束触摸操作 | |||||
| * @param {Object} e | |||||
| * @param {Object} ownerInstance | |||||
| */ | |||||
| function touchend(e, ownerInstance) { | |||||
| var instance = e.instance; | |||||
| var state = instance.getState() | |||||
| ownerInstance.callMethod('moveEnd', { | |||||
| velocity: Math.abs(state.deltaX / state.timing), | |||||
| direction: state.direction, | |||||
| deltaX: state.deltaX, | |||||
| deltaY: state.deltaY | |||||
| }) | |||||
| } | |||||
| /** | |||||
| * 设置移动距离 | |||||
| * @param {Object} instance | |||||
| * @param {Object} ownerInstance | |||||
| */ | |||||
| function move(instance, ownerInstance) { | |||||
| var state = instance.getState() | |||||
| var value = state.deltaX || 0 | |||||
| var state = instance.getState() | |||||
| if (state.direction == 'horizontal') { | |||||
| // instance.requestAnimationFrame(function() { | |||||
| // instance.setStyle({ | |||||
| // transform: 'translateX(' + value + 'px)', | |||||
| // '-webkit-transform': 'translateX(' + value + 'px)' | |||||
| // }) | |||||
| // }) | |||||
| ownerInstance.callMethod('moveTo', { | |||||
| deltaX: value, | |||||
| deltaY: state.deltaY || 0, | |||||
| left: state.left + value | |||||
| }) | |||||
| } | |||||
| } | |||||
| /** | |||||
| * 滑动中，是否禁止打开 | |||||
| * @param {Object} event | |||||
| */ | |||||
| function stopTouchMove(event) { | |||||
| var instance = event.instance; | |||||
| var state = instance.getState(); | |||||
| var touch = event.touches[0]; | |||||
| state.timing = getDate().getTime() - state.startTime; | |||||
| state.deltaX = touch.clientX - state.startX; | |||||
| state.deltaY = touch.clientY - state.startY; | |||||
| state.offsetX = Math.abs(state.deltaX); | |||||
| state.offsetY = Math.abs(state.deltaY); | |||||
| state.direction = state.direction || getDirection(state.offsetX, state.offsetY); | |||||
| } | |||||
| /** | |||||
| * 设置滑动开始位置 | |||||
| * @param {Object} event | |||||
| */ | |||||
| function stopTouchStart(event) { | |||||
| var instance = event.instance; | |||||
| var state = instance.getState(); | |||||
| resetTouchStatus(instance); | |||||
| var touch = event.touches[0]; | |||||
| state.startTime = getDate().getTime(); | |||||
| state.startX = touch.clientX; | |||||
| state.startY = touch.clientY; | |||||
| } | |||||
| function getDirection(x, y) { | |||||
| if (x > y && x > MIN_DISTANCE) { | |||||
| return 'horizontal'; | |||||
| } | |||||
| if (y > x && y > MIN_DISTANCE) { | |||||
| return 'vertical'; | |||||
| } | |||||
| return ''; | |||||
| } | |||||
| /** | |||||
| * 重置滑动状态 | |||||
| * @param {Object} event | |||||
| */ | |||||
| function resetTouchStatus(instance) { | |||||
| var state = instance.getState(); | |||||
| state.direction = ''; | |||||
| state.deltaX = 0; | |||||
| state.deltaY = 0; | |||||
| state.offsetX = 0; | |||||
| state.offsetY = 0; | |||||
| } | |||||
| module.exports = { | |||||
| changeData: changeData, | |||||
| touchstart: touchstart, | |||||
| touchmove: touchmove, | |||||
| touchend: touchend | |||||
| } | |||||
+ 0
- 62
components/sn-swiper/esc-swiper/mixins/mpother.js
View File
| @ -1,62 +0,0 @@ | |||||
| const MIN_DISTANCE = 10; | |||||
| export default { | |||||
| methods: { | |||||
| touchstart(e) { | |||||
| this._left = this.left | |||||
| this.stopTouchStart(e) | |||||
| }, | |||||
| touchmove(e) { | |||||
| // 是否可以滑动页面 | |||||
| this.stopTouchMove(e); | |||||
| if (this.direction == 'horizontal') { | |||||
| this.moveTo({ | |||||
| deltaX: this.deltaX, | |||||
| deltaY: this.deltaY || 0, | |||||
| left: this._left + this.deltaX | |||||
| }) | |||||
| } | |||||
| // FIXME: 冒泡 | |||||
| return false | |||||
| }, | |||||
| touchend() { | |||||
| this.moveEnd({ | |||||
| velocity: Math.abs(this.deltaX / this.timing), | |||||
| direction: this.direction, | |||||
| deltaX: this.deltaX, | |||||
| deltaY: this.deltaY, | |||||
| }) | |||||
| }, | |||||
| stopTouchStart(event) { | |||||
| this.resetTouchStatus(); | |||||
| const touch = event.touches[0]; | |||||
| this.startTime = new Date().getTime(); | |||||
| this.startX = touch.clientX; | |||||
| this.startY = touch.clientY; | |||||
| }, | |||||
| stopTouchMove(event) { | |||||
| const touch = event.touches[0]; | |||||
| this.timing = new Date().getTime() - this.startTime; | |||||
| this.deltaX = touch.clientX - this.startX; | |||||
| this.deltaY = touch.clientY - this.startY; | |||||
| this.offsetX = Math.abs(this.deltaX); | |||||
| this.offsetY = Math.abs(this.deltaY); | |||||
| this.direction = this.direction || this.getDirection(this.offsetX, this.offsetY); | |||||
| }, | |||||
| getDirection(x, y) { | |||||
| if (x > y && x > MIN_DISTANCE) { | |||||
| return 'horizontal'; | |||||
| } | |||||
| if (y > x && y > MIN_DISTANCE) { | |||||
| return 'vertical'; | |||||
| } | |||||
| return ''; | |||||
| }, | |||||
| resetTouchStatus() { | |||||
| this.direction = ''; | |||||
| this.deltaX = 0; | |||||
| this.deltaY = 0; | |||||
| this.offsetX = 0; | |||||
| this.offsetY = 0; | |||||
| } | |||||
| } | |||||
| } | |||||
+ 0
- 7
components/sn-swiper/esc-swiper/mixins/mpwxs.js
View File
| @ -1,7 +0,0 @@ | |||||
| export default { | |||||
| data() { | |||||
| return { | |||||
| wxsData: {} | |||||
| } | |||||
| } | |||||
| } | |||||
+ 0
- 15
components/utils/style.js
View File
| @ -1,15 +0,0 @@ | |||||
| const toLine = (name) => { | |||||
| return name.replace(/([A-Z])/g, '-$1').toLowerCase(); | |||||
| } | |||||
| /** | |||||
| * style对象转化为style字符串 | |||||
| * @return {string} | |||||
| */ | |||||
| export const getStyleStr = (styleObject) => { | |||||
| let transfrom = ''; | |||||
| for (let i in styleObject) { | |||||
| let line = toLine(i); | |||||
| transfrom += line + ':' + styleObject[i] + ';'; | |||||
| } | |||||
| return transfrom | |||||
| } | |||||
+ 0
- 3
pages.json
View File
+ 2
- 0
pages_order/components/address/addressList.vue
View File
+ 227
- 0
pages_order/components/address/redactAddressForm.vue
View File
| @ -0,0 +1,227 @@ | |||||
| <template> | |||||
| <view class="redact-address"> | |||||
| <uv-form label-width="210rpx" :model="addressDetail" ref="form"> | |||||
| <uv-form-item label="联系人" prop="name"> | |||||
| <uv-input v-model="addressDetail.name" placeholder="请输入联系人姓名" border="none"> | |||||
| </uv-input> | |||||
| </uv-form-item> | |||||
| <uv-form-item label="手机号" prop="phone"> | |||||
| <uv-input v-model="addressDetail.phone" placeholder="请输入手机号" border="none"> | |||||
| </uv-input> | |||||
| </uv-form-item> | |||||
| <uv-form-item label="所在地区" prop="address"> | |||||
| <uv-input v-model="addressDetail.address" placeholder="请选择所在地区" border="none"> | |||||
| </uv-input> | |||||
| <template #right> | |||||
| <view style="padding-right: 40rpx;color: #FBAB32;" @click.stop="selectAddr"> | |||||
| <image src="../../static/address/selectIcon.png" mode="aspectFit"></image>定位 | |||||
| </view> | |||||
| </template> | |||||
| </uv-form-item> | |||||
| <uv-form-item label="详细地址" prop="addressDetail"> | |||||
| <uv-input v-model="addressDetail.addressDetails" placeholder="请输入详细地址" border="none"> | |||||
| </uv-input> | |||||
| </uv-form-item> | |||||
| </uv-form> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import Position from '@/utils/position.js' | |||||
| export default { | |||||
| data() { | |||||
| return { | |||||
| addressDetail: { | |||||
| name: '', | |||||
| phone: '', | |||||
| address: '', | |||||
| addressDetails: '', | |||||
| defaultFlag: '', | |||||
| latitude: '', | |||||
| longitude: '' | |||||
| } | |||||
| } | |||||
| }, | |||||
| props: { | |||||
| title: { | |||||
| type: String, | |||||
| default: '新增地址' | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| open(addressDetail) { | |||||
| this.addressDetail = addressDetail | |||||
| this.$refs.addressPopup.open('bottom') | |||||
| }, | |||||
| close(){ | |||||
| this.$refs.addressPopup.close() | |||||
| }, | |||||
| //新增和修改地址 | |||||
| onSubmit() { | |||||
| let isOk = this.parameterVerification(this.addressDetail) | |||||
| if (isOk && !isOk.auth) { | |||||
| return uni.showToast({ | |||||
| icon: 'none', | |||||
| title: isOk.title, | |||||
| 'zIndex': 10000 | |||||
| }) | |||||
| } | |||||
| this.$emit('saveOrUpdate', this.addressDetail) | |||||
| }, | |||||
| //验证用户参数合法性 | |||||
| parameterVerification(addressForm) { | |||||
| let { | |||||
| name, | |||||
| phone, | |||||
| address, | |||||
| addressDetails | |||||
| } = addressForm | |||||
| if (name.trim() == '') { | |||||
| return { | |||||
| title: '请填写联系人', | |||||
| auth: false | |||||
| } | |||||
| } else if (phone.trim() == '') { | |||||
| return { | |||||
| title: '请填写手机号', | |||||
| auth: false | |||||
| } | |||||
| } else if (address.trim() == '') { | |||||
| return { | |||||
| title: '请填写所在地区', | |||||
| auth: false | |||||
| } | |||||
| } else if (addressDetails.trim() == '') { | |||||
| return { | |||||
| title: '请填写详细地址', | |||||
| auth: false | |||||
| } | |||||
| } else if (phone.trim() != '') { | |||||
| if (!this.$utils.verificationPhone(phone)) { | |||||
| return { | |||||
| title: '手机号格式不合法', | |||||
| auth: false | |||||
| } | |||||
| } | |||||
| } | |||||
| return { | |||||
| title: '验证通过', | |||||
| auth: true | |||||
| } | |||||
| }, | |||||
| //地图上选择地址 | |||||
| selectAddr() { | |||||
| // Position.getLocation(res => { | |||||
| Position.selectAddress(0, 0, success => { | |||||
| this.setAddress(success) | |||||
| }) | |||||
| // }) | |||||
| }, | |||||
| //提取用户选择的地址信息复制给表单数据 | |||||
| setAddress(res) { | |||||
| //经纬度信息 | |||||
| this.addressDetail.latitude = res.latitude | |||||
| this.addressDetail.longitude = res.longitude | |||||
| if (!res.address && res.name) { //用户直接选择城市的逻辑 | |||||
| return this.addressDetail.address = res.name | |||||
| } | |||||
| if (res.address || res.name) { | |||||
| return this.addressDetail.address = res.address + res.name | |||||
| } | |||||
| this.addressDetail.address = '' //用户啥都没选就点击勾选 | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style lang="scss" scoped> | |||||
| .redact-address { | |||||
| box-sizing: border-box; | |||||
| .redact-address-title { | |||||
| height: 80rpx; | |||||
| line-height: 80rpx; | |||||
| font-size: 30rpx; | |||||
| color: #333333; | |||||
| font-weight: 600; | |||||
| } | |||||
| .save { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| width: 90%; | |||||
| height: 80rpx; | |||||
| border-radius: 40rpx; | |||||
| color: white; | |||||
| font-size: 28rpx; | |||||
| margin: 0rpx auto; | |||||
| background: $uni-color; | |||||
| margin-top: 150rpx; | |||||
| } | |||||
| image { | |||||
| width: 25rpx; | |||||
| height: 25rpx; | |||||
| } | |||||
| //修改组件默认样式 | |||||
| .uv-form { | |||||
| padding: 30rpx 0rpx; | |||||
| } | |||||
| .uv-input__content__field-wrapper__field{ | |||||
| padding: 30rpx !important; | |||||
| height: 180rpx !important; | |||||
| } | |||||
| &::v-deep .uv-cell { | |||||
| padding: 0rpx 0rpx; | |||||
| font-size: 26rpx; | |||||
| &::after { | |||||
| border: none !important; | |||||
| } | |||||
| .uv-field__label { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| height: 80rpx; | |||||
| } | |||||
| .uv-field__control, | |||||
| .uv-field__right-icon { | |||||
| height: 80rpx; | |||||
| font-size: 26rpx; | |||||
| border-bottom: 2rpx solid #cbc8c8; | |||||
| } | |||||
| .uv-field__right-icon { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| height: 78rpx; | |||||
| color: #5FCC9F; | |||||
| } | |||||
| .uv-cell__value { | |||||
| height: 120rpx; | |||||
| } | |||||
| } | |||||
| &::v-deep .uv-field__error-message { | |||||
| color: #5AC796; | |||||
| font-size: 20rpx; | |||||
| margin-top: 10rpx; | |||||
| } | |||||
| } | |||||
| </style> | |||||