-修改主页

-添加图片上传

master/src/main/java/com/ruoyi/common/config/RuoYiConfig.java

@@ -5,7 +5,7 @@ import org.springframework.stereotype.Component;
 
 /**
  * 读取项目相关配置
- * 
+ *
  * @author ruoyi
  */
 @Component
@@ -132,4 +132,9 @@ public class RuoYiConfig
     {
         return getProfile() + "/upload";
     }
+
+    public static String getFilePath(String dir)
+    {
+        return getProfile() + dir;
+    }
 }

master/src/main/java/com/ruoyi/project/base/controller/TBasePointController.java

@@ -1,47 +1,44 @@
 package com.ruoyi.project.base.controller;
 
-import java.io.IOException;
-import java.text.SimpleDateFormat;
-import java.util.ArrayList;
-import java.util.Date;
-import java.util.List;
-import java.util.concurrent.CopyOnWriteArrayList;
-import java.util.concurrent.CountDownLatch;
-import java.util.concurrent.ExecutorService;
-import java.util.concurrent.Executors;
-import java.util.concurrent.atomic.AtomicInteger;
-import javax.annotation.Resource;
-import javax.servlet.http.HttpServletResponse;
-
 import com.alibaba.fastjson2.JSON;
+import com.ruoyi.common.annotation.Log;
+import com.ruoyi.common.config.RuoYiConfig;
+import com.ruoyi.common.core.controller.BaseController;
+import com.ruoyi.common.core.domain.AjaxResult;
 import com.ruoyi.common.core.domain.entity.SysDictData;
+import com.ruoyi.common.core.page.TableDataInfo;
+import com.ruoyi.common.enums.BusinessType;
 import com.ruoyi.common.utils.file.ExcelUtils;
+import com.ruoyi.common.utils.file.FileUploadUtils;
+import com.ruoyi.common.utils.poi.ExcelUtil;
 import com.ruoyi.project.base.domain.TBaseDevice;
+import com.ruoyi.project.base.domain.TBasePoint;
 import com.ruoyi.project.base.mapper.TBaseDeviceMapper;
-import com.ruoyi.project.base.mapper.TBasePointMapper;
-import com.ruoyi.project.base.service.ITBaseDeviceService;
-import com.ruoyi.project.base.service.ITBasePlantService;
-import com.ruoyi.project.base.service.ITBaseRegionService;
+import com.ruoyi.project.base.service.ITBasePointService;
 import com.ruoyi.system.service.ISysDictTypeService;
-import org.apache.ibatis.exceptions.TooManyResultsException;
 import org.apache.poi.ss.usermodel.Cell;
 import org.apache.poi.ss.usermodel.Row;
 import org.apache.poi.ss.usermodel.Sheet;
 import org.apache.poi.ss.usermodel.Workbook;
 import org.mybatis.spring.MyBatisSystemException;
-import org.springframework.security.access.prepost.PreAuthorize;
 import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.security.access.prepost.PreAuthorize;
 import org.springframework.web.bind.annotation.*;
-import com.ruoyi.common.annotation.Log;
-import com.ruoyi.common.core.controller.BaseController;
-import com.ruoyi.common.core.domain.AjaxResult;
-import com.ruoyi.common.enums.BusinessType;
-import com.ruoyi.project.base.domain.TBasePoint;
-import com.ruoyi.project.base.service.ITBasePointService;
-import com.ruoyi.common.utils.poi.ExcelUtil;
-import com.ruoyi.common.core.page.TableDataInfo;
 import org.springframework.web.multipart.MultipartFile;
 
