初始化

2024-01-30 09:30:56 +08:00
parent a38cfb023d
commit ff582f261b
213 changed files with 37514 additions and 4 deletions
@@ -0,0 +1,162 @@
+<template>
+  <div class="home">
+    <!-- 用户信息 -->
+    <el-row :gutter="15">
+      <el-col :md="24" :lg="24" :xl="24" 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" />
+            </div>
+            <div class="user-item-right overflow">
+              <el-row>
+                <el-col :span="24" class="right-title mb15 one-text-overflow"
+                  >{{ currentTime }}，{{ userInformation.name }}，{{ 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>
+                  </el-col>
+                  <el-col :xs="12" :sm="12" :md="16" class="right-l-v">
+                    <div class="right-label">身份：</div>
+                    <div class="right-value">
+                      {{ identity }}
+                    </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>
+                  </el-col>
+                </el-col>
+                <el-col :span="24" class="mt15">
+                  <el-button size="small" icon="el-icon-edit-outline"
+                    >修改信息
+                  </el-button>
+                  <el-button size="small" icon="el-icon-position" type="primary"
+                    >发布活动</el-button
+                  >
+                </el-col>
+              </el-row>
+            </div>
+          </div>
+        </el-card>
+      </el-col>
+      <!-- 消息通知 -->
+      <!-- <el-col :md="24" :lg="8" :xl="8" class="mb15">
+        <el-card shadow="hover">
+          <div slot="header">
+            <span>{{ $t("message.card.title2") }}</span>
+            <el-button class="home-card-more" type="text" @click="onOpenGitee">{{
+              $t("message.card.title3")
+            }}</el-button>
+          </div>
+          <div class="info">
+            <Scroll
+              :data="newsInfoList"
+              class="info-scroll"
+              :class-option="optionSingleHeight"
+            >
+              <ul class="info-ul">
+                <li
+                  v-for="(v, k) in newsInfoList"
+                  :key="k"
+                  class="info-item"
+                  @click="onNewsInfoListClick(v)"
+                >
+                  <div class="info-item-left" v-text="v.title"></div>
+                  <div class="info-item-right" v-text="v.date"></div>
+                </li>
+              </ul>
+            </Scroll>
+          </div>
+        </el-card>
+      </el-col> -->
+    </el-row>
+  </div>
+</template>
+
+<script>
+import Scroll from "vue-seamless-scroll";
+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 },
+  data() {
+    return {
+      newsInfoList,
+      userInfo: {},
+      dailyMessage: {},
+      // 返回的用户信息
+      userInformation: {
+        roleList: [{ name: "" }],
+      },
+    };
+  },
+  created() {
+    this.requestToObtainUserInformations();
+    this.initDailyMessage();
+  },
+  computed: {
+    currentTime() {
+      return formatAxis(new Date());
+    },
+    identity() {
+      return this.userInformation.roleList[0].name;
+    },
+    optionSingleHeight() {
+      return {
+        singleHeight: 28,
+        limitMoveNum: 8,
+        waitTime: 2000,
+      };
+    },
+    getUserInfos() {
+      return Session.get("setUserInfosDD");
+    },
+  },
+  mounted() {},
+  methods: {
+    // 随机语录
+    initDailyMessage() {
+      this.dailyMessage = dailyMessage[Math.floor(Math.random() * dailyMessage.length)];
+    },
+
+    // 消息通知当前项点击
+    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("获取信息失败");
+      }
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+@import "./index.scss";
+</style>