java/cath-app/pages/menu/backStockOut/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 { listStockIn, ListStockOutHead, listBackStockTaskOut, listRwbm, listSupplier, listDepartment, listEmployee, listCustomer, listExtend, listPallet, listPackage } from "@/api/wms/backStockOut.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: [], // 表体数据
				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 "rwbm": //任务编码
							// 出库类型
							let inTypeObj = {}
							getDicts("out_type").then(response => { 
								  // that.inTypeOption = response.data;
								  let tmpArr = response.data;
								  if(tmpArr.length > 0){
									tmpArr.forEach((item,index)=>{
										inTypeObj[item.dictValue] = item.dictLabel;
									})
								  }
							});
							// 任务编码表头
							that.column = [
							  { name: 'taskCode', label:'任务编号', width:170,align:'center', emptyString:'--' },
							  { name: 'taskDate', label:'任务日期', width:120,align:'center', emptyString:'--'},
							  { name: 'taskType', label: '任务类型', width:100, align:'center', emptyString:'--', filters:inTypeObj},
							];
							that.getRwbmList();
						break;
					case "bm": // 部门
						// 部门表头
						that.column = [
						  { name: 'deptCode', label:'部门编码', width:130,align:'center', emptyString:'--' },
						  { name: 'deptName', label:'部门名称', width:120,align:'center', emptyString:'--'},
						];
						that.getBmList();
						break;
					case "zy": // 职员
						// 职员表头
						that.column = [
						  { name: 'employeeCode', label:'职员编码', width:120,align:'center', emptyString:'--' },
						  { name: 'employeeName', label:'职员名称', width:100,align:'center', emptyString:'--'},
						];
						that.getZyList();
						break;
					case "kh": // 客户
						// 职员表头
						that.column = [
						  { name: 'customerCode', label:'客户编码', width:100,align:'center', emptyString:'--' },
						  { name: 'customerName', label:'客户名称', width:300,align:'center', emptyString:'--'},
						];
						that.getKhList();
						break;
					case "sflb": // 收发类别
						// 收发类别表头
						that.column = [
							{ name: 'extendClassName', label:'类', width:60, align:'center', emptyString:'--' },
							{ name: 'extendCode', label:'编码', width:100, align:'center', emptyString:'--'},
							{ name: 'extendName', label: '名称', width:150, align:'center', emptyString:'--'},
						];
						that.getSflbList();
						break;
					case "gys": // 供应商
						// 供应商表头
						that.column = [
						  { name: 'supplierCode', label:'供应商码', width:120, align:'center', emptyString:'--' },
						  { name: 'supplierName', label:'供应商', width:300, align:'center', emptyString:'--'},
						];
						that.getGysList();
						break;
					case "tp": // 托盘
						// 托盘表头
						that.column = [
						  { name: 'palletCode', label:'托盘编码', width:100, align:'center', emptyString:'--'},
						  { name: 'palletName', label: '托盘名称', width:130, align:'center', emptyString:'--'},
						];
						that.getTpList();
						break;
					case "bz": // 包装
						// 包装表头
						that.column = [
						  { name: 'packageCode', label:'包装编码', width:100, align:'center', emptyString:'--'},
						  { name: 'packageName', label: '包装名称', width:130, align:'center', emptyString:'--'},
						];
						that.getBzList();
						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 "rwbm": // 任务编码
						this.getRwbmList();
						break;
					case "bm": // 部门
						that.getBmList();
						break;
					case "zy": // 职员
						this.getZyList();
						break;
					case "kh": // 职员
						this.getKhList();
						break;
					case "sflb": //收发类别
						this.getSflbList();
						break;
					case "gys": //供应商
						this.getGysList();
						break;
					case "bz": //包装
						this.getBzList();
						break;
					case "tp": //托盘
						this.getTpList();
						break;
					default:
						break;
				}
			},
			// 获取任务编码数据
			getRwbmList(){
				let that = this;
				let params = {
					supplierCode: that.formData.supplierCode,  //供应商
					customerCode: that.formData.customerCode, //客户
					taskType: 1,
					params: {
						"billTypeCode":that.formData.billTypeCode,
						"keyWord":that.keyWord,
						"limit":50
					},
				}
				listBackStockTaskOut(params).then(res => {
					if(res.code === 200){
						that.data = res.rows.map(item => {
							let a1 = item.wmsTaskOuts;
							let a2 = item;
						    return Object.assign({}, a2, a1);
						});
						this.$refs.popup.open();
					}
				});
			},
			// 获取供应商数据
			getGysList(){
				let that = this;
				let params = {
					status: '0', //(固定)
					params: {
						"keyWord":that.keyWord,
						"limit":50
					},
				}
				listSupplier(params).then(res => {
					if(res.code === 200){
						that.data = res.rows;
						this.$refs.popup.open();
					}
				});
			},
			// 获取部门数据
			getBmList(){
				let that = this;
				let params = {
					status: '0', //(固定)
					params: {
						"keyWord":that.keyWord,
						"limit":50
					},
				}
				listDepartment(params).then(res => {
					if(res.code === 200){
						that.data = res.rows;
						this.$refs.popup.open();
					}
				});
				
			},
			// 职员数据
			getZyList(){
				let that = this;
				if(that.formData.deptCode === ""){
					uni.showToast({
						title: "请先选择部门",
						icon: "none",
					})
					return; 
				}
				
				let params = {
					status: '0', //(固定)
					deptCode: that.formData.deptCode,
					params: {
						"keyWord":that.keyWord,
						"limit":50
					},
				}
				
				listEmployee(params).then(res => {
					if(res.code === 200){
						that.data = res.rows;
						this.$refs.popup.open();
					}
				});
			},
			// 获取客户数据
			getKhList(){
				let that = this;
				let params = {
					status: '0', //(固定)
					params: {
						"keyWord":that.keyWord,
						"limit":50
					},
				}
				listCustomer(params).then(res => {
					if(res.code === 200){
						that.data = res.rows;
						this.$refs.popup.open();
					}
				});
				
			},
			// 获取收发类别数据
			getSflbList(){
				let that = this;
				
				let params = {
					extendClassCode: "01.02",
					params: {
						"keyWord":that.keyWord,
						"limit":50
					},
				}
				
				listExtend(params).then(res => {
					if(res.code === 200){
						that.data = res.rows;
						this.$refs.popup.open();
					}
				});
			},
			// 获取包装数据
			getBzList(){
				let that = this;
				
				let params = {
					status: '0',
					params: {
						"keyWord":that.keyWord,
						"limit":50
					},
				}
				
				listPackage(params).then(res => {
					if(res.code === 200){
						that.data = res.rows;
						this.$refs.popup.open();
					}
				});
			},
			//获取托盘数据
			getTpList(){
				let that = this;
				
				let params = {
					status: '0',
					params: {
						"keyWord":that.keyWord,
						"limit":50
					},
				}
				
				listPallet(params).then(res => {
					if(res.code === 200){
						that.data = res.rows;
						this.$refs.popup.open();
					}
				});
			},
		},
	}
</script>

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