reactor:公告管理上传及分页问题更改

src/views/announcement-management/index.vue

@@ -46,7 +46,7 @@
         </el-col>
       </el-row>
     </el-form>
-    <el-table :data="tableData" border style="width: 100%" height="580">
+    <el-table :data="tableData" border style="width: 100%" height="620">
       <el-table-column prop="announcementName" label="公告名称" align="center"> </el-table-column>
       <el-table-column prop="createrName" label="创建人" align="center"> </el-table-column>
       <el-table-column prop="createTime" label="创建时间" align="center">
@@ -96,17 +96,17 @@
             action="/api/announcement/uploadImage"
             list-type="picture-card"
             accept=".jpg,.jpeg,.png"
+            :auto-upload="false"
             :file-list="fileList"
-            :show-file-list="false"
-            :class="{ 'hide-upload-button': fileList.length >= 1 }"
+            :class="objClass"
             :limit="1"
+            :on-change="handlePicChange"
             :on-preview="handlePictureCardPreview"
             :on-remove="handleRemove"
             :on-success="handleAvatarSuccess"
             :before-upload="beforeUpload"
           >
-            <img v-if="imageUrl" :src="imageUrl" class="avatar" />
-            <i class="el-icon-plus" v-else></i>
+            <i class="el-icon-plus"></i>
             <div slot="tip" class="el-upload__tip">温馨提示:仅需上传一张小于5M的配图即可，格式支持JPG、PNG、JPEG</div>
           </el-upload>
         </el-form-item>
@@ -142,6 +142,10 @@ import { getAnnouncementList, toPublish, toTakeDown, toDelete, toAddAnnouncement
 export default {
   data() {
     return {
+      objClass: {
+        upLoadShow: true,
+        upLoadHide: false
+      },
       dateRange: [],
       imageUrl: '',
       dialogImageVisible: false,
@@ -193,6 +197,10 @@ export default {
     this.fetchData()
   },
   methods: {
+    handlePicChange() {
+      this.objClass.upLoadHide = true
+      this.objClass.upLoadShow = false
+    },
     formatDate(date) {
       return moment(date).format('YYYY-MM-DD HH:mm:ss')
     },
@@ -274,7 +282,7 @@ export default {
       })
     },
     handleAvatarSuccess(res, file) {
-      this.form.images = URL.createObjectURL(file.raw)
+      this.form.images = res.data.fileUrl
       this.imageUrl = res.url
       this.fileList = [file]
     },
@@ -387,7 +395,8 @@ export default {
       }
     },
     handleRemove(file, fileList) {
-      this.fileList = fileList
+      this.objClass.upLoadHide = false
+      this.objClass.upLoadShow = true
     },
     handlePictureCardPreview(file) {
       this.imageUrl = file.url
@@ -416,6 +425,9 @@ export default {
   :deep(.el-upload-list__item-status-label) {
     display: none;
   }
+  .upLoadHide :deep(.el-upload) {
+    display: none;
+  }
   .mb20 {
     margin-bottom: px-to-rem(20);
   }
@@ -483,6 +495,10 @@ export default {
     display: none;
   }
 }
+.avatar {
+  width: px-to-rem(90);
+  height: px-to-rem(90);
+}
 .preview-image {
   max-width: px-to-rem(100);
   max-height: px-to-rem(100);

src/views/hydrological-station/hyInfo.vue

@@ -23,7 +23,7 @@
         </el-col>
       </el-row>
     </el-form>
-    <el-table :data="tableData" border style="width: 100%" height="550">
+    <el-table :data="tableData" border style="width: 100%" height="680">
       <el-table-column prop="stationCode" label="水文站编号" align="center"> </el-table-column>
       <el-table-column prop="stationName" label="水文站名称" align="center"> </el-table-column>
       <el-table-column prop="stationLocation" label="水文站位置" align="center"> </el-table-column>
@@ -172,11 +172,11 @@ export default {
       })
     },
     handleSizeChange(val) {
-      this.pageSize = val
+      this.searchForm.pageSize = val
       this.fetchData()
     },
     handleCurrentChange(val) {
-      this.currentPage = val
+      this.searchForm.pageNum = val
       this.fetchData()
     },
     fetchData() {

src/views/hydrological-station/jcInfo.vue

@@ -20,7 +20,7 @@
         </el-col>
       </el-row>
     </el-form>
-    <el-table :data="tableData" border style="width: 100%" height="600">
+    <el-table :data="tableData" border style="width: 100%" height="650">
       <el-table-column prop="realTimeElevation" label="实时高程(m)" align="center"> </el-table-column>
       <el-table-column prop="maxElevationYesterday" label="昨日最高高程(m)" align="center"> </el-table-column>
       <el-table-column prop="precipitationOneH" label="1小时雨量(mm)" align="center"> </el-table-column>
@@ -172,11 +172,11 @@ export default {
       })
     },
     handleSizeChange(val) {
-      this.pageSize = val
+      this.searchForm.pageSize = val
       this.fetchData()
     },
     handleCurrentChange(val) {
-      this.currentPage = val
+      this.searchForm.pageNum = val
       this.fetchData()
     },
     fetchData() {
@@ -244,7 +244,7 @@ export default {
     },
     importData(event){
       const file = event.target.files[0]; 
-      toImport({file:file}).then((res)=>{
+      toImport({file:file,stationId: this.id}).then((res)=>{
         if(res.data && res.data.errorCount == 0){
           this.$message.success('导入成功')
           this.fetchData()