<template>
	<view class="body">
		<uni-nav-bar :statusBar="true" left-icon="left" title=" Cart" color="#fff" backgroundColor="#000" :fixed="true" @clickLeft="back">
			<block slot="right">
				<view class="nav_right">
					<image src="../../static/img/delete_white.png" mode="" @click="deleteCart"></image>
				</view>
			</block>
		</uni-nav-bar>
		<view class="empty" v-if="inlist.length==0">
			<image src="/static/img/cart3.png" mode=""></image>
			<text>Your cart is empty</text>
			<navigator url="/pages/category/index" open-type="switchTab">
				<button>Shop Now</button>
			</navigator>

		</view>
		<!-- <template v-else> -->
		<template v-if="inlist.length>0">
			<view class="cart_info" v-if="money>0">
			<!-- <view class="cart_info" v-if="inlist.length>0"> -->
				<image src="/static/img/Shipped.png" mode=""></image>
				<view class="cart_title_content">Buy <text  style="color:darkred;margin-left: 10rpx;margin-right: 10rpx;font-weight: 500;">US${{ money }}</text>more to enjoy FREE STANDARD SHIPPING!</view>
				<view class="cart_title_right" @click="gotAdd()">Add</view>
			</view>
			<view class="cart_info" v-if="money == 0">
				<image src="/static/img/Shipped.png" mode=""></image>
				<view class="title_left">FREE SHIPPING</view>
			</view>
			<!-- <view class="cart_info" v-if="money == -1">
				<navigator url="../account/address">
				 <image src="/static/img/Shipped.png" mode=""></image>
				 <view class="title_left">PLEASE ADD　AN ADDRESS</view>
				</navigator>
			</view> -->
			<view class="cart">
				<view class="cart_content">
					<view class="good_info" v-for="(gitem,index) in  inlist" :key="gitem.rec_id">
						<!-- 左侧按钮 -->
						<image src="../../static/img/select1.png" mode="" class="cart_select" v-show="gitem.is_check==1"
							@click="cartCheck(1,0,gitem.rec_id,gitem)"></image>
						<image src="../../static/img/select2.png" mode="" class="cart_select" v-show="gitem.is_check==0"
							@click="cartCheck(1,1,gitem.rec_id,gitem)"></image>
						<view class="good_info_left ">
							<!-- 左侧图片 -->
							<view class="good_info_image" @click="goDetails(gitem.goods_id)">
								<image :src="gitem.goods_thumb" mode=""></image>
							</view>
							<view class="left_info">
								<view class="info_name" style="margin-top: 10px;">{{gitem.goods_name}}</view>
								<!-- 中间框内 -->
								<view class="left_info_bottom" v-if="gitem.goods_attr">
									<view class="info_lable">
										<view class="info_lable_text">{{gitem.goods_attr}}</view> 
										 <!-- <image src="/static/img/bottom.png" mode="" @click="ChangeAttr(gitem)"></image> -->
										<view class="image-v"><image src="/static/img/bottom.png" mode="" @click="ChangeAttr(gitem)"></image></view>
									</view>
								</view>
								<view class="left_info_bottom2" v-if="!gitem.goods_attr"></view>
								<view class="info_price" style="">
									<text style="margin-top: -20px;">US${{gitem.goods_price}}</text>
									<uni-number-box background="#FFFFFF" style="margin-top: -20px;" :min="1" :value="gitem.goods_number"
										@change="updateCart($event,gitem.rec_id)"></uni-number-box>

								</view>
							</view>
						</view>
					</view>

				</view>
			</view>

