更新

src/views/home/components/index.vue

@@ -24,7 +24,7 @@
                 </el-select>
             </div>
             <div class="form-date">
-                <el-date-picker v-model="dateTime" type="daterange" range-separator="To" start-placeholder="Start date" end-placeholder="End date" />
+                <el-date-picker v-model="dateTime" type="daterange" range-separator="To" start-placeholder="开始日期" end-placeholder="结束日期" />
             </div>
         </div>
     </div>

src/views/home/index.vue

@@ -78,7 +78,7 @@
                     <el-col :span="6">
                         <div class="circle_item c">
                             <div>
-                                <span class="number">31</span>个
+                                <span class="number">29</span>个
                             </div>
                         </div>
                         <div class="circle_item_title">
@@ -88,7 +88,7 @@
                     <el-col :span="6">
                         <div class="circle_item d">
                             <div>
-                                <span class="number">31</span>个
+                                <span class="number">0</span>个
                             </div>
                         </div>
                         <div class="circle_item_title">
@@ -108,31 +108,13 @@
                 </div>
                 <div class="message_content">
                     <el-scrollbar v-if="msg_type === '1'">
-                        <div class="message-item">
-                            <div class="title_wrapper">
-                                <span class="dot" />
-                                <span class="time">2023-04-09 08:03:36</span>
-                            </div>
-                            <div class="content_wrapper">
-                                <span class="content">阈值报警：2-2-12105(XZC3-4应变)已经解除报警，当前值为：61.8με。</span>
-                            </div>
-                        </div>
-                        <div class="message-item">
-                            <div class="title_wrapper">
-                                <span class="dot" />
-                                <span class="time">2023-04-09 08:03:36</span>
-                            </div>
-                            <div class="content_wrapper">
-                                <span class="content">阈值报警：2-2-12105(XZC3-4应变)已经解除报警，当前值为：61.8με。</span>
-                            </div>
-                        </div>
-                        <div class="message-item">
+                        <div v-for="item in dataJson.data" :key="item" class="message-item">
                             <div class="title_wrapper">
                                 <span class="dot" />
-                                <span class="time">2023-04-09 08:03:36</span>
+                                <span class="time">{{ item.time }}</span>
                             </div>
                             <div class="content_wrapper">
-                                <span class="content">阈值报警：2-2-12105(XZC3-4应变)已经解除报警，当前值为：61.8με。</span>
+                                <span class="content">{{ item.name }}</span>
                             </div>
                         </div>
                     </el-scrollbar>
@@ -163,6 +145,7 @@ import { ref } from 'vue'
 import indexVue from './components/index.vue'
 import { useAppStore } from '~src/store'
 import { getRandom } from 'js-fast-way'
+import dataJson from './data.json'
 
 const appStore = useAppStore()