+import javax.annotation.Resource;
+import javax.servlet.http.HttpServletResponse;
+import java.io.IOException;
+import java.text.SimpleDateFormat;
+import java.util.ArrayList;
+import java.util.Date;
+import java.util.List;
+import java.util.concurrent.CopyOnWriteArrayList;
+import java.util.concurrent.CountDownLatch;
+import java.util.concurrent.ExecutorService;
+import java.util.concurrent.Executors;
+import java.util.concurrent.atomic.AtomicInteger;
+
 /**
  * 密封点Controller
  *
@@ -54,20 +51,9 @@ public class TBasePointController extends BaseController {
     @Autowired
     private ITBasePointService tBasePointService;
 
-    @Autowired
-    private ITBaseDeviceService tBaseDeviceService;
-
-    @Autowired
-    private ITBasePlantService tBasePlantService;
-
-    @Autowired
-    private ITBaseRegionService tBaseRegionService;
-
     @Autowired
     private ISysDictTypeService isysDictTypeService;
 
-    @Resource
-    private TBasePointMapper tBasePointMapper;
     @Resource
     private TBaseDeviceMapper tBaseDeviceMapper;
 
@@ -123,14 +109,14 @@ public class TBasePointController extends BaseController {
                 tBasePoint.setUpdatedate(new Date());
                 tBasePoint.setUpdaterCode(getUserId());
                 tBasePoint.setCreaterCode(getUserId());
-            return toAjax(tBasePointService.insertTBasePoint(tBasePoint));
-            }else{
-                return AjaxResult.success("当前装置下的密封点已存在该群组编号和扩展编码!",0);
+                return toAjax(tBasePointService.insertTBasePoint(tBasePoint));
+            } else {
+                return AjaxResult.success("当前装置下的密封点已存在该群组编号和扩展编码!", 0);
             }
         } catch (MyBatisSystemException e) {
             e.printStackTrace();
-            return AjaxResult.success("当前装置下的密封点已存在该群组编号和扩展编码!",0);
-        }catch (Exception e) {
+            return AjaxResult.success("当前装置下的密封点已存在该群组编号和扩展编码!", 0);
+        } catch (Exception e) {
             e.printStackTrace();
             return AjaxResult.error();
         }
@@ -149,15 +135,24 @@ public class TBasePointController extends BaseController {
             tBasePoint.setUpdatedate(new Date());
             tBasePoint.setUpdaterCode(getUserId());
             return toAjax(tBasePointService.updateTBasePoint(tBasePoint));
-        }else{
+        } else {
             return AjaxResult.error("当前数据已存在!");
         }
     }
 
     @PutMapping("/handleApprove")
     public AjaxResult handleApprove(@RequestBody TBasePoint tBasePoint) {
-            tBasePoint.setApproveTime(new Date());
-            return toAjax(tBasePointService.updateTBasePointByPointIds(tBasePoint));
+        tBasePoint.setApproveTime(new Date());
+        return toAjax(tBasePointService.updateTBasePointByPointIds(tBasePoint));
+    }
+
+    @PutMapping("/handleUpload")
+    public AjaxResult handleUpload(@RequestBody TBasePoint tBasePoint) {
+        tBasePoint.setUpdaterCode(getUserId());
+        if ((tBasePointService.updateTBasePointByUploadFile(tBasePoint)>0))
+            return AjaxResult.success();
+        else
+            return AjaxResult.error("未找到对应名称的PID图号/组件照片号");
     }
 
     /**
@@ -187,7 +182,7 @@ public class TBasePointController extends BaseController {
         int rowNum = sheet.getPhysicalNumberOfRows();
         //线程池
         ExecutorService executorService = Executors.newFixedThreadPool(30);
-        final CountDownLatch latch = new CountDownLatch(rowNum -1); //相同线程数量的计数
+        final CountDownLatch latch = new CountDownLatch(rowNum - 1); //相同线程数量的计数
         AtomicInteger failNumber = new AtomicInteger();
         AtomicInteger successNumber = new AtomicInteger();
         for (int i = 1; i < rowNum; i++) {
@@ -208,7 +203,7 @@ public class TBasePointController extends BaseController {
                         if (j == 0) {
                             //装置名称
                             entity.setPlantName(cellValue);
-                        } else if (j == 1 ) {
+                        } else if (j == 1) {
                             entity.setPlantCode(cellValue);
                         } else if (j == 3) {
                             //  区域名称
@@ -303,7 +298,7 @@ public class TBasePointController extends BaseController {
                         logger.info("没有设备数据");
                         failRow.add(finalI + 1);
                         throw new InterruptedException(); //中止线程
-                    }else {
+                    } else {
                         entity.setDevId(device.getDevId());
                         entity.setPlantId(device.getPlantId());
                         entity.setRegionId(device.getRegionId());
@@ -315,15 +310,15 @@ public class TBasePointController extends BaseController {
                             entity.setUpdaterCode(userId);
                             tBasePointService.insertTBasePoint(entity);
                             successNumber.getAndIncrement();
-                        }else {
+                        } else {
                             logger.info("重复数据");
                             failRow.add(finalI + 1);
                             throw new InterruptedException();//中止线程
                         }
                     }
-                }catch (InterruptedException e) {
-                    logger.info("中止线程"+ Thread.currentThread().getName());
-                }catch (Exception e) {
+                } catch (InterruptedException e) {
+                    logger.info("中止线程" + Thread.currentThread().getName());
+                } catch (Exception e) {
                     failRow.add(finalI + 1);
                     e.printStackTrace();
                 } finally {
@@ -344,4 +339,16 @@ public class TBasePointController extends BaseController {
         logger.info("failRow:" + failRow);
         return AjaxResult.success(String.valueOf(successNumber.get()), failRow);
     }
+
+    @Log(title = "文件上传", businessType = BusinessType.UPDATE)
+    @PostMapping("/uploadFile")
+    public AjaxResult uploadFile(@RequestParam("file") MultipartFile file) throws IOException {
+        if (!file.isEmpty()) {
+            String avatar = FileUploadUtils.upload(RuoYiConfig.getFilePath("/point"), file);
+            return AjaxResult.success(avatar);
+        }
+        return AjaxResult.error("上传异常，请联系管理员");
+    }
+
+
 }

master/src/main/java/com/ruoyi/project/base/domain/TBasePoint.java

@@ -262,12 +262,15 @@ public class TBasePoint extends BaseEntity {
     /**
      * 修改人
      */
