diff --git a/psdc-ui/src/assets/images/3Dimg.png b/psdc-ui/src/assets/images/3Dimg.png
new file mode 100644
index 0000000..fdabad2
Binary files /dev/null and b/psdc-ui/src/assets/images/3Dimg.png differ
diff --git a/psdc-ui/src/assets/images/footer.png b/psdc-ui/src/assets/images/footer.png
new file mode 100644
index 0000000..7671ca1
Binary files /dev/null and b/psdc-ui/src/assets/images/footer.png differ
diff --git a/psdc-ui/src/views/bigview/index.vue b/psdc-ui/src/views/bigview/index.vue
index d234b51..a951e2e 100644
--- a/psdc-ui/src/views/bigview/index.vue
+++ b/psdc-ui/src/views/bigview/index.vue
@@ -12,7 +12,12 @@
             <div class="dev_img">
               <img src="../../assets/images/电磁锅炉.png" alt="">
             </div>
-            <div class="dev_data"></div>
+            <div class="dev_data">
+              <p>当前状态：<span class="now_tatus">开启</span></p>
+              <p>进水温度：<span class="enter_t"><span>25</span>℃</span></p>
+              <p>出水温度：<span class="leave_t"><span>85</span>℃</span></p>
+              <p>今日能耗：<span class="today_tce"><span>23</span>kWh</span></p>
+            </div>
           </div>
           <div class="chart_box">
             <div class="dev_chart"></div>
@@ -24,7 +29,12 @@
             <div class="dev_img">
               <img src="../../assets/images/蓄热锅炉.png" alt="">
             </div>
-            <div class="dev_data"></div>
+            <div class="dev_data">
+              <p>当前状态：<span class="now_tatus">开启</span></p>
+              <p>进水温度：<span class="enter_t"><span>25</span>℃</span></p>
+              <p>出水温度：<span class="leave_t"><span>85</span>℃</span></p>
+              <p>今日能耗：<span class="today_tce"><span>23</span>kWh</span></p>
+            </div>
           </div>
           <div class="chart_box">
             <div class="dev_chart"></div>
@@ -33,21 +43,66 @@
       </div>
       <div class="middle">
         <div class="middle_top">
-          <div class="important_data"></div>
-          <div class="my3D_img"></div>
-          <div class="important_data"></div>
+          <div class="now_power">
+              <div class="data">35kW</div>
+              <div class="bg_img"></div>
+              <div class="txt">当前功率</div>
+            </div>
+          <div class="my3D_img">
+            <img src="../../assets/images/3Dimg.png" alt="">
+          </div>
+          <div class="now_ele">
+              <div class="data">16446kWh</div>
+              <div class="bg_img"></div>
+              <div class="txt">总用电量</div>
+            </div>
         </div>
         <div class="middle_bottom">
-          <div class="chart_box bgimg"></div>
+          <div class="chart_box bgimg">
+            <div class="title">当前功率</div>
+            <div class="nowPower_chart"></div>
+          </div>
           <div class="wendu_box">
-            <div class="item"></div>
-            <div class="item"></div>
-            <div class="item"></div>
-            <div class="item"></div>
-            <div class="item"></div>
-            <div class="item"></div>
-            <div class="item"></div>
-            <div class="item"></div>
+            <div class="item">
+              <div class="dev_name">温度传感器1</div>
+              <div class="line"></div>
+              <div class="data">26℃</div>
+            </div>
+            <div class="item">
+              <div class="dev_name">温度传感器2</div>
+              <div class="line"></div>
+              <div class="data">26℃</div>
+            </div>
+            <div class="item">
+              <div class="dev_name">温度传感器3</div>
+              <div class="line"></div>
+              <div class="data">26℃</div>
+            </div>
+            <div class="item">
+              <div class="dev_name">温度传感器4</div>
+              <div class="line"></div>
+              <div class="data">26℃</div>
+            </div>
+            <div class="item">
+              <div class="dev_name">温度传感器5</div>
+              <div class="line"></div>
+              <div class="data">26℃</div>
+            </div>
+            <div class="item">
+              <div class="dev_name">温度传感器6</div>
+              <div class="line"></div>
+              <div class="data">26℃</div>
+            </div>
+            <div class="item">
+              <div class="dev_name">温度传感器7</div>
+              <div class="line"></div>
+              <div class="data">26℃</div>
+            </div>
+            <div class="item">
+              <div class="dev_name">温度传感器8</div>
+              <div class="line"></div>
+              <div class="data">26℃</div>
+            </div>
           </div>
         </div>
       </div>
@@ -58,7 +113,12 @@
             <div class="dev_img">
               <img src="../../assets/images/空气源热泵.png" alt="">
             </div>
