7.12-01

src/layout/components/AppMain.vue

@@ -7,8 +7,27 @@
       </keep-alive>
     </transition>
     <el-card v-if="shuo" class="box-card">
-      <div class="text item">1234567890-</div>
-      <el-button type="primary" class="btn" @click="shuo = false"
+      <div v-if="mainShow">
+        <div class="title">
+          {{ topic }}
+        </div>
+        <div class="text">
+          <p class="p">{{ message }}</p>
+        </div>
+        <div class="block">
+          <el-pagination
+            style="width: 100%"
+            @current-change="handleCurrentChange"
+            :current-page="pagination.current"
+            :page-size="pagination.size"
+            layout="prev, pager, next"
+            pager-count="3"
+            :total="total"
+          >
+          </el-pagination>
+        </div>
+      </div>
+      <el-button type="primary" size="small" class="btn" @click="shuo = false"
         >确 定</el-button
       >
     </el-card>
@@ -18,6 +37,7 @@
 <script>
 // import { asyncRoutes } from '@/router/router.config'
 import { uploadRoute } from "@/api/user";
+import { getNotifications } from "@/api/dashboard";
 
 export default {
   name: "AppMain",
@@ -37,9 +57,58 @@ export default {
   data() {
     return {
       shuo: true,
+      mainShow: true,
+      pagination: {
+        size: 1,
+        current: 1,
+        type: 8,
+        tableName: "SCADA_HISTORY",
+      },
+      total: 0,
+      topic: "",
+      message: "",
     };
   },
+  mounted() {
+    this.getNotificationList();
+  },
   methods: {
+    handleCurrentChange(value) {
+      console.log("2333", value);
+      this.pagination.current = value;
+      this.getNotificationListPage();
+    },
+    // 获取消息列表
+    getNotificationListPage() {
+      const data = Object.assign({}, this.pagination, this.filter);
+      // console.log("lz2222222", data);
+      this.mainShow = false;
+      getNotifications(data).then((res) => {
+        if (res.code == 1) {
+          if (res.result.records.length > 0) {
+            this.topic = res.result.records[0].topic;
+            this.message = res.result.records[0].message;
+            this.total = res.result.total;
+            this.mainShow = true;
+          }
+        }
+      });
+    },
+    getNotificationList() {
+      const data = Object.assign({}, this.pagination, this.filter);
+      // console.log("lz2222222", data);
+      this.shuo = false;
+      getNotifications(data).then((res) => {
+        if (res.code == 1) {
+          if (res.result.records.length > 0) {
+            this.topic = res.result.records[0].topic;
+            this.message = res.result.records[0].message;
+            this.total = res.result.total;
+          }
+        }
+      });
+      this.shuo = true;
+    },
     uploadRouteTable() {
       const data = {
         1: JSON.stringify({
@@ -78,6 +147,30 @@ export default {
   bottom: 10px;
   right: 10px;
 }
+.title {
+  height: 40px;
+  width: 250px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  cursor: pointer;
+}
+.text {
+  height: 160px;
+}
+.p {
+  margin: 0;
+  text-overflow: -o-ellipsis-lastline;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 8;
+  line-clamp: 8;
+  -webkit-box-orient: vertical;
+}
+.block {
+  width: 150px;
+}
 .fixed-header + .app-main {
   padding-top: 43px;
 }
@@ -89,4 +182,7 @@ export default {
     padding-right: 15px;
   }
 }
+/deep/.el-pager {
+  width: 100px;
+}
 </style>