java/cath-app/pages/mes/gx/popup/commonpopup.vue

<template>
	<view class="pop-container">
		<uni-popup ref="popup" type="dialog" >
			<uni-popup-dialog 
				:title="title" 
				message="" 
				:duration="2000" 
				:before-close="true" 
				@close="handleCancel" 
				@confirm="handleOk">
				<view class="dialog-content">
					<view class="header-container">
						<uni-row class="demo-uni-row">
							<uni-col :span="5" style="padding-left: 10px;text-align: center" >
								<view  class="gjz-title">关键字</view>
							</uni-col>
							<uni-col :span="19">
								<uni-search-bar
									v-model="keyWord"
									 @input="input"
									 @cancel="cancel" 
									 @clear="clear" 
									  cancelButton="none"
								 />
							</uni-col>
						</uni-row>
						<uni-row class="demo-uni-row">
							<uni-col :span="24" style="text-align: center;">
								<button class="mini-btn" type="primary" size="mini"  @click="search">查询</button>
							</uni-col>
						</uni-row>
					</view> 
					<view style="height: 200px">
						 <zb-table
						 ref="zbTable"
						 :show-header="true"
						 :stripe="false"
						 :columns="column"
						 :data="data"
						 :highlight="true"
						 @currentChange="currentChange"
						 :border="true"
					    >
						 
						</zb-table> 
					</view>
				</view>
				<!-- <view slot="footer">
				  <button type="primary" @click="handleOk">确定</button>
				  <button @click="handleCancel">取消</button>
				</view> -->
			</uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	import { getDicts } from "@/api/system/dict/data"; // 字典
	import { reserveIssue,reserveIssue2 } from '@/api/mes/pro.js'
	
	export default {
		props: {
		  title: {
		    type: String,
		    required: true
		  },
		  idxFlag:{
			type: String,
			required: true
		  },
		  formData:{
			type: Object,
			require: true
		  }
		},
		mounted() {
			
		},
		created: function(option) {
			
		},
		data() {
			return {
				currentFlag: '',
				keyWord: '', // 输入查询的值
				column: [],	 // 表头数据
				data: [], // 表体数据
				data2: [], // 表体数据2
				currentSelectData: {},  //当前选中数据行
			};
		},
		methods:{
			handleOk() {
				let returnData = {
					currentFlag: this.currentFlag,
					selectData: this.currentSelectData
				}
				this.$emit("sendData", returnData);
			      // 点击确定按钮的处理逻辑
				this.currentSelectData = {}
			    this.$refs.popup.close()
			},
			handleCancel() {
			  // 点击取消按钮的处理逻辑
			  this.$refs.popup.close()
			},
			showPopup() {
				// 传递的哪个跳转标志位
				this.currentFlag = this.idxFlag;
				let that = this;
				let cFlag = that.idxFlag;
				switch (cFlag){
					case "lld": // 领料单
						that.column = [
						  { name: 'batchCode', label:'批次号', width:90, align:'center', emptyString:'--'},
						  { name: 'itemCode', label: '产品物料编码', width:150, align:'center', emptyString:'--'},
						  { name: 'itemName', label: '产品物料名称', width:150, align:'center', emptyString:'--'},
						  { name: 'warehouseName', label: '仓库名称', width:90, align:'center', emptyString:'--'},
						  { name: 'quantityIssued', label: '领料量', width:90, align:'center', emptyString:'--'},
						];
						that.getReserveIssue();
						break;
					default:
						break;
				}
			
			},
			hidePopup() {
				this.$refs.popup.close();
			},
			// 单选当前行
			currentChange(row,index){
				this.currentSelectData = row;
		    },
			// searchBar
			input(value) {// uniSearchBar 的 value 改变时触发事件，返回参数为uniSearchBar的 value	e=value
				this.keyWord = value;
			},
			clear(res) {
				this.keyWord = "";
			},
			cancel(res) {
				this.keyWord = "";
			},
			// 查询按钮点击事件
			search(){
				let that = this;
				let cFlag = that.idxFlag;
				switch (cFlag){
					case "lld": //单据
						this.getReserveIssue();
						break;
					default:
						break;
				}
			},
			async getReserveIssue(){
				let params = {
					workstationId:this.formData.workstationId,
					params: {
						"keyWord":this.keyWord
					},
				}
				await reserveIssue(params).then(res => {
					if(res.code === 200){
						this.data = res.data.map(item => ({
							sourceDocId: item.id,
							sourceLineId: item.id,
							batchCode: item.batch,
							itemCode: item.materialCode,
							itemName: item.materialName,
							specification: item.materialSpecification,
							warehouseName: item.warehouseName,
							quantityIssued: item.stockQty,
							unitOfMeasure: item.unitCode
						}));
						this.$refs.popup.open();
					}
				});
				
				
				let params2 = {
					workorderId:this.formData.workorderId,
					params: {
						"keyWord":this.keyWord
					},
				}
				await reserveIssue2(params2).then(res => {
					if(res.code === 200){
						this.data2 = res.data.flatMap(item =>
							item.wmsStockOutsList.map(subItem => ({
								sourceDocId: item.id,
								sourceLineId: subItem.id,
								batchCode: subItem.batch,
								itemCode: subItem.materialCode,
								itemName: subItem.materialName,
								specification: subItem.materialSpecification,
								warehouseName: item.warehouseName,
								quantityIssued: subItem.stockQty,
								unitOfMeasure: subItem.unitCode
							}))
						);
						this.$refs.popup.open();
					}
				});
				//合并两个接口数据
				this.data = this.data.concat(this.data2);
			},
		},
	}
</script>

<style>
	@import "@/static/scss/commonpopup.css"
</style>