yiliangyiyun-app/pages/user/contractLook/warehouseReserves.vue

<template>
	<view>
		<view style='background:#fff;padding:15px 10px 10px;border-radius:0 0 10px 10px;'>
			<u-search bgColor='#F5F6F9' @change='keyWordChange' :show-action="false" placeholder="请输入仓库名" v-model="warehouseName"></u-search>
		</view>
		
		<view class='content'>
			<view class='content-item' v-for='item in dataList'>
				<view style='padding:10px 0;font-weight:600;' class="flex justify-between">
					<view class="big-title">{{item.name}}</view>
					<view class="big-price">￥{{item.value}}</view>
				</view>
				<view v-for='(item2,index) in item.content'>
					<view style='margin:10px 0;padding:0 10px 10px;' :style='{"border-bottom":index!=item.content.length-1?"1px solid #eee":""}'>
						<view style='width:100%;height:30px;' v-if='item2.status==1'>
							<view class="orange-title">{{item2.goodsName}}</view>
						</view>
						<view v-else>
							<view class="green-title">{{item2.goodsName}}</view>
						</view>
						<view style='color:#878C9C;' class="flex justify-between">
							<view>{{item2.storage}}吨</view>
							<view>{{item2.cost}}元/吨</view>
							<view>{{item2.value}}元</view>
						</view>
					</view>
					
					
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				chartlist: [],
				carCount1: '',
				carCount2: '',
				carCount3: '',
				inventoryCost: '',
				inventoryValue: '',
				ZChart: {},
				// url:"https://datav.aliyuncs.com/share/235518097ffd673bc1eb05011b9a02b6",
				url: '',
				flag: true,
				chartData: {},
				ringoptions: {},
				dataList:[],
				currentPage:1,
				pageSize:10,
				warehouseId:'',
				warehouseName:''
			}
		},
		onLoad: function(option) {
			uni.showLoading({
				title: "加载中",
				mask: true
			})
			this.init()
		},
		methods: {
			keyWordChange(e){
				this.warehouseName=e
				uni.showLoading({
					title: "加载中",
					mask: true
				})
				this.init()
			},
			init() {
				this.dataList=[]
				this.$api.doRequest('get', '/costManagementInfo/selectCostManagementInfo',
				{compId:uni.getStorageSync('pcUserInfo').compId,
				warehouseId: this.warehouseId,
				warehouseName: this.warehouseName,
				warehouseType: 1,currentPage: this.currentPage,pageSize: this.pageSize,searchKeyWord:this.searchKeyWord}).then(res => {
					uni.hideLoading()
					var data={
						name:'',
						content:[]
					}
					var id=''
					let index = 1;
					let i = 0;
					if(res.data.data.length>0){
						for(let k in res.data.data){
							data.name=res.data.data[k].warehouseName
							let {warehouseId} = res.data.data[i];
							let {warehouseId:warehouseId2} = res.data.data[i+1]||{}
							if(warehouseId==warehouseId2 ){
								index++;
								data.content.push({...res.data.data[k]})
								if(this.dataList.length>0){
									if(this.dataList.every( function( item, index, array ){ 
										return item.name!=data.name })){
										this.dataList.push(JSON.parse(JSON.stringify(data)))
									}else{
										for (var q = 0; q < this.dataList.length; q++) {
											if(this.dataList[q].name==data.name){
												this.dataList[q]=JSON.parse(JSON.stringify(data))
											}
										}
									}
								}else{
									this.dataList.push(JSON.parse(JSON.stringify(data)))
								}
							}else{
								data.name=res.data.data[k].warehouseName
								data.content.push({...res.data.data[k]})
								if(this.dataList.length>0){
									if(this.dataList.every( function( item, index, array ){ return item.name!=data.name })){
										this.dataList.push(JSON.parse(JSON.stringify(data)))
									}else{
										for (var q = 0; q < this.dataList.length; q++) {
											if(this.dataList[q].name==data.name){
												this.dataList[q]=JSON.parse(JSON.stringify(data))
											}
										}
									}
								}else{
									this.dataList.push(JSON.parse(JSON.stringify(data)))
								}
								data.content=[]
								index = 1;
							}
							i++
						}
					}else{
						this.dataList=[]
					}
					if(this.dataList.length>0){
						for (var q = 0; q < this.dataList.length; q++) {
							var num=0
							for (var k = 0; k < this.dataList[q].content.length; k++) {
								if(this.dataList[q].content[k].goodsName.indexOf('玉米')==-1){
									this.dataList[q].content[k].status=0
								}else{
									this.dataList[q].content[k].status=1
								}
								this.dataList[q].content[k].value=(this.dataList[q].content[k].cost*this.dataList[q].content[k].storage).toFixed(4)
								num+=Number(this.dataList[q].content[k].value)
							}
							this.dataList[q].value=Number(num).toFixed(2)
						}
					}
					console.log(this.dataList)
				})
			
				
			},
			getdata(e) {
				console.log(e)
			}
		}
	}
</script>



<style scoped lang="scss">
	.content{
		background:#F5F6FA;
	}
	.content-item{
		background:#fff;
		margin:10px;
		padding:10px;
		border-radius:6px;
		font-size:14px;
		.big-title,.big-price{
			font-size:16px;
		}
		.big-price{
			color:#22C572;
		}
		.orange-title {
			color:#FE6430;
			font-size:24rpx;
			background:#FEECE6;
			position:absolute;
			padding:3px;
			border-radius:3px;
			text-align:center;
		}
		.green-title {
			color:#22C572;
			font-size:24rpx;
		}
	}
	charts-box {
		// background: black;
		position: relative;
		// top: 70vh;
	}

	.content2 .row,
	.content4 .row {
		display: flex;
		justify-content: space-around;
		background: #24262d;
		padding: 40rpx 20rpx;

		.item-top,
		.item-bottom {
			color: #d5d5d5;
		}

		.item-bottom {
			display: flex;
			align-items: center;
		}
	}

	.bottom-tip {
		position: absolute;
		z-index: 11;
		color: #8c8c8d;
		right: 10px;
		bottom: 10px;
	}

	.title-margin {
		bottom: 120rpx;
	}
</style>