<template>
	<view class="page">
		<navbar title="我的物品" leftClick @leftClick="$utils.navigateBack" />
		
		<!-- <view class="tabs">
			<uv-tabs :list="tabs" :activeStyle="{color : '#FD5100', fontWeight : 600}" lineColor="#FD5100" lineHeight="8rpx"
				lineWidth="50rpx" :scrollable="false" @click="clickTabs"></uv-tabs>
		</view> -->
		
		<commoditySelect ref="commoditySelect"/>
		
		<!-- <view class="btn fixed" @click="$refs.addLease.open()">
			<button class="a">添加物品</button>
		</view> -->
		
		
		<addLease ref="addLease" @submit="$refs.commoditySelect.getList()"/>
	</view>
</template>

<script>
	import commoditySelect from "../components/commodity/commoditySelect.vue"
	import addLease from '../components/product/addLease.vue'
	import { mapState } from 'vuex'
	export default {
		components : {
			commoditySelect,
			addLease,
		},
		data() {
			return {
				tabs: [{
						name: '选择租赁物品'
					},
					{
						name: '选择我的物品'
					},
				],
				type : '',
			}
		},
		onLoad(args) {
			this.type = args.type
			if(this.type == 'add'){
				this.$refs.addLease.open()
			}
		},
		onShow() {
			this.$refs.commoditySelect.getList()
		},
		methods: {
			//点击tab栏
			clickTabs({
				index,
				name
			}) {
				// this.type = index;
				// this.queryParams.pageSize = 10
				// this.checkboxValue = []
				// this.mixinsListApi = ['orderPage', 'orderPage'][index]
			},
		}
	}
</script>

<style scoped lang="scss">
.page{
	// padding-bottom: 200rpx;
	.tabs{
		position: sticky;
		top: calc(var(--status-bar-height) + 120rpx);
		background-color: #fff;
		// padding-top: 20rpx;
	}
	.fixed{
		position: fixed;
		bottom: 20rpx;
	}
	.btn {
		display: flex;
		justify-content: center;
		width: 100%;
		
		.a {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 90%;
			height: 100rpx;
			color: #FFF;
			background-color: $uni-color;
			border: 1px solid red;
			border-radius: 100rpx;
			font-size: 30rpx;
		}
	}
	
}
</style>
