<template>
	<view class="se-h-vh-100 se-w-vw-100 se-flex">
		<view class="se-w-vw-25 se-bgc-f5">
			<view class="se-h-80 se-lh-80 se-tos-1 se-ta-c se-fs-24 se-c-black " @click="onItems(indexs,items)" :class="indexs==current?'se-bgc-white se-c-green':''" v-for="(items,indexs) in navList" :key="indexs">
				<text>{{items.name}}</text>
			</view>
		</view>
		<view class="se-w-vw-75 se-scroll-y">
			<view class="se-grid-2 se-pt-10">
				<view class="items-box se-br-5 se-px-10" v-for="(items,indexs) in list" :key="indexs" @click="onDetail(items)">
					<image class="se-w-p-100 se-h-200 se-bgc-f5 se-br-5  se-py-5" :src="items.images[0]" mode=""></image>
					<view class="se-c-black se-fs-24 se-fw-6 se-mt-10">
						{{ items.goodsName }}
					</view>
					<!-- <view class="se-flex se-flex-ff-rw se-mt-10">
						<view class="se-tag">
							{{items.brand}}
						</view>
						<view class="se-tag">
							{{items.goodsTime}}
						</view>
						<view class="se-tag">
							{{items.mileage}}公里
						</view>
					</view> -->
					<view class="se-flex se-flex-h-sb se-w-p-100 se-pt-20">
						<view class="se-fs-24 se-display-ib">
							<text class="se-c-orange se-fs-26 se-fw-6"><text class="se-fs-24">￥</text>{{items.price | getPersonAuthentication}}<text class="se-fs-24">元</text><text class="se-fs-24" v-if="items.cartypeId=='1875536807086256130'">/月</text></text>
						</view>
					</view>
				</view>
			</view>
			<u-empty v-if="list && list.length==0" mode="list"></u-empty>
		</view>
	</view>
</template>

<script>
	import { queryCategoryList,queryGoodsList } from "@/common/api.js"
	export	default {
		data(){
			return{
				id:null,
				categorytwoId:"",
				current:0,
				navList:[],
				list:[],
				pageNo:1,
				pageSize:20
			}
		},
		onLoad(options) {
			this.id = options.id
			this.onQueryCategoryTwoList()
		},
		filters:{
			getPersonAuthentication(price){
				let companyAuthenticationStatus = uni.getStorageSync("companyAuthenticationStatus")
				if(companyAuthenticationStatus==1){
					return price
				}
				
				let personAuthenticationStatus =uni.getStorageSync("personAuthenticationStatus")
				if (personAuthenticationStatus != 1){
					return '***';
				}
				return price
			}	
		},
		methods:{
			onItems(indexs,items){
				this.current=indexs
				this.categorytwoId = items.id
				this.pageNo=1
				this.onPageList()
			},
			onQueryCategoryTwoList(){
				let that = this
				let params = {
					categoryOneId:that.id
				}
				queryCategoryList(params).then(response=>{
					that.navList = response.result[0].carrentCategorytwoList
					that.categorytwoId = response.result[0].carrentCategorytwoList[0].id
					that.onPageList()
				}).catch(error=>{
					
				})
			},
			onPageList(){
				let that = this
				let params={
					status:1,
					cartypeId:that.id,
					categorytwoId:that.categorytwoId,
					pageNo:that.pageNo,
					pageSize:that.pageSize,
				}
				queryGoodsList(params).then((response) => {
					console.info('queryGoodsList',response)
					response.result.records.forEach((items,indexs)=>{
						if(items.image){
							items.images = items.image.split(',')
						}else{
							items.images = []
						}
						if(items.imageBack){
							items.imageBacks = items.imageBack.split(',')
						}else{
							items.imageBacks = []
						}
						if(items.imageCab){
							items.imageCabs = items.imageCab.split(',')
						}else{
							items.imageCabs = []
						}
						if(items.imageFront){
							items.imageFronts = items.imageFront.split(',')
						}else{
							items.imageFronts = []
						}
						if(items.imageLeft){
							items.imageLefts = items.imageLeft.split(',')
						}else{
							items.imageLefts = []
						}
						if(items.imageRight){
							items.imageRights = items.imageRight.split(',')
						}else{
							items.imageRights = []
						}
					})
					if(that.pageNo==1){
						that.list = response.result.records
					}else{
						that.list = that.list.concat(response.result.records) 
					}
					
				}).catch((error) =>{
					
				})
			},
			onDetail(event){
				let companyAuthenticationStatus = uni.getStorageSync("companyAuthenticationStatus")
				if(companyAuthenticationStatus==1){
					uni.navigateTo({
						url:"/pages_subpack/detail/index?goodsId="+event.id
					})
					return;
				}
				let personAuthenticationStatus =uni.getStorageSync("personAuthenticationStatus")
				if (personAuthenticationStatus != 1){
					return uni.showModal({
								title:"未认证",
								showCancel:false,
								content:"立即前往认证",
								success() {
									uni.navigateTo({
										url:"/pages/identity/index?userStatus=1"
									})
								}
							})
				}
				uni.navigateTo({
					url:"/pages_subpack/detail/index?goodsId="+event.id
				})
			}
		}
	}
</script>

<style>
	.items-box{
		background: #ffffff;
		border-radius: 8rpx;
		box-shadow: 0rpx 4rpx 16rpx 0rpx rgba(0,0,0,0.05); 
		padding: 20rpx;
	}
	.se-tag{
		margin-right: 10rpx;
		margin-top: 5px;
		padding: 5rpx 10rpx;
		background: #fff2df;
		border-radius: 4rpx;
		border: 2rpx solid rgba(0,0,0,0.00);
		font-size: 16rpx;
		font-family: PingFang SC, PingFang SC-Bold;
		font-weight: 700;
		text-align: center;
		color: #fab143;
	}
</style>