<!-- 地址管理 -->
<template>
    <nav-bar :navbar-data="navbarData" />
    <view :style="{ marginTop: height +'px', height: 'calc(100vh - '+ height +'px)' }">
        <view class="address-management">
            <view class="am-item border-bottom-after" v-for="(item, index) in addressData" :key="index" @tap="toCleanOrder"
                :data-index="item.index" :data-id="item.id" :data-name="item.name" :data-tel="item.tel"
                :data-addre="item.addre" :data-areavalue="item.areavalue" :data-addrevalue="item.addrevalue"
                :data-door="item.door">
                <view class="am-item-img">
                    <text class="thumb-span">{{ item.nameImg }}</text>
                </view>
                <view class="am-item-content">
                    <view class="am-item-content-desc">
                        {{ item.name }}
                        <text>{{ item.mobile }}</text>
                    </view>
                    <view class="am-item-content-address">
                        {{ item.provinceDesc + item.cityDesc + item.areaDesc + item.villageDesc + item.address }}
                    </view>
                </view>
                <view class="list-extra" @tap="updateAddress" :data-item="item">编辑</view>
                <!-- <view class="card-top">
				<van-row>
					<van-row>
						<van-col span="16">
							<view>
								<text class="text">{{item.provinceDesc+item.cityDesc+item.areaDesc+item.villageDesc+item.address}}</text>
							</view>
							<view class="view3">
								<text >{{item.name}}</text>
								<text > {{item.mobile}}</text>
							</view>
						</van-col>
						<van-col span="4" class="edit">
							<view>
								<van-icon name="edit" size="20px" bindtap="updateAddress" data-item="{{item}}" />
							</view>
						</van-col>
					</van-row>
					<view class="border-bottom-after::after"></view>
				</van-row>
			</view> -->
            </view>
            <van-cell title="添加收货地址" is-link icon="add-o" center @tap="address" />
        </view>
    </view>
</template>

<script>
import $http from "@/utils/https";
import navBar from '@/components/navBar/index';
import VanCell from '@/components/cell/index';
const app = getApp()
export default {
    components: {
        'nav-bar': navBar,
        'van-cell': VanCell,
    },
    data() {
        return {
            height: app.globalData.height,
            navbarData: {
                isGoHome: true,
                isGoBack: true,
                title: "我的收货地址",
                homePath: "../../../pages/tabBar/index/index"
            },
            visible: false,
            addressData: [],
            addressTotal: ''
        }
    },
    onShow() {
        this.getAddressList();
    },
    methods: {
        updateAddress(event) {
            console.log('321', event)
            let item = event.currentTarget.dataset.item;
            let str = JSON.stringify(item)
            uni.navigateTo({
                url: '../addressManagement/address/address?optionType=edit&jsonStr=' + str,
            })
            // uni.setNavigationBarTitle({
            //     title: '编辑收货地址'
            // })
        },

        /*添加地址 */
        address() {
            uni.navigateTo({
                url: '../addressManagement/address/address'
            })
        },

        /**
         * 地址列表
         */
        getAddressList: function () {
            let userData = this.$cache.get('userData');
            let data = {
                params: [{
                    pubAccCode: userData.pubAccCode,
                    openID: userData.openID,
                }]
            }
            uni.showLoading({
                title: '加载中...'
            })
            $http.post("urlS", this, {
                code: "01020006",
                data: data,
                success(res) {
                    console.log("成功", res)
                    if (+res.errorCode === 0) {
                        for (var i = 0; i < res.result.rows.length; i++) {
                            res.result.rows[i].nameImg = res.result.rows[i].name;
                            if (res.result.rows[i].name.length === 3) {
                                res.result.rows[i].nameImg = res.result.rows[i].nameImg.slice(1)
                            } else if (res.result.rows[i].name.length > 3) {
                                res.result.rows[i].nameImg = res.result.rows[i].nameImg.slice(0, 2)
                            }
                        }
                        this.setData({ addressData: res.result.rows, addressTotal: res.result.total });
                    } else {
                        this.setData({ addressData: [] });
                    }
                },
                complete() {
                    uni.hideLoading()
                }
            });
        },

        /*添加地址 条数限制*/
        addNumber: function () {
            let total = this.addressTotal
            console.log("Number", total)
            if (total < 5) {
                setTimeout(function () {
                    uni.navigateTo({
                        url: '../addressManagement/address/address'
                    })
                    uni.setNavigationBarTitle({
                        title: '新增收货地址'
                    })
                }, 2000)
            } else {
                uni.showToast({
                    title: '每个账号最多添加5个地址',
                    icon: 'none',
                    duration: 850
                })
            }
        },
    }
}
</script>

<style>
/* pages/addressManagement/addressManagement.wxss */
.address-management {
  background: #fff;
}

.am-item {
  display: flex;
  align-items: center;
  padding-left: 24rpx;
  box-sizing: border-box;
}

.border-bottom-after {
    border-bottom: 1px solid #ebedf0;
}

.am-item-content {
  color: #666;
  font-size: 28rpx;
  padding: 16rpx;
  padding-left: 0;
  width: 70%;
}

.am-item-content-desc {
  color: #333;
  font-size: 32rpx;
  height: 50rpx;
  line-height: 50rpx;
}

.am-item-content-desc text {
  color: #999;
  font-size: 24rpx;
  padding-left: 24rpx;
}

.am-item-content-address {
  line-height: 48rpx;
}

.am-item-img {
  margin-right: 24rpx;
}

.thumb-span {
  display: inline-block;
  width: 40px;
  height: 40px;
  background: #eee;
  border-radius: 20px;
  line-height: 40px;
  text-align: center;
  color: #666;
  font-size: 24rpx;
}

.list-extra {
  width: 88rpx;
  text-align: center;
  border-left: 1Px solid #eee;
  font-size: 28rpx;
  height: 68rpx;
  line-height: 68rpx;
  color: #999;
}

.address-management .van-cell {
  height: 100rpx;
}

.address-management .van-icon.van-icon-add-o {
  color: #1890FF;
  font-size: 44rpx;
}

.address-management .van-cell__title {
  font-size: 32rpx;
  color: #333;
}
</style>