<template>
	<view class="page1" style="overflow: scroll;height:100%;">
		<view style="background: #fff;height: 100rpx;">
			<view class="content-list" style="padding-top: 20rpx;">
				<view class="list-name">供应商</view>
				<uni-data-select class="uni-data-select" :clear='false' :localdata="supplierList" v-model="gysId"
					placeholder="请选择供应商" @change="supplierChange"></uni-data-select>
			</view>
		</view>
		<view class="heji">
			<view style="flex: 1;">合计</view>
			<view style="flex: 1;">{{totalAmount}}件</view>
			<view style="flex: 1;">{{totalPrice}}元</view>
		</view>
		<view style="width: 95%;margin: 0 auto 100rpx;border: 1.5px solid #000;border-radius: 10px;">
			<uni-table emptyText="请选择供应商后查看">
				<uni-tr style="background: #F08080;">
					<uni-th align="center" width="70">货号</uni-th>
					<uni-th align="center" width="70">品名</uni-th>
					<uni-th align="center" width="70">进价</uni-th>
					<uni-th align="center" width="55">库存</uni-th>
					<uni-th align="center" width="80">成本</uni-th>
				</uni-tr>
				<!-- 表格数据行 -->
				<uni-tr v-for="(item,index) in inventoryList" :key="index">
					<uni-td align="center">
						<text>
							{{item.productSn == null ?"" :item.productSn}}
						</text>
					</uni-td>
					<uni-td align="center">
						{{item.productName == null ?"0" :item.productName}}
					</uni-td>
					<uni-td align="center">
						{{item.purchasePrice == null ?"0" :item.purchasePrice}}
					</uni-td>
					<uni-td align="center">
						{{item.stockCount == null ?"0" :item.stockCount}}
					</uni-td>
					<uni-td align="center">
						{{item.price == null ?"0" :item.price}}
					</uni-td>
				</uni-tr>
			</uni-table>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				searchStr: '',
				inventoryList: [],
				supplierList: [],
				gysId:'',
				totalPrice:0,
				totalAmount:0
			};
		},
		onLoad(options) {
			this.gysList()
		},
		methods: {
			//切换供应商
			supplierChange(e) {
				this.gysId = e;
				this.getOrderInfoList()
			},
			//供应商列表
			gysList() {
				this.tui.request('/app/supplier/getByCondition', 'POST', {
					pageNumber: 1,
					pageSize: 100000
				}, false, true).then((res) => {
					if (res.code !== 200) return
					this.supplierList = res.result.content.map(item => {
						return {
							value: item.id,
							text: item.consigneeName
						}
					})
				})
			},
			// 订单查询
			getOrderInfoList() {
				if(this.gysId == '') return
				uni.showLoading({
					title: '加载中...',
					mask: true
				})
				let data = {
					pageNum: 1,
					supplierId: this.gysId,
					pageSize: 1000000
				}
				this.tui.request("/app/product/getShareList", "POST", data, false, false).then((res) => {
					if (res.code == 200) {
						this.totalPrice = 0
						this.totalAmount = 0
						this.inventoryList = res.result.records
						for(let i=0;i<this.inventoryList.length;i++){
							this.inventoryList[i].price = Number((this.inventoryList[i].purchasePrice * this.inventoryList[i].stockCount).toFixed(2))
							this.totalPrice += this.inventoryList[i].price
							this.totalAmount += Number(this.inventoryList[i].stockCount)
						}
					} else {
						this.tui.toast(res.message)
					}
				}).catch((res) => {})
				uni.hideLoading()
			},
		}
	}
</script>

<style lang="scss">
	page,.page1{
		height: 100%;
		font-size: 28rpx;
	}
	.content-list {
		display: flex;
		height: 80rpx;
	}
	.list-name {
		width: 200rpx;
		text-align: left;
		line-height: 80rpx;
		height: 80rpx;
		padding-left: 20rpx;
	}
	.uni-data-select {
		width: 70%;
		text-align: center;
	}
	.heji{
		display: flex;
		text-align: center;
		height: 80rpx;
		margin-top: 20rpx;
		line-height: 80rpx;
		font-weight: bold;
		font-size: 30rpx;
	}
</style>