用料清单

src/router/plan.js

@@ -47,6 +47,12 @@ const plant = {
 					path: "/plan/inventory/transitInventory",
 					title: "在途库存",
 					component: () => import("@/views/plan/inventory/transitInventory"),
+				},
+				{
+					icon: "el-icon-document",
+					path: "/plan/inventory/materialsList",
+					title: "用料清单",
+					component: () => import("@/views/plan/inventory/materialsList"),
 				}
 			]
 		},

src/views/plan/inventory/materialsList/index.vue

@@ -0,0 +1,106 @@
+<template>
+  <div ref="tableRef" class="table-height-wrap">
+    <SearchTemplate>
+			<el-form :inline="true" class="clearfix search-content">
+        <el-form-item :label="getColumnName('ArticleStock-ArtId')">
+					<el-input
+						v-model.trim="queryParams.ArtId"
+						placeholder="请输入查询内容"
+						clearable
+						style="width: 240px"
+					/>
+				</el-form-item>
+				<el-form-item>
+					<el-button icon="el-icon-search" size="mini" class="search-button-style" @click="handleQuery">搜索</el-button>
+					<el-button icon="el-icon-refresh" size="mini" class="reset-button-style" @click="resetQuery">重置</el-button>
+				</el-form-item>
+      </el-form>
+		</SearchTemplate>
+    <ContentContainer>
+			<el-table v-if="tableHeight" :height="tableHeight" :data="tableData" v-loading="loading" size="mini" style="width: 100%" border>
+				<el-table-column v-for="(item, index) in headers" :key="index" :label="getColumnName(item)" :show-overflow-tooltip="true">
+					<template #default="scope">
+						<span v-if="item === 'ArticleStock-PlantNr'">{{ getWorkshopName(scope.row['ArticleStock-PlantNr']) }}</span>
+						<span v-else>{{ scope.row[item] }}</span>
+					</template>
+				</el-table-column>
+			</el-table>
+			<!-- 分页 -->
+			<Pagination v-show="pagination.total>0" v-model:pagination="pagination" @change="getList" />
+		</ContentContainer>
+  </div>
+</template>
+<script>
+import { get } from "@/server/api.js";
+import { ListMixin } from "@/mixins/ListMixin";
+export default {
+	mixins: [ListMixin],
+	data() {
+		return {
+			queryTableDataUrl: "/admin/base/articlestock/zaiku",
+			// 默认字段
+			headers: [
+        "ArticleStock-PlantNr",
+        "ArticleStock-ArtId",
+        "ArticleStock-Descr",
+        "ArticleStock-AvailableStock",
+				],
+			tableHeight:0,
+			queryParams: {
+				'WarehouseId': 'qingdan'
+			}
+		};
+	},
+	created() {
+	
+	},
+	methods: {
+		// 查询分页列表
+    getList() {
+      this.loading = true;
+      for (let key in this.queryParams) {
+        if(this.queryParams[key] == ''){
+          this.queryParams[key]=undefined
+        }
+      }
+      get(this.queryTableDataUrl, { ...this.pagination, ...this.queryParams, 'WarehouseId': 'qingdan' })
+        .then(({ code, data: { count = 0, records = [] } }) => {
+          if (code === 200) {
+            this.tableData = records
+            this.pagination.total = count
+            this.loading = false
+          } else {
+            this.loading = false
+          }
+        })
+        .catch(() => {
+          this.loading = false
+        });
+    },
+		// 搜索按钮操作
+		handleQuery() {
+			this.pagination.pageNumber = 1
+			this.getList()
+		},
+		// 重置按钮操作
+		resetQuery() {
+			this.queryParams.ArtId = undefined
+			this.handleQuery()
+		},
+	},
+  mounted(){
+    this.$nextTick(()=>{
+      this.tableHeight = this.calculationTableHeight(
+        this.$refs.tableRef,
+        120
+      );
+    })
+  }
+};
+</script>
+<style lang="less" scoped>
+  .table-height-wrap{
+    height: 100%;
+    overflow: hidden;
+  }
+</style>