From c239c25fa4129fefabdf9059455ff6354ba117c7 Mon Sep 17 00:00:00 2001
From: liangbin <15536829364@163.com>
Date: Fri, 16 Jan 2026 16:59:47 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E6=96=87=E4=BB=B6=E4=B8=8A=E4=BC=A0):=20?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E4=B8=8A=E4=BC=A0=E7=BB=84=E4=BB=B6=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD=E5=8F=8A=E6=A0=B7=E5=BC=8F=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 新增上传图标资源文件
- 在utils中添加生成唯一标识符方法
- 重构GatePassInfo组件文件上传功能，支持图片和PDF格式
- 优化BasicsInfo和GatePassInfo组件滚动行为
- 添加上传文件大小和类型校验
- 完善文件列表展示和删除功能
---
 .../WorkOrderEdit/compoents/BasicsInfo.vue    |   2 +-
 .../WorkOrderEdit/compoents/GatePassInfo.vue  | 119 ++++++++++++++++--
 src/static/icon/upload-icon.png               | Bin 0 -> 964 bytes
 src/utils/index.js                            |  12 ++
 4 files changed, 125 insertions(+), 8 deletions(-)
 create mode 100644 src/static/icon/upload-icon.png

diff --git a/src/pages/WorkOrderEdit/compoents/BasicsInfo.vue b/src/pages/WorkOrderEdit/compoents/BasicsInfo.vue
index bf78b37..43240ea 100644
--- a/src/pages/WorkOrderEdit/compoents/BasicsInfo.vue
+++ b/src/pages/WorkOrderEdit/compoents/BasicsInfo.vue
@@ -319,7 +319,7 @@ const initTiandituMap = () => {
     padding: 20rpx;
     background-color: #fff;
     height: 100%;
-    overflow: hidden;
+    overflow: auto;
 }
 
 .mustBox::after {
diff --git a/src/pages/WorkOrderEdit/compoents/GatePassInfo.vue b/src/pages/WorkOrderEdit/compoents/GatePassInfo.vue
index c35829e..9e8d6c3 100644
--- a/src/pages/WorkOrderEdit/compoents/GatePassInfo.vue
+++ b/src/pages/WorkOrderEdit/compoents/GatePassInfo.vue
@@ -59,16 +59,34 @@
             <view class="FormItem">
                 <view class="FormLableBox">附件上传</view>
                 <view class="FormValueBox">
-                    <up-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple
-                        :maxCount="10"></up-upload>
+                    <up-upload width="100%" @afterRead="afterRead" multiple accept="image/*,application/pdf">
+                        <view class="UploadBox">
+                            <view class="UpIcon">
+                                <img src="@/static/icon/upload-icon.png" alt="">
+                            </view>
+                            <view class="UpTitle">点击上传</view>
+                            <view class="UpDesc">支持JPG,PNG,PDF格式上传，单个文件大小不超过10MB</view>
+                        </view>
+                    </up-upload>
+                </view>
+                <view class="UpFileListBox">
+                    <view v-for="item in fileList1" :key="item.url" class="UpFileItem">
+                        <view>
+                            <view class="UpFileName">{{ item.name }}</view>
+                            <view class="UpFileSize">{{ item.size }}</view>
+                        </view>
+
+                        <u-button text="删除" type="primary" size="small" @click="deletePic(item.fid)"></u-button>
+                    </view>
                 </view>
             </view>
         </view>
     </view>
 </template>
 <script setup>
+import { generateGuid } from '@/utils/index.js';
 import dayjs from "dayjs";
-import { ref, computed, onMounted, defineExpose } from "vue";
+import { ref, defineExpose } from "vue";
 
 const props = defineProps({
     allData: {
@@ -95,9 +113,7 @@ const CarArr = ref([
         type: '轿车',
         code: '京B123456',
     },
-]); // 随行车辆数组
-
-
+]);
 
 // 组件数据
 const formData = ref({
@@ -105,6 +121,46 @@ const formData = ref({
     CarList: [], // 随行车辆数组
 })
 
+const fileList1 = ref([]); // 上传的文件列表
+
+// 处理上传文件事件
+const afterRead = (e) => {
+    console.log('上传的文件：', e);
+    let fileInfo = e.file[0];
+    // 判断文件大小
+    if (fileInfo.size > 10 * 1024 * 1024) {
+        uni.showToast({
+            title: '文件大小不能超过10MB',
+            icon: 'none'
+        });
+        return;
+    }
+    // 判断文件类型
+    if (!fileInfo.name.match(/\.(jpg|png|pdf)$/i)) {
+        uni.showToast({
+            title: '请上传JPG,PNG,PDF格式的文件',
+            icon: 'none'
+        });
+        return;
+    }
+
+    let arr = [...fileList1.value];
+    arr.push({
+        fid: generateGuid(),
+        name: fileInfo.name,
+        size: (fileInfo.size / 1024 / 1024).toFixed(2) + 'MB',
+        url: fileInfo.url,
+    });
+    fileList1.value = arr;
+}
+
+// 删除上传的文件
+const deletePic = (fid) => {
+    console.log('删除文件：', fid);
+    let arr = [...fileList1.value];
+    arr = arr.filter(item => item.fid !== fid);
+    fileList1.value = arr;
+}
 
 // 组件暴露方法
 defineExpose({
@@ -113,6 +169,8 @@ defineExpose({
     }
 })
 
+
+
 // 处理出入证有效日期选择器确认事件
 const HandleValidTimeConfirm = (e) => {
     const selectedDate = (e.value && dayjs(e.value).isValid()) ? e.value : minTimestamp.value;
@@ -183,6 +241,53 @@ const HandleDeleteCar = (carId) => {
 
 </script>
 <style lang="scss" scoped>
+.UploadBox {
+    width: 100%;
+    height: 300rpx;
+    margin: 0 auto;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 20rpx;
+    padding: 20rpx;
+    border: 1rpx dashed #e4e7ed;
+    border-radius: 10rpx;
+
+    .UpTitle {
+        font-size: 30rpx;
+        font-weight: bold;
+        color: #333;
+    }
+
+    .UpDesc {
+        font-size: 24rpx;
+        color: #666;
+    }
+}
+
+.UpFileListBox {
+    margin-top: 20rpx;
+    height: auto;
+    .UpFileItem {
+        border: 1rpx solid #e4e7ed;
+        padding: 20rpx;
+        border-radius: 10rpx;
+        display: flex;
+        flex-direction: column;
+        gap: 20rpx;
+        .UpFileName {
+            font-size: 30rpx;
+            font-weight: bold;
+            color: #333;
+        }
+        .UpFileSize {
+            font-size: 24rpx;
+            color: #666;
+        }
+    }
+}
+
 .FlexBox {
     display: flex;
     align-items: center;
@@ -200,7 +305,7 @@ const HandleDeleteCar = (carId) => {
     padding: 20rpx;
     background-color: #fff;
     height: 100%;
-    overflow: hidden;
+    overflow: auto;
 }
 
 .mustBox::after {
diff --git a/src/static/icon/upload-icon.png b/src/static/icon/upload-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..017650059eb89857a9154aff44ba557310cd35a7
GIT binary patch
literal 964
zcmV;#13UbQP)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm000AdNkl<ZcmeEJ
zJxmlq82x5J4nm^Xpd^^wsg<EH*im6@+}6YxXvD(8%Em$~hR)8;U@SN*Lt?*F0u6Rb
zL1lAiC_oyJ1i3?wao!y>?B4C&&MtemOLCjMo1LBce%{RcX7?<*;8&MG(i_;_f$k2R
za|L`Q#GRuV?vxiK3TG%S&pG8;?i@}^WX~BlHggXFB*vZ6GLcx25oRQi=qcEwAmT)p
z9JiJ+mr`(f2oN!uIGd#4OOmn*r#m9=gALj>Llda2s8RAdm)ednDYfKer3o;yo>HU>
zq%Fuw)=NoBt1Jmc!|9HOsxeI<Qtk~#AVa8~NT}^-bur{Z92!Y8W&#w~C6l*|NTihj
z79z_GWSwRLBuE6Fh^Zz(#H5s{<rSJhVMox{jm}{0r^s@rEL^C*d)$md5%^vZRM>Hw
zcl<sph`1yqU%0i{#su~bh=7_|(!WAW%b38{UeZas<FlgbnG@I*$|eQv$tRVB5rM60
z^2#J!d;JOvXJ9a!+XE|Vnh}A$ztNIdeBMV2Dqsw4-tEJP!0thK`PgGUq*fp8-5W-s
z+_^QmXRGdkK(CNb>Bwzjc7N@%ciu=$QsQ=BxE+WpA8-1x^*qVLYv2w<kq;cV2VVIg
zMoR)=<n#JrFRi}HXgr(fg?|nAI0_qmJ!pJW(Wj3xX-U9TJ~I<NgrZeWgIW|d=7%io
zygWYj3rxjmNx)P-zxS29cD9Z3LA0g>!pP^x<_RsV9n-pOxBmzN;M@&7b3@H{&uM+%
zC?CvkO2AY;aDv40YZZFA_>Z1^JgNc-VoV|btx|oi#xY-wnY4cLfn8Gqrt*Q44xr)q
zR55)C;Ilc(%S$<pzdieStM~0oAdXMx^-b^R2kN9gxM^R?r{VZiw!Q@7kk9tMs1`Qr
z<L%P1Z(*w>0@|kXft@dbIOK!GQK%?dXQP5x5#fJ)DrcI2AodFnaeSgp1FjA-s{eSa
z&r1^^sz7JOIP_m1Bx?VXb+R2~s|m<LDayYsE%g@UEY9(vL899uJ#T`1Y66%zYiH(0
zhS+Bqqn{LV!$jjbS_zU5^79bDgAdc0>G7P%-MdBeW23axN!%G_UmlDxesh>{Zuj3u
zK0#<800V9h6yH7SfAM~*-;RWccJou2$4~))JWSwAz{D^ubGihQ-ihuGB)tRw0RRC1
m|E~!$xBvhE21!IgR09Bn6!dWKqZBIu0000<MNUMnLSTY2v%(+%

literal 0
HcmV?d00001

diff --git a/src/utils/index.js b/src/utils/index.js
index 94a2ae0..216076a 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -1,3 +1,15 @@
 export * from './storage'
 export * from './validate'
 export * from './format'
+
+
+// 生成指定长度的唯一标识符
+export function generateGuid(length = 8) {
+    let arr = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'];
+    let guid = '';
+    for (let i = 0; i < length; i++) {
+        let randomIndex = Math.floor(Math.random() * arr.length);
+        guid += arr[randomIndex];
+    }
+    return guid;
+}
\ No newline at end of file