<template>
  <u-popup
    v-model="props.modelValue"
    mode="bottom"
    length="60%"
    border-radius="15"
    closeable
    @close="close"
  >
    <view class="fill">
      <h3 class="fill-title">填写报名信息</h3>
      <u-form :label-width="240">
        <u-form-item
          v-show="trainItem.fsFillRiding === 'true'"
          label="是否统一乘车"
          prop=""
          ><u-radio-group v-model="form.fillRiding">
            <u-radio
              v-for="(item, index) in radioList"
              :key="index"
              :name="item.name"
              :disabled="item.disabled"
              @change="radioChange($event, 'FIsRiding')"
            >
              {{ item.name }}
            </u-radio>
          </u-radio-group></u-form-item
        >
        <u-form-item
          v-show="trainItem.fisFillArrAngEroom === 'true'"
          label="是否安排单间"
          prop=""
          ><u-radio-group v-model="form.fillArrAngEroom">
            <u-radio
              v-for="(item, index) in radioList"
              :key="index"
              :name="item.name"
              :disabled="item.disabled"
              @change="radioChange($event, 'FIsArrangeRoom')"
            >
              {{ item.name }}
            </u-radio>
          </u-radio-group></u-form-item
        >
        <u-form-item
          v-show="trainItem.fisFillCohabItant === 'true'"
          label="是否需填同住人"
          prop=""
          ><u-radio-group v-model="form.fillCohabItant">
            <u-radio
              v-for="(item, index) in radioList"
              :key="index"
              :name="item.name"
              :disabled="item.disabled"
              @change="radioChange($event, 'FIsCohabit')"
            >
              {{ item.name }}
            </u-radio>
          </u-radio-group>
          <u-input
            v-show="form.fillCohabItant == '是'"
            v-model="saveData.parmeters.Model.F_LQKJ_Entity[0].FCohabitName"
            placeholder="同住人姓名"
          />
        </u-form-item>
        <u-form-item
          v-show="trainItem.fisFillInfo === 'true'"
          label="个人信息"
          prop=""
          ><u-input
            v-model="form.fillInfo"
            type="select"
            @click="selectShow = true"
        /></u-form-item>
        <u-form-item v-if="isFText" label="自定义内容" prop=""
          ><u-input
            v-model="saveData.parmeters.Model.F_LQKJ_Entity[0].FText"
            type="textarea"
        /></u-form-item>
      </u-form>
      <view style="margin-top: 30rpx">
        <u-button @tap="application" type="primary" size="medium"
          >报名</u-button
        >
      </view>
    </view>
  </u-popup>
  <u-select
    v-model="selectShow"
    :list="selectList"
    mode="mutil-column-auto"
    label-name="FDATAVALUE"
    value-name="FNUMBER"
    @confirm="selectConfirm"
  />
</template>

<script setup lang="ts">
import { toast } from "@/utils/util"
import { signUp } from "@/api/trainRegistration"
import { useGlobalStore } from "@/store/useStore"

const globalStore = useGlobalStore()

const props = defineProps({
  modelValue: {
    type: Boolean,
    default: false,
  },
  selectList: {
    type: Array,
    default: [
      { FDATAVALUE: "所属街道", FNUMBER: 0, children: [] },
      { FDATAVALUE: "所属党委", FNUMBER: 1, children: [] },
      { FDATAVALUE: "自定义内容", FNUMBER: 2, children: [] },
    ],
  },
  trainItem: {
    type: Array,
    default: () => [],
  } as any,
  current: Number,
})

const emits = defineEmits(["update:modelValue", "initTrain"])

const selectShow = ref(false)
const form = ref({
  fillInfo: "", // 是否填写个人信息
  fillRiding: "否", // 是否统一乘车
  fillArrAngEroom: "否", // 是否安排单间
  fillCohabItant: "否", // 是否需填同住人
})

const isFText = ref(false)

const radioList = ref([
  {
    name: "是",
    disabled: false,
  },
  {
    name: "否",
    disabled: false,
  },
])

const saveData: any = ref({
  classId: props.trainItem.classId,
  parmeters: {
    IsDeleteEntry: "false",
    Model: {
      FID: 0,
      FTrainingProgram: {
        FNUMBER: props.trainItem.itemNumber, //项目
      },
      FClass: {
        FNUMBER: props.trainItem.classNumber, //班级
      },
      F_LQKJ_Entity: [
        {
          FStudentId: {
            FNUMBER: globalStore.infoData.FNUMBER,
          },
          FGroup: "1",
          FSourceChannel: "",
          FWorkUnit: globalStore.infoData.FWorkUnit1,
          FDuties: globalStore.infoData.FDUTIES,
          FType: "",
          FStreet: {
            FNumber: "",
          },
          FAffiliationDGW: {
            FNumber: "",
          },
          FText: "",
          FIsRiding: false,
          FIsArrangeRoom: false,
          FIsCohabit: false,
          FCohabitName: "",
          FStuClassId: {
            FNUMBER: "",
          },
          FPhoneNmuber: globalStore.infoData.FMOBILE,
        },
      ],
    },
  },
})

const radioChange = (name: string, type: string) => {
  if (name === "是")
    saveData.value.parmeters.Model.F_LQKJ_Entity[0][type] = true
  else {
    if (type == "FIsCohabit") {
      saveData.value.parmeters.Model.F_LQKJ_Entity[0].FCohabitName = ""
    }
    saveData.value.parmeters.Model.F_LQKJ_Entity[0][type] = false
  }
}

const selectConfirm = (val: any) => {
  if (val[0].value === 2) {
    form.value.fillInfo = "自定义内容"
    saveData.value.parmeters.Model.F_LQKJ_Entity[0].FType = "2"
    saveData.value.parmeters.Model.F_LQKJ_Entity[0].FStreet.FNumber = ""
    saveData.value.parmeters.Model.F_LQKJ_Entity[0].FAffiliationDGW.FNumber = ""
    isFText.value = true
  } else {
    isFText.value = false
    saveData.value.parmeters.Model.F_LQKJ_Entity[0].FType = val[0].value
    if (val[0].value) {
      saveData.value.parmeters.Model.F_LQKJ_Entity[0].FStreet.FNumber =
        val[1].value
      saveData.value.parmeters.Model.F_LQKJ_Entity[0].FAffiliationDGW.FNumber =
        ""
    } else {
      saveData.value.parmeters.Model.F_LQKJ_Entity[0].FStreet.FNumber = ""
      saveData.value.parmeters.Model.F_LQKJ_Entity[0].FAffiliationDGW.FNumber =
        val[1].value
    }
    saveData.value.parmeters.Model.F_LQKJ_Entity[0].FText = ""
    form.value.fillInfo = val[0].label + "：" + val[1].label
  }
}

// 报名
const application = async () => {
  const { data: res } = await signUp(saveData.value)
  if (res.code == 200) {
    initTrain()
    toast("报名成功")
    emits("update:modelValue", false)
  }
}

const close = () => {
  isFText.value = false
  emits("update:modelValue", false)
}

const initTrain = () => {
  emits("initTrain", props.current)
}
</script>

<style lang="scss" scoped>
.fill {
  padding: 30rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  .fill-title {
    position: sticky;
    top: 3%;
  }
  .fill-item {
    display: flex;
    width: 100%;
    margin-top: 5%;
  }
}

.u-form {
  width: 100%;
}
</style>
