30 lines
1.3 KiB
Vue
30 lines
1.3 KiB
Vue
|
<script setup>
|
|||
|
import TmImage from "@/uni_modules/tmui/components/tm-image/tm-image.vue";
|
|||
|
import {useAuth} from "@/store/auth";
|
|||
|
import { useClockIn } from "@/store/clockIn/index.js";
|
|||
|
const {userInfo}=useAuth()
|
|||
|
const {workingTimeInfoData,actionTypeData} = useClockIn()
|
|||
|
</script>
|
|||
|
<template>
|
|||
|
<div class="flex-shrink-0 pl-[16rpx] pr-[40rpx] flex items-center rounded-[8rpx] w-[686rpx] h-[154rpx] bg-white">
|
|||
|
<div class="rounded-full overflow-hidden w-[96rpx] h-[96rpx]">
|
|||
|
<tm-image preview :width="96" :height="96" :src="userInfo.Avatar"></tm-image>
|
|||
|
</div>
|
|||
|
<div class="ml-[20rpx]">
|
|||
|
<div class="flex items-center">
|
|||
|
<div class="text-[32rpx] text-black">{{ userInfo.NickName }}</div>
|
|||
|
<div class="mx-[14rpx] h-[30rpx] w-[1rpx] bg-[#F7F7F7]"></div>
|
|||
|
<div class="w-[40rpx] h-[40rpx]">
|
|||
|
<img v-if="actionTypeData.isWorkDay ===1" class="w-[40rpx] h-[40rpx]" src="@/static/image/clockIn/zu3275@3x.png" alt="">
|
|||
|
<img v-else class="w-[40rpx] h-[40rpx]" src="@/static/image/clockIn/rest3275@2x.png" alt="">
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
<div class="mt-[5rpx] flex">
|
|||
|
<div class="text-[24rpx] text-[#999999]">{{ workingTimeInfoData.WorkTimeTemplateName }}</div>
|
|||
|
<div class="text-[#46299D] text-[24rpx]">(考勤规则)</div>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
<slot name="right"></slot>
|
|||
|
</div>
|
|||
|
</template>
|