|
@@ -0,0 +1,208 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <!-- #ifdef MP-ALIPAY -->
|
|
|
+ <u-navbar :placeholder="true" bgColor="#fff" :autoBack="true" :border="true" title="使用范围" leftIconSize="0">
|
|
|
+ </u-navbar>
|
|
|
+ <!-- #endif -->
|
|
|
+ <!-- #ifndef MP-ALIPAY -->
|
|
|
+ <u-navbar :placeholder="true" bgColor="#fff" :autoBack="true" :border="true" title="使用范围"></u-navbar>
|
|
|
+ <!-- #endif -->
|
|
|
+
|
|
|
+ <view class="address-wrap">
|
|
|
+ <view class="header-title" @click="selectAddress">
|
|
|
+ <view class="adderss-select">
|
|
|
+ {{ confirm ? confirm : '所有地区' }}
|
|
|
+ </view>
|
|
|
+ <view class="adderss-select-icon">
|
|
|
+ <u-icon name="arrow-right" color="#999" size="12"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="content">
|
|
|
+ <view class="address-box" v-for="(item,index) in list" :key="index">
|
|
|
+ <text class="store-name" selectable="true">{{item.name}}</text>
|
|
|
+ <view class="store-address">
|
|
|
+ <text>地址:{{item.addressAll}}</text>
|
|
|
+ <view @click="copyDeliveryFlowId(item.addressAll)">复制</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <u-loadmore :line="true" v-if="list.length>10" :status="status" :loading-text="'努力加载中'" :nomore-text="'已经到底了'" />
|
|
|
+ </view>
|
|
|
+ <view class="flex empty" v-if="!list.length">
|
|
|
+ <view class="center">
|
|
|
+ <image class="center-img"
|
|
|
+ src="https://mp-public-1310078123.cos.ap-shanghai.myqcloud.com/v2/nodata_5.png" mode="scaleToFill">
|
|
|
+ </image>
|
|
|
+ <view class="center-font">暂无门店</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <address-popup :address-show="addressShow" @cancel="cancel" @confirmAddress="confirmAddress" />
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import $http from '@/utils/request.js'
|
|
|
+ import AddressPopup from '../components/address-popup/address-popup.vue'
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ AddressPopup
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ list: [],
|
|
|
+ couponId: null,
|
|
|
+ addressShow: false,
|
|
|
+ confirm: '',
|
|
|
+ info: {},
|
|
|
+ total: 0,
|
|
|
+ pageNum: 1,
|
|
|
+ status: 'nomore',//上拉刷新状态
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad(options) {
|
|
|
+ this.couponId = options.couponId
|
|
|
+ this.pageList()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ pageList() {
|
|
|
+ this.pageNum = 1
|
|
|
+ this.total = 0
|
|
|
+ this.list = []
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ getList() {
|
|
|
+ uni.showLoading({
|
|
|
+ title: '加载中'
|
|
|
+ });
|
|
|
+ $http.post(`/api/v1/mp/user/mine/coupon/channel/list?pageNum=${this.pageNum}&pageSize=20`, { ...this.info, couponId: this.couponId }).then(
|
|
|
+ res => {
|
|
|
+ uni.hideLoading();
|
|
|
+ if (res.code == 0) {
|
|
|
+ this.list = res.rows
|
|
|
+ this.list.forEach(item=>{
|
|
|
+ item.addressAll = `${item.province} ${item.city} ${item.area} ${item.address}`
|
|
|
+ })
|
|
|
+ this.total = res.total
|
|
|
+ }
|
|
|
+ }).catch(() => {
|
|
|
+ uni.hideLoading();
|
|
|
+ })
|
|
|
+ },
|
|
|
+ selectAddress() {
|
|
|
+ this.addressShow = true
|
|
|
+ },
|
|
|
+ cancel() {
|
|
|
+ this.addressShow = false
|
|
|
+ },
|
|
|
+ confirmAddress(obj) {
|
|
|
+ this.info = {
|
|
|
+ provinceId: obj.provinceId,
|
|
|
+ cityId: obj.cityId,
|
|
|
+ }
|
|
|
+ this.confirm = obj.cityShow
|
|
|
+ this.addressShow = false
|
|
|
+ this.pageList()
|
|
|
+ },
|
|
|
+ copyDeliveryFlowId(data) {
|
|
|
+ uni.setClipboardData({data});
|
|
|
+ },
|
|
|
+ },
|
|
|
+ onReachBottom() {
|
|
|
+ if(this.total < this.pageNum * 20) return ;
|
|
|
+ this.status = 'loading';
|
|
|
+ ++this.pageNum
|
|
|
+ if(this.total < this.pageNum * 20) this.status = 'nomore';
|
|
|
+ else this.status = 'loading';
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .address-wrap {
|
|
|
+
|
|
|
+ .header-title {
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 0 20rpx;
|
|
|
+ display: flex;
|
|
|
+ height: 90rpx;
|
|
|
+ box-shadow: 0 5rpx 5rpx #ececec;
|
|
|
+ line-height: 90rpx;
|
|
|
+
|
|
|
+ .adderss-select {
|
|
|
+ margin-right: 10rpx;
|
|
|
+ font-size: 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .adderss-select-icon {
|
|
|
+ display: inline-block;
|
|
|
+ margin-top: 34rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .content {
|
|
|
+ margin: 20rpx 10rpx;
|
|
|
+ padding: 0 25rpx;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ background-color: #fff;
|
|
|
+
|
|
|
+ .address-box {
|
|
|
+ width: 100%;
|
|
|
+ padding: 30rpx 0;
|
|
|
+ border-bottom: 2rpx solid #dadbde;
|
|
|
+
|
|
|
+ .store-name {
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #000;
|
|
|
+ margin-bottom: 15rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .store-address {
|
|
|
+
|
|
|
+ text {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+
|
|
|
+ view {
|
|
|
+ margin-left: 8rpx;
|
|
|
+ background-color: rgba(153, 153, 153, .1);
|
|
|
+ display: inline-block;
|
|
|
+ width: 80rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ line-height: 34rpx;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 24rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .address-box:last-child {
|
|
|
+ border-bottom: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .empty {
|
|
|
+ height: 60vh;
|
|
|
+
|
|
|
+ .center {
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ &-img {
|
|
|
+ width: 228rpx;
|
|
|
+ height: 320rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-font {
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #999999;
|
|
|
+ margin-bottom: 250rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|