<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { getTmTrainPlan } from '@/api/train/plan.ts'
import { useDict } from '@/common/utils/dict'
import { selectDictLabel } from '@/common/utils/ruoyi'
import { getCompanyName, getDeptName } from '@/common/utils/transcoding'

const { train_type, train_category, train_way, train_cycle, train_examination_targets, train_mode } = useDict(
  'train_type', 'train_category', 'train_way', 'train_cycle', 'train_examination_targets', 'train_mode'
)

const planId = ref('')
const form = reactive({
  trainCompany: '',
  trainName: '',
  trainCycle: '',
  trainStarttime: '',
  trainEndtime: '',
  trainCategory: '',
  trainCourses: '',
  trainMan: '',
  trainParticipants: '',
  trainWay: '',
  trainInfo: '',
  trainMode: '',
  trainRespons: '',
  trainAddress: '',
  trainFee: '',
  trainTargets: ''
})

onLoad((options) => {
  if (options.planId) {
    planId.value = options.planId
    getTmTrainPlan(planId.value).then(res => {
      const data = res.data
      if (!data) return
      
      Object.assign(form, {
        trainType: data.trainType,
        trainCompany: data.trainCompany,
        trainName: data.trainName,
        trainCycle: data.trainCycle,
        trainStarttime: data.trainStarttime,
        trainEndtime: data.trainEndtime,
        trainCategory: data.trainCategory,
        trainCourses: data.trainCourses,
        trainMan: data.trainMan,
        trainParticipants: data.trainParticipants,
        trainWay: data.trainWay,
        trainInfo: data.trainInfo,
        trainMode: data.trainMode,
        trainRespons: data.trainRespons,
        trainAddress: data.trainAddress,
        trainFee: data.trainFee,
        trainTargets: data.trainTargets
      })
    })
  }
})
</script>

<template>
  <view class="container">
    <view class="container__body">
      <view class="container__card">
        <uv-cell-group>
          <uv-cell
            title="培训类别"
            :value="selectDictLabel(train_type, form.trainType) || '暂无信息'"
          />
          <uv-cell
            title="所属公司"
            :value="getCompanyName(form.trainCompany) || '暂无信息'"
          />
          <uv-cell
            title="培训周期"
            :value="selectDictLabel(train_cycle, form.trainCycle) || '暂无信息'"
          />
          <uv-cell
            title="培训方式"
            :value="selectDictLabel(train_mode, form.trainMode) || '暂无信息'"
          />
          <uv-cell
            title="培训负责人"
            :value="form.trainRespons || '暂无信息'"
          />
          <uv-cell
            title="培训地点"
            :value="form.trainAddress || '暂无信息'"
          />
          <uv-cell
            title="培训费"
            :value="form.trainFee || '暂无信息'"
          />
          <uv-cell
            title="培训计划开始时间"
            :value="form.trainStarttime || '暂无信息'"
          />
          <uv-cell
            title="培训计划结束时间"
            :value="form.trainEndtime || '暂无信息'"
          />
          <uv-cell
            title="培训类型"
            :value="selectDictLabel(train_category, form.trainCategory) || '暂无信息'"
          />
          <uv-cell
            title="关联课程"
            :value="form.trainCourses || '暂无信息'"
          />
          <uv-cell
            title="主讲人"
            :value="form.trainMan || '暂无信息'"
          />
          <uv-cell
            title="培训对象"
            :value="selectDictLabel(train_examination_targets, form.trainTargets) || '暂无信息'"
          />
          <uv-cell
            title="培训参与人员"
            :value="form.trainParticipants || '暂无信息'"
          />
          <uv-cell
            title="开展方式"
            :value="selectDictLabel(train_way, form.trainWay) || '暂无信息'"
          />
          <uv-cell
            title="培训信息介绍"
            :value="form.trainInfo || '暂无信息'"
          />
        </uv-cell-group>
      </view>
    </view>
  </view>
</template>

<style lang="scss" scoped>
.container {
  // width: 100%;
  // height: 100vh;
  // overflow: hidden;
  
  // &__body {
  //   padding: 20rpx;
  // }
  
  // &__card {
  //   background-color: #fff;
  //   border-radius: 12rpx;
  //   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1);
  //   padding: 20rpx;
  // }
}
</style>