ISCS_Standard_front/src/views/UiCom/welcomeBar.vue

<script setup lang="ts">
import {useUserStore} from "@/store/modules/user";
import { ref } from "vue"

const { t } = useI18n()
const userStore = useUserStore()
const avatar = userStore.getUser.avatar
const username = userStore.getUser.nickname


// 星期映射
const weekDays = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]

// 获取当前日期
const getToday = () => {
  const now = new Date()
  const year = now.getFullYear()
  const month = now.getMonth() + 1
  const day = now.getDate()
  const week = weekDays[now.getDay()]
  return `${year}年${month}月${day}日，${week}`
}

const todayStr = ref(getToday())

</script>

<template>
  <div class="flex items-center">
    <el-avatar :src="avatar" :size="70" class="mr-16px">
      <img src="../../assets/imgs/avatar.gif" alt="" />
    </el-avatar>
    <div>
      <div class="text-20px">
        {{ t('workplace.welcome') }} {{ username }} {{ t('workplace.happyDay') }}
      </div>
      <div class="mt-10px text-14px text-gray-500">
        {{ todayStr }}
      </div>
    </div>
  </div>
</template>

<style scoped lang="scss">
.items-center{
  background: #fff;
  padding: 20px;
}
</style>