<template>
  <view class="card-shadow bg-white rounded-19rpx p-base space-y-10rpx" @click="goPath">
    <view class="text-30rpx">补卡申请</view>
    <view class="text-24rpx text-hex-999999 flex">
      <view class="text-24rpx w-140rpx">补卡原因：</view>
      <view class="">{{ item.reason }}</view>
    </view>
    <view class="text-24rpx text-hex-999999 flex">
      <view class="text-24rpx w-140rpx">补卡类别：</view>
      <view class="">{{ item.sign_time == 1 ? "上班打卡" : "下班打卡" }}</view>
    </view>
    <view class="flex items-center text-hex-999999 flex">
      <view class="text-24rpx w-140rpx"> 补卡时间：</view>
      <view class="text-24rpx">{{ valueFormat }}</view>
    </view>
    <view
      :style="{
        color: statusFun(item.workflow_check.check_status, 'workflow_check', 'color')
      }"
      class="text-24rpx"
      >{{ statusFun(item.workflow_check.check_status, "workflow_check", "name") }}</view
    >
  </view>
</template>
<script setup>
import statusFun from "@/utils/status"
import { computed } from "vue"
import { timeFormat } from "@climblee/uv-ui/libs/function/index"
const props = defineProps({
  item: Object
})
const valueFormat = computed(() => {
  return timeFormat(props.item.date, "yyyy-mm-dd hh:MM")
})
const goPath = () => {
  uni.navigateTo({
    url: `/pages/make-card/detail?id=${props.item.id}`
  })
}
</script>
