sfms3.0-uniapp3/src/mycomponents/query/balanceQuery.vue

<template>
	<view style=" ">
		<u-popup v-model="show" mode="left" : :width="330">
			<view style="height:100vh;display:flex;flex-direction:column;">
				<view class="uni-flex" style="justify-content: center;
				background-color:#007AFF ;
				color: #fff; 
				padding: 15rpx;
				font-size: 35rpx;">
					库存查询
				</view>
				<scroll-view v-if="true" style="height: calc(100vh - 180rpx)" scroll-y="true">
					<!-- <button @click="closeDrawer" type="primary">关闭Drawer</button> -->
					<!-- <view v-for="item in 110" :key="item">可滚动内容 {{ item }}</view> -->
					<view class="" style="margin: 10rpx; font-size: 35rpx;">
						物料号：
					</view>
					<view style=" margin: 10rpx; display: flex; align-items: center;">
						<u-input class="uni-mt-5" prefixIcon="search" v-model="itemCode" placeholder="请输入物料号"
							@clear="clearItemCode" @confirm="onConfirmItemCode"></u-input>
						<!-- <view>查询</view> -->
						<!-- <button  style="height: 80rpx; align-items: center; text-align: center;" type="primary" size="mini" >查询</button> -->
					</view>

					<view v-for="(item, index) in itemCodeResult" :key="index" @click="selectItemCode(item)">
						<view class="" style="font-size: 30rpx; margin: 20rpx;">
							<view class="">
								({{index+1}}) 物料代码 : {{item.code}}
							</view>
							<view class="">
								名称 : {{item.name}}
							</view>
							<view class="">
								描述1 : {{item.desc1}}
							</view>
							<view class="">
								描述2 : {{item.desc1}}
							</view>
						</view>
						<view class="split_line"></view>
					</view>
					<scroll-view scroll-x="true" v-if="tableData.length>0"
						style="width: 330px; display: flex; align-items: center;  justify-content: center; ">
						<view
							style="width: 330px; display: flex;justify-content: center; background-color: #fff; padding-bottom: 150rpx;">
							<u-table border stripe emptyText="暂无更多数据">
								<!-- 表头行 -->
								<u-tr>
									<u-th width="60" align="left">批次</u-th>
									<u-th width="100" align="left">库位</u-th>
									<u-th width="60" align="left">状态</u-th>
									<u-th width="120" align="left">数量</u-th>
								</u-tr>
								<!-- 表格数据行 -->
								<u-tr v-for="(item, index) in tableData" :key="index">
									<u-td>{{item.batch}}</u-td>
									<u-td>{{item.locationCode}}</u-td>
									<u-td>{{statusDesc(item.inventoryStatus)}}</u-td>
									<u-td>{{item.totalQty}}</u-td>
								</u-tr>

							</u-table>
							<!-- <view class="uni-flex"   style=" flex-direction: column; position: fixed; bottom: 0;  margin-bottom: 100rpx; background-color: #fff; width: 100%; align-items: center;" >
								<view class="" style="width: 100%; display: flex;  justify-content: center; font-size: 32rpx;margin-top: 10rpx;margin-bottom: 10rpx;">
									<view class="" >当前页：{{ current }}，总数：{{ total }}条，每页：{{ pageSize }}
								</view>
								
								</view>
								<uni-pagination :current="current" :total="total" :show-icon="true"
									@change="change" />
							</view> -->

						</view>

					</scroll-view>

				</scroll-view>

				<button @click="closeDrawer" type="primary" style="padding-left: 20rpx; width: 100%;">关闭</button>
			</view>

		</u-popup>
		<comMessage ref="comMessageRef"></comMessage>
	</view>
</template>

<script setup>
	import {
		getBasicItemByCodeSenior,
		getBalanceByBusinessType
	} from '@/api/request2.js';

	import {
		getInventoryStatusStyle,
		getInventoryStatusName
	} from '@/common/directory.js';

import { ref } from 'vue';
import { onLoad } from '@dcloudio/uni-app'; // 引入 uni-app 的 onLoad 钩子

const props = defineProps({
  businessTypeCode: {
    type: String,
    default: ""
  }
});

const comMessageRef = ref(null);

const itemCode = ref("");
const itemCodeResult = ref([]);
const current = ref(1);
const total = ref(18);
const tableData = ref([]);

const statusStyle = (val) => {
  return getInventoryStatusStyle(val);
};

const statusDesc = (value) => {
  return getInventoryStatusName(value);
};

const change = () => {
};

const showErrorMessage = (message) => {
  comMessageRef.value.showErrorMessage(message, (res) => {
    if (res) {
    }
  });
};

const selectItemCode = (item) => {
  itemCode.value = item.code;
  itemCodeResult.value = [];
  getBalanceByBusiness(itemCode.value, props.businessTypeCode);
};

const clearItemCode = () => {
  itemCode.value = "";
  itemCodeResult.value = [];
  tableData.value = [];
};

const onConfirmItemCode = () => {
  if (!itemCode.value) {
    showErrorMessage("物料号为空,请先输入物料号");
    return;
  }
  tableData.value = [];
  uni.showLoading({
    title: "加载中",
    mask: true
  });

  getBasicItemByCodeSenior(itemCode.value).then((res) => {
    if (res.data && res.data.list.length > 0) {
      if (res.data.list.length === 1) {
        itemCode.value = res.data.list[0].code;
        getBalanceByBusiness(itemCode.value, props.businessTypeCode);
      } else {
        uni.hideLoading();
        itemCodeResult.value = res.data.list;
      }
    } else {
      uni.hideLoading();
      showErrorMessage("未查找到物料[" + itemCode.value + "]");
    }
  }).catch((error) => {
    uni.hideLoading();
    showErrorMessage(error);
  });
};

const getBalanceByBusiness = (itemCode, businessType) => {
  const params = {
    itemCode: itemCode,
    businessType: businessType,
    inOrOut: "out"
  };
  getBalanceByBusinessType(params).then((res) => {
    uni.hideLoading();
    if (res.data && res.data.length > 0) {
      tableData.value = res.data;
    } else {
      showErrorMessage("系统异常:按" + res.msg + "未查找到库存");
    }
  }).catch((error) => {
    uni.hideLoading();
    showErrorMessage(error);
  });
};

const showDrawer = () => {
  show.value = true
};

const closeDrawer = () => {
  show.value = false
};
</script>

<style>
</style>