<script setup lang="ts" name="DetailDisciplinary">
import { ref } from 'vue'
import { useRouter } from 'vue-router'
import MyAvatar from '@/component/Avatar/MyAvatar.vue'
import UploadImage from '@/component/Upload/UploadImage.vue'
import { selectDictLabel } from '@/common/utils/ruoyi'
// import { getDeptName, getPostName } from '@/common/utils/transcoding'

/* 员工详情 */
const emit = defineEmits<{
  back: []
}>()
const props = defineProps<{
  detail: any
  disciplinary_type: any
}>()

const router = useRouter()
const activeCollapse = ref('1')
function onBack() {
  emit('back')
}

// 预览
function onPreview() {
  router.push({ path: '/preview', query: { fileUrl: props.detail.value.file.url } })
}
</script>

<template>
  <div class="container float-bottom">
    <div class="container__card flex">
      <van-cell title="工号" :value="props.detail?.employeeNumber ?? '-'" />
      <van-cell title="姓名" :value="props.detail?.name ?? '-'" />
      <van-cell title="奖惩金额" :value="props.detail?.amount ?? '-'" />
      <van-cell title="奖惩分数" :value="props.detail?.scores ?? '-'" />
      <van-cell title="部门" :value="props.detail?.department ?? '-'" />
      <van-cell title="岗位" :value="props.detail?.position ?? '-'" />
      <van-cell title="奖惩类型">
        <DictTag
          plain
          :options="props.disciplinary_type"
          :value="props.detail?.type" />
      </van-cell>
      <van-button class="button-default float-bottom" type="default" @click="onBack">返回</van-button>
    </div>
  </div>
</template>

<style lang="less" scoped>
.container {
  position: relative;
  padding: 0;
  &.float-bottom {
    padding-bottom: calc(1.8rem + var(--float-button-height)) !important;
  }
}
:deep(.van-cell:not(.van-collapse-item__title)) {
  .van-cell__title {
    margin-right: 1rem;
    flex: none;
  }
  .van-cell__value {
    display: flex;
    justify-content: flex-end;
    color: var(--van-cell-text-color);
    overflow: hidden;
    span {
      text-align: justify;
    }
  }
}

:deep(.tag-label) {
  font-size: 1.4rem;
}

.cell-top {
  display: flex;
  align-items: center;
  &-content {
    margin-left: 1.8rem;
    &-name {
      font-size: 1.6rem;
    }
  }
}

.cv-log-item {
  margin-top: 1.2rem;
  margin-bottom: 1.6rem;
  padding: var(--container-pd);
  border-radius: 24rpx;
  box-shadow: 0 4rpx 40rpx  rgba(64, 103, 251, 0.14);
  color: #333;
  font-size: 1.4rem;
  &-row {
    display: flex;
    margin-top: 0.2rem;
    > span:nth-child(1) {
      width: 6rem;
    }
    > span:nth-child(2) {
      flex: 1;
      overflow: hidden;
    }
  }
}
.button-default {
  position: absolute;
  &.float-bottom {
    margin-bottom: 0;
  }
}
</style>
