zhongshen_project/addon/cashier---/source/os/pages/stock/check.vue

<template>
	<base-page>
		<view class="goodslist">
			<view class="goodslist-box">
				<view class="goodslist-left">
					<view class="goods-title">
						盘点单查询
						<text class="iconfont icongengduo1"></text>
					</view>
					<view class="goods-search">
						<view class="search">
							<text class="iconfont icon31sousuo"></text>
							<input type="text" v-model="search_text" @input="search" placeholder="搜索盘点单号" />
						</view>
					</view>
					<scroll-view scroll-y="true" class="goods-list-scroll" :show-scrollbar="false" @scrolltolower="getListData">
						<view
							class="item"
							@click="getDetailData(item.inventory_no, index)"
							v-for="(item, index) in list"
							:key="index"
							:class="{ itemhover: selectGoodsKeys == index }"
						>
							<view class="title">
								<view>{{ item.inventory_no }}</view>
							</view>
							<view class="other-info">
								<view>{{ item.operater_name }}</view>
								<view>{{ $util.timeFormat(item.create_time) }}</view>
							</view>
						</view>
						<view class="notYet" v-if="!list.length">暂无数据</view>
					</scroll-view>
					<button type="default" class="add-wastage" v-if="storeInfo.stock_type == 'store'" @click="add()">添加盘点单</button>
				</view>
				<view class="goodslist-right">
					<view class="goods-title">盘点单详情</view>
					<view class="order-information" v-if="Object.keys(detail).length">
						<view class="order-status">基本信息</view>
						<view class="order-types">
							<view class="type type1">
								<view>制单人：</view>
								<view>{{ detail.operater_name || '--' }}</view>
							</view>
							<view class="type type1">
								<view>制单时间：</view>
								<view class="message">{{ detail.create_time }}</view>
							</view>
						</view>

						<view class="goods-info">
							<view class="title">商品明细</view>
							<view class="table">
								<view class="table-th table-all">
									<view class="table-td" style="width:25%;justify-content: flex-start;">商品名称/规格/条形码</view>
									<!-- <view class="table-td" style="width:5%">单位</view> -->
									<view class="table-td" style="width:8%">实物库存</view>
									<view class="table-td" style="width:8%">实盘数量</view>
									<view class="table-td" style="width:8%">盈亏数量</view>
									<view class="table-td" style="width:13%">盈亏成本总额(元)</view>
								</view>
								<view class="table-tr table-all" v-for="(item, index) in detail.goods_sku_list_array" :key="index">
									<view class="table-td table-goods-name" style="width:25%;justify-content: flex-start;">
										<image :src="$util.img(item.goods_img)" mode="aspectFill"></image>
										<text class="multi-hidden">{{ item.goods_sku_name }}</text>
									</view>
									<!-- <view class="table-td" style="width:5%">种</view> -->
									<view class="table-td" style="width:8%">{{ item.stock }}</view>
									<view class="table-td" style="width:8%">{{ item.inventory_num }}</view>
									<view class="table-td" style="width:8%">{{ item.profitloss_num }}</view>
									<view class="table-td" style="width:13%">{{ item.inventory_cost_money }}</view>
								</view>
							</view>

							<view class="total-money-num">
								<view class="box">
									<view>商品种类</view>
									<view class="money">{{ detail.goods_count }}种</view>
								</view>
								<view class="box">
									<view>实盘种类</view>
									<view class="money">{{ detail.kinds_num }}种</view>
								</view>
								<view class="box">
									<view>盘盈</view>
									<view class="money kinds-profit">{{ detail.kinds_profit_num }}</view>
								</view>
								<view class="box">
									<view>盘亏</view>
									<view class="money kinds-loss">{{ detail.kinds_loss_num }}</view>
								</view>
								<view class="box">
									<view>持平种类</view>
									<view class="money">{{ detail.kinds_even_num }}种</view>
								</view>
							</view>
						</view>
					</view>
					<block v-else><image class="cart-empty" :src="$util.img('public/uniapp/cashier/goods_empty.png')" mode="widthFix"></image></block>
				</view>
			</view>
		</view>
	</base-page>
</template>

<script>
export default {
	data() {
		return {
			selectGoodsKeys: 0,
			//获取订单的页数
			page: 1,
			//每次获取订单的条数
			page_size: 9,
			// 订单搜索是用到的数据
			search_text: '',
			//初始时加载详情数据判断
			one_judge: true,
			// 订单列表数据
			list: [],
			//订单详情数据
			detail: {}
		};
	},
	onLoad(option) {
		this.getListData();
	},
	methods: {
		// 搜索
		search() {
			this.page = 1;
			this.list = [];
			this.one_judge = true;
			this.getListData();
		},
		/**
		 * 获取订单列表
		 */
		getListData() {
			this.$api.sendRequest({
				url: '/stock/storeapi/check/lists',
				data: {
					page: this.page,
					page_size: this.page_size,
					inventory_no: this.search_text
				},
				success: res => {
					if (res.data.list.length == 0 && this.one_judge) {
						this.detail = {};
						this.one_judge = false;
					}
					if (res.code >= 0 && res.data.list.length != 0) {
						this.page += 1;

						if (this.list.length == 0) {
							this.list = res.data.list;
						} else {
							this.list = this.list.concat(res.data.list);
						}

						//初始时加载一遍详情数据
						if (this.one_judge) {
							this.getDetailData(this.list[0].inventory_no);
						}
					}
				}
			});
		},
		/**
		 * 获取订单详情数据
		 */
		getDetailData(inventory_no, keys = 0) {
			this.selectGoodsKeys = keys;
			this.type = 'detail';
			this.$api.sendRequest({
				url: '/stock/storeapi/check/detail',
				data: {
					inventory_no
				},
				success: res => {
					if (res.code >= 0) {
						this.detail = res.data;
						this.$forceUpdate();
						this.one_judge = false;
					}
				}
			});
		},
		add(data) {
			this.$util.redirectTo('/pages/stock/add_check');
		}
	}
};
</script>

<style scoped lang="scss">
.kinds-loss {
	color: red !important;
}
.kinds-profit {
	color: #15eb26 !important;
}
@import './public/css/orderlist.scss';
</style>