添加语言提示，暂存列表倒序

src/views/storehouse/ValidationTool/validation.vue

@@ -1,13 +1,22 @@
 <script setup lang="ts">
-import { validation_add, validation_del, validation_List, readvaildation, updatevaildation,exportFile, validation_update, Storehouse_ProductClass_List, uploadFile } from '@/api/storehouse'
+import {
+  exportFile,
+  readvaildation,
+  Storehouse_ProductClass_List,
+  updatevaildation,
+  uploadFile,
+  validation_add,
+  validation_del,
+  validation_List,
+  validation_update
+} from '@/api/storehouse'
 import TableBase from '@/components/TableBase/index.vue'
-import { computed, reactive, ref, onMounted } from 'vue'
+import { computed, onMounted, reactive, ref } from 'vue'
 import { GlobalStore } from '@/stores'
 import type { ColumnProps } from '@/components/TableBase/interface'
 import { Delete, Edit } from '@element-plus/icons-vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import type { FormInstance, UploadInstance} from 'element-plus'
-import { ElLoading } from 'element-plus'
+import type { FormInstance, UploadInstance } from 'element-plus'
+import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
 
 const uploadRef = ref<UploadInstance>()
 const uploadFiles = ref<File[]>([]) // 新增：用于存储上传的文件
@@ -24,7 +33,7 @@ const initParam = reactive({
   T_iccid: '',
   LendUser: '',
   T_project: '',
-  T_class: '',
+  T_class: ''
 })
 const columns: ColumnProps[] = [
   { type: 'index', label: '序号', width: 80 },
@@ -66,12 +75,11 @@ const deleteFun = (row: any) => {
       }
     })
     // eslint-disable-next-line @typescript-eslint/no-empty-function
-    .catch(() => { })
+    .catch(() => {})
 }
 //导出文件execl
 const exportExecl = async () => {
-  try{
-
+  try {
     const response: any = await exportFile({
       User_tokey: globalStore.GET_User_tokey,
       Validationnumber: initParam.Validationnumber,
@@ -82,22 +90,22 @@ const exportExecl = async () => {
       LendUser: initParam.LendUser,
       T_project: initParam.T_project,
       T_class: initParam.T_class
-    });
+    })
     // 处理返回的二进制文件并触发下载
-    const blob = new Blob([response], { type: 'application/vnd.ms-excel;charset=utf8' });
-    const url = window.URL.createObjectURL(blob);
-    const a = document.createElement('a');
-    a.href = url;
-    a.download = 'filename.xlsx'; // 设置下载的文件名
-    document.body.appendChild(a);
-    a.click();
-    a.remove();
-    window.URL.revokeObjectURL(url);
-    ElMessage.success('导出成功');
-  }catch(error){
-    ElMessage.error('导出失败，请检查网络连接');
+    const blob = new Blob([response], { type: 'application/vnd.ms-excel;charset=utf8' })
+    const url = window.URL.createObjectURL(blob)
+    const a = document.createElement('a')
+    a.href = url
+    a.download = 'filename.xlsx' // 设置下载的文件名
+    document.body.appendChild(a)
+    a.click()
+    a.remove()
+    window.URL.revokeObjectURL(url)
+    ElMessage.success('导出成功')
+  } catch (error) {
+    ElMessage.error('导出失败，请检查网络连接')
   }
-};
+}
 
 const showInStorageForm = ref(false)
 const showrRepaidForm = ref(false)
@@ -107,18 +115,22 @@ const inStorageForm = reactive({
   T_sn: '',
   Validationnumber: '',
   T_remark: '',
-  T_class:'',
+  T_class: ''
 })
+
 interface InStorageItem {
-  T_sn: string;
-  Validationnumber: string;
-  T_remark: string;
+  T_sn: string
+  Validationnumber: string
+  T_remark: string
 }
+
 // 获取产品分类
