|
|
@@ -0,0 +1,213 @@
|
|
|
+<template>
|
|
|
+ <AidopDemoShell :title="pageTitle" subtitle="只读列表">
|
|
|
+ <!--
|
|
|
+ S5 标签查询 · 只读页(S5z-LABEL-QUERY-1)。
|
|
|
+ 数据源:aidopdev.MissedPrint(legacy 标签/条码记录表,只读);状态描述经 GeneralizedCodeMaster BarcodeStatus 解码。
|
|
|
+ 只读:无新增/编辑/保存/库位转移/库存事务/状态流转;无 mock。
|
|
|
+ -->
|
|
|
+ <el-form :inline="true" :model="query" class="mb12" @submit.prevent>
|
|
|
+ <el-form-item label="物料编码">
|
|
|
+ <el-input v-model="query.itemNum" clearable style="width: 160px" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="批次号">
|
|
|
+ <el-input v-model="query.lotSerial" clearable style="width: 160px" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="库位">
|
|
|
+ <el-select v-model="query.location" clearable placeholder="请选择" style="width: 140px">
|
|
|
+ <el-option v-for="o in locationOptions" :key="o.val" :label="o.val" :value="o.val!" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="货架">
|
|
|
+ <el-input v-model="query.shelf" clearable style="width: 160px" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="送货单号">
|
|
|
+ <el-input v-model="query.shipperNbr" clearable style="width: 160px" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="状态">
|
|
|
+ <el-select v-model="query.status" clearable placeholder="请选择" style="width: 140px">
|
|
|
+ <el-option v-for="o in statusOptions" :key="o.val" :label="o.label" :value="o.val!" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="条码">
|
|
|
+ <el-input v-model="query.barCode" clearable style="width: 220px" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" @click="doSearch">查询</el-button>
|
|
|
+ <el-button @click="resetQuery">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <el-table :data="rows" row-key="id" v-loading="loading" border stripe @sort-change="onSortChange">
|
|
|
+ <el-table-column type="index" label="#" width="55" align="center" />
|
|
|
+ <el-table-column prop="barCode" label="条码" min-width="200" sortable="custom" show-overflow-tooltip resizable />
|
|
|
+ <el-table-column prop="itemNum" label="物料编码" min-width="130" sortable="custom" show-overflow-tooltip resizable />
|
|
|
+ <el-table-column prop="descr" label="描述" min-width="140" show-overflow-tooltip resizable />
|
|
|
+ <el-table-column prop="product" label="规格型号" min-width="140" show-overflow-tooltip resizable />
|
|
|
+ <el-table-column prop="qty" label="数量" width="90" align="right" sortable="custom" resizable />
|
|
|
+ <el-table-column prop="status" label="状态" width="80" sortable="custom" resizable />
|
|
|
+ <el-table-column prop="statusDesc" label="状态描述" width="110" show-overflow-tooltip resizable />
|
|
|
+ <el-table-column prop="lotSerial" label="批次号" min-width="140" sortable="custom" show-overflow-tooltip resizable />
|
|
|
+ <el-table-column prop="location" label="库位" width="90" sortable="custom" resizable />
|
|
|
+ <el-table-column prop="shelf" label="货架" width="120" show-overflow-tooltip resizable />
|
|
|
+ <el-table-column prop="ordNbr" label="单据号" min-width="140" show-overflow-tooltip resizable />
|
|
|
+ <el-table-column prop="prodDate" label="生产日期" width="120" sortable="custom" resizable>
|
|
|
+ <template #default="{ row }">{{ fmtDate(row.prodDate) }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="workOrd" label="工单编号" min-width="130" show-overflow-tooltip resizable />
|
|
|
+ <el-table-column prop="prodLine" label="生产线" width="100" resizable />
|
|
|
+ <el-table-column prop="labelFormat" label="标签格式" width="110" resizable />
|
|
|
+ <el-table-column prop="carton" label="箱号" width="100" resizable />
|
|
|
+ <el-table-column prop="period" label="班次" width="80" align="right" resizable />
|
|
|
+ <el-table-column prop="supply" label="供应商" min-width="120" show-overflow-tooltip resizable />
|
|
|
+ <el-table-column prop="purOrd" label="采购单号" min-width="130" show-overflow-tooltip resizable />
|
|
|
+ <el-table-column prop="purLine" label="采购单项次" width="110" align="right" resizable />
|
|
|
+ <el-table-column prop="shipperNbr" label="送货单号" min-width="130" show-overflow-tooltip resizable />
|
|
|
+ <el-table-column prop="shipperLine" label="送货单项次" width="110" align="right" resizable />
|
|
|
+ <el-table-column prop="invDate" label="入库日期" width="120" sortable="custom" resizable>
|
|
|
+ <template #default="{ row }">{{ fmtDate(row.invDate) }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="expireDate" label="过期日期" width="120" sortable="custom" resizable>
|
|
|
+ <template #default="{ row }">{{ fmtDate(row.expireDate) }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="remark" label="备注" min-width="140" show-overflow-tooltip resizable />
|
|
|
+ <template #empty>
|
|
|
+ <el-empty description="暂无数据" />
|
|
|
+ </template>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <div class="pager">
|
|
|
+ <el-pagination
|
|
|
+ v-model:current-page="query.page"
|
|
|
+ v-model:page-size="query.pageSize"
|
|
|
+ :total="total"
|
|
|
+ :page-sizes="[10, 20, 50]"
|
|
|
+ layout="total, sizes, prev, pager, next"
|
|
|
+ @current-change="loadList"
|
|
|
+ @size-change="loadList"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </AidopDemoShell>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup lang="ts" name="aidopS5InventoryLabelQuery">
|
|
|
+import { computed, onActivated, onMounted, reactive, ref } from 'vue';
|
|
|
+import { useRoute } from 'vue-router';
|
|
|
+import { ElMessage } from 'element-plus';
|
|
|
+import AidopDemoShell from '/@/views/aidop/components/AidopDemoShell.vue';
|
|
|
+import {
|
|
|
+ fetchLabelQueryList,
|
|
|
+ fetchLabelQueryStatusOptions,
|
|
|
+ fetchLabelQueryLocationOptions,
|
|
|
+ type LabelQueryRow,
|
|
|
+ type LabelQueryStatusOption,
|
|
|
+ type LabelQueryLocationOption,
|
|
|
+} from '../api/labelQuery';
|
|
|
+
|
|
|
+const route = useRoute();
|
|
|
+const pageTitle = computed(() => (route.meta?.title as string) || '标签查询');
|
|
|
+
|
|
|
+const query = reactive({
|
|
|
+ itemNum: '',
|
|
|
+ lotSerial: '',
|
|
|
+ location: '',
|
|
|
+ shelf: '',
|
|
|
+ shipperNbr: '',
|
|
|
+ status: '',
|
|
|
+ barCode: '',
|
|
|
+ page: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ orderBy: '',
|
|
|
+ orderDir: '',
|
|
|
+});
|
|
|
+
|
|
|
+const loading = ref(false);
|
|
|
+const rows = ref<LabelQueryRow[]>([]);
|
|
|
+const total = ref(0);
|
|
|
+const statusOptions = ref<LabelQueryStatusOption[]>([]);
|
|
|
+const locationOptions = ref<LabelQueryLocationOption[]>([]);
|
|
|
+
|
|
|
+function fmtDate(v?: string | null) {
|
|
|
+ if (!v) return '';
|
|
|
+ return String(v).slice(0, 10);
|
|
|
+}
|
|
|
+
|
|
|
+function onSortChange({ prop, order }: { prop: string; order: string | null }) {
|
|
|
+ query.orderBy = prop || '';
|
|
|
+ query.orderDir = order === 'ascending' ? 'asc' : order === 'descending' ? 'desc' : '';
|
|
|
+ loadList();
|
|
|
+}
|
|
|
+
|
|
|
+async function loadList() {
|
|
|
+ loading.value = true;
|
|
|
+ try {
|
|
|
+ const data = await fetchLabelQueryList({
|
|
|
+ itemNum: query.itemNum,
|
|
|
+ lotSerial: query.lotSerial,
|
|
|
+ location: query.location,
|
|
|
+ shelf: query.shelf,
|
|
|
+ shipperNbr: query.shipperNbr,
|
|
|
+ status: query.status,
|
|
|
+ barCode: query.barCode,
|
|
|
+ page: query.page,
|
|
|
+ pageSize: query.pageSize,
|
|
|
+ orderBy: query.orderBy,
|
|
|
+ orderDir: query.orderDir,
|
|
|
+ });
|
|
|
+ rows.value = data.list || [];
|
|
|
+ total.value = data.total || 0;
|
|
|
+ } catch (e: any) {
|
|
|
+ rows.value = [];
|
|
|
+ total.value = 0;
|
|
|
+ ElMessage.error(e?.message || '加载标签查询列表失败');
|
|
|
+ } finally {
|
|
|
+ loading.value = false;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+async function loadOptions() {
|
|
|
+ try {
|
|
|
+ const [st, loc] = await Promise.all([fetchLabelQueryStatusOptions(), fetchLabelQueryLocationOptions()]);
|
|
|
+ statusOptions.value = st || [];
|
|
|
+ locationOptions.value = loc || [];
|
|
|
+ } catch {
|
|
|
+ statusOptions.value = [];
|
|
|
+ locationOptions.value = [];
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function doSearch() {
|
|
|
+ query.page = 1;
|
|
|
+ loadList();
|
|
|
+}
|
|
|
+
|
|
|
+function resetQuery() {
|
|
|
+ query.itemNum = '';
|
|
|
+ query.lotSerial = '';
|
|
|
+ query.location = '';
|
|
|
+ query.shelf = '';
|
|
|
+ query.shipperNbr = '';
|
|
|
+ query.status = '';
|
|
|
+ query.barCode = '';
|
|
|
+ query.page = 1;
|
|
|
+ query.orderBy = '';
|
|
|
+ query.orderDir = '';
|
|
|
+ loadList();
|
|
|
+}
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ loadOptions();
|
|
|
+ loadList();
|
|
|
+});
|
|
|
+onActivated(() => loadList());
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+.mb12 {
|
|
|
+ margin-bottom: 12px;
|
|
|
+}
|
|
|
+.pager {
|
|
|
+ margin-top: 12px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+}
|
|
|
+</style>
|