仓库模块-出库单：添加出库单样式

2024-03-18 15:36:00 +08:00
parent 202dc372b3
commit 49280dfbc1
5 changed files with 771 additions and 428 deletions
--- a/src/views/wmsManagement/components/TheChouseMaterial/TheChouseMaterial.vue
+++ b/src/views/wmsManagement/components/TheChouseMaterial/TheChouseMaterial.vue
@@ -0,0 +1,133 @@
+<template>
+	<div>
+		<el-dialog v-bind="$attrs" v-on="$listeners" @open="onOpen" @close="onClose" title="物料选择">
+			<el-form ref="elForm" :model="formData" :rules="rules" size="mini" label-width="80px">
+				<el-row type="flex" justify="start" align="top" :gutter="10">
+					<el-form-item label="物料号" prop="partnumber">
+						<el-input v-model="formData.partnumber" placeholder="请输入物料号" clearable :style="{ width: '100%' }"> </el-input>
+					</el-form-item>
+					<el-form-item label="U8编码" prop="u8InventoryCode">
+						<el-input v-model="formData.u8InventoryCode" placeholder="请输入U8编码" clearable :style="{ width: '100%' }"></el-input>
+					</el-form-item>
+					<el-form-item label="描述" prop="description">
+						<el-input v-model="formData.description" placeholder="请输入描述" clearable :style="{ width: '100%' }"> </el-input>
+					</el-form-item>
+				</el-row>
+				<el-row type="flex" justify="start" align="top" :gutter="10">
+					<el-form-item label="" prop="search">
+						<el-button type="primary" icon="el-icon-search" size="medium" @click="getList">搜索</el-button>
+						<el-button type="success" icon="el-icon-plus" size="medium" :disabled="dataList.length === 0">添加物料</el-button>
+					</el-form-item>
+				</el-row>
+				<el-row>
+					<el-table
+						:data="dataList"
+						v-loading="loading"
+						ref="table"
+						border
+						highlight-current-row
+						@selection-change="handleSelectionChange"
+					>
+						<el-table-column type="selection" width="50" align="center" />
+						<el-table-column prop="partnumber" label="物料号" align="center" :show-overflow-tooltip="true" />
+						<el-table-column prop="u8InventoryCode" label="U8编码" align="center" :show-overflow-tooltip="true" />
+						<el-table-column prop="unit" label="单位" align="center" :show-overflow-tooltip="true" />
+						<el-table-column prop="description" label="显示描述" align="center" :show-overflow-tooltip="true" />
+						<el-table-column prop="version" label="版本号" align="center" :show-overflow-tooltip="true" />
+						<el-table-column prop="remarks" label="备注" align="center" :show-overflow-tooltip="true" />
+						<el-table-column prop="remarks" label="现有库存" align="center" :show-overflow-tooltip="true" />
+					</el-table>
+					<pagination
+						class="mt10"
+						background
+						:total="total"
+						:page.sync="queryParams.pageNum"
+						:limit.sync="queryParams.pageSize"
+						@pagination="getList"
+					/>
+				</el-row>
+			</el-form>
+			<div slot="footer">
+				<el-button @click="close">取消</el-button>
+				<el-button type="primary" @click="handelConfirm">确定</el-button>
+			</div>
+		</el-dialog>
+	</div>
+</template>
+<script>
+import { getMaterialList } from '@/api/wmsManagement/wmOutOrder.js'
+export default {
+	inheritAttrs: false,
+	components: {},
+	props: [],
+	data() {
+		return {
+			// 遮罩层
+			loading: false,
+			formData: {
+				partnumber: undefined,
+				u8InventoryCode: undefined,
+				description: undefined,
+				search: '',
+			},
+			queryParams: {
+				pageNum: 1,
+				pageSize: 10,
+			},
+			// 数据列表
+			dataList: [],
+			// 总记录数
+			total: 0,
+			rules: {},
+			// 多选框选中数据
+			selectList: [],
+		}
+	},
+	computed: {},
+	watch: {},
+	created() {},
+	mounted() {},
+	methods: {
+		onOpen() {
+			this.getList()
+		},
+		onClose() {
+			this.$refs['elForm'].resetFields()
+			this.dataList = []
+			this.queryParams = {
+				pageNum: 1,
+				pageSize: 10,
+			}
+			this.total = 0
+			this.ids = []
+		},
+		close() {
+			this.$emit('update:visible', false)
+		},
+		handelConfirm() {
+			this.$emit('materialChoused', this.selectList)
+			this.close()
+			// this.$refs['elForm'].validate((valid) => {
+			// 	if (!valid) return
+			// 	this.close()
+			// })
+		},
+		// 多选框选中数据
+		handleSelectionChange(selection) {
+			this.selectList = selection
+			// this.selectList = selection.map((item) => item.id)
+		},
+		getList() {
+			this.loading = true
+			const data = this.queryParams
+			getMaterialList(data).then((res) => {
+				if (res.code === 200) {
+					this.dataList = res.data
+					this.loading = false
+				}
+			})
+		},
+	},
+}
+</script>
+<style></style>