-const Pruductoptions = ref<any[]>([{
-  Id:'',
-  T_name:''
-}])
+const Pruductoptions = ref<any[]>([
+  {
+    Id: '',
+    T_name: ''
+  }
+])
 const getProductClassList = async () => {
   const res: any = await Storehouse_ProductClass_List({ page: 1, page_z: 999 })
   Pruductoptions.value = res.Data.Data
@@ -139,7 +151,7 @@ const rules = reactive({
   T_class: [{ required: true, message: '请选择产品分类', trigger: 'blur' }]
 })
 const rulesrepaid = reactive({
-  T_sn: [{ required: true, message: '请输入SN', trigger: 'blur' }],
+  T_sn: [{ required: true, message: '请输入SN', trigger: 'blur' }]
 })
 
 const extractSN = (fullSN: string): string => {
@@ -157,11 +169,17 @@ const submitInStorageForm = () => {
         ElMessage.warning('已存在相同的SN，不能添加')
         return
       }
-      pendingItems.value.push({ ...inStorageForm, T_sn: extractedSN })
+      pendingItems.value.unshift({ ...inStorageForm, T_sn: extractedSN })
       inStorageForm.T_sn = ''
       inStorageForm.Validationnumber = ''
       inStorageForm.T_remark = ''
       ElMessage.success('已添加到待提交列表')
+      if ('speechSynthesis' in window) {
+        const utterance = new SpeechSynthesisUtterance('添加成功')
+        window.speechSynthesis.speak(utterance)
+      } else {
+        console.warn('Web Speech API 不被支持')
+      }
     }
   })
 }
@@ -174,17 +192,24 @@ const submitRepaidForm = () => {
         ElMessage.warning('已存在相同的SN，不能添加')
         return
       }
-      const result: any = await readvaildation({ sn: extractedSN });
+      const result: any = await readvaildation({ sn: extractedSN })
       if (result.Code !== 200) {
         ElMessage.warning('当前SN未入库不能归还')
         return
       }
 
-      pendingItems.value.push({ ...inStorageForm, T_sn: extractedSN })
-      inStorageForm.T_sn = ''
+		pendingItems.value.unshift({ ...inStorageForm, T_sn: extractedSN })
+
+		inStorageForm.T_sn = ''
       inStorageForm.Validationnumber = ''
       inStorageForm.T_remark = ''
       ElMessage.success('已添加到待提交列表')
+      if ('speechSynthesis' in window) {
+        const utterance = new SpeechSynthesisUtterance('添加成功')
+        window.speechSynthesis.speak(utterance)
+      } else {
+        console.warn('Web Speech API 不被支持')
+      }
     }
   })
 }
@@ -196,27 +221,27 @@ const removePendingItem = (index: number) => {
 
 const submitInStoragePendingItems = async () => {
   if (pendingItems.value.length === 0) {
-    ElMessage.warning('暂无数据可提交');
-    return;
+    ElMessage.warning('暂无数据可提交')
+    return
   }
 
-  const rest = JSON.parse(JSON.stringify(pendingItems.value));
+  const rest = JSON.parse(JSON.stringify(pendingItems.value))
   try {
-    const result: any = await validation_add(rest);
+    const result: any = await validation_add(rest)
     if (result.Code === 200) {
-      ElMessage.success('提交成功');
-      pendingItems.value = [];
-      inStorageForm.T_sn = '';
-      inStorageForm.Validationnumber = '';
-      inStorageForm.T_remark = '';
-      searchHandle();
+      ElMessage.success('提交成功')
+      pendingItems.value = []
+      inStorageForm.T_sn = ''
+      inStorageForm.Validationnumber = ''
+      inStorageForm.T_remark = ''
+      searchHandle()
     } else {
-      ElMessage.error('提交失败');
+      ElMessage.error('提交失败')
     }
   } catch (error) {
-    ElMessage.error('提交失败，请检查网络连接');
+    ElMessage.error('提交失败，请检查网络连接')
   }
-};
+}
 const handlePageChange = (page: number) => {
   currentPage.value = page
 }
@@ -230,12 +255,13 @@ const lendForm = reactive({
   LendUser: '',
   T_project: ''
 })
