<script setup lang="ts">
|
import { onMounted, ref } from 'vue';
|
import { getSeedQualityPage, type SeedQualityRecord } from '#/api/mes/qc/seedQuality';
|
import { errorText } from '#/mobile/api';
|
import Scanner from './scanner.vue';
|
|
const rows = ref<SeedQualityRecord[]>([]), busy = ref(false), error = ref('');
|
const code = ref(''), batchCode = ref(''), result = ref(''), page = ref(0), total = ref(0);
|
let filters: { code?: string; batchCode?: string; result?: number } = {};
|
async function load(reset = true) {
|
if (busy.value) return;
|
busy.value = true; error.value = '';
|
const next = reset ? 1 : page.value + 1;
|
const query = reset ? { code: code.value.trim() || undefined, batchCode: batchCode.value.trim() || undefined, result: result.value ? Number(result.value) : undefined } : filters;
|
try {
|
const data = await getSeedQualityPage({ ...query, pageNo: next, pageSize: 20 });
|
rows.value = reset ? data.list : [...rows.value, ...data.list];
|
page.value = next; total.value = data.total; filters = query;
|
} catch (e) { error.value = errorText(e); } finally { busy.value = false; }
|
}
|
onMounted(() => load());
|
</script>
|
<template>
|
<p class="m-muted">查看质检结果、批次与不合格原因。</p>
|
<Scanner :disabled="busy" @code="value => { code = value; load(); }" />
|
<form class="m-panel" @submit.prevent="load()">
|
<label class="m-field"><span>业务码 / 追溯码</span><input v-model="code" :disabled="busy" placeholder="输入袋码" /></label>
|
<label class="m-field"><span>生产批次</span><input v-model="batchCode" :disabled="busy" placeholder="输入批次号" /></label>
|
<label class="m-field"><span>质检结果</span><select v-model="result" :disabled="busy"><option value="">全部结果</option><option value="1">合格</option><option value="2">不合格</option></select></label>
|
<button class="m-secondary" :disabled="busy">{{busy ? '正在查询…' : '查询记录'}}</button>
|
</form>
|
<p v-if="error" class="m-error" role="alert">{{error}}</p>
|
<p class="m-muted" role="status">共 {{total}} 条记录</p>
|
<p v-if="!rows.length && !busy && !error" class="m-empty">暂无匹配的质检记录</p>
|
<article v-for="row in rows" :key="row.id" class="m-panel">
|
<strong :class="['m-status', row.result === 1 ? 'success' : row.result === 2 ? 'failed' : '']">{{row.result === 1 ? '合格' : row.result === 2 ? '不合格' : '处理中'}}</strong>
|
<dl><div class="m-row"><dt>追溯码</dt><dd>{{row.code}}</dd></div><div class="m-row"><dt>生产批次</dt><dd>{{row.batchCode || '—'}}</dd></div><div class="m-row"><dt>检验时间</dt><dd>{{row.inspectedAt || row.createTime || '—'}}</dd></div><div v-if="row.reason" class="m-row"><dt>原因 / 备注</dt><dd>{{row.reason}}</dd></div></dl>
|
</article>
|
<button v-if="rows.length < total" class="m-secondary" :disabled="busy" @click="load(false)">{{busy ? '正在加载…' : '加载更多'}}</button>
|
</template>
|
