1

src/views/home/index.vue

@@ -2,38 +2,40 @@
   <div class="home">
     <!-- 用户信息 -->
     <el-row :gutter="15">
-      <el-col :md="24" :lg="24" :xl="24" class="mb15">
+      <el-col :md="24" :lg="16" :xl="16" class="mb15">
         <el-card shadow="hover">
           <div slot="header">
             <span>{{ $t("message.card.title1") }}</span>
           </div>
           <div class="user-item">
             <div class="user-item-left">
-              <img :src="userInformation.avatar" />
+              <img :src="getUserInfos.photo" />
             </div>
             <div class="user-item-right overflow">
               <el-row>
                 <el-col :span="24" class="right-title mb15 one-text-overflow"
-                  >{{ currentTime }}，{{ userInformation.name }}，{{ dailyMessage }}
+                  >{{ currentTime }}，{{ getUserInfos.userName }}，{{ dailyMessage }}
                 </el-col>
                 <el-col :span="24">
                   <el-col :xs="12" :sm="12" :md="8" class="right-l-v">
                     <div class="right-label">昵称：</div>
-                    <div class="right-value">{{ userInformation.name }}</div>
+                    <div class="right-value">小柒</div>
                   </el-col>
                   <el-col :xs="12" :sm="12" :md="16" class="right-l-v">
                     <div class="right-label">身份：</div>
                     <div class="right-value">
-                      {{ identity }}
+                      {{ userInfo.userName === "admin" ? "超级管理" : "普通用户" }}
                     </div>
                   </el-col>
                 </el-col>
                 <el-col :span="24" class="mt5">
                   <el-col :xs="12" :sm="12" :md="8" class="right-l-v">
-                    <div class="right-label one-text-overflow">电话：</div>
-                    <div class="right-value one-text-overflow">
-                      {{ userInformation.mobile }}
-                    </div>
+                    <div class="right-label one-text-overflow">IP：</div>
+                    <div class="right-value one-text-overflow">192.168.1.1</div>
+                  </el-col>
+                  <el-col :xs="12" :sm="12" :md="16" class="right-l-v">
+                    <div class="right-label one-text-overflow">时间：</div>
+                    <div class="right-value one-text-overflow">{{ userInfo.time }}</div>
                   </el-col>
                 </el-col>
                 <el-col :span="24" class="mt15">
@@ -49,8 +51,7 @@
           </div>
         </el-card>
       </el-col>
-      <!-- 消息通知 -->
-      <!-- <el-col :md="24" :lg="8" :xl="8" class="mb15">
+      <el-col :md="24" :lg="8" :xl="8" class="mb15">
         <el-card shadow="hover">
           <div slot="header">
             <span>{{ $t("message.card.title2") }}</span>
@@ -78,18 +79,18 @@
             </Scroll>
           </div>
         </el-card>
-      </el-col> -->
+      </el-col>
     </el-row>
+    <div>{{ $t("message.card.title1") }}</div>
   </div>
 </template>
 
 <script>
 import Scroll from "vue-seamless-scroll";
+import { CountUp } from "countup.js";
 import { Session } from "@/utils/storage";
 import { formatAxis, formatDate } from "@/utils/formatTime";
 import { newsInfoList, dailyMessage } from "./mock";
-import { useLoginApi } from "@/api/login";
-const LoginApi = useLoginApi();
 export default {
   name: "home",
   components: { Scroll },
@@ -98,23 +99,16 @@ export default {
       newsInfoList,
       userInfo: {},
       dailyMessage: {},
-      // 返回的用户信息
-      userInformation: {
-        roleList: [{ name: "" }],
-      },
     };
   },
   created() {
-    this.requestToObtainUserInformations();
+    this.initUserInfo();
     this.initDailyMessage();
   },
   computed: {
     currentTime() {
       return formatAxis(new Date());
     },
-    identity() {
-      return this.userInformation.roleList[0].name;
-    },
     optionSingleHeight() {
       return {
         singleHeight: 28,
@@ -123,7 +117,7 @@ export default {
       };
     },
     getUserInfos() {
-      return Session.get("setUserInfosDD");
+      return this.$store.state.userInfos.userInfos;
     },
   },
   mounted() {},
@@ -132,26 +126,22 @@ export default {
     initDailyMessage() {
       this.dailyMessage = dailyMessage[Math.floor(Math.random() * dailyMessage.length)];
     },
-
+    // 初始化登录信息
+    initUserInfo() {
+      if (!Session.get("userInfo")) return false;
+      this.userInfo = Session.get("userInfo");
+      this.userInfo.time = formatDate(
+        new Date(this.userInfo.time),
+        "YYYY-mm-dd HH:MM:SS"
+      );
+    },
     // 消息通知当前项点击
     onNewsInfoListClick(v) {
       window.open(v.link);
     },
     // 跳转到 gitee
     onOpenGitee() {
-      window.open("https://www.baidu.com/");
-    },
-    // 获取登录信息
-    async requestToObtainUserInformations() {
-      try {
-        let res = await LoginApi.requestToObtainUserInformation();
-        console.log(res.data);
-        this.userInformation = res.data;
-        // 存储钉钉用户信息到浏览器缓存
-        Session.set("userInfoDD", res.data);
-      } catch (error) {
-        Message.error("获取信息失败");
-      }
+      window.open("https://gitee.com/lyt-top/vue-next-admin");
     },
   },
 };