<template>
	<view class="">
		<u-navbar :is-back="true" :custom-back="backPush" :background="{ backgroundColor: '#F5F5F5' }" title="我的面料">
		</u-navbar>
		<view class="content background_fff u-p-30">
			<!-- 正文内容 -->
			<u-sticky offset-top="15">
				<u-search @search="searchCli" class="" bg-color="#fff" border-color="#ececec" placeholder="请输入面料名称"
					:show-action="false" v-model="search"></u-search>
			</u-sticky>
			<view>
				<view class="u-m-t-30">
					<!-- 后期用公共组件 fabricTitle -->
					<!-- <hs-material-thumbnail @click="detailFabric(item)" :item="filterFiabric(item)"></hs-material-thumbnail> -->
					<fabricTitle :tableData="fiabricList"></fabricTitle>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import home from './mixin/index.js'
	import fabricTitle from "./components/fabricTitle.vue"
	export default {
		mixins: [home],
		components: {
			fabricTitle
		},
		data() {
			return {
				size: 10,
				search: '',
				fiabricList: [],
				// dataList:[],
				total: 0,
				current: 1,
				isLoad: false,
			};
		},
		onLoad() {
			this.materialList();
			// 	this.$http("category.query", {}).then(res => {
			//     let {
			//       code,
			//       data
			//     } = res;
			//     if (code === 200) {
			//       this.dataList = data;

			//     }
			//   })
		},
		// 上拉加载更多
		onReachBottom() {
			// console,log("jiazai")
			if (this.total > this.fiabricList.length) {
				// this.size = this.size + 5;
				this.current += 1
				this.materialList();
			}
		},
		methods: {
			searchCli() {
				// this.size = 5;
				this.current = 1
				this.isLoad = true
				this.materialList();

			},
			// 我的面料
			materialList() {
				// this.$http('orderTicket.materialList', {
				// 	size: this.size,
				// 	materialCode: '',
				// 	materialName: this.search
				// }).then(res => {
				// 	let { code, data } = res;
				// 	if (code == 200) {
				// 		this.fiabricList = data.data;
				// 		this.total = data.total;
				// 	}
				// });
				this.$http('materialinfo.getMaterialList', {
					size: this.size,
					materialCode: '',
					"current": this.current,
					"materialType": "面料",
					codeAndName: this.search
				}).then(res => {
					let {
						code,
						data
					} = res;
					if (code == 200) {
						// 搜索
						if (this.isLoad) {
							console.log("load")
							this.fiabricList = []
							this.fiabricList = data.page.records;
							this.isLoad = false
						} else {
							this.fiabricList = this.fiabricList.concat(data.page.records);
						}
						this.total = data.page.total;
					}
				});
			},
			backPush() {
				this.$Router.push({
					path: "/pages/home/index",
					// query: {
					//   id: this.id
					// }
				})
			}
		}
	};
</script>

<style scoped lang="scss">
	.background_fff {
		background: #fff;
	}
</style>