From fc62e83f73b4b8ff4714f995da4eafbb7f525d1a Mon Sep 17 00:00:00 2001
From: gongchunyi <deslre0381@gmail.com>
Date: 星期二, 18 八月 2026 23:30:10 +0800
Subject: [PATCH] feat(table): 统一表格日期字段展示格式为YYYY-MM-DD
---
src/views/qualityManagement/nearExpiryReturn/index.vue | 445 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 445 insertions(+), 0 deletions(-)
diff --git a/src/views/qualityManagement/nearExpiryReturn/index.vue b/src/views/qualityManagement/nearExpiryReturn/index.vue
new file mode 100644
index 0000000..26dc747
--- /dev/null
+++ b/src/views/qualityManagement/nearExpiryReturn/index.vue
@@ -0,0 +1,445 @@
+<template>
+ <div class="app-container">
+ <el-form :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ v-show="showSearch"
+ label-width="68px">
+ <el-form-item label="浜у搧鍚嶇О"
+ prop="productName">
+ <el-input v-model="queryParams.productName"
+ placeholder="璇疯緭鍏ヤ骇鍝佸悕绉�"
+ clearable
+ @keyup.enter.native="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鎵规鍙�"
+ prop="batchNumber">
+ <el-input v-model="queryParams.batchNumber"
+ placeholder="璇疯緭鍏ユ壒娆″彿"
+ clearable
+ @keyup.enter.native="handleQuery" />
+ </el-form-item>
+ <el-form-item label="閫�鍥炴棩鏈�"
+ prop="returnDate">
+ <el-date-picker clearable
+ v-model="queryParams.returnDate"
+ type="date"
+ value-format="YYYY-MM-DD"
+ placeholder="璇烽�夋嫨閫�鍥炴棩鏈�">
+ </el-date-picker>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary"
+ icon="Search"
+ @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh"
+ @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ <el-row :gutter="10"
+ class="mb8">
+ <el-col :span="1.5">
+ <el-button type="primary"
+ plain
+ icon="Plus"
+ @click="handleAdd">鏂板</el-button>
+ </el-col>
+ <el-col :span="1.5">
+ <el-button type="success"
+ plain
+ icon="Edit"
+ :disabled="single"
+ @click="handleUpdate">淇敼</el-button>
+ </el-col>
+ <el-col :span="1.5">
+ <el-button type="danger"
+ plain
+ icon="Delete"
+ :disabled="multiple"
+ @click="handleDelete">鍒犻櫎</el-button>
+ </el-col>
+ <el-col :span="1.5">
+ <el-button type="warning"
+ plain
+ icon="Download"
+ @click="handleExport">瀵煎嚭</el-button>
+ </el-col>
+ <right-toolbar v-model:showSearch="showSearch"
+ @queryTable="getList"></right-toolbar>
+ </el-row>
+ <el-table v-loading="loading"
+ :data="nearExpiryReturnList"
+ @selection-change="handleSelectionChange">
+ <el-table-column type="selection"
+ width="55"
+ align="center" />
+ <el-table-column label="搴忓彿"
+ type="index"
+ width="50"
+ align="center" />
+ <el-table-column label="浜у搧鍚嶇О"
+ prop="productName" />
+ <el-table-column label="瑙勬牸鍨嬪彿"
+ prop="productSpec" />
+ <el-table-column label="鎵规鍙�"
+ prop="batchNumber" />
+ <el-table-column label="鐢熶骇鏃ユ湡"
+ prop="productionDate"
+ align="center">
+ <template #default="scope">
+ <span>{{ parseTime(scope.row.productionDate, '{y}-{m}-{d}') }}</span>
+ </template>
+ </el-table-column>
+ <el-table-column label="鍒版湡鏃ユ湡"
+ prop="expiryDate"
+ align="center">
+ <template #default="scope">
+ <span>{{ parseTime(scope.row.expiryDate, '{y}-{m}-{d}') }}</span>
+ </template>
+ </el-table-column>
+ <el-table-column label="閫�鍥炴暟閲�"
+ prop="returnQuantity" />
+ <el-table-column label="閫�鍥炲師鍥�"
+ prop="returnReason" />
+ <el-table-column label="閫�鍥炴棩鏈�"
+ prop="returnDate"
+ align="center">
+ <template #default="scope">
+ <span>{{ parseTime(scope.row.returnDate, '{y}-{m}-{d}') }}</span>
+ </template>
+ </el-table-column>
+ <el-table-column label="澶勭悊鐘舵��"
+ prop="status"
+ align="center">
+ <template #default="scope">
+ <dict-tag :options="statusOptions"
+ :value="scope.row.status" />
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔"
+ align="center"
+ class-name="small-padding fixed-width">
+ <template #default="scope">
+ <el-button size="mini"
+ type="text"
+ icon="Edit"
+ @click="handleUpdate(scope.row)">淇敼</el-button>
+ <el-button size="mini"
+ type="text"
+ icon="Delete"
+ @click="handleDelete(scope.row)">鍒犻櫎</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ <pagination v-show="total>0"
+ :total="total"
+ v-model:page="queryParams.pageNum"
+ v-model:limit="queryParams.pageSize"
+ @pagination="getList" />
+ <!-- 娣诲姞鎴栦慨鏀逛复鏈熼��鍥炲彴璐﹀璇濇 -->
+ <el-dialog :title="title"
+ v-model="open"
+ width="800px"
+ append-to-body>
+ <el-form ref="formRef"
+ :model="form"
+ :rules="rules"
+ label-width="100px">
+ <el-row>
+ <el-col :span="12">
+ <el-form-item label="浜у搧鍚嶇О"
+ prop="productName">
+ <el-input v-model="form.productName"
+ placeholder="璇疯緭鍏ヤ骇鍝佸悕绉�" />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="瑙勬牸鍨嬪彿"
+ prop="productSpec">
+ <el-input v-model="form.productSpec"
+ placeholder="璇疯緭鍏ヨ鏍煎瀷鍙�" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="12">
+ <el-form-item label="鎵规鍙�"
+ prop="batchNumber">
+ <el-input v-model="form.batchNumber"
+ placeholder="璇疯緭鍏ユ壒娆″彿" />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="閫�鍥炴暟閲�"
+ prop="returnQuantity">
+ <el-input-number v-model="form.returnQuantity"
+ controls-position="right"
+ :min="1" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="12">
+ <el-form-item label="鐢熶骇鏃ユ湡"
+ prop="productionDate">
+ <el-date-picker clearable
+ v-model="form.productionDate"
+ type="date"
+ value-format="YYYY-MM-DD"
+ placeholder="璇烽�夋嫨鐢熶骇鏃ユ湡">
+ </el-date-picker>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鍒版湡鏃ユ湡"
+ prop="expiryDate">
+ <el-date-picker clearable
+ v-model="form.expiryDate"
+ type="date"
+ value-format="YYYY-MM-DD"
+ placeholder="璇烽�夋嫨鍒版湡鏃ユ湡">
+ </el-date-picker>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="12">
+ <el-form-item label="閫�鍥炴棩鏈�"
+ prop="returnDate">
+ <el-date-picker clearable
+ v-model="form.returnDate"
+ type="date"
+ value-format="YYYY-MM-DD"
+ placeholder="璇烽�夋嫨閫�鍥炴棩鏈�">
+ </el-date-picker>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="澶勭悊鐘舵��"
+ prop="status">
+ <el-select v-model="form.status"
+ placeholder="璇烽�夋嫨澶勭悊鐘舵��">
+ <el-option v-for="dict in statusOptions"
+ :key="dict.value"
+ :label="dict.label"
+ :value="dict.value"></el-option>
+ </el-select>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="24">
+ <el-form-item label="閫�鍥炲師鍥�"
+ prop="returnReason">
+ <el-input v-model="form.returnReason"
+ type="textarea"
+ placeholder="璇疯緭鍏ラ��鍥炲師鍥�" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="24">
+ <el-form-item label="澶囨敞"
+ prop="remark">
+ <el-input v-model="form.remark"
+ type="textarea"
+ placeholder="璇疯緭鍏ュ娉�" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ <template #footer>
+ <div class="dialog-footer">
+ <el-button type="primary"
+ @click="submitForm">纭� 瀹�</el-button>
+ <el-button @click="cancel">鍙� 娑�</el-button>
+ </div>
+ </template>
+ </el-dialog>
+ </div>
+</template>
+
+<script setup name="NearExpiryReturn">
+ import { ref, reactive, onMounted } from "vue";
+ import { ElMessageBox } from "element-plus";
+ // API鎺ュ彛宸茬Щ闄わ紝涓嶅啀璋冪敤鍚庣鎺ュ彛
+
+ const { proxy } = getCurrentInstance();
+ const { parseTime } = proxy;
+
+ const nearExpiryReturnList = ref([]);
+ const open = ref(false);
+ const loading = ref(true);
+ const showSearch = ref(true);
+ const ids = ref([]);
+ const single = ref(true);
+ const multiple = ref(true);
+ const total = ref(0);
+ const title = ref("");
+
+ // 鐘舵�佸瓧鍏�
+ const statusOptions = ref([
+ { label: "寰呭鐞�", value: "0" },
+ { label: "澶勭悊涓�", value: "1" },
+ { label: "宸插畬鎴�", value: "2" },
+ ]);
+
+ const data = reactive({
+ form: {},
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ productName: null,
+ batchNumber: null,
+ returnDate: null,
+ },
+ rules: {
+ productName: [
+ { required: true, message: "浜у搧鍚嶇О涓嶈兘涓虹┖", trigger: "blur" },
+ ],
+ productSpec: [
+ { required: true, message: "瑙勬牸鍨嬪彿涓嶈兘涓虹┖", trigger: "blur" },
+ ],
+ batchNumber: [
+ { required: true, message: "鎵规鍙蜂笉鑳戒负绌�", trigger: "blur" },
+ ],
+ returnQuantity: [
+ { required: true, message: "閫�鍥炴暟閲忎笉鑳戒负绌�", trigger: "blur" },
+ ],
+ productionDate: [
+ { required: true, message: "鐢熶骇鏃ユ湡涓嶈兘涓虹┖", trigger: "blur" },
+ ],
+ expiryDate: [
+ { required: true, message: "鍒版湡鏃ユ湡涓嶈兘涓虹┖", trigger: "blur" },
+ ],
+ returnDate: [
+ { required: true, message: "閫�鍥炴棩鏈熶笉鑳戒负绌�", trigger: "blur" },
+ ],
+ returnReason: [
+ { required: true, message: "閫�鍥炲師鍥犱笉鑳戒负绌�", trigger: "blur" },
+ ],
+ status: [
+ { required: true, message: "澶勭悊鐘舵�佷笉鑳戒负绌�", trigger: "change" },
+ ],
+ },
+ });
+
+ const { queryParams, form, rules } = toRefs(data);
+
+ /** 鏌ヨ涓存湡閫�鍥炲彴璐﹀垪琛� */
+ function getList() {
+ loading.value = true;
+ // 涓嶈皟鐢ㄦ帴鍙ｏ紝杩斿洖绌烘暟鎹�
+ nearExpiryReturnList.value = [];
+ total.value = 0;
+ loading.value = false;
+ }
+
+ // 鍙栨秷鎸夐挳
+ function cancel() {
+ open.value = false;
+ reset();
+ }
+
+ // 琛ㄥ崟閲嶇疆
+ function reset() {
+ form.value = {
+ id: null,
+ productName: null,
+ productSpec: null,
+ batchNumber: null,
+ productionDate: null,
+ expiryDate: null,
+ returnQuantity: null,
+ returnReason: null,
+ returnDate: null,
+ status: null,
+ remark: null,
+ };
+ proxy.resetForm("formRef");
+ }
+
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ function handleQuery() {
+ queryParams.value.pageNum = 1;
+ getList();
+ }
+
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ function resetQuery() {
+ proxy.resetForm("queryForm");
+ handleQuery();
+ }
+
+ // 澶氶�夋閫変腑鏁版嵁
+ function handleSelectionChange(selection) {
+ ids.value = selection.map(item => item.id);
+ single.value = selection.length !== 1;
+ multiple.value = !selection.length;
+ }
+
+ /** 鏂板鎸夐挳鎿嶄綔 */
+ function handleAdd() {
+ reset();
+ open.value = true;
+ title.value = "娣诲姞涓存湡閫�鍥炲彴璐�";
+ }
+
+ /** 淇敼鎸夐挳鎿嶄綔 */
+ function handleUpdate(row) {
+ reset();
+ // 涓嶈皟鐢ㄦ帴鍙ｏ紝鐩存帴浣跨敤浼犲叆鐨勬暟鎹�
+ if (row) {
+ form.value = { ...row };
+ open.value = true;
+ title.value = "淇敼涓存湡閫�鍥炲彴璐�";
+ }
+ }
+
+ /** 鎻愪氦鎸夐挳 */
+ function submitForm() {
+ proxy.$refs["formRef"].validate(valid => {
+ if (valid) {
+ // 涓嶈皟鐢ㄦ帴鍙ｏ紝鍙樉绀烘垚鍔熸彁绀�
+ if (form.value.id != null) {
+ proxy.$modal.msgSuccess("淇敼鎴愬姛");
+ } else {
+ proxy.$modal.msgSuccess("鏂板鎴愬姛");
+ }
+ open.value = false;
+ getList();
+ }
+ });
+ }
+
+ /** 鍒犻櫎鎸夐挳鎿嶄綔 */
+ function handleDelete(row) {
+ const deleteIds = row.id || ids.value;
+ ElMessageBox.confirm(
+ '鏄惁纭鍒犻櫎涓存湡閫�鍥炲彴璐︾紪鍙蜂负"' + deleteIds + '"鐨勬暟鎹」锛�',
+ "璀﹀憡",
+ {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }
+ )
+ .then(function () {
+ // 涓嶈皟鐢ㄦ帴鍙ｏ紝鍙樉绀烘垚鍔熸彁绀�
+ proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ getList();
+ })
+ .catch(() => {});
+ }
+
+ /** 瀵煎嚭鎸夐挳鎿嶄綔 */
+ function handleExport() {
+ // 涓嶈皟鐢ㄦ帴鍙ｏ紝鍙樉绀烘彁绀�
+ proxy.$modal.msgSuccess("瀵煎嚭鍔熻兘鏆傛湭瀹炵幇");
+ }
+
+ onMounted(() => {
+ getList();
+ });
+</script>
+
--
Gitblit v1.9.3