|
|
|
|
<template>
|
|
|
|
|
<view class="add_box">
|
|
|
|
|
<view class="address_box" >
|
|
|
|
|
<view class="address_item" v-for="item in addressData" :key="item.name">
|
|
|
|
|
<view class="top_box">
|
|
|
|
|
<view class="top_item">
|
|
|
|
|
<view class="top">
|
|
|
|
|
<span class="name_txt">{{item.name}}</span>
|
|
|
|
|
<span class="phone_txt">{{item.phone}}</span>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="bottom">
|
|
|
|
|
{{item.address}}
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="edit_box">
|
|
|
|
|
<view class="img_box">
|
|
|
|
|
<image class="img" src="../../../static/image/edit.png" mode=""></image>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="bottom_item">
|
|
|
|
|
<view v-if="item.status == 0" class="no_checked"></view>
|
|
|
|
|
<view v-if="item.status == 1" class="checked">
|
|
|
|
|
<p class="item"></p>
|
|
|
|
|
</view>
|
|
|
|
|
<p class="no_default" v-if="item.status == 0">设为默认</p>
|
|
|
|
|
<p v-if="item.status == 1" class="default_txt">默认地址</p>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="btn_box">
|
|
|
|
|
<p class="btn" @click="handleAdd">添加新地址</p>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="pop_box">
|
|
|
|
|
<uni-popup ref="popup" style="width: 100%;" background-color="#fff" >
|
|
|
|
|
<view class="popup-content" >
|
|
|
|
|
<view class="title_box">
|
|
|
|
|
<view class="tit_txt">
|
|
|
|
|
新增地址
|
|
|
|
|
</view>
|
|
|
|
|
<view class="image_box">
|
|
|
|
|
<image class="img" src="../../../static/image/cancel.png" mode=""></image>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="content_box">
|
|
|
|
|
<view class="content_item">
|
|
|
|
|
<view class="left_item">
|
|
|
|
|
收货人：
|
|
|
|
|
</view>
|
|
|
|
|
<view class="right_item">
|
|
|
|
|
张三
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="content_item">
|
|
|
|
|
<view class="left_item">
|
|
|
|
|
联系电话：
|
|
|
|
|
</view>
|
|
|
|
|
<view class="right_item">
|
|
|
|
|
15612345678
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="content_item">
|
|
|
|
|
<view class="left_item">
|
|
|
|
|
位置：
|
|
|
|
|
</view>
|
|
|
|
|
<!-- <view class="right_item">
|
|
|
|
|
山东省青岛市市北区
|
|
|
|
|
</view> -->
|
|
|
|
|
<!-- <view class="right_icon" @click="changeAddress">
|
|
|
|
|
<image src="../../../static/image/icon-arrow-right.png"></image>
|
|
|
|
|
</view> -->
|
|
|
|
|
<picker class="picker_box" :range="locationArr" @change="cityChange" mode="multiSelector"
|
|
|
|
|
@columnchange="columnchange" :value="multiIndex">
|
|
|
|
|
<view class="city_box" v-if="province !== '' && city !== ''">
|
|
|
|
|
{{province}} / {{city}} {{district ? '/' : ''}} {{district}}
|
|
|
|
|
</view>
|
|
|
|
|
<view class="city_box" v-if="province == '' && city == '' && district == ''">
|
|
|
|
|
<span style="color: #999;">请选择地区</span>
|
|
|
|
|
</view>
|
|
|
|
|
</picker>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="content_item">
|
|
|
|
|
<view class="left_item">
|
|
|
|
|
详细地址：
|
|
|
|
|
</view>
|
|
|
|
|
<view class="right_item">
|
|
|
|
|
大港街道大港三路8号铁路住宅小区6号楼大港街道大港三路8号铁路住宅小区6号楼
|
|
|
|
|
</view>
|
|
|
|
|
<view class="right_icon" @click="handlePosition">
|
|
|
|
|
<image src="../../../static/image/position.png"></image>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="button_box">
|
|
|
|
|
<p class="btn">删除</p>
|
|
|
|
|
<p class="btn">保存</p>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</uni-popup>
|
|
|
|
|
</view>
|
|
|
|
|
<!-- <uni-load-more iconType="circle" :status="status" @clickLoadMore="loadMore"
|
|
|
|
|
:content-text="contentText"></uni-load-more> -->
|
|
|
|
|
</view>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import allCityData from "../../../util/all_city.json"
|
|
|
|
|
export default {
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
imgPrefix: getApp().globalData.imgPrefix,
|
|
|
|
|
locationArr: [
|
|
|
|
|
[],
|
|
|
|
|
[],
|
|
|
|
|
[]
|
|
|
|
|
],
|
|
|
|
|
multiIndex: [0, 0, 0],
|
|
|
|
|
province:'',
|
|
|
|
|
city:'',
|
|
|
|
|
district:'',
|
|
|
|
|
addressData: [
|
|
|
|
|
{name:'张三',phone:'15612345678',address:'山东省青岛市市北区大港街道大港三路8号铁路住宅小区6号楼6单元666室',status:1},
|
|
|
|
|
{name:'张三',phone:'15612345678',address:'山东省青岛市市北区大港街道大港三路8号铁路住宅小区6号楼6单元666室',status:0},
|
|
|
|
|
],
|
|
|
|
|
allCityData,
|
|
|
|
|
current: 0,
|
|
|
|
|
size: 10,
|
|
|
|
|
hasMore: true,
|
|
|
|
|
status: '',
|
|
|
|
|
contentText: {
|
|
|
|
|
contentdown: "点击查看更多",
|
|
|
|
|
contentrefresh: "正在加载...",
|
|
|
|
|
contentnomore: "没有更多数据了",
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
onLoad() {
|
|
|
|
|
this.getData()
|
|
|
|
|
let userInfo = uni.getStorageSync('userInfo');
|
|
|
|
|
if (userInfo) {
|
|
|
|
|
this.userInfo = JSON.parse(userInfo);
|
|
|
|
|
if (this.userInfo.id != undefined) {
|
|
|
|
|
this.loadMore();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
// 获取地区数据
|
|
|
|
|
getData() {
|
|
|
|
|
console.log(this.allCityData)
|
|
|
|
|
this.allCityData.map(item => {
|
|
|
|
|
this.locationArr[0].push(item.province);
|
|
|
|
|
})
|
|
|
|
|
this.allCityData[0].citys[0].areas.map(item => {
|
|
|
|
|
this.locationArr[1].push(item.area)
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
console.log(this.locationArr)
|
|
|
|
|
},
|
|
|
|
|
cityChange(e) {
|
|
|
|
|
console.log(e)
|
|
|
|
|
this.multiIndex = e.detail.value;
|
|
|
|
|
console.log(this.locationArr)
|
|
|
|
|
this.province = this.locationArr[0][this.multiIndex[0]]
|
|
|
|
|
this.city = this.locationArr[1][this.multiIndex[1]]
|
|
|
|
|
this.district = this.locationArr[2][this.multiIndex[2]]
|
|
|
|
|
},
|
|
|
|
|
columnchange(e) {
|
|
|
|
|
let value = e.detail.value;
|
|
|
|
|
console.log(e.detail)
|
|
|
|
|
if (e.detail.column == 0) {
|
|
|
|
|
this.locationArr[1] = [];
|
|
|
|
|
this.locationArr[2] = []
|
|
|
|
|
let tmp = this.allCityData.find(item => item.province == this.locationArr[0][value])
|
|
|
|
|
console.log(tmp)
|
|
|
|
|
if (tmp.citys.length == 1) {
|
|
|
|
|
tmp.citys[0].areas.map(item => {
|
|
|
|
|
this.locationArr[1].push(item.area)
|
|
|
|
|
})
|
|
|
|
|
} else {
|
|
|
|
|
tmp.citys.map(item => {
|
|
|
|
|
this.locationArr[1].push(item.city)
|
|
|
|
|
})
|
|
|
|
|
tmp.citys[0].areas.map(item => {
|
|
|
|
|
this.locationArr[2].push(item.area);
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
// 第一列滑动 第二列 和第三列 都变为第一个
|
|
|
|
|
this.multiIndex = [value, 0, 0]
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
if (e.detail.column == 1) {
|
|
|
|
|
this.locationArr[2] = [];
|
|
|
|
|
this.multiIndex[1] = value;
|
|
|
|
|
if (this.allCityData[this.multiIndex[0]].citys.length !== 1) {
|
|
|
|
|
this.allCityData[this.multiIndex[0]].citys[value].areas.map(item => {
|
|
|
|
|
this.locationArr[2].push(item.area)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
this.multiIndex.splice(2, 1, 0)
|
|
|
|
|
console.log(this.multiIndex)
|
|
|
|
|
}
|
|
|
|
|
// 第三列滑动
|
|
|
|
|
if (e.detail.column === 2) {
|
|
|
|
|
this.multiIndex[2] = e.detail.value
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
// 添加地址
|
|
|
|
|
handleAdd(){
|
|
|
|
|
this.$refs.popup.open('bottom')
|
|
|
|
|
},
|
|
|
|
|
// 定位
|
|
|
|
|
handlePosition(){
|
|
|
|
|
uni.getLocation({
|
|
|
|
|
type:" wgs84",
|
|
|
|
|
isHighAccuracy:true,
|
|
|
|
|
success: (res) => {
|
|
|
|
|
console.log('当前位置的经度：' + res.longitude);
|
|
|
|
|
console.log('当前位置的纬度：' + res.latitude);
|
|
|
|
|
uni.request({
|
|
|
|
|
url:`https://restapi.amap.com/v3/geocode/regeo?location=${res.longitude},${res.latitude}&key=b8e2796701c731e4a97f4d0bc4e51385&radius=1000&extensions=all`,
|
|
|
|
|
method:"get",
|
|
|
|
|
success: res => {
|
|
|
|
|
console.log(res.data)
|
|
|
|
|
this.province = res.data.regeocode.addressComponent.province;
|
|
|
|
|
this.city = res.data.regeocode.addressComponent.city;
|
|
|
|
|
this.district = res.data.regeocode.addressComponent.district;
|
|
|
|
|
console.log(this.province)
|
|
|
|
|
this.allCityData.map(item1 =>{
|
|
|
|
|
if(item1.province == this.province){
|
|
|
|
|
item1.citys.map(item2 =>{
|
|
|
|
|
this.locationArr[1].push(item2.city)
|
|
|
|
|
if(item2.city == this.city){
|
|
|
|
|
item2.areas.map(item3 =>{
|
|
|
|
|
this.locationArr[2].push(item3.area)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
console.log(this.locationArr)
|
|
|
|
|
this.locationArr[0].map((item,index) =>{
|
|
|
|
|
if(item == this.province){
|
|
|
|
|
this.multiIndex[0] = index
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
this.locationArr[1].map((item,index) =>{
|
|
|
|
|
if(item == this.city){
|
|
|
|
|
this.multiIndex[1] = index
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
this.locationArr[2].map((item,index) =>{
|
|
|
|
|
if(item == this.district){
|
|
|
|
|
this.multiIndex[2] = index
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
//加载更多
|
|
|
|
|
loadMore() {
|
|
|
|
|
console.log('loadmore')
|
|
|
|
|
if (this.hasMore) {
|
|
|
|
|
this.current = this.current + 1;
|
|
|
|
|
this.staus = 'loading';
|
|
|
|
|
uni.request({
|
|
|
|
|
url: getApp().globalData.baseUrl + '/address/list?userId=' + this.userInfo.id + '¤t=' + this
|
|
|
|
|
.current + '&size=' + this.size,
|
|
|
|
|
method: 'GET',
|
|
|
|
|
success: (res) => {
|
|
|
|
|
if (res.data.code == 200) {
|
|
|
|
|
this.addressData = this.addressData.concat(res.data.data.records);
|
|
|
|
|
if (res.data.data.records.length == 0 || res.data.data.total < this.size) {
|
|
|
|
|
this.hasMore = false;
|
|
|
|
|
this.status = 'nomore';
|
|
|
|
|
} else {
|
|
|
|
|
this.status = 'more';
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
uni.showToast({
|
|
|
|
|
title: res.data.msg,
|
|
|
|
|
icon: 'none'
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
.add_box {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
|
|
|
|
.address_box {
|
|
|
|
|
height: 82%;
|
|
|
|
|
width: 690rpx;
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
border-radius: 30rpx 30rpx 30rpx 30rpx;
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
|
|
|
|
.address_item {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 255rpx;
|
|
|
|
|
border-bottom: 1rpx solid #F2F2F2;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
|
|
|
|
.bottom_item{
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 25%;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
.no_checked{
|
|
|
|
|
width: 28rpx;
|
|
|
|
|
height: 28rpx;
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
border: 1rpx solid #666666;
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
margin: 0 30rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.checked{
|
|
|
|
|
width: 28rpx;
|
|
|
|
|
height: 28rpx;
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
border: 1rpx solid #D73232;
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
margin: 0 30rpx;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
|
|
|
|
.item{
|
|
|
|
|
width: 16rpx;
|
|
|
|
|
height: 16rpx;
|
|
|
|
|
background: #D73232;
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.default_txt{
|
|
|
|
|
font-size: 22rpx;
|
|
|
|
|
color: #D73232;
|
|
|
|
|
}
|
|
|
|
|
.no_default{
|
|
|
|
|
color: #B8B8B8;
|
|
|
|
|
font-size: 22rpx;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.top_box{
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 75%;
|
|
|
|
|
display: flex;
|
|
|
|
|
.top_item{
|
|
|
|
|
width: 85%;
|
|
|
|
|
margin-left: 30rpx;
|
|
|
|
|
.top{
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
display: flex;
|
|
|
|
|
height: 40rpx;
|
|
|
|
|
align-items: flex-end;
|
|
|
|
|
|
|
|
|
|
.name_txt{
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
color: #333;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.phone_txt{
|
|
|
|
|
font-size: 22rpx;
|
|
|
|
|
color: #999;
|
|
|
|
|
margin-left: 20rpx;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.bottom {
|
|
|
|
|
width: 484rpx;
|
|
|
|
|
height: 74rpx;
|
|
|
|
|
font-size: 26rpx;
|
|
|
|
|
color: #333;
|
|
|
|
|
margin-top: 20rpx;
|
|
|
|
|
line-height: 40rpx;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.edit_box{
|
|
|
|
|
height: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
|
|
.img_box{
|
|
|
|
|
width: 44rpx;
|
|
|
|
|
height: 44rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.img{
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.btn_box{
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 150rpx;
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
position: fixed;
|
|
|
|
|
bottom: 0;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
|
|
|
|
.btn{
|
|
|
|
|
width: 690rpx;
|
|
|
|
|
height: 78rpx;
|
|
|
|
|
background: #D73232;
|
|
|
|
|
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
color: #fff;
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.pop_box{
|
|
|
|
|
width: 100%;
|
|
|
|
|
/deep/ .uni-popup{
|
|
|
|
|
width: 100%;
|
|
|
|
|
}
|
|
|
|
|
.popup-content{
|
|
|
|
|
width: 100%;
|
|
|
|
|
background: #fff;
|
|
|
|
|
padding-top: 40rpx;
|
|
|
|
|
border-radius: 30rpx 30rpx 0rpx 0rpx;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.title_box{
|
|
|
|
|
width:100%;
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
// justify-content: space-between;
|
|
|
|
|
|
|
|
|
|
.tit_txt{
|
|
|
|
|
width: 90%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
font-size: 36rpx;
|
|
|
|
|
color: #000;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.image_box{
|
|
|
|
|
width: 44rpx;
|
|
|
|
|
height: 44rpx;
|
|
|
|
|
|
|
|
|
|
.img{
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.content_box{
|
|
|
|
|
width: 100%;
|
|
|
|
|
margin-top: 20rpx;
|
|
|
|
|
.content_item{
|
|
|
|
|
width: 100%;
|
|
|
|
|
padding: 30rpx 0;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
border: 1rpx solid #F2F2F2;
|
|
|
|
|
|
|
|
|
|
.left_item{
|
|
|
|
|
width:140rpx;
|
|
|
|
|
height: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
margin-left: 30rpx;
|
|
|
|
|
font-size: 26rpx;
|
|
|
|
|
color: #333;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.right_item{
|
|
|
|
|
width: 406rpx;
|
|
|
|
|
height: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
margin-left: 30rpx;
|
|
|
|
|
font-size: 26rpx;
|
|
|
|
|
color: #333;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.right_icon{
|
|
|
|
|
width: 44rpx;
|
|
|
|
|
height: 44rpx;
|
|
|
|
|
margin-left: 66rpx;
|
|
|
|
|
|
|
|
|
|
image{
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.button_box{
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 120rpx;
|
|
|
|
|
display: flex;
|
|
|
|
|
margin-top: 20px;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
|
|
|
|
.btn{
|
|
|
|
|
width: 320rpx;
|
|
|
|
|
height: 78rpx;
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
|
|
|
|
border: 1rpx solid #D73232;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
font-size: 26rpx;
|
|
|
|
|
color: #D73232;
|
|
|
|
|
|
|
|
|
|
&:last-child{
|
|
|
|
|
background: #D73232;
|
|
|
|
|
margin-left: 50rpx;
|
|
|
|
|
color: #FFFFFF;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