<!-- 			<view class="cart">
				<view class="cart_content">
					<view class="good_info" v-for="(item,index) in 3 " :key="index">
						<image src="../../static/img/select.png" mode="" class="cart_select"></image>
						<view class="good_info_left ">
							<view class="good_info_image">
								<view class="good_info_image_tips">sold out</view>
							</view>
							
							<view class="left_info left_info1">
								<view class="info_name">Adidas Yeezy Boost 350 V2  DazzlingBlue Black GY7164 Men's</view>
								<view class="left_info_bottom">
									<view class="info_lable">
										<text>Multicolor;41</text>
										<image src="/static/img/bottom.png" mode=""></image>
									</view>
									<text>x1</text>
								</view>
								<view class="info_price">
									<text>US$314.00</text>
									<image src="../../static/img/delete2.png" mode="" class="delete"></image>
								</view>
							</view>
						</view>
					</view>
						
				</view>
			</view> -->
			<!-- //失效商品 -->
			<view v-if="outlist.length>0">
				<view class="flex outdate">
					<text>Out of stock</text>
					<text @click="deleteoOutCart(0)">Delete them all</text>
				</view>
				<view class="cart">
					<view class="cart_content">
						<view class="good_info" v-for="(item,index) in outlist" :key="item.rec_id">
							<!-- <image src="../../static/img/select1.png" mode="" class="cart_select"
								v-show="item.is_check==1" @click="cartCheck(0,0,item.rec_id,item)"></image> -->
							<image src="../../static/img/select2.png" mode="" class="cart_select"></image>
							<view class="good_info_left ">
								<view class="good_info_image"
									:style="{background: 'url(' + item.goods_thumb + ') ', backgroundSize: '100%'}">

									<!-- <image :src="item.goods_thumb" mode=""></image> -->
									<view class="delete_tu">sold out</view>
								</view>

								<view class="left_info ">
									<view class="info_name outcat">{{item.goods_name}}</view>
									<view class="left_info_bottom outcat"v-show="item.goods_attr">
										<view class="info_lable">
											<text>{{item.goods_attr}}</text>
											<image src="/static/img/bottom.png" mode=""></image>
										</view>
									</view>
									<!-- <view class="left_info_bottom2" v-if="!item.goods_attr"></view> -->
									<view class="info_price">
										<text class="outcat">US${{item.goods_price}}</text>
										<view class="imgsize">
											<image src="../../static/img/delete1.png" mode=""
												style="height:100%;width:100%" @click="deleteoOutCart(1,item)"></image>
										</view>
									</view>
								</view>
							</view>
						</view>

					</view>
				</view>
			</view>
		</template>


		<view class="recommend">
			<view class="recommend_title">RECOMMEND</view>
			<view class="recommend_content">
				<view class="recommend_content_item" v-for="(item,index) in catList " :key="index"
					>
					<view class="recommend_content_item_image" @click="goDetails(item.id)">
						<image :src="item.thumb" mode=""></image>
					</view>
					<view class="recommend_content_item_image_name">{{item.short_name}}</view>
					<view class="recommend_content_item_pric">
						US${{item.is_promote==0? item.shop_price :item.promote_price}}
						<view><image src="../../static/img/cart2.png" @click="getitem(item)"></image></view>
					</view>
				</view>
			</view>
		</view>

		<view class="footer" v-if="inlist.length>0">
			<view class="footer_left">
				<image src="../../static/img/select1.png" mode="" v-if="all_allno==1 && inlist.length>0"
					@click="cartCheck(0,0)"></image>
				<image src="../../static/img/select2.png" mode="" v-else @click="cartCheck(0,1)"></image>
				<text>All</text>
			</view>
			<view class="footer_right">
				<text>US${{total.goods_price}}</text>
				<button @click="cartCheckOut">CHECKOUT({{total.goods_count}})</button>
			</view>
		</view>
		<uni-popup ref="alertDialog" type="dialog">
			<uni-popup-dialog type="error" cancelText="Close" confirmText="Delete" title="Tips"
				content="Whether to delete goods?" @confirm="dialogConfirm"></uni-popup-dialog>
		</uni-popup>

		<!-- 规格弹出层 -->
		<view class="mask" @click="isChange=false" v-show="isChange"></view>
		<view v-show="isChange" class="addCard">
			<image src="/static/img/close1.png" mode="" class="addCard_close" @click="Close()"></image>
			<!-- <view class="change_img"><image :src="Attr_img" mode=""></image></view> -->
			<scroll-view class="spike1" scroll-x="true" >
				<image :src="item.img_url" mode="" @click="clickImg(gallery_list,index)" class="addCard_scroll" v-for="(item,index) in gallery_list" ></image>
			</scroll-view>
			<scroll-view class="addCard_body" scroll-y="true">
				<view >{{ goodsDate.goods_name}}</view>
				<view class="addCard_price">US${{goodsDate.is_promote==0? shop_price :goodsDate.promote_price}}</view>
				<view  v-for="(item,index) in goods_attr_list" :key="item.attr_id">
					<view >{{item.name}}</view>
					<view class="color_select variations_select_size" v-if="Change == 1 ">
						<view class="color_select_item" v-for="(item1,index1) in item.list"  :key="item1.attr_value"
						:class="str_select[index].goods_attr_id==item1.goods_attr_id?'active_color':''" 
						@click="selectAttr(index,item.attr_id,item1.goods_attr_id,index1,item1.attr_price)">
						<view class="color_select_item_zoom" v-if="item1.attr_img!=''">
							<image src="/static/icon/big2.png" mode="" @click="clickImg(item.list,index1)"></image>
						</view>
						<image :src="item1.attr_img"  mode="" v-if="item1.attr_img!=''"></image>
						<view class="color_select_item_bottom" v-if="item1.attr_img!=''">【{{ item1.attr_value}}】</view>
						<view  class="color_select_item_bottom" v-if="!item1.attr_img">{{ item1.attr_value}}</view>
						</view>
					
					</view>
					<view class="color_select variations_select_size" v-if="Change == 0">
						<view class="color_select_item" v-for="(item1,index1) in item.list"  :key="item1.attr_value"
						:class="goods_attr_list[index].goods_attr_id==item1.goods_attr_id?'active_color':''" 
						@click="selectAttr2(item.attr_id,item1.goods_attr_id,index1,item1.attr_price)">
						<view class="color_select_item_zoom" v-if="item1.attr_img!=''">
							<image src="/static/icon/big2.png" mode="" @click="clickImg(item.list,index1)"></image>
						</view>
						<image :src="item1.attr_img"  mode="" v-if="item1.attr_img!=''"></image>
						<view class="color_select_item_bottom" v-if="item1.attr_img!=''">【{{ item1.attr_value}}】</view>
						<view  class="color_select_item_bottom" v-if="!item1.attr_img">{{ item1.attr_value}}</view>
						</view>
					
					</view>
				</view>	
			</scroll-view>
			<view class="quantity">
				<text>Quantity</text>
				<uni-number-box background="#fff" v-model="num" :min="1"></uni-number-box>
			</view>
			<button @click="AddtoCart">ADD TO CART</button>
		</view>

 <view class="bootom_last1" v-if="bootom == 1">-THE END-</view>
 <view class="tarbar">
 	<view  @click="change(index)" v-for="(item,index) in tarbar" :key="item.name" :class="index==2?'img_m':'tarbar_img'" :style="{color:index==3?'#000':''}">
 		<image :src="item.src"></image>
 		<view>{{ item.name}}</view>
 	</view>
 </view>
</view>
</template>

