menduner/src/views/recruit/personal/PersonalCenter/resume/online/analysis/trainingExperience.vue

<!--  -->
<template>
  <CtForm ref="CtFormRef" :items="items" style="width: 100%;"></CtForm>
</template>

<script setup>
defineOptions({ name: 'resumeAnalysis-trainingExperience'})
import { ref, watch } from 'vue'
const props = defineProps({
  id: {
    type: String,
    default: ''
  },
  data: {
    type: Object,
    default: () => {}
  }
})

const CtFormRef = ref()
const items = ref({
  options: [
    {
      type: 'text',
      key: 'orgName',
      value: '',
      col: 6,
      label: '培训中心 *',
      flexStyle: 'mr-3',
      rules: [v => !!v || '请输入培训中心']
    },
    {
      type: 'text',
      key: 'course',
      value: '',
      col: 6,
      label: '培训课程 *',
      rules: [v => !!v || '请输入培训课程']
    },
    {
      type: 'datePicker',
      key: 'startTime',
      mode: 'month',
      value: '2020-01',
      labelWidth: 140,
      format: 'YYYY/MM',
      defaultValue: new Date(2020, 1),
      label: '培训开始时间 *',
      disabledFutureDates: true,
      col: 6,
      flexStyle: 'mr-3',
      rules: [v => !!v || '请选择培训开始时间']
    },
    {
      type: 'datePicker',
      key: 'endTime',
      mode: 'month',
      value: '2022-01',
      format: 'YYYY/MM',
      labelWidth: 140,
      defaultValue: new Date(2022, 1),
      label: '培训结束时间 *',
      disabledFutureDates: true,
      col: 6,
      rules: [v => !!v || '请选择培训结束时间']
    },
    {
      type: 'textarea',
      key: 'content',
      value: '',
      label: '培训描述',
      rows: 5,
      flexStyle: 'mt-5',
      resize: true,
      counter: 2000,
      rules: [
        value => {
          if (value?.length <= 2000) return true
          return '请输入2-2000个字符'
        }
      ]
    }
  ]
})

watch(
  () => props.data,
  (newVal) => {
    if (newVal && Object.keys(newVal)) {
      items.value.options.forEach(e => {
        if (newVal[e.key]) e.value = newVal[e.key]
      })
    }
  },
  { immediate: true }
)

const submit = async () => {
  const { valid } = await CtFormRef.value.formRef.validate()
  if (!valid) return { id: props.id, data: null}
  const obj = {}
  items.value.options.forEach(e => obj[e.key] = e.value)
  return { id: props.id, data: obj}
}

defineExpose({
  id: props.id,
  submit
})
</script>
<style lang="scss" scoped>
</style>