-            <div class="dev_data"></div>
+            <div class="dev_data">
+              <p>当前状态：<span class="now_tatus">开启</span></p>
+              <p>进水温度：<span class="enter_t"><span>25</span>℃</span></p>
+              <p>出水温度：<span class="leave_t"><span>85</span>℃</span></p>
+              <p>今日能耗：<span class="today_tce"><span>23</span>kWh</span></p>
+            </div>
           </div>
           <div class="chart_box">
             <div class="dev_chart"></div>
@@ -70,7 +130,11 @@
             <div class="dev_img">
               <img src="../../assets/images/发热电缆.png" alt="">
             </div>
-            <div class="dev_data"></div>
+            <div class="dev_data">
+              <p>当前状态：<span class="now_tatus">开启</span></p>
+              <p>当前温度：<span class="now_t"><span>25</span>℃</span></p>
+              <p>今日能耗：<span class="today_tce"><span>23</span>kWh</span></p>
+            </div>
           </div>
           <div class="chart_box">
             <div class="dev_chart"></div>
@@ -141,32 +205,95 @@
       width: 50.5%;
       height: 100%;
       .middle_top{
+        position: relative;
         display: flex;
         justify-content: space-between;
         flex-wrap: nowrap;
         flex: 2;
         width: 100%;
+        height: 67%;
         padding-bottom: 20px;
-        .important_data{
-          width: 14%;
-          height: 100%;
-          border: 1px solid #fff;
+        .now_power{
+          position: absolute;
+          bottom: 20px;
+          left: 20px;
+          width: 112px;
+          height: 110px;
+          .data{
+            color: #F5901A;
+            font-size: 24px;
+            font-weight: bold;
+            text-align: center;
+          }
+          .bg_img{
+            width: 112px;
+            height: 62px;
+            background-image: url("../../assets/images/footer.png");
+            background-size: 100% 100%;
+            margin-top: -10px;
+          }
+          .txt{
+            color: #1AC4F5;
+            font-size: 15px;
+            font-weight: bold;
+            line-height: 30px;
+            text-align: center;
+          }
+        }
+        .now_ele{
+          position: absolute;
+          bottom: 20px;
+          right: 20px;
+          width: 112px;
+          height: 110px;
+          .data{
+            color: #128DFF;
+            font-size: 24px;
+            font-weight: bold;
+            text-align: center;
+          }
+          .bg_img{
+            width: 112px;
+            height: 62px;
+            background-image: url("../../assets/images/footer.png");
+            background-size: 100% 100%;
+            margin-top: -10px;
+          }
+          .txt{
+            color: #1AC4F5;
+            font-size: 15px;
+            font-weight: bold;
+            line-height: 30px;
+            text-align: center;
+          }
         }
         .my3D_img{
-          width: 72%;
+          width: 100%;
           height: 100%;
           border: 1px solid #fff;
+          padding: 20px 60px 0 60px;
+          img{
+            width: 100%;
+            height: 100%;
+            opacity: .85;
+          }
         }
       }
       .middle_bottom{
         display: flex;
         justify-content: space-between;
         flex-wrap: nowrap;
-        flex: 1;
+        height: 33%;
         width: 100%;
         .chart_box{
           width: 49.5%;
           height: 100%;
+          border: 1px solid #fff;
+          .nowPower_chart{
+            width: 100%;
+            height: 81%;
+            border: 1px solid #fff;
+          }
         }
         .wendu_box{
           display: flex;
@@ -177,10 +304,30 @@
           .item{
             width: 24%;
             height: 48.5%;
-            background-color: #1ab394;
+            padding: 0 10px;
+            border: 1px solid #1085B6;
             &:first-child{
               margin-bottom: 8px;
             }
+            .dev_name{
+              color: #19C3F4;
+              font-size: 14px;
+              text-align: center;
+              line-height: 50px;
+            }
+            .line{
+              width: 100%;
+              height: 1px;
+              background-image: url("../../assets/images/line.png");
+              background-size: 100% 100%;
+            }
+            .data{
+              color: #F5901A;
+              font-size: 26px;
+              font-weight: bold;
+              line-height: 80px;
+              text-align: center;
+            }
           }
         }
       }
@@ -222,7 +369,7 @@
   .dev_img{
     width: 50%;
     height: 100%;
-    border: 1px solid #fff;
+    //border: 1px solid #fff;
     img{
       width: 100%;
       height: 100%;
@@ -231,7 +378,27 @@
   .dev_data{
     width: 50%;
     height: 100%;
-    border: 1px solid #fff;
+    //border: 1px solid #fff;
+    margin-left: 10px;
+    p{
+      font-size: 16px;
+      line-height: 40px;
+    }
+    .now_tatus{
+      color: #14FF00;
+    }
+    .enter_t{
+      color: #F5901A;
+    }
+    .leave_t{
+      color: #F5901A;
+    }
+    .today_tce{
+      color: #128DFF;
+    }
+    .now_t{
+      color: #F5901A;
+    }
   }
 }
 .chart_box{