123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450 |
- <template>
- <view :style="colorStyle">
- <view class='address-management' :class='addressList.length < 1 && page > 1 ? "fff":""'>
- <view class='line'>
- <image src='@/static/images/line.jpg' v-if="addressList.length"></image>
- </view>
- <radio-group class="radio-group" @change="radioChange" v-if="addressList.length">
- <view class='item' v-for="(item,index) in addressList" :key="index">
- <view class='address' @click='goOrder(item.id)'>
- <view class='consignee'>收货人:{{item.real_name}}<text class='phone'>{{item.phone}}</text></view>
- <view>收货地址:{{item.province}}{{item.city}}{{item.district}}{{item.detail}}</view>
- </view>
- <view class='operation acea-row row-between-wrapper'>
-
- <radio class="radio" :value="index.toString()" :checked="item.is_default ? true : false">
- <text>设为默认</text>
- </radio>
-
-
- <radio class="radio" :value="index" :checked="item.is_default ? true : false">
- <text>设为默认</text>
- </radio>
-
- <view class='acea-row row-middle'>
- <view @click='editAddress(item.id)'><text class='iconfont icon-bianji'></text>编辑</view>
- <view @click='delAddress(index)'><text class='iconfont icon-shanchu'></text>删除</view>
- </view>
- </view>
- </view>
- </radio-group>
- <view class='loadingicon acea-row row-center-wrapper' v-if="addressList.length">
- <text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
- </view>
- <view class='noCommodity' v-if="addressList.length < 1 && page > 1">
- <view class='pictrue'>
- <image :src="imgHost + '/statics/images/noAddress.png'"></image>
- </view>
- </view>
- <view style='height:120rpx;'></view>
- <view class='footer acea-row row-between-wrapper'>
-
- <view class='addressBnt bg-color on' @click='addAddress'><text
- class='iconfont icon-tianjiadizhi'></text>添加新地址</view>
-
-
- <view class='addressBnt bg-color' @click='addAddress'><text
- class='iconfont icon-tianjiadizhi'></text>添加新地址</view>
- <view class='addressBnt wxbnt' @click='getWxAddress'><text class='iconfont icon-weixin2'></text>导入微信地址
- </view>
-
-
- <view class='addressBnt bg-color' :class="this.$wechat.isWeixin()?'':'on'" @click='addAddress'><text
- class='iconfont icon-tianjiadizhi'></text>添加新地址</view>
- <view class='addressBnt wxbnt' @click='getAddress' v-if="this.$wechat.isWeixin()"><text
- class='iconfont icon-weixin2'></text>导入微信地址</view>
-
- </view>
- </view>
- <home v-if="navigation"></home>
-
-
-
- </view>
- </template>
- <script>
- import {
- getAddressList,
- setAddressDefault,
- delAddress,
- editAddress,
- postAddress
- } from '@/api/user.js';
- import {
- toLogin
- } from '@/libs/login.js';
- import {
- mapGetters
- } from "vuex";
- import home from '@/components/home';
- import colors from '@/mixins/color.js';
- import {HTTP_REQUEST_URL} from '@/config/app';
- export default {
- components: {
- home
- },
- mixins:[colors],
- data() {
- return {
- addressList: [],
- loading: false,
- loadend: false,
- loadTitle: '加载更多',
- page: 1,
- limit: 20,
- isAuto: false,
- isShowAuth: false,
- news: '',
- unique: '',
- num: "",
- imgHost:HTTP_REQUEST_URL
- };
- },
- computed: mapGetters(['isLogin']),
- onLoad(options) {
- this.unique = options.unique
- this.num = options.num
- if (this.isLogin) {
- this.cartId = options.cartId || '';
- this.pinkId = options.pinkId || 0;
- this.couponId = options.couponId || 0;
- this.news = options.news || 0;
- this.getAddressList(true);
- } else {
- toLogin();
- }
- },
- onShow: function() {
- uni.removeStorageSync('form_type_cart');
- },
- methods: {
- onLoadFun: function() {
- this.getAddressList();
- this.isShowAuth = false;
- },
-
- authColse: function(e) {
- this.isShowAuth = e
- },
-
- getWxAddress: function() {
- let that = this;
- uni.authorize({
- scope: 'scope.address',
- success: function(res) {
- uni.chooseAddress({
- success: function(res) {
- let addressP = {};
- addressP.province = res.provinceName;
- addressP.city = res.cityName;
- addressP.district = res.countyName;
- editAddress({
- address: addressP,
- is_default: 1,
- real_name: res.userName,
- post_code: res.postalCode,
- phone: res.telNumber,
- detail: res.detailInfo,
- id: 0,
- type: 1
- }).then(res => {
- that.$util.Tips({
- title: "添加成功",
- icon: 'success'
- }, function() {
- that.getAddressList(true);
- });
- }).catch(err => {
- return that.$util.Tips({
- title: err
- });
- });
- },
- fail: function(res) {
- if (res.errMsg == 'chooseAddress:cancel') return that.$util
- .Tips({
- title: '取消选择'
- });
- },
- })
- },
- fail: function(res) {
- uni.showModal({
- title: '您已拒绝导入微信地址权限',
- content: '是否进入权限管理,调整授权?',
- success(res) {
- if (res.confirm) {
- uni.openSetting({
- success: function(res) {}
- });
- } else if (res.cancel) {
- return that.$util.Tips({
- title: '已取消!'
- });
- }
- }
- })
- }
- })
- },
-
- getAddress() {
- let that = this;
- that.$wechat.openAddress().then(userInfo => {
-
- editAddress({
- real_name: userInfo.userName,
- phone: userInfo.telNumber,
- address: {
- province: userInfo.provinceName,
- city: userInfo.cityName,
- district: userInfo.countryName
- },
- detail: userInfo.detailInfo,
- post_code: userInfo.postalCode,
- is_default: 1,
- type: 1
- })
- .then(() => {
- that.$util.Tips({
- title: "添加成功",
- icon: 'success'
- }, function() {
-
- that.getAddressList(true);
- });
- })
- .catch(err => {
-
- return that.$util.Tips({
- title: err || "添加失败"
- });
- });
- });
- },
-
- getAddressList: function(isPage) {
- let that = this;
- if (isPage) {
- that.loadend = false;
- that.page = 1;
- that.$set(that, 'addressList', []);
- };
- if (that.loading) return;
- if (that.loadend) return;
- that.loading = true;
- that.loadTitle = '';
- getAddressList({
- page: that.page,
- limit: that.limit
- }).then(res => {
- let list = res.data;
- let loadend = list.length < that.limit;
- that.addressList = that.$util.SplitArray(list, that.addressList);
- that.$set(that, 'addressList', that.addressList);
- that.loadend = loadend;
- that.loadTitle = loadend ? '没有更多内容啦~' : '加载更多';
- that.page = that.page + 1;
- that.loading = false;
- }).catch(err => {
- that.loading = false;
- that.loadTitle = '加载更多';
- });
- },
-
- radioChange: function(e) {
- let index = parseInt(e.detail.value),
- that = this;
- let address = this.addressList[index];
- if (address == undefined) return that.$util.Tips({
- title: '您设置的默认地址不存在!'
- });
- setAddressDefault(address.id).then(res => {
- for (let i = 0, len = that.addressList.length; i < len; i++) {
- if (i == index) that.addressList[i].is_default = true;
- else that.addressList[i].is_default = false;
- }
- that.$util.Tips({
- title: '设置成功',
- icon: 'success'
- }, function() {
- that.$set(that, 'addressList', that.addressList);
- });
- }).catch(err => {
- return that.$util.Tips({
- title: err
- });
- });
- },
-
- editAddress: function(id) {
- let cartId = this.cartId,
- pinkId = this.pinkId,
- couponId = this.couponId;
- this.cartId = '';
- this.pinkId = '';
- this.couponId = '';
- uni.navigateTo({
- url: '/pages/users/user_address/index?id=' + id + '&pinkId=' +
- pinkId + '&couponId=' +
- couponId + '&new=' + this.news
- })
- },
-
- delAddress: function(index) {
- let that = this,
- address = this.addressList[index];
- if (address == undefined) return that.$util.Tips({
- title: '您删除的地址不存在!'
- });
- delAddress(address.id).then(res => {
- that.$util.Tips({
- title: '删除成功',
- icon: 'success'
- }, function() {
- that.addressList.splice(index, 1);
- that.$set(that, 'addressList', that.addressList);
- });
- }).catch(err => {
- return that.$util.Tips({
- title: err
- });
- });
- },
-
- addAddress: function() {
- uni.navigateTo({
- url: '/pages/users/user_address/index?' + '&new=' + this.news
- })
- },
- goOrder: function(id) {
- let cartId = '';
- let pinkId = '';
- let couponId = '';
- if (id) {
- uni.redirectTo({
- url: '/pages/points_mall/integral_order?is_address=1&new=' + this.news +
- '&addressId=' + id + '&num=' + this.num + '&unique=' + this.unique
- })
- }
- }
- },
- onReachBottom: function() {
- this.getAddressList();
- }
- }
- </script>
- <style>
- .address-management.fff {
- background-color: #fff;
- height: 1300rpx
- }
- .address-management .line {
- width: 100%;
- height: 3rpx;
- }
- .address-management .line image {
- width: 100%;
- height: 100%;
- display: block;
- }
- .address-management .item {
- background-color: #fff;
- padding: 0 30rpx;
- margin-bottom: 12rpx;
- }
- .address-management .item .address {
- padding: 30rpx 0;
- border-bottom: 1rpx solid #eee;
- font-size: 28rpx;
- color: #282828;
- }
- .address-management .item .address .consignee {
- font-size: 28rpx;
- font-weight: bold;
- margin-bottom: 8rpx;
- }
- .address-management .item .address .consignee .phone {
- margin-left: 25rpx;
- }
- .address-management .item .operation {
- height: 83rpx;
- font-size: 28rpx;
- color: #282828;
- }
- .address-management .item .operation .radio text {
- margin-left: 13rpx;
- }
- .address-management .item .operation .iconfont {
- color: #2c2c2c;
- font-size: 35rpx;
- vertical-align: -2rpx;
- margin-right: 10rpx;
- }
- .address-management .item .operation .iconfont.icon-shanchu {
- margin-left: 40rpx;
- font-size: 38rpx;
- }
- .address-management .footer {
- position: fixed;
- width: 100%;
- background-color: #fff;
- bottom: 0;
- height: 106rpx;
- padding: 0 30rpx;
- box-sizing: border-box;
- }
- .address-management .footer .addressBnt {
- width: 330rpx;
- height: 76rpx;
- border-radius: 50rpx;
- text-align: center;
- line-height: 76rpx;
- font-size: 30rpx;
- color: #fff;
- }
- .address-management .footer .addressBnt.on {
- width: 690rpx;
- margin: 0 auto;
- }
- .address-management .footer .addressBnt .iconfont {
- font-size: 35rpx;
- margin-right: 8rpx;
- vertical-align: -1rpx;
- }
- .address-management .footer .addressBnt.wxbnt {
- background-color: #fe960f;
- }
- </style>
|