<script>
	import {
		defaultRequest,
		defaultRequest2,
		defaultRequest3,
		defaultRequest4
	} from '../../api/index.js'
	export default {
		data() {
			return {
				isEmpty: false,
				bootom:0,
				isChange: false,
				backButtonPress: 0,
				// 购物车数据
				Change:0,
				total: {
					goods_price: 0,
					goods_count: 0
				},
				money:0,
				// 商品数据
				goods_list: [],
				// 全选标识。1-全部选中，2-全部未选，3-部分选中。
				all_allno: 2,
				deleteQuery: {
					_action: 'removecart'
				},
				// 获取该分类的其他商品的请求参数
				catQuery: {
					_action: 'getgoods',
					page_index: 1,
					page_size: 30,
					type: 'new'
				},
				addQuery:{
					_action:'addtocart',
					goods_id:'',
					goods_parent_id:0,
					goods_number:'',
					goods_attr_id:'',
					goods_is_package:0
				},
				catList: [],
				isReachBottom: true,
				outlist: [],
				inlist: [],
				goodsDate: {
					comment_summary: [{
						comment_summary: '',
						commentlabel: ""
					}],
					gallery_list: [{
						content: ''
					}],

				},
				gallery_list: [],
				goods_attr_list: [],
				Attr_img:'',
				gotoPay:0,
				num:1.,
				str_select:[],
				query:{
					_action:'cartcheckout',
					is_new:1,
					direct_shopping:0,
					consignee:{
						country:'4191'
					}
				},
				orderId:0,
				shop_price:0,
				bootom:0,
				Is_attr:0,//是否有规格
				isLogin:-1,
				tarbar:[
					{
						src:'../../static/icon/home3.png',
						name:'Home',
						url:'../index/index'
					},
					{
						src:'../../static/img/Category.png',
						name:'Category',
						url:'../category/index'
					},
					{
						src:'../../static/img/min.png',
						name:''
					},
					{
						src:'../../static/img/cart1.png',
						name:'Cart',
						url:'../shippingCart/index'
					},
					{
						src:'../../static/img/Account.png',
						name:'Account',
						url:'../account/index'
					},
				],
			}
		},
		onBackPress(options) {
			this.backButtonPress++;
			if (this.backButtonPress > 1) {
				plus.runtime.quit();
			} else {
				plus.nativeUI.toast('Click again to exit');
			}
			setTimeout(function() {
				this.backButtonPress = 0;
			}, 1000);
			return true;
		},

		methods: {
			goDetails(id) {
				uni.navigateTo({
					url: '/pages/productDetails/index?goodid=' + id
				})
			},
			change(e){
				 this.index = e
				 let tarbar = this.tarbar
				if(e == 2){
					uni.navigateTo({
						url:'../index/index2'
					})
				}else{
					uni.switchTab({
						url:this.tarbar[e].url
					})
				}
			},
			onReachBottom(e){
				
				this.bootom = 1
			},
			Close(){
				this.isChange=false,
				this.goods_attr_list = []
				this.goodsDate=[]
				this.gallery_list=[]
				//
			},
			//获取商品购物车弹窗口数据
			getitem(item){
				this.Change = 0
				//console.log(item)
				let data = {
					_action: 'getgoodsdetail',
					goods_id: item.id
				}
				this.gallery_list = []
				this.goods_attr_list = []
				this.addQuery.goods_id = item.id
				
				this.addQuery.goods_number = this.num
				this.goodsDate = []
				this.getgoodData(data)
				uni.showLoading({
					title:'loading',
				
				})
				setTimeout( () =>{
					uni.hideLoading()
					
					this.isChange = true
				},1500)
				uni.hideTabBar()
			},
			// 获取的其他商品
			getCatList(type) {
				defaultRequest4(this.catQuery).then(res => {
					//console.info(res)
					if (res.error == 0) {
						if (res.data) {
							if (type == 0) {
								this.catList = res.data
							} else {
								this.catList = this.catList.concat(res.data)
							}
						} else {
							this.isReachBottom = false
							uni.showToast({
								title: 'No more data yet',
								icon: 'none'
							})
							this.catQuery.page_index--
						}
					}
					uni.hideNavigationBarLoading();
				})
			},
			//获取地址
			getAddress(){
				let data ={
					_action:'getdefaultconsignee'
				}
				defaultRequest(data).then(res => {
					if(res.error == 0){
						if(res.data.address_id!=' '){
							this.gotoPay = 1
						}
					}
					
				})
			},
			// 修改商品数量
			updateCart(e, id) {
				let data = {
					_action: 'updatecart',
					rec_id: id,
					goods_number: e
				}
				defaultRequest4(data).then(res => {
					//console.info(res)
					if (res.error == 0) {
						this.getList()
						this.getorder()
					}
				})
			},
			// 提交订单
			cartCheckOut() {
				// if (this.inlist.length == 0) return
				this.inlist =[]
				this.goods_list = []
				this.getList()
				this.getorder()
				if (this.all_allno == 2) {
					uni.showToast({
						icon: 'none',
						title: 'Please select the product'
					})
					return
				}
				let data = {
					_action: 'cartcheckout',
					is_new: 1,
					direct_shopping: 0,
					consignee:''
				}
				
				
				uni.navigateTo({
					url: '../order/confirmation?query=' + JSON.stringify(data) + '&orderId='+this.orderId
				})

			},
			// 删除商品
			deleteCart() {
				////console.log(this.inlist, '/////')
				if (this.inlist.length == 0) return
				//未选
				this.deleteQuery.rec_id = ''
				if (this.all_allno == 2) {
					uni.showToast({
						icon: 'none',
						title: 'Please select the product to delete'
					})
					return
				}
				//有选中的数量
				else if (this.all_allno == 3) {
					let selectNum = 0,
						rec_id = ''
					let total = 0

					this.inlist.map(item => {
						if (item.is_check == 1) {
							rec_id = item.rec_id
							selectNum++

						}

					})
					//单选大于1
					if (selectNum > 1) {
						uni.showToast({
							icon: 'none',
							title: 'Only one or all items can be deleted'
						})
						return
					} else if (selectNum == 1) {

						this.deleteQuery.rec_id = rec_id
					}

				} else {
					this.deleteQuery._action = 'removecart'
				}

				this.$refs.alertDialog.open()

			},
			dialogConfirm() {
				var that = this

				defaultRequest(this.deleteQuery).then(res => {

					if (res.error == 0) {
						if (!this.deleteQuery.rec_id) {
							this.inlist = []
							this.outlist = []
							this.goods_list = []
							this.total = 0

						} else {

							this.getList()
							this.getorder()
						}
						setTimeout(() => {
							uni.showToast({
								icon: 'none',
								title: 'Successfully deleted!'
							})
						}, 500)
					}




				})
			},
			// 购物车-商品勾选-单个记录 type: 1为单选 、0为全选
			cartCheck(type, e, id, item) {
				if (this.inlist.length == 0) return;
				let data = {}
				if (type == 1) {
					data = {
						_action: 'cartcheck',
						rec_id: id,
						is_check: e
					}
				} else if (type == 0) {
					data = {
						_action: 'cartcheckall',
						is_check: e
					}

				}
				defaultRequest4(data).then(res => {
					if (res.error == 0) {
						this.getList()
						this.getorder()
					}
				})
			},
			//检测商品是否过期
			async test(list) {
				let goods = []
				let outlist = []
				let inlist = []
				let ids = []

				for (let i of list) {
					ids.push(i.goods_id)
				}
				let res = await Promise.all(ids.map(async (item) => {
					// 等待异步操作完成，返回执行结果 
					return await defaultRequest({
						_action: 'getgoodsdetail',
						goods_id: item
					})
				}));

				res.map(item => {
					goods.push(item.data)
				})
				this.inlist = []
				goods.map(item => {
					for (let i of list) {
						if (i.goods_id == item.goods_id && item.is_on_sale == 0) {
							if (!outlist.includes(i)) {
								outlist.push(i)
								this.outlist = outlist
							}
						} else if (i.goods_id == item.goods_id && item.is_on_sale != 0) {
							if (!inlist.includes(i)) {
								inlist.push(i)
								this.inlist = inlist
							}
						}
					}

				})


			},
			getList() {
				let data = {
					_action: 'getcartgoods'
				}
                
				this.goods_list = []
				defaultRequest4(data).then(res => {
					//console.info(res)

					if (res.error == 0) {
						this.total = res.data.total
						this.all_allno = res.data.all_allno
						
                         ////console.log(this.inlist)
						if (res.data.goods_list) {
							res.data.goods_list.map(item => {
								item.goods_attr = item.goods_attr.replace(/\s\n/g, ';');
							})
							this.goods_list = res.data.goods_list
						}
						let goodlist = this.goods_list
						this.test(goodlist)
						let user = uni.getStorageSync('user_info')
						
						 let list2 = uni.getStorageSync('cartlist')
						  //console.log('11',list2)
						 if(goodlist.length>0 ){
						 
						  list2.map( item =>{
							  if(item.email == user.email){
								 
								  item.cartlist = goodlist
								   
								  uni.setStorageSync('cartlist',list2)
								  console.log(list2)
								 
							  }
						  })
						 
						
						  
						}else{
							// 购物车bug
							// this.inlist = uni.getStorageSync('cartlist')
						}
						
					}
				})

         // 获取tarbar中间
         let data2={_action:'getpagedata',pagecode:'HOMESALEICON '}
         defaultRequest(data2).then(res => {
         	//console.log(res)
         	let url
         	if(res.error == 0){
         		if(res.data.page_code == 'HOMESALEICON'){
         			let src = 'https://www.dopeplus.com/images/mapp_customized/202210/1665653173499940520.png'
         			if(src==res.data.zones[0].blocks[0].block_pic){
         				this.tarbar[2].src = '../../static/img/min.png'
         			}else{
         				src=res.data.zones[0].blocks[0].block_pic
         				// this.tabar[2].src=src
						this.tarbar[2].src = res.data.zones[0].blocks[0].block_pic
         				uni.setStorageSync('midButton',src)
         			}
         		}
         	}
         });


			},
			back() {
				uni.switchTab({
					url: '/pages/index/index'
				});
			},
			//删除购物车失效的商品
			async deleteoOutCart(e, item) {
				let rec_ids = []
				if (e == 1) {
					let data = {
						_action: 'removecart',
						rec_id: item.rec_id
					}
					defaultRequest2(data).then(res => {
						if (res.error == 0) {
							this.getList()
							this.getorder()
							uni.startPullDownRefresh()
							uni.showToast({
								icon: 'none',
								title: 'ok!'
							})


						}
					})
				} else {
					// ////console.log(this.outlist,'删除完了')
					this.outlist.map(item => {
						rec_ids.push(item.rec_id)
					})
					rec_ids.map(item => {
						////console.log(item)
					})
					let res = await Promise.all(rec_ids.map(async (item) => {
						// 等待异步操作完成，返回执行结果 
						return await defaultRequest2({
							_action: 'removecart',
							rec_id: item
						})
					}));
					////console.log(res)
					if (res[0].error == 0) {
						setTimeout( () =>{
						uni.showToast({
							icon: 'none',
							title: 'ok!'
						})	
						},1000)
						
						this.outlist = []
						this.getList()
						this.getorder()
						uni.startPullDownRefresh()

					}


				}

			},
			gotAdd() {
				let data1 = {
					_action:'getgoods',
					type:'hot'
				    
				}
				uni.navigateTo({
					url: '../category/productList?type=' + 'hot'+'&title='+'hot'
							})
				// let data = {
				// 	_action: 'getpagedata',
				// 	pagecode: 'CART'
				// }
				// defaultRequest(data).then(res => {
				// 	if (res.error == 0) {
				// 		let list = res.data.zones
				// 		let url = ''
				// 		list.map(item => {
				// 			if (item.zone_name == 'Add Items') {
				// 				let listdata = item.blocks
				// 				url = listdata[0].block_link

				// 			}
				// 		})

				// 		const i = url.indexOf('?')
				// 		const src = url.substring(i)
    //                     //console.log(src)
				// 		if (url.includes('goodslist')) {
				// 			uni.navigateTo({
				// 				url: '../category/productList' + src
				// 			})
				// 		}
				// 	}
				// })

			},

  getorder(){
	  defaultRequest3(this.query,'consignee').then(res =>{
		  //console.log(res)
		  //console.log(this.query)
		  if(res.error ==0){
			  ////console.log(res)
			  ////console.log(this.total.goods_price)
			// if(res.data.shipping_list == undefined){
			// 	this.money = -1
			// }
			  this.orderId = res.data.shipping_list[0].shipping_id
			  if(parseInt(res.data.shipping_list[0].free_money)> parseFloat(this.total.goods_price)){
				  this.money = parseInt(res.data.shipping_list[0].free_money) - parseFloat(this.total.goods_price)
				  this.money =  parseFloat(this.money).toFixed(2)
				  ////console.log(this.money)
			  }else{
				  this.money = 0
			  }
		  }
	  })
  },
			// 更改购物车规格
			ChangeAttr(item) {
				////console.log(item)
				this.isChange = true
				uni.hideTabBar()
				this.Change = 1
				this.goodsDate =[]
				this.gallery_list = []
				this.deleteQuery.rec_id = item.rec_id
				this.addQuery ={
					_action:'addtocart',
					goods_id:item.goods_id,
					goods_parent_id:item.goods_parent_id,
					goods_number:'',
					goods_attr_id:'',
					goods_is_package:0
				}
				this.goods_attr_list = []
				
				this.str_select =[]
				this.Attr_img = item.goods_thumb
				this.num  = item.goods_number
				let str_select = item.goods_attr_id.split(',')
				////console.log(str_select)
				str_select.map(item =>{
					this.str_select.push({
						goods_attr_id:item
					})
				})
				 ////console.log(this.str_select)
				
				let data = {
					_action: 'getgoodsdetail',
					goods_id: item.goods_id
				}
				
				this.getgoodData(data)
			},
			getgoodData(data){
				defaultRequest(data).then( res =>{
					if(res.error==0){
						this.goodsDate = res.data
						this.shop_price = this.goodsDate.shop_price
						this.gallery_list = res.data.gallery_list
						if(this.goodsDate.attr_list){
							this.goodsDate.attr_list.map(item=>{
								if(item.attr_name=="Color"){
									this.colorNum=item.goods_attrs.length
								}
								let data={name:item.attr_name,goods_attr_id:'',attr_id:item.attr_id,list:item.goods_attrs}
									this.goods_attr_list.push(data)
	
								this.Is_attr =1
								//console.log(this.goods_attr_list,'pp')
							})
						}else if (this.goodsDate.attr_list==undefined){
							 this.goods_attr_list =[] //无规格
							this.Is_attr = 0
							//console.log(this.goods_attr_list)
						}
					}
				})
			},
			// 选择规格
		selectAttr(index,attr_id,goods_attr_id,index1,attr_price){
			this.current = index
			if(this.Change == 0){
				this.goods_attr_list[index].goods_attr_id = goods_attr_id
			}
			//console.log(this.goods_attr_list)
			//console.log(goods_attr_id)
			let sum  = this.goodsDate.shop_price
			if(attr_price){
			   sum = parseInt(sum) + parseInt(attr_price)
			   ////console.log(sum)
			    
			}
			this.shop_price = sum
			let data={attr_id:attr_id,goods_attr_id:goods_attr_id}
			if(this.goods_attr_list.length==0){
				this.goods_attr_list.push(data)
			}else{
				// 判断是否有新的规格加入
				let isNew=false
				for(let i in this.goods_attr_list){
					let item=this.goods_attr_list[i]
					if(item.attr_id==attr_id){
						if(item.goods_attr_id==goods_attr_id){
							this.str_select[i].goods_attr_id=''
						}else{
							this.str_select[i].goods_attr_id=goods_attr_id
							////console.log(this.str_select)
							
						}
						isNew=false
						break
					}else{
						isNew=true
					}
				}
				if(isNew){
					this.goods_attr_list.splice(index,0,data)
				}
			}
		},
		selectAttr2(attr_id,goods_attr_id,index1,attr_price){
			this.current = index1
			this.addQuery.goods_number = this.num
			let sum  = this.goodsDate.shop_price
			if(attr_price){
			   sum = parseInt(sum) + parseInt(attr_price)
			   //console.log(sum) 
			}
			this.shop_price = sum
			let data={attr_id:attr_id,goods_attr_id:goods_attr_id}
			if(this.goods_attr_list.length==0){
				this.goods_attr_list.push(data)
			}else{
				// 判断是否有新的规格加入
				let isNew=false
				for(let i in this.goods_attr_list){
					let item=this.goods_attr_list[i]
					if(item.attr_id==attr_id){
						if(item.goods_attr_id==goods_attr_id){
							this.goods_attr_list[i].goods_attr_id=''
						}else{
							this.goods_attr_list[i].goods_attr_id=goods_attr_id
						}
						isNew=false
						break
					}else{
						isNew=true
					}
				}
				if(isNew){
					this.goods_attr_list.splice(index,0,data)
				}
			}
			//console.log(this.goods_attr_list)
			// let list =[]
			// this.goods_attr_list.map( item =>{
			// 	if(item.goods_attr_id!=''&&!this.addQuery.goods_attr_id.includes(item.goods_attr_id)){
			// 		this.addQuery.goods_attr_id+=item.goods_attr_id+','
			// 	}
			// })
			// this.cartQuery.goods_attr_id=goods_attr_id.substring(0,goods_attr_id.lastIndexOf(','));
			// //console.log(this.addQuery.goods_attr_id)
		},
		//1选择规格确定后 2先删除原来商品 3再加入购物车
		AddtoCart(){
			////console.log(this.deleteQuery)
			//console.log(this.addQuery)
			
			this.addQuery.goods_number = this.num
			if(this.Change == 1){
			this.addQuery.goods_attr_id =''
			this.str_select.map(item=>{
			if(item.goods_attr_id!=''){
				this.addQuery.goods_attr_id+=item.goods_attr_id+','
			}	
					})
			////console.log(this.addQuery)
			let tag = 0 
			
			defaultRequest4(this.deleteQuery).then(res =>{
				////console.log(res)
				if(res.error==0){
					tag = 1
					
					// setTimeout(() =>{
						defaultRequest4(this.addQuery).then(res =>{
							if(res.error ==0){
								this.getList()
								this.getorder()
								this.isChange = false
								
							}
						})
					// },3000)
				}
			})
			}else{
				// this.isChange = false
				this.addCart()
				
			}
		},
		// 添加到购物车
		addCart(){
			//console.log(this.goods_attr_list)
			//console.log(this.Is_attr)
			let goods_attr_id=''
			 if(this.Is_attr>0){
				
				this.goods_attr_list.map(item=>{
					if(item.goods_attr_id!=''){
						goods_attr_id+=item.goods_attr_id+','
					}
					
				})
				let isall = 1
				this.goods_attr_list.map(item =>{
					////console.log(item.goods_attr_id)
					if(item.goods_attr_id==''){
						isall = 0
					}
				})
				
				if(isall == 0){
					uni.showToast({
						title:'Please select the product specification',
						icon:'none'
					})
					return
				}
				
				// this.cartQuery.goods_attr_id=goods_attr_id.substring(0,goods_attr_id.lastIndexOf(','));
			}
			//console.log(goods_attr_id)
			this.addQuery.goods_attr_id=goods_attr_id.substring(0,goods_attr_id.lastIndexOf(','));
			//console.log(this.addQuery)
			if(this.isLogin == 1){
			defaultRequest2(this.addQuery).then(res=>{
				//console.log(res)
				if(res.error==0){
					
					this.addQuery.goods_attr_id = ''
				if(res.data[0].success){
					this.isChange = false
					//
					setTimeout( ()=>{
						uni.showToast({
							title:'Successfully added',
							icon:'none'
						})
					},500)
					
				}   
				   this.getList()
					this.getCartNum()
					this.getCatList()
				}
			})
			}
			else if (this.isLogin == 0){
				uni.navigateTo({
					url:'../login/index'
				})
			}
			
		},
		// 点击预览图片
		clickImg(list,index) {
			////console.log(list)
			let imglist = []
			
			list.map( item =>{
				if(item.img_url){
				imglist.push(item.img_url)
				}
				else{
	          imglist.push(item.attr_img)	
				}
			})
			
			
			wx.previewImage({
				urls: imglist, //需要预览的图片http链接列表，多张的时候，url直接写在后面就行了
				current: index, // 当前显示图片的http链接，默认是第一个
				indicator:'number',
				success: function(res) {},
				fail: function(res) {},
				complete: function(res) {},
			})
			
			
		},

		},
	 	onLoad() {
			this.isLogin = uni.getStorageSync('isLogin')
			console.log(this.isLogin)
			 let user = uni.getStorageSync('user_info')
			 console.log(user)
			 let list = uni.getStorageSync('cartlist')
			 console.log(list)
			 
			// uni.startPullDownRefresh()
			uni.hideTabBar()
			this.getList()
			this.getCatList(0)
            this.getAddress()
            this.getorder()
			

		},
		async onShow() {
			this.isLogin = uni.getStorageSync('isLogin')
			console.log(this.isLogin)
			// uni.startPullDownRefresh()
			let user = uni.getStorageSync('user_info')
			console.log(user)
			let list = uni.getStorageSync('cartlist')
			console.log(this.inlist)
			let tag = 0
			// list.map(i =>{
			// 	if(i.email == user.email){
			// 		tag = 1
			// 		this.inlist = i.cartlist
			// 	}
			// 	});
			// if(this.goods_list.length == 0 &&tag ==1){
				
			// let res = await Promise.all(this.inlist.map(async (item) => {
			// 	// 等待异步操作完成，返回执行结果 
			// 	return await defaultRequest({
			// 		_action:'addtocart',
			// 		goods_id:item.goods_id,
			// 		goods_parent_id:0,
			// 		goods_number:item.goods_number,
			// 		goods_attr_id:item.goods_attr_id,
			// 		goods_is_package:0
			// 	})
			// }))
			
			
			
				
			
			// console.log(res)
			// if(res&&res[0].error == 0){
			// 	uni.startPullDownRefresh()
			// 	this.getList()
			// }
			// }
			// this.tarbar[2].src = uni.getStorageSync('midButton')
			this.getList()
			this.getorder()

		},
		onPullDownRefresh() {
			this.getList()
			this.getorder()
			this.getCatList(0)

			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 2000);
		},

		// onHide() {
		// 	//
		// },
		// 上拉加载
		onReachBottom() {
			if (!this.isReachBottom) return
			this.catQuery.page_index++
			this.getCatList(1)
		},
		onPullDownRefresh() {
			uni.stopPullDownRefresh()
		}

	}
