<template>
	<view class="">
		<u-navbar :is-back="true" :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
		};
	},
	onLoad() {
		this.materialList();
	// 	this.$http("category.query", {}).then(res => {
    //     let {
    //       code,
    //       data
    //     } = res;
    //     if (code === 200) {
    //       this.dataList = data;

    //     }
    //   })
	},
	// 上拉加载更多
	onReachBottom() {
		if (this.total > this.fiabricList.length) {
			this.size = this.size + 5;
			this.materialList();
		}
	},
	methods: {
		searchCli() {
			// this.size = 5;
			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": 1,
				"materialType": "面料",
				codeAndName: this.search
			}).then(res => {
				let { code, data } = res;
				if (code == 200) {
					this.fiabricList = data.page.records;
					this.total = data.page.total;
				}
			});
		}
	}
};
</script>

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