消息

src/views/home/index.vue

@@ -5,8 +5,8 @@
         <div class="message-box">
           <el-carousel height="32px" direction="vertical" indicator-position="none" autoplay>
             <el-carousel-item v-for="(item, index) in messages" :key="'message-' + index">
-              <p class="text-row-1" style="line-height: 32px;" :class="{'is-link': item.href}"
+              <p class="text-row-1" style="line-height: 32px;" :class="{ 'is-link': item.href }"
-                 @click="userStore.showHomeMsg=true">【{{ item.category }}】 {{ item.message }}</p>
+                @click="userStore.showHomeMsg = true">【{{ item.category }}】 {{ item.message }}</p>
             </el-carousel-item>
           </el-carousel>
         </div>
@@ -17,7 +17,7 @@
           </div>
           <div class="header-item">
             <el-icon class="text1-color" style="font-size: 26px;margin-right: 20px;">
-              <Calendar/>
+              <Calendar />
             </el-icon>
             <div>
               <p class="text1-color f14">待办任务</p>
@@ -27,22 +27,22 @@
         </div>
         <div class="echart-box">
           <div class="echart-item">
-            <NumberChart/>
+            <NumberChart />
           </div>
           <div class="echart-item">
-            <NumberPieChart/>
+            <NumberPieChart />
           </div>
           <div class="echart-item">
-            <TimeChart/>
+            <TimeChart />
           </div>
           <div class="echart-item">
-            <TimeBarChart/>
+            <TimeBarChart />
           </div>
         </div>
       </div>
       <div class="right-content">
         <div class="week-calendar">
-          <WeekCalendar/>
+          <WeekCalendar />
         </div>
         <div class="system-logs" v-if="showLogMod">
           <div class="title">
@@ -50,51 +50,18 @@
             <span class="f14" style="cursor: pointer;" @click="router.push('./logs-manage/logs-manage')">更多</span>
           </div>
           <div class="content">
-            <SystemLogs/>
+            <SystemLogs />
           </div>
         </div>
       </div>
     </div>
-    <el-drawer
-        class="message-drawer-box"
-        v-model="userStore.showHomeMsg"
-        title="通知消息"
-    >
-      <div class="body">
-        <el-card style="margin-top: 10px;" v-for="(item, index) in messageTable">
-          <template #header>
-            <div class="card-header">
-              <span>{{ item.category }}</span>
-            </div>
-          </template>
-          <p class="text item">{{ item.message }}</p>
-          <template #footer>
-            <span>{{ item.creatorName }}</span>
-            <span style="float: inline-end;">{{ item.createTime }}</span>
-          </template>
-        </el-card>
-      </div>
-
-      <div class="footer">
-        <el-pagination
-            v-model:page-size="size"
-            v-model:current-page="current"
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-            background
-            layout="prev, pager, next, jumper, sizes"
-            :page-sizes="[10, 20, 30, 50]"
-            :total="total"
-        />
-      </div>
-    </el-drawer>
   </div>
 </template>
 
 <script lang='ts' setup>
-import {onMounted, ref} from 'vue'
+import { onMounted, ref } from 'vue'
-import {useRouter} from 'vue-router'
+import { useRouter } from 'vue-router'
-import {useUserStore} from '@/stores/user-info-store'
+import { useUserStore } from '@/stores/user-info-store'
 import NumberChart from "./number-chart.vue";
 import NumberPieChart from "./number-pie-chart.vue";
 import TimeChart from "./time-chart.vue";
@@ -102,7 +69,7 @@ import TimeBarChart from "./time-bar-chart.vue";
 import WeekCalendar from "./week-calendar.vue";
 import SystemLogs from "@/components/system-logs.vue";
 import * as dailyPlanApi from "@/api/daily-plan";
-import {dateFormater} from "@/utils/date-util";
+import { dateFormater } from "@/utils/date-util";
 import * as msgApi from "@/api/sys-message";
 
 const router = useRouter()
@@ -110,10 +77,6 @@ const userStore = useUserStore();
 const userInfo = userStore.getlogin()
 const showLogMod = ref(false)
 const messages = ref([] as any)
