fix(disClaimer):免责图片大小限制1M内

src/main/webapp/WEB-INF/views/cmpt/disClaimer.jsp

@@ -128,35 +128,40 @@
                                 <script type="text/x-template" id="my-app">
                                     <n-spin :show="loading" >
                                     <n-space >
-                                        <n-card title="免责图片">
-                                            <div class="flex flex-col  w-full justify-center items-center gap-y-3">
-                                                <n-image
-                                                width="300"
-                                                :src="bgImage"
-                                                />
-                                                <!-- 只允许上传png -->
-                                                <div>
+                                        <!-- 只允许上传png -->
+                                        <n-card>
+                                            <div class="flex flex-col gap-y-3">
+                                                <n-alert title="图片要求" type="warning">
+                                                    建议1081 x 4174 png格式 1MB以内
+                                                </n-alert>
                                                     <n-upload
+                                                    :max="1"
+                                                    @before-upload="beforeUpload"
                                                     :action="uploadUrl"
                                                     @finish="onFileUpload"
                                                     v-model:file-list="fileList"
                                                     accept="image/png"
                                                 >
-                                                    <n-button type="primary">
+                                                    <n-button type="primary" block>
                                                         上传免责声明
                                                     </n-button>
                                                 </n-upload>
-                                                </div>
-                                            </div>
+                                            </div> 
+                                        </n-card>  
+                                        <n-card title="免责图片">
+                                            <n-image
+                                                width="300"
+                                                :src="bgImage"
+                                                />
                                         </n-card>
                                         <n-card>
                                             <div class="flex flex-col  w-full justify-center items-start gap-y-3">
                                                 <h4 class="mb-2">签名图片共 {{total}} 张</h4>
                                                 <div class="flex flex-col items-start gap-y-3">
                                                     <span class="flex-shrink-0">将签名图片分 </span>
-                                                    <n-input-number v-model:value="pieceCount" />
+                                                    <n-input-number :min="1" v-model:value="pieceCount" />
                                                     <span class="flex-shrink-0">批次下载本次下载第 </span>
-                                                    <n-input-number v-model:value="pieceNum" />
+                                                    <n-input-number :min="1" v-model:value="pieceNum" />
                                                     <span class="flex-shrink-0">批次 </span>
                                                     <n-button type="primary" @click="download" block>
                                                         下载
@@ -320,7 +325,8 @@
                                             const fileList = ref([])
                                             const total = ref(0)
                                             // 证书地址
-                                            const bgImage = "https://geexekimgoss-sxk.oss-cn-hangzhou.aliyuncs.com/micro/" + getCId() + "_cmptId/mianze.png"
+                                            const bgImage = "https://geexekimgoss-sxk.oss-cn-hangzhou.aliyuncs.com/micro/" + getCId() + "_cmptId/mianze.png" + "?t=" + new Date().getTime()
+                                            // 检查证书是否存在
                                             const checkCert = () => {
                                                 // 判断图片是否存在
                                                 const img = new Image()
@@ -332,11 +338,12 @@
                                                     certExit.value = false
                                                 }
                                             }
-                                            // 上传成功
+                                            // 文件上传成功
                                             const onFileUpload = (file) => {
                                                 fileList.value = []
                                                 checkCert()
                                                 window.location.reload()
+                                                loading.value = false
                                             }
                                             // 获取统计
                                             const getStatistics = async () => {
@@ -368,7 +375,21 @@
                                                     window.location.href = 'https://timerbackend.geexek.com/statistics/downloadSignPicZip.do?cmptId=' + getCId() + "&pieceCount=" + pieceCount.value + "&pieceNum=" + pieceNum.value;
                                                 }
                                             }
-                                            // 文件上传
+                                            // 文件上传前回调
+                                            const beforeUpload = (data) => {
+                                                // 限制类型
+                                                if (data.file.file?.type !== 'image/png') {
+                                                    message.error('只能上传png格式的图片文件，请重新上传')
+                                                    return false
+                                                }
+                                                // 限制大小为1M
+                                                if (data.file.file.size > 1 * 1024 * 1024) {
+                                                    message.error('文件大小不能超过1M，请重新上传')
+                                                    return false
+                                                }
+                                                loading.value = true
+                                                return true
+                                            }
                                             /***---------------- 设置信息 end-----------------*/
                                             // 页面加载
                                             onMounted(() => {
@@ -387,6 +408,7 @@
                                                 total,
                                                 loading,
                                                 download,
+                                                beforeUpload
                                             }
                                         }
                                     })