+
 interface LendItem {
-  T_sn: string;
-  Validationnumber: string;
-  T_remark: string;
-  LendUser: string;
-  T_project: string;
+  T_sn: string
+  Validationnumber: string
+  T_remark: string
+  LendUser: string
+  T_project: string
 }
 
 const pendingLendItems = ref<LendItem[]>([])
@@ -249,7 +275,7 @@ const paginatedPendingLendItems = computed(() => {
 })
 
 const lendRules = reactive({
-  T_sn: [{ required: true, message: '请输入SN', trigger: 'blur' }],
+  T_sn: [{ required: true, message: '请输入SN', trigger: 'blur' }]
 })
 
 const submitLendForm = () => {
@@ -260,12 +286,13 @@ const submitLendForm = () => {
         ElMessage.warning('已存在相同的SN，不能添加')
         return
       }
-      const result: any = await readvaildation({ sn: extractedSN });
+      const result: any = await readvaildation({ sn: extractedSN })
       if (result.Code !== 200) {
         ElMessage.warning('当前SN未入库不能借出')
         return
       }
-      pendingLendItems.value.push({
+
+      pendingLendItems.value.unshift({
         T_sn: extractedSN,
         Validationnumber: lendForm.Validationnumber,
         T_remark: lendForm.T_remark,
@@ -275,6 +302,12 @@ const submitLendForm = () => {
       lendForm.T_sn = ''
       lendForm.T_remark = ''
       ElMessage.success('已添加到待提交列表')
+      if ('speechSynthesis' in window) {
+        const utterance = new SpeechSynthesisUtterance('添加成功')
+        window.speechSynthesis.speak(utterance)
+      } else {
+        console.warn('Web Speech API 不被支持')
+      }
     } else {
     }
   })
@@ -290,7 +323,7 @@ const submitLendPendingItems = async () => {
     ElMessage.warning('暂无数据可提交')
     return
   }
-  const rest = JSON.parse(JSON.stringify(pendingLendItems.value));
+  const rest = JSON.parse(JSON.stringify(pendingLendItems.value))
 
   const result: any = await validation_update(rest)
   if (result.Code == 200) {
@@ -317,7 +350,7 @@ const editForm = reactive({
   Validationnumber: '',
   T_remark: '',
   T_state: '',
-  T_class: '',
+  T_class: ''
 })
 
 const Repaid = () => {
@@ -356,18 +389,21 @@ const handleFileChange = (file: any, fileList: any) => {
 }
 
 const submitUpload = async () => {
-  if (uploadFiles.value.length === 0) { // 修改：使用 uploadFiles.value
+  if (uploadFiles.value.length === 0) {
+    // 修改：使用 uploadFiles.value
     ElMessage.warning('请先选择文件')
     return
   }
   const formData = new FormData()
-  uploadFiles.value.forEach((file: File) => { // 修改：遍历 uploadFiles.value
+  uploadFiles.value.forEach((file: File) => {
+    // 修改：遍历 uploadFiles.value
     formData.append('excelFile', file)
   })
-  const loading = ElLoading.service({ // 新增：显示加载动画
+  const loading = ElLoading.service({
+    // 新增：显示加载动画
     lock: true,
     text: '正在上传文件...',
-    background: 'rgba(0, 0, 0, 0.7)',
+    background: 'rgba(0, 0, 0, 0.7)'
   })
   try {
     const result: any = await uploadFile(formData)
@@ -389,19 +425,29 @@ const submitUpload = async () => {
 onMounted(() => {
   getProductClassList()
 })
-
 </script>
 <template>
   <div class="list">
-    <TableBase ref="TableRef" :columns="columns" :requestApi="validation_List" :initParam="initParam"
-      :pagination="true">
+    <TableBase
+      ref="TableRef"
+      :columns="columns"
+      :requestApi="validation_List"
+      :initParam="initParam"
+      :pagination="true"
+    >
       <template #table-header>
         <div class="input-suffix">
           <el-row :gutter="20" style="margin-bottom: 0">
             <el-col :xl="3" :lg="3" :md="3">
               <span class="inline-flex items-center">设备编号：</span>
-              <el-input v-model="initParam.Validationnumber" class="w-50 m-2" type="text" placeholder="设备编号搜索" clearable
-                @change="searchHandle" />
+              <el-input
+                v-model="initParam.Validationnumber"
+                class="w-50 m-2"
+                type="text"
+                placeholder="设备编号搜索"
+                clearable
+                @change="searchHandle"
+              />
             </el-col>
             <el-col :xl="3" :lg="3" :md="3">
               <span class="inline-flex items-center">状态：</span>
@@ -411,8 +457,14 @@ onMounted(() => {
             </el-col>
             <el-col :xl="3" :lg="3" :md="3">
               <span class="inline-flex items-center">SN：</span>
-              <el-input class="w-50 m-2" v-model="initParam.T_sn" type="text" placeholder="按SN搜索" clearable
-                @change="searchHandle" />
+              <el-input
+                class="w-50 m-2"
+                v-model="initParam.T_sn"
+                type="text"
+                placeholder="按SN搜索"
+                clearable
+                @change="searchHandle"
+              />
             </el-col>
             <el-col :xl="3" :lg="3" :md="3">
               <span class="inline-flex items-center">产品分类：</span>
@@ -422,25 +474,49 @@ onMounted(() => {
             </el-col>
             <el-col :xl="3" :lg="3" :md="3">
               <span class="inline-flex items-center">模组imei：</span>
-              <el-input class="w-50 m-2" v-model="initParam.T_imei" type="text" placeholder="按模组imei搜索" clearable
-                @change="searchHandle" />
+              <el-input
+                class="w-50 m-2"
+                v-model="initParam.T_imei"
+                type="text"
+                placeholder="按模组imei搜索"
+                clearable
+                @change="searchHandle"
+              />
             </el-col>
             <el-col :xl="3" :lg="3" :md="3">
               <span class="inline-flex items-center">借出人</span>
-              <el-input class="w-50 m-2" v-model="initParam.LendUser" type="text" placeholder="按借出人搜索" clearable
-                @change="searchHandle" />
+              <el-input
+                class="w-50 m-2"
+                v-model="initParam.LendUser"
+                type="text"
+                placeholder="按借出人搜索"
+                clearable
+                @change="searchHandle"
+              />
             </el-col>
             <el-col :xl="3" :lg="3" :md="3">
               <span class="inline-flex items-center">借出项目</span>
-              <el-input class="w-50 m-2" v-model="initParam.T_project" type="text" placeholder="按借出项目搜索" clearable
-                @change="searchHandle" />
+              <el-input
+                class="w-50 m-2"
+                v-model="initParam.T_project"
+                type="text"
+                placeholder="按借出项目搜索"
+                clearable
+                @change="searchHandle"
+              />
             </el-col>
             <el-col :xl="3" :lg="3" :md="3">
               <span class="inline-flex items-center">物联网卡号：</span>
-              <el-input class="w-50 m-2" v-model="initParam.T_iccid" type="text" placeholder="按物联网卡号搜索" clearable
-                @change="searchHandle" />
+              <el-input
+                class="w-50 m-2"
+                v-model="initParam.T_iccid"
+                type="text"
+                placeholder="按物联网卡号搜索"
+                clearable
+                @change="searchHandle"
+              />
             </el-col>
-            <el-col :xl="10" :lg="10" :md="10" style="margin-top: 10px;">
+            <el-col :xl="10" :lg="10" :md="10" style="margin-top: 10px">
               <el-button type="primary" @click="searchHandle">搜索</el-button>
               <el-button type="primary" @click="showInStorageForm = true">入库</el-button>
               <el-button type="primary" @click="showLendForm = true">借出</el-button>
@@ -474,7 +550,7 @@ onMounted(() => {
       <el-form-item label="设备编号" prop="Validationnumber">
         <el-input v-model="inStorageForm.Validationnumber" placeholder="请输入设备编号"></el-input>
       </el-form-item>
-      <el-form-item label="产品分类"  prop="T_class">
+      <el-form-item label="产品分类" prop="T_class">
         <el-select v-model="inStorageForm.T_class" class="w-50 m-2" clearable placeholder="请选择分类~">
           <el-option v-for="item in Pruductoptions" :key="item.Id" :label="item.T_name" :value="item.Id" />
         </el-select>
@@ -500,8 +576,15 @@ onMounted(() => {
         </template>
       </el-table-column>
     </el-table>
-    <el-pagination background layout="prev, pager, next" :total="pendingItems.length" :page-size="pageSize"
-      :current-page="currentPage" @current-change="handlePageChange" style="margin-top: 20px; text-align: right" />
+    <el-pagination
+      background
+      layout="prev, pager, next"
+      :total="pendingItems.length"
+      :page-size="pageSize"
+      :current-page="currentPage"
+      @current-change="handlePageChange"
+      style="margin-top: 20px; text-align: right"
+    />
     <template #footer>
       <span class="dialog-footer">
         <el-button @click="showInStorageForm = false">取消</el-button>
@@ -515,7 +598,7 @@ onMounted(() => {
   <el-dialog title="借出" v-model="showLendForm" width="50%">
     <el-form :model="lendForm" :rules="lendRules" ref="lendFormRef">
       <el-form-item label="SN" prop="T_sn">
-        <el-input v-model="lendForm.T_sn" placeholder="请输入SN"  @keyup.enter="submitLendForm"></el-input>
+        <el-input v-model="lendForm.T_sn" placeholder="请输入SN" @keyup.enter="submitLendForm"></el-input>
       </el-form-item>
       <el-form-item label="备注">
         <el-input v-model="lendForm.T_remark" type="textarea" placeholder="请输入备注"></el-input>
@@ -545,9 +628,15 @@ onMounted(() => {
         </template>
       </el-table-column>
     </el-table>
-    <el-pagination background layout="prev, pager, next" :total="pendingLendItems.length" :page-size="lendPageSize"
-      :current-page="lendCurrentPage" @current-change="handleLendPageChange"
-      style="margin-top: 20px; text-align: right" />
+    <el-pagination
+      background
+      layout="prev, pager, next"
+      :total="pendingLendItems.length"
+      :page-size="lendPageSize"
+      :current-page="lendCurrentPage"
+      @current-change="handleLendPageChange"
+      style="margin-top: 20px; text-align: right"
+    />
     <template #footer>
       <span class="dialog-footer">
         <el-button @click="showLendForm = false">取消</el-button>
@@ -611,8 +700,15 @@ onMounted(() => {
         </template>
       </el-table-column>
     </el-table>
-    <el-pagination background layout="prev, pager, next" :total="pendingItems.length" :page-size="pageSize"
-      :current-page="currentPage" @current-change="handlePageChange" style="margin-top: 20px; text-align: right" />
+    <el-pagination
+      background
+      layout="prev, pager, next"
+      :total="pendingItems.length"
+      :page-size="pageSize"
+      :current-page="currentPage"
+      @current-change="handlePageChange"
+      style="margin-top: 20px; text-align: right"
+    />
     <template #footer>
       <span class="dialog-footer">
         <el-button @click="showInStorageForm = false">取消</el-button>
@@ -623,19 +719,12 @@ onMounted(() => {
     </template>
   </el-dialog>
   <el-dialog title="模板导入" v-model="ImportEdit" width="50%">
-    <el-upload
-      ref="uploadRef"
-      class="upload-demo"
-      :auto-upload="false"
-      @change="handleFileChange"
-    >
+    <el-upload ref="uploadRef" class="upload-demo" :auto-upload="false" @change="handleFileChange">
       <template #trigger>
         <el-button type="primary">模板导入</el-button>
       </template>
 
-      <el-button class="ml-3" type="success" @click="submitUpload">
-        提交文件
-      </el-button>
+      <el-button class="ml-3" type="success" @click="submitUpload"> 提交文件</el-button>
       <template #tip></template>
     </el-upload>
   </el-dialog>