<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>
      <scroll-view style="max-height: 760rpx" :scroll-y="true">
        <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"
              placeholder="请选择个人信息"
              @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-item
            v-show="trainItem.FIdCardCheckBox === 'true'"
            label="证件类型"
            prop=""
            ><u-input
              v-model="form.idCard"
              type="select"
              placeholder="请选择证件类型"
              @click="selectShow1 = true"
          /></u-form-item>
          <u-form-item v-if="form.idCard" label="证件类型" prop=""
            ><u-input
              v-model="saveData.parmeters.Model.F_LQKJ_Entity[0].FIdcard"
              :placeholder="`请输入${
                form.idCard === '港澳同胞回乡证'
                  ? '港澳同胞回乡证'
                  : '居民身份证'
              }`"
          /></u-form-item>
        </u-form>
      </scroll-view>
      <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"
  />
  <u-select
    v-model="selectShow1"
    :list="selectList1"
    label-name="FDATAVALUE"
    value-name="FNUMBER"
    @confirm="selectConfirm1"
  />
</template>

<script setup lang="ts">
import { toast } from "@/utils/util";
import { signUp } from "@/api/trainRegistration";
import { useStudentStore } from "@/stores/modules/studentStore";

const globalStore = useStudentStore();

const props = defineProps({
  modelValue: {
    type: Boolean,
    default: false,
  },
  selectList: {
    type: Array,
    default: [
      { FDATAVALUE: "所属街道", FNUMBER: 0, children: [] },
      { FDATAVALUE: "所属党委", FNUMBER: 1, children: [] },
      { FDATAVALUE: "自定义内容", FNUMBER: 2, children: [] },
    ],
  },
  selectList1: {
    type: Array,
    default: [
      { FDATAVALUE: "居民身份证", FNUMBER: 0 },
      { FDATAVALUE: "港澳同胞回乡证", FNUMBER: 1 },
    ],
  },
  trainItem: {
    type: Array,
    default: () => [],
  } as any,
  current: Number,
});

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

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

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: "",
          FIdcardType: "",
          FIdcard: "",
          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 === 0 || val[0].value === 1) {
      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 selectConfirm1 = (val: any) => {
  form.value.idCard = val[0].label;
  saveData.value.parmeters.Model.F_LQKJ_Entity[0].FIdcardType;
};

// 报名
const application = async () => {
  const { FStreet, FIdcard, FText } =
    saveData.value.parmeters.Model.F_LQKJ_Entity[0];
  if (
    !isFText.value &&
    !FStreet.FNumber &&
    props.trainItem.fisFillInfo === "true"
  )
    return toast("请选择个人信息");
  if (isFText.value && !FText) return toast("请填写个人信息自定义内容");
  if (!form.value.idCard) return toast("请选择证件类型");
  if (!FIdcard && form.value.idCard) return toast("证件号不能为空");
  if (!uniA.$u.test.idCard(FIdcard) && form.value.idCard === "居民身份证")
    return toast("居民身份证格式不正确");
  console.log(saveData.value.parmeters.Model.F_LQKJ_Entity[0]);

  const { data: res }: any = 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>