-
     private Long updaterCode;
+
     @Excel(name = "维护人")
     @TableField(exist = false)
     private String updater;
 
+    @TableField(exist = false)
+    private String fileName;
+
 
     /**
      * 修改时间
@@ -282,6 +285,25 @@ public class TBasePoint extends BaseEntity {
     @Excel(name = "描述")
     private String remarks;
 
+    @TableField(exist = false)
+    private String pidFlag;
+
+    public String getPidFlag() {
+        return pidFlag;
+    }
+
+    public void setPidFlag(String pidFlag) {
+        this.pidFlag = pidFlag;
+    }
+
+    public String getFileName() {
+        return fileName;
+    }
+
+    public void setFileName(String fileName) {
+        this.fileName = fileName;
+    }
+
     public Long getPlanId() {
         return planId;
     }

master/src/main/java/com/ruoyi/project/base/mapper/TBasePointMapper.java

@@ -51,6 +51,8 @@ public interface TBasePointMapper extends BaseMapper<TBasePoint>
     public int updateTBasePoint(TBasePoint tBasePoint);
     public int updateTBasePointByPointIds(TBasePoint tBasePoint);
 
+    public int updateTBasePointByUploadFile(TBasePoint tBasePoint);
+
     /**
      * 删除密封点
      *

master/src/main/java/com/ruoyi/project/base/service/ITBasePointService.java

@@ -51,6 +51,7 @@ public interface ITBasePointService {
      */
     public int updateTBasePoint(TBasePoint tBasePoint);
     public int updateTBasePointByPointIds(TBasePoint tBasePoint);