</script>
<style lang="scss" scoped>
	page{
		background-color: #f4f3f8;
		height: 100vh;
		padding-bottom: 150rpx;
	}
	.body{
		background-color: #f4f3f8;
		height: 100%;
		padding-bottom: 150rpx;
		
	}
	.bootom_last1{
		 height: 200rpx;
		 // height: 300rpx;
		 width: 100%;
		 color: #000;
		 // background-color: #fff;
		 font-size: 25rpx;
		 line-height: 115rpx;
		 text-align: center;
	}
	.recommend_content{
		background-color: #f4f3f8 !important;
		
	}
	.uni-navbar {
		font-size: 32rpx;
		font-weight: bold;
	}
	.recommend{
	 color:#000 !important;	
	 margin-top: 10px !important;
	}
	.recommend_content_item{
		background-color: #fff !important;
		// padding: 0 20rpx;
	}
	.recommend_content_item_image_name{
		color:#333 !important;
		height:60rpx;
		line-height: 34rpx;
		overflow: hidden;
	}
	.recommend_content_item_pric{
		font-weight: bold;
		font-size: 36rpx;
		padding-left: 20rpx;
		padding-top: 18rpx;
		padding-right:20rpx;
		display: flex;
		justify-content: space-between;
		image{
			height: 36rpx;
			width: 36rpx;
		}
	}
	
	.recommend_content_item_image_name{
		
		color:#cfcfcf;
		
		padding: 8rpx 20rpx;
		
		word-wrap: wrap;
		overflow: hidden !important;
	}
	// .recommend_content{
	// 	line-height: 34rpx !important;
	// 	height: 68rpx !important;
	// }
 .body{
	 background-color:#f4f3f8;
 }
	.uni-numbox {
		border: 1px solid #999999;
		border-radius: 14rpx;
		height: 42.67rpx;

		/deep/ .uni-numbox__minus {
			border-radius: 14rpx;
		}

		/deep/.uni-numbox__plus {
			border-radius: 14rpx;
		}

		/deep/.uni-numbox__value {
			border-left: 1px solid #999999;
			border-right: 1px solid #999999;
			height: 100%;
			width: 63.33rpx;
			font-size: 21.33rpx;
		}
	}

	.nav_right {
		image {
			width: 36rpx;
			height: 36rpx;
		}
	}

	.empty {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding-top: 136rpx;
		font-size: 30.67rpx;
		font-weight: 400;

		image {
			width: 125.33rpx;
			height: 125.33rpx;
			margin-bottom: 49.33rpx;
		}

		button {
			font-size: 29.33rpx;
			font-weight: 500;
			background-color: black;
			color: white;
			height: 45.67rpx;
			line-height: 45.67rpx;
			border-radius: 0;
			margin-top: 33.33rpx;
		}
	}

	.recommend {
		margin-top: 124rpx;
	}

	.cart_info {
		background-color: #fcfcfc;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 20.67rpx 0 36rpx  32rpx;
		padding-right: 32rpx;
		font-size: 24rpx;
		font-weight: 400;
         // border-bottom: #737373 1rpx dashed;
		image {
			width: 41.33rpx;
			height: 41.33rpx;
		}

		.cart_title_content {
			width: 510.67rpx;
			margin-top: 18rpx;
			text-align: left;
			line-height: 50rpx;
			
		}
        .title_left{
        	width: 620rpx;
			line-height: 50rpx;
			height: 50rpx;
			margin-top: 20rpx;
			text-align: left;
			// background-color: #B22234;
        	float: left !important;
        	padding: 0 !important;
        }
		.cart_title_right {
			width: 100rpx;
			
			text-align: right;
			font-size: 26rpx;
			font-weight: bold;
		}
	}

	.cart {
		background-color: #fff;
		  
		margin: 0 18rpx;
		padding-left: 18rpx;
		padding-right: 24rpx;
		padding-top: 20rpx;
		padding-bottom: 15rpx;
		margin-top: 10.67rpx;
		.cart_title {
			padding-left: 12.67rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			font-size: 28rpx;
			margin-bottom: 76rpx;
		}

		.cart_content {
			.good_info {
				display: flex;
				align-items: center;
				color: #000000;
				justify-content: space-between;
				border-bottom: none;
				padding: 0;
				// margin-bottom: 78.67rpx;
				&:nth-child(odd) {
					margin-bottom: 10px;
				}
				&:last-child {
					margin-bottom: 0;
				}

				.good_info_image {
					position: relative;

					image {
						width: 100%;
						height: 100%;
					}

					.good_info_image_tips {
						width: 117.33rpx;
						height: 117.33rpx;
						border-radius: 50%;
						background: rgba(0, 0, 0, 0.3);
						color: white;
						font-size: 22rpx;
						font-weight: 800;
						display: flex;
						align-items: center;
						justify-content: center;
						z-index: 99;
						position: absolute;
						top: 50%;
						margin-top: -60rpx;
						left: 50%;
						margin-left: -60rpx;
					}
				}
                   .left_info_bottom2{
					    width: 250rpx;
						margin-right: 10rpx;
						height: 30rpx;
						// padding: 0 3rpx  10rpx;
						padding: 5.37rpx;
						margin-top: 20rpx;
				   }
					.left_info_bottom {
						 color: #C4C4C4;
                         // background-color: #B22234;
						 max-width: 280rpx;
						 display: flex;
						 padding: 0 3rpx 10rpx  10rpx;
						 // border: 1px solid #C4C4C4;
						 border-radius:25rpx;
						 margin-right: 10rpx;
						 height: 30rpx;
						 align-items: center;
						 text-align: start;
						 line-height: 40rpx;
						 padding: 5.37rpx;
						 .image-v{
							 height: 15rpx;
							 width: 15rpx;
							 margin-left:6rpx ;
							 float: right;
							 margin-bottom: 25rpx;
							 image{
								 height: 100%;
								 width: 100%;
								 margin-right: 6rpx;
							 }
						 }
						 
						.info_lable {
							display: flex;
							align-items: center;
							height: 30rpx;
							margin-top: -20px;
							// height: 40rpx;
							padding-left: 10rpx;
							 // border: 1px solid #C4C4C4;
							overflow: hidden;
							// border: none !important;
						.info_lable_text {
								// 内部
								white-space: nowrap;
								overflow: hidden;
								text-overflow: ellipsis;
								
								margin-right: -3rpx;
							}
							
						}
					}

					.info_price {
						color: #000000;
				}
				

				.cart_select {
					// width: 34.67rpx;
					// height: 34.67rpx;
					width: 14px;
					height: 14px;
					object-fit: cover;
					margin-right: 6rpx;
				}

				.info_name {
					width: 406.67rpx;
					text-overflow: -o-ellipsis-lastline;
					overflow: hidden; //溢出内容隐藏
					text-overflow: ellipsis; //文本溢出部分用省略号表示
					display: -webkit-box; //特别显示模式
					-webkit-line-clamp: 2; //行数
					line-clamp: 2;
					-webkit-box-orient: vertical;
				}

				.delete {
					width: 36rpx;
					height: 36rpx;
				}
			}


		}
	}

	.footer {
		padding: 21rpx 0;
		padding-left: 27.33rpx;
		padding-right: 19.33rpx;
		background-color: white;
		position: fixed;
		bottom: 115rpx;
		width: 100%;
		box-sizing: border-box;
		border-top: 2px solid #F6F5FA;
		z-index: 120;
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-size: 36rpx;

		.footer_left {
			font-weight: 400;
			display: flex;
			align-items: center;

			image {
				width: 34.67rpx;
				height: 34.67rpx;
				margin-right: 10rpx;
			}
		}

		.footer_right {
			display: flex;
			align-items: center;
			font-weight: 600;

			button {
				height: 73.33rpx;
				line-height: 73.33rpx;
				background-color: #191919;
				margin: 0;
				font-size: 26.67rpx;
				font-weight: bold;
				color: white;
				margin-left: 23.33rpx;
				border-radius: 0;
			}
		}
	}

	.flex {
		display: flex;
	}

	.outdate {
		justify-content: space-between;
		margin: 30rpx 18rpx;
		font-weight: 400;

	}

	.imgsize {
		height: 40rpx;
		width: 40rpx;
	}

	.delete_tu {
		position: absolute;
		width: 100rpx;
		height: 100rpx;
		margin: 25rpx;
		padding: 25rpx;
		text-align: center;
		background-color: #eef;
		background-color: rgba(0, 0, 0, 0.2);
		color: #fff;
		font-size: 26rpx;
		line-height: 100rpx;
		border-radius: 50%;
		z-index: 99;
		font-weight: 700;
		// justify-content: space-between;

	}

	.outcat {
		filter: blur(2px);
	}