-const messageTable = ref([] as any)
-const current = ref(1);
-const size = ref(10);
-const total = ref(0);
 const todoTotal = ref(0) // 日历添加的记录提醒统计
 
 onMounted(() => {
@@ -131,9 +94,6 @@ function init() {
   });
   getTodoCount();
   messages.value = [];
-  messageTable.value = [];
-  current.value = 1
-  total.value = 0
   loadMsg();
 }
 
@@ -145,25 +105,11 @@ function getTodoCount() {
   });
 }
 
-function handleSizeChange() {
-  messageTable.value = [];
-  loadMsg()
-}
-
-function handleCurrentChange() {
-  messageTable.value = [];
-  loadMsg()
-}
-
 async function loadMsg() {
-  const res = await msgApi.page(current.value, size.value)
+  const res = await msgApi.page(0, 10)
   if (res.code == 0) {
-    total.value = res.data.total
     res.data.records.forEach((row: any) => {
-      if (current.value == 1) {
+      messages.value.push(row)
-        messages.value.push(row)
-      }
-      messageTable.value.push(row)
     })
   }
 }
@@ -224,7 +170,7 @@ async function loadMsg() {
         flex-direction: column;
         justify-content: center;
 
-        & ~ .header-item {
+        &~.header-item {
           width: 40%;
           flex-direction: row;
           justify-content: flex-start;
@@ -307,4 +253,5 @@ async function loadMsg() {
       background: white;
     }
   }
-}</style>
+}
+</style>

src/views/index.vue

@@ -56,6 +56,39 @@
     <el-drawer v-model="isShowUserInfoDrawer" size="35%" :with-header="false">
       <userInfoForm @close="isShowUserInfoDrawer = false"/>
     </el-drawer>
+    <el-drawer
+        class="message-drawer-box"
+        v-model="userStore.showHomeMsg"
+        title="通知消息"
+    >
+      <div class="body">
+        <el-card style="margin-top: 10px;" v-for="(item, index) in messageTable">
+          <template #header>
+            <div class="card-header">
+              <span>{{ item.category }}</span>
+            </div>
+          </template>
+          <p class="text item">{{ item.message }}</p>
+          <template #footer>
+            <span>{{ item.creatorName }}</span>
+            <span style="float: inline-end;">{{ item.createTime }}</span>
+          </template>
+        </el-card>
+      </div>
+
+      <div class="footer">
+        <el-pagination
+            v-model:page-size="size"
+            v-model:current-page="current"
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            background
+            layout="prev, pager, next, jumper, sizes"
+            :page-sizes="[10, 20, 30, 50]"
+            :total="total"
+        />
+      </div>
+    </el-drawer>
   </div>
 </template>
 
@@ -67,6 +100,7 @@ import {useUserStore} from '@/stores/user-info-store'
 import userInfoForm from '@/components/user-info.vue'
 import {logout} from "@/api/login";
 import * as hospitalApi from "@/api/hospital";
+import * as msgApi from "@/api/sys-message";
 
 const router = useRouter()
 const route = useRoute()
@@ -78,6 +112,10 @@ const hospitals = ref([] as any)
 const menus = ref([] as any)
 const isShowUserInfoDrawer = ref(false)
 const menuActive = ref('/')
+const messageTable = ref([] as any)
+const current = ref(1);
+const size = ref(10);
+const total = ref(0);
 
 router.isReady().then(() => {
   menuActive.value = route.path
@@ -94,6 +132,9 @@ onMounted(() => {
 function init() {
   getHospitalList();
   handleMenu();
+  messageTable.value = [];
+  current.value = 1
+  total.value = 0
 }
 
 function handleMenu() {
@@ -102,6 +143,26 @@ function handleMenu() {
   });
 }
 
+function handleSizeChange() {
+  messageTable.value = [];
+  loadMsg()
+}
+
+function handleCurrentChange() {
+  messageTable.value = [];
+  loadMsg()
+}
+
+async function loadMsg() {
+  const res = await msgApi.page(current.value, size.value)
+  if (res.code == 0) {
+    total.value = res.data.total
+    res.data.records.forEach((row: any) => {
+      messageTable.value.push(row)
+    })
+  }
+}
+
 const menuToPath = (e: any) => {
   menuActive.value = e.path
   router.push(e.path)