+    public int updateTBasePointByUploadFile(TBasePoint tBasePoint);
 
     /**
      * 批量删除密封点

master/src/main/java/com/ruoyi/project/base/service/impl/TBasePointServiceImpl.java

@@ -82,6 +82,11 @@ public class TBasePointServiceImpl implements ITBasePointService {
         return tBasePointMapper.updateTBasePointByPointIds(tBasePoint);
     }
 
+    @Override
+    public int updateTBasePointByUploadFile(TBasePoint tBasePoint) {
+        return tBasePointMapper.updateTBasePointByUploadFile(tBasePoint);
+    }
+
     /**
      * 批量删除密封点
      *

master/src/main/resources/mybatis/base/TBasePointMapper.xml

@@ -298,4 +298,19 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
             </if>
         </where>
     </update>
+
+    <update id="updateTBasePointByUploadFile" parameterType="TBaseRegion">
+        update t_base_point
+        <trim prefix="SET" suffixOverrides=",">
+            <if test="pidUrl != null">pid_url = #{pidUrl},</if>
+            <if test="updaterCode != null">updater_code = #{updaterCode},</if>
+            <if test="updatedate != null">updatedate = #{updatedate},</if>
+            <if test="picUrl != null">pic_url = #{picUrl},</if>
+        </trim>
+        <where>
+            <if test="pidFlag != null and pidFlag==1"> and pid_no = #{fileName}</if>
+            <if test="pidFlag != null and pidFlag==0"> and pic_no = #{fileName}</if>
+        </where>
+    </update>
+
 </mapper>

ui/src/api/base/point.js

@@ -41,7 +41,9 @@ export function updatePoint(data) {
     method: 'put',
     data: data
   })
-}export function handleApprove(data) {
+}
+
+export function handleApprove(data) {
   return request({
     url: '/base/point/handleApprove',
     method: 'put',
@@ -49,6 +51,14 @@ export function updatePoint(data) {
   })
 }
 
+export function handleUpload(data) {
+  return request({
+    url: '/base/point/handleUpload',
+    method: 'put',
+    data: data
+  })
+}
+
 // 删除密封点
 export function delPoint(id) {
   return request({

ui/src/views/base/point/index.vue

@@ -185,7 +185,7 @@
           plain
           icon="el-icon-upload"
           size="mini"
-          @click="handleToApprove"
+          @click="habdleUpdload('上传PID图',1)"
         >上传PID图
         </el-button>
       </el-col>
@@ -195,7 +195,7 @@
           plain
           icon="el-icon-upload"
           size="mini"
-          @click="handleApprove"
+          @click="habdleUpdload('上传组件照片',0)"
         >上传组件照片
         </el-button>
       </el-col>
@@ -205,7 +205,8 @@
     <el-table v-loading="loading" :data="pointList" :cell-style="tableCellStyle"
               @selection-change="handleSelectionChange" :height="clientHeight" border>
       <el-table-column type="selection" width="55" align="center"/>
-      <el-table-column label="检测净值(ppm)" align="center" prop="netTestValue" width="110" :show-overflow-tooltip="true"/>
+      <el-table-column label="检测净值(ppm)" align="center" prop="netTestValue" width="110"
+                       :show-overflow-tooltip="true"/>
       <el-table-column label="泄漏程度" align="center" prop="leakageDegree" :formatter="leakageFormat"
                        :show-overflow-tooltip="true"/>
       <el-table-column label="装置名称" align="center" prop="plantName" :show-overflow-tooltip="true"/>
@@ -242,8 +243,28 @@
           <span>{{ parseTime(scope.row.runTime, '{y}-{m}-{d}') }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="PID图号" align="center" prop="pidNo" :show-overflow-tooltip="true"/>
-      <el-table-column label="群组照片号" align="center" prop="picNo" width="110" :show-overflow-tooltip="true"/>
+      <el-table-column label="PID图号" align="center" prop="pidNo" :show-overflow-tooltip="true">
+        <template slot-scope="scope">
+          <el-button
+            v-if="scope.row.pidUrl"
+            size="mini"
+            type="text"
+            icon="el-icon-view"
+            @click="handleSee(scope.row,true)"
+          >{{ $t('预览') }}</el-button>
+        </template>
+      </el-table-column>
+      <el-table-column label="群组照片号" align="center" prop="picNo" width="110" :show-overflow-tooltip="true">
+        <template slot-scope="scope">
+          <el-button
+            v-if="scope.row.picUrl"
+            size="mini"
+            type="text"
+            icon="el-icon-view"
+            @click="handleSee(scope.row,false)"
+          >{{ $t('预览') }}</el-button>
+        </template>
+      </el-table-column>
       <el-table-column label="TOC质量分数" align="center" prop="tocMark" width="110" :show-overflow-tooltip="true"/>
       <el-table-column label="甲烷质量分数" align="center" prop="methaneMark" width="110"
                        :show-overflow-tooltip="true"/>
@@ -551,12 +572,44 @@
         <el-button @click="upload.open = false">{{ $t('取 消') }}</el-button>
       </div>
     </el-dialog>
+    <el-dialog v-dialogDrag :title="doc.title" :visible.sync="doc.open" width="400px" append-to-body>
+      <el-upload
+        ref="doc"
+        :headers="doc.headers"
+        :action="doc.url"
+        :disabled="doc.isUploading"
+        :on-progress="handleFileDocProgress"
+        :on-success="handleFileDocSuccess"
+        :auto-upload="true"
+        accept=".jpg,.png"
+        :limit="1"
+        :on-exceed="handleExceed"
+        :multiple="false"
+        :file-list="fileList"
+        list-type="picture"
+        drag
+      >
+        <i class="el-icon-upload"></i>
+        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+        <div slot="tip" class="el-upload__tip">文件大小建议不超过5Mb</div>
+      </el-upload>
+    </el-dialog>
+    <el-dialog v-dialogDrag :title="pic.title" :visible.sync="pic.open" width="500px" append-to-body>
+      <div>
+        <el-image
+          style="width: 200px; height: 200px;margin:10px;border-radius: 5%"
+          :key="pic.picUrl"
+          :src="pic.picUrl"
+          :preview-src-list="pic.picList"
+          fit="cover"/>
+      </div>
+    </el-dialog>
     <point-detail v-if="detailVisible" ref="pointDetail"></point-detail>
   </div>
 </template>
 
 <script>
-import {listPoint, getPoint, delPoint, addPoint, updatePoint, handleApprove} from "@/api/base/point";
+import {listPoint, getPoint, delPoint, addPoint, updatePoint, handleApprove, handleUpload} from "@/api/base/point";
 import {getAllPlantName} from "@/api/base/plant";
 import {getAllRegion} from "@/api/base/region";
 import {getAllDeviceByRegionId} from "@/api/base/device";
@@ -569,7 +622,18 @@ export default {
   components: {PointDetail},
   data() {
     return {
-      detailVisible:false,
+      pic : {
+        title: '图片预览',
+        picUrl: '',
+        numPages: null,
+        open: false,
+        pageNum: 1,
+        pageTotalNum: 1,
+        loadedRatio: 0,
+        picList:[],
+      },
+
+      detailVisible: false,
       fullscreenLoading: false,
       // 用户导入参数
       upload: {
@@ -589,6 +653,24 @@ export default {
         // 上传的地址
         url: process.env.VUE_APP_BASE_API + "/base/point/importData"
       },
+      doc: {
+
+        file: "",
+        // 是否显示弹出层（报告附件）
+        open: false,
+        // 弹出层标题（报告附件）
+        title: "",
+        // 是否禁用上传
+        isUploading: false,
+        // 是否更新已经存在的用户数据
+        updateSupport: 0,
+        // 报告附件上传位置编号
+        ids: 0,
+        // 设置上传的请求头部
+        headers: {Authorization: "Bearer " + getToken()},
+        // 上传的地址
+        url: process.env.VUE_APP_BASE_API + "/base/point/uploadFile",
+      },
       plantOperation: [],
       regionOperation: [],
       deviceOperation: [],
@@ -609,6 +691,7 @@ export default {
       yesOrNoOperation: [],
       pointOptions: [],
       mediumTypeOptions: [],
+      fileList: [],
       approveStatusOperation: [],
       // 总条数
       total: 0,
@@ -618,6 +701,7 @@ export default {
       title: "",
       // 是否显示弹出层
       open: false,
+      pidFlag: 0,
       // 查询参数
       queryParams: {
         pageNum: 1,
@@ -719,10 +803,45 @@ export default {
     })
   },
   methods: {
-    openDetail(row){
-      this.detailVisible=true;
-      row.mediumTypeOptions=this.mediumTypeOptions;
-      row.plantOperation=this.plantOperation;
+    handleSee (row,flag){
+      this.pic.picList = []
+      this.pic.open =true
+      if (flag) {
+        this.pic.title = row.pidNo
+        this.pic.picUrl = process.env.VUE_APP_BASE_API + row.pidUrl;
+      } else {
+        this.pic.title = row.picNo
+        this.pic.picUrl = process.env.VUE_APP_BASE_API + row.picUrl;
+      }
+      this.pic.picList.push(this.pic.picUrl)
+    },
+    //附件上传中处理
+    handleFileDocProgress(event, file, fileList) {
+      this.doc.file = file;
+    },
+    //附件上传成功处理
+    handleFileDocSuccess(response, file, fileList) {
+      let data = {};
+      if (this.pidFlag==1)
+        data.pidUrl = response.msg;
+      else
+        data.picUrl = response.msg;
+      data.fileName = file.name;
+      data.pidFlag = this.pidFlag;
+      console.log(data)
+      handleUpload(data).then(() => {
+        this.getList();
+      })
+      this.fileList=[];
+      this.doc.open = false;
+    },
+    handleExceed(files, fileList) {
+      this.$message.warning(`当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
+    },
+    openDetail(row) {
+      this.detailVisible = true;
+      row.mediumTypeOptions = this.mediumTypeOptions;
+      row.plantOperation = this.plantOperation;
       this.$nextTick(() => {
         this.$refs.pointDetail.init(row);
       })
@@ -954,11 +1073,11 @@ export default {
             });
           } else {
             addPoint(this.form).then(response => {
-              if (response.data!=0){
-              this.$modal.msgSuccess("新增成功");
-              this.open = false;
-              this.getList();
-              }else {
+              if (response.data != 0) {
+                this.$modal.msgSuccess("新增成功");
+                this.open = false;
+                this.getList();
+              } else {
                 this.$modal.msgWarning(response.msg);
               }
             });
@@ -999,20 +1118,26 @@ export default {
       }, `point_${new Date().getTime()}.xlsx`)
     },
     handleToApprove() {
-      let data={}
-      data.pointIds=this.ids;
-      data.approveStatus=1;
+      let data = {}
+      data.pointIds = this.ids;
+      data.approveStatus = 1;
       handleApprove(data).then(() => {
         this.getList();
       });
     },
     handleApprove() {
-      let data={}
-      data.pointIds=this.ids;
-      data.approveStatus=2;
+      let data = {}
+      data.pointIds = this.ids;
+      data.approveStatus = 2;
       handleApprove(data).then(() => {
         this.getList();
       });
+    },
+    habdleUpdload(title, flag) {
+      this.doc.open = true;
+      this.doc.title = title;
+      this.pidFlag = flag;
+      this.fileList=[];
     }
   }
 };

ui/src/views/dashboard/PanelGroup.vue

@@ -1,71 +1,88 @@
 <template>
   <el-row :gutter="40" class="panel-group">
     <el-col :xs="16" :sm="16" :lg="8" class="card-panel-col">
-      <div class="card-panel" @click="handleSetLineChartData('newVisitis')">
+      <div class="card-panel">
         <div class="card-panel-icon-wrapper icon-people">
-          <svg-icon icon-class="dashboard" class-name="card-panel-icon" />
+          <svg-icon icon-class="dashboard" class-name="card-panel-icon"/>
         </div>
         <div class="card-panel-description">
           <div class="card-panel-text">
             初始排放量
           </div>
-          <count-to :start-val="0" :end-val="12345" :duration="2600" class="card-panel-num" />吨/年
+          <count-to :start-val="0" :end-val="pfl" :duration="2600" :decimals="4" class="card-panel-num"/>
+          吨/年
         </div>
       </div>
     </el-col>
     <el-col :xs="16" :sm="16" :lg="8" class="card-panel-col">
-      <div class="card-panel" @click="handleSetLineChartData('messages')">
+      <div class="card-panel">
         <div class="card-panel-icon-wrapper icon-message">
-          <svg-icon icon-class="dashboard" class-name="card-panel-icon" />
+          <svg-icon icon-class="dashboard" class-name="card-panel-icon"/>
         </div>
         <div class="card-panel-description">
           <div class="card-panel-text">
             减排量
           </div>
-          <count-to :start-val="0" :end-val="12345" :duration="3000" class="card-panel-num" />吨/年
+          <count-to :start-val="0" :end-val="jpl" :duration="3000" :decimals="4" class="card-panel-num"/>
+          吨/年
         </div>
       </div>
     </el-col>
     <el-col :xs="16" :sm="18" :lg="8" class="card-panel-col">
-      <div class="card-panel" @click="handleSetLineChartData('purchases')">
+      <div class="card-panel">
         <div class="card-panel-icon-wrapper icon-money">
-          <svg-icon icon-class="dashboard" class-name="card-panel-icon" />
+          <svg-icon icon-class="dashboard" class-name="card-panel-icon"/>
         </div>
         <div class="card-panel-description">
           <div class="card-panel-text">
             最终排放量
           </div>
-          <count-to :start-val="0" autopa :end-val="1235.123" :duration="3200" :decimals="4" class="card-panel-num" />吨/年
+          <count-to :start-val="0" autopa :end-val="sjpfl" :duration="3200" :decimals="4" class="card-panel-num"/>
+          吨/年
         </div>
       </div>
     </el-col>
-<!--    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
-      <div class="card-panel" @click="handleSetLineChartData('shoppings')">
-        <div class="card-panel-icon-wrapper icon-shopping">
-          <svg-icon icon-class="shopping" class-name="card-panel-icon" />
-        </div>
-        <div class="card-panel-description">
-          <div class="card-panel-text">
-            订单
-          </div>
-          <count-to :start-val="0" :end-val="13600" :duration="3600" class="card-panel-num" />
-        </div>
-      </div>
-    </el-col>-->
   </el-row>
 </template>
 
 <script>
 import CountTo from 'vue-count-to'
+import {listStatistics, pflByPoint} from "@/api/statistics/statistics";
 
 export default {
+  props: {
+    statisticsList: {
+      type: Array,
+      default() {
+        return [];
+      }
+    },
+  },
   components: {
     CountTo
   },
+  data() {
+    return {
+      pfl: 0,
+      jpl: 0,
+      sjpfl: 0,
+    }
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.statisticsList.forEach(item => {
+        if (item.plantName == '合计') {
+          this.pfl = parseFloat(item.pfl);
+          this.jpl = parseFloat(item.jpl);
+          this.sjpfl = parseFloat(item.sjpfl);
+        }
+      })
+    })
+  },
   methods: {
     handleSetLineChartData(type) {
       this.$emit('handleSetLineChartData', type)
-    }
+    },
   }
 }
 </script>
@@ -160,7 +177,7 @@ export default {
   }
 }
 
-@media (max-width:550px) {
+@media (max-width: 550px) {
   .card-panel-description {
     display: none;
   }

ui/src/views/index.vue

@@ -1,27 +1,39 @@
 <template>
   <div class="dashboard-editor-container">
 
-    <panel-group @handleSetLineChartData="handleSetLineChartData" />
+    <panel-group :statisticsList="statisticsList" v-if="show"/>
 
-    <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
-      <line-chart :chart-data="lineChartData" />
+    <el-row  style="background:#fff;margin-bottom:32px;">
+      <el-card style="height: 570px">
+        <div class="bt"><span><i class="el-icon-coin i"></i> 泄露程度统计</span></div>
+        <el-col :span="12">
+          <el-card style="margin:0 5px 0 0;height: 500px" shadow="hover">
+            <plant-count-chart v-if="show" :statistics="statisticsList"></plant-count-chart>
+          </el-card>
+        </el-col>
+        <el-col :span="12">
+          <el-card style="margin: 0 0 0 5px;height: 500px " shadow="hover">
+            <pt-count-chart v-if="show" :queryParams="queryParams"></pt-count-chart>
+          </el-card>
+        </el-col>
+      </el-card>
     </el-row>
 
     <el-row :gutter="32">
-      <el-col :xs="24" :sm="24" :lg="8">
-        <div class="chart-wrapper">
-          <raddar-chart />
-        </div>
+      <el-col :span="8">
+        <el-card>
+          <pfl-pie-chart v-if="showPoint" :pointList="pointCountList" :plant-name="''"></pfl-pie-chart>
+        </el-card>
       </el-col>
-      <el-col :xs="24" :sm="24" :lg="8">
-        <div class="chart-wrapper">
-          <pie-chart />
-        </div>
+      <el-col :span="8">
+        <el-card>
+          <xll-pie-chart v-if="showPoint" :pointList="pointCountList" :plant-name="''"></xll-pie-chart>
+        </el-card>
       </el-col>
-      <el-col :xs="24" :sm="24" :lg="8">
-        <div class="chart-wrapper">
-          <bar-chart />
-        </div>
+      <el-col :span="8">
+        <el-card>
+          <jpl-pie-chart v-if="showPoint" :pointList="pointCountList" :plant-name="''"></jpl-pie-chart>
+        </el-card>
       </el-col>
     </el-row>
 
@@ -35,6 +47,12 @@ import LineChart from './dashboard/LineChart'
 import RaddarChart from './dashboard/RaddarChart'
 import PieChart from './dashboard/PieChart'
 import BarChart from './dashboard/BarChart'
+import {listStatistics, pflByPoint} from "@/api/statistics/statistics";
+import PflPieChart from "@/views/statistics/pie/pflPieChart";
+import XllPieChart from "@/views/statistics/pie/xllPieChart";
+import JplPieChart from "@/views/statistics/pie/jplPieChart";
+import PlantCountChart from "@/views/statistics/plantCountChart";
+import PtCountChart from "@/views/statistics/ptCountChart";
 
 const lineChartData = {
   newVisitis: {
@@ -58,6 +76,11 @@ const lineChartData = {
 export default {
   name: 'Index',
   components: {
+    PtCountChart,
+    PlantCountChart,
+    JplPieChart,
+    XllPieChart,
+    PflPieChart,
     PanelGroup,
     LineChart,
     RaddarChart,
@@ -66,12 +89,39 @@ export default {
   },
   data() {
     return {
-      lineChartData: lineChartData.newVisitis
+      lineChartData: lineChartData.newVisitis,
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        plantId: null,
+        year: null,
+        startTime: null,
+        endTime: null,
+        company: null,
+      },
+      show: false,
+      showPoint: false,
+      statisticsList: [],
+      pointCountList: [],
     }
   },
+  created() {
+    this.getList();
+  },
   methods: {
     handleSetLineChartData(type) {
       this.lineChartData = lineChartData[type]
+    },
+    getList() {
+      this.queryParams.year = new Date().getFullYear();
+      listStatistics(this.queryParams).then(response => {
+        this.statisticsList = response.data;
+        this.show = true;
+      })
+      pflByPoint(this.queryParams).then(response => {
+        this.pointCountList = response.data;
+        this.showPoint = true;
+      })
     }
   }
 }