.addCard{
		z-index: 999;
		position: fixed;
		bottom: 0;
		left: 0;
			
		background-color: white;
		padding-left: 29.33rpx;
		padding-right: 29.33rpx;
		box-sizing: border-box;
		padding-top: 77.67rpx;
		width: 100%;
		font-size: 30.67rpx;
		font-weight: 400;
		padding-bottom: 44.67rpx;
		
		.addCard_close{
			width: 21.33rpx;
			height: 21.33rpx;
			position: absolute;
			right: 24.67rpx;
			top: 18.67rpx;
		}
		.spike1{
			margin-top: 0;
			margin-bottom: 20rpx;
			padding-bottom: 0;
			border-bottom: none;
			.addCard_scroll{
				width: 286.67rpx;
				height: 286.67rpx;
				margin-left: 10.67rpx;
				&:first-child{
					margin-left: 0;
				}
				&:last-child{
					margin-right: 15rpx;
				}
			}
		}
		.addCard_body{
			padding-right: 31.33rpx;
			max-height: 60vh;
			min-height: 400rpx;
			.addCard_price{
				font-size: 44rpx;
				font-weight: bold;
				margin-top: 27.33rpx;
				margin-bottom: 51.33rpx;
			}
			.color_select{
				
				display: flex;
				font-size: 16.67rpx;
				color: #666666;
				flex-wrap: wrap;
				margin-bottom: 59.33rpx;
				.color_select_item{
					margin-top: 22rpx;
					position: relative;
					background-color: #F9F7FA;
					border-radius: 6.67rpx;
					margin-right: 12.67rpx;
					width: 134.67rpx;
					image{
						width: 134.67rpx;
						height: 133.33rpx;
						border-radius: 6.67rpx 6.67rpx 0 0; 
					}
					.color_select_item_zoom{
						width: 20.33rpx;
						height: 20.33rpx;
						// background-color: rgba(0, 0, 0, 0.3);
						display: flex;
						align-items: center;
						justify-content: center;
						position: absolute;
						right: 12.67rpx;
						top: 9.33rpx;
						z-index: 99;
						image{
							width: 100%;
							height: 100%;
						}
					}
					.color_select_item_bottom{
						padding: 10rpx 0rpx;
						font-size: 24rpx;
						text-align: center;
						
					}
				}
				.active_color{
					color: #fff;
					background-color: #000;
					border: 1px solid #000000;
				}
			}
			.variations_select_size{
				margin-left: 0;
				margin-top: 26.67rpx;
				margin-bottom: 40.67rpx;
				.select_size_item{
					margin-bottom: 16.67rpx !important; 
					&:nth-child(4n+4){
						margin-right: 0;
					}
				}
			}
			
		}
		
		.quantity{
			display: flex;
			align-items: center;
			background-color: white;
			justify-content: space-between;
			margin-bottom: 43.33rpx;
			.uni-numbox{
				border: 1px solid #999999;
				border-radius: 14rpx;
				height: 42.67rpx;
				
				
				/deep/ .uni-numbox__minus{
					border-radius: 14rpx;
				}
				/deep/.uni-numbox__plus{
					border-radius: 14rpx;
				}
				/deep/.uni-numbox__value{
					border-left: 1px solid #999999;
					border-right: 1px solid #999999;
					height: 100%;
					width: 63.33rpx;
					font-size: 21.33rpx;
				}
			}
		}
		button{
			width: 100%;
			height: 73.33rpx;
			line-height: 73.33rpx;
			background-color: #191919;
			color: white;
			font-weight: bold;
			font-size: 26.67rpx;
		}
	}
	
	.spike1{
		white-space: nowrap;
		width: 100%;
		margin-top: 36.67rpx;
		padding-bottom: 34rpx;
		border-bottom: 1px solid #E2E2E2;
		::-webkit-scrollbar {
			width: 0;
			height: 0;
			background-color: transparent;
		} 
		.spike1_item{
			width: 410rpx;
			background-color: #F6F6F6;
			padding: 21.33rpx 24.67rpx;
			margin-right: 19.33rpx;
			font-size: 20rpx;
			display: inline-block;
			color: #737373;
			&:last-child{
				margin-right: 0;
			}
			view{
				margin-bottom: 10rpx;
			}
			.spike1_item_title{
				font-weight: bold;
				
				.text_black{
					color: black;
					display: inline-block;
					margin-left: 10rpx;
				}
				.text_red{
					color: #B22234;
					display: inline-block;
					margin-left: 10rpx;
				}
			}
		}
		.spike1_item1{
				color: #191919;
				font-size: 29.33rpx;
				margin-right: 16.67rpx;
				width: 200rpx;
				display: inline-block;
				font-weight: bold;
				.spike1_item_img{
					width: 200rpx;
					height: 200rpx;
					
					background-color: #999999;
				}
				.spike1_item_bottom{
					padding-left: 9.33rpx;
					margin-top: 22.67rpx;
					
					.spike1_item_text{
						color: #9D9D9D;
						font-size: 21.33rpx;
						text-decoration: line-through;
					}
					.spike1_item_text1{
						color: #9D9D9D;
						font-size: 21.33rpx;
					}
				}
				.spike1_item_bottom1{
					padding-left: 9.33rpx;
					margin-top: 19.33rpx;
					font-weight: bold;
					
					.spike1_item_text{
						color: #000000;
						font-size: 16rpx;
						font-weight: 400;
						margin-bottom: 20.67rpx;
						white-space: break-spaces;
						
					}
				}
				
			}
			.spike1_item:last-child{
				margin-right: 0;
			}
	}
	/deep/ .uni-nav-bar-text {
		padding-left: 16%;
	}
</style>
