EmploymentSite/h5app/src/views/pages/jobhunt/edit.vue

<template>
  <ion-page class="list-page">
    <ion-header class="header-theme2">
      <ion-toolbar>
        <ion-buttons slot="start">
          <ion-icon :icon="arrowBackOutline" @click="onBack" style="padding-left:10px;width:24px;height:24px;"></ion-icon>
        </ion-buttons>
        <ion-title>求职人员信息登记</ion-title>
      </ion-toolbar>
    </ion-header>
    <ion-content>
      <div class="stepFlex">
        <div v-for="(record,key) in stepList" :key="key" class="stepFlex-item">
          <div
              :class="[(record.val < curStepData?.statusVal || curStepData?.statusVal == stepList.val) ? 'greenCircle' :record.val == curStepData?.statusVal ? 'now' : 'grayCircle']"></div>
          <div v-if="key !== stepList.length - 1"
               :class="[record.val < curStepData?.statusVal ? 'greenLine' : 'grayLine']"></div>
          <div class="stepFlex-item-label">
            <p class="stepFlex-item-label-title" @click="onPathRedirect(record.val)">{{ record.title }}</p>
            <!--<p class="stepFlex-item-label-desc"  @click="onPathRedirect(record.val)">{{ record.desc }}</p>-->
          </div>
        </div>
      </div>

      <form autocomplete="off">
        <div class="bw-vue-form">
          <ion-list  v-if="curStepData.statusVal==1">
            <div class="form-title">基本信息</div>
            <div class="form-input">
            <ion-label>姓名<span class="danger">*</span></ion-label>
            <ion-input name="name" id="name" class="custom" :clear-input="true"
                     placeholder="请输入姓名" v-model="baseData.name" >
            </ion-input>
<!--              <ion-note slot="error">姓名不能为空</ion-note>-->
            </div>
            <div class="form-input">
              <ion-label>公民身份号码</ion-label>
              <ion-input name="identityNumber" id="identityNumber"  class="custom" :clear-input="true"
                     placeholder="请输入身份证号码" v-model="baseData.identityNumber" ></ion-input>
            </div>
            <div class="form-input">
              <ion-label>出生日期<span class="danger">*</span></ion-label>
              <div class="dateTimeBox">
                <ion-datetime-button datetime="birthDay"></ion-datetime-button>
                <ion-modal :keep-contents-mounted="true">
                  <ion-datetime name="birthDay" id="birthDay" placeholder="日期"
                                v-model="baseData.birthDay" :prefer-wheel="true"
                                dataformatas="YYYY-MM-DD" presentation="date" cancel-text="取消" done-text="确定"
                                :show-default-buttons="true">
                  </ion-datetime>
                </ion-modal>
              </div>
            </div>
            <div class="form-select">
              <ion-label>性别<span class="danger">*</span></ion-label>
              <ion-select name="sex" id="sex" okText="确定" cancelText="取消" v-model="baseData.sex"
                          interface="action-sheet"  placeholder="请选择性别" style="width:100%;text-align:left;" >
                <ion-select-option v-for="(it,key) in genderList" :key="key" :value="it.value">
                  {{ it.name }}
                </ion-select-option>
              </ion-select>
            </div>
            <div class="form-input">
             <ion-label>联系电话<span class="danger">*</span></ion-label>
             <ion-input name="userMobile" id="userMobile"  style="text-align: left;" class="custom" :clear-input="true"
                       placeholder="请输入联系电话" v-model="baseData.userMobile" ></ion-input>
            <!--              <ion-note slot="error">联系电话不能为空</ion-note>-->
            </div>
            <!--            <div class="form-select">-->
            <!--              <ion-label>所属驿站<span class="danger">*</span></ion-label>-->
            <!--              <ion-select disabled name="siteID"  id="siteID" okText="确定" cancelText="取消" v-model="baseData.siteID"-->
            <!--                          interface="action-sheet" placeholder="请选择所属驿站"  style="width:100%;text-align:left;">-->
            <!--                <ion-select-option v-for=" (it,key) in siteInfoList" :key="key" :value="it.value">-->
            <!--                  {{ it.text }}-->
            <!--                </ion-select-option>-->
            <!--              </ion-select>-->
            <!--              &lt;!&ndash;          <ion-note slot="error">所属驿站不能为空</ion-note>&ndash;&gt;-->
            <!--            </div>-->
            <ion-label style="padding-left: 10px;">所在街道/社区/镇村<span class="danger">*</span></ion-label>
            <div class="form-select">
              <ion-select disabled name="regionCode"  id="regionCode" okText="确定" cancelText="取消" v-model="baseData.regionCode"
                          interface="action-sheet" placeholder="请选择常住市/县" style="width:50%;float:left;"
                          @ionChange="regionChange()">
                <ion-select-option v-for="(it,key) in regionList" :key="key" :value="it.code">
                  {{ it.name }}
                </ion-select-option>
              </ion-select>
              <ion-select interface="action-sheet" placeholder="请选择街道/社区/镇村" cancel-text="取消"
                          id="streetCode" v-model="baseData.streetCode" style="width: 50%;float: left;">
                <ion-select-option v-for="(record,key) in streetList" :key="key"
                                   v-model:value="record.code">
                  {{ record.name }}
                </ion-select-option>
              </ion-select>
            </div>
<!--            <div class="form-select">-->
            <!--              <ion-label>常住市/县<span class="danger">*</span></ion-label>-->
<!--              <ion-select disabled name="regionCode"  id="regionCode" okText="确定" cancelText="取消" v-model="baseData.regionCode"-->
            <!--                          interface="action-sheet" placeholder="请选择常住市/县" style="width:100%;text-align:left;" @ionChange="regionChange()" >-->
<!--                <ion-select-option v-for=" (it,key) in regionList" :key="key" :value="it.code">-->
<!--                  {{ it.name }}-->
<!--                </ion-select-option>-->
<!--              </ion-select>-->
<!--            </div>-->
<!--            <div class="form-select">-->
<!--              <ion-label>所在街道<span class="danger">*</span></ion-label>-->
<!--              <ion-select name="streetCode"  id="streetCode" okText="确定" cancelText="取消" v-model="baseData.streetCode"-->
<!--                          interface="action-sheet" placeholder="请选择镇/街" style="width:100%;text-align:left;">-->
<!--                <ion-select-option v-for=" (it,key) in streetList" :key="key" :value="it.code">-->
<!--                  {{ it.name }}-->
<!--                </ion-select-option>-->
<!--              </ion-select>-->
<!--            </div>-->
            <div class="form-input">
              <ion-label>常住地址<span class="danger">*</span></ion-label>
              <ion-input name="address" id="address"  style="text-align: left;"  class="custom" :clear-input="true"
                         placeholder="请输入常住地址" v-model="baseData.address"></ion-input>
<!--          <ion-note slot="error">地址不能为空</ion-note>-->
            </div>
            <div class="form-select">
              <ion-label>就业状态<span class="danger">*</span></ion-label>
              <ion-select name="jobStatusID"  id="jobStatusID" okText="确定" cancelText="取消" v-model="baseData.jobStatusID"
                      interface="action-sheet" placeholder="请选择就业状态"  style="width:100%;text-align:left;" >
                <ion-select-option v-for=" (it,key) in jobUserStatusList" :key="key" :value="it.value">{{ it.name }}</ion-select-option>
              </ion-select>
                <!--          <ion-note slot="error">就业状态不能为空</ion-note>-->
            </div>
            <div class="form-select">
              <ion-label>重点人员类别<span class="danger">*</span></ion-label>
              <ion-select name="keyPersonTypeID"  id="keyPersonTypeID" okText="确定" cancelText="取消" v-model="baseData.keyPersonTypeID"
                          interface="action-sheet" placeholder="请选择重点人员类别" style="width:100%;text-align:left;">
                <ion-select-option v-for=" (it,key) in keyPersonTypeList" :key="key" :value="it.value">
                  {{ it.name }}
                </ion-select-option>
              </ion-select>
              <!--          <ion-note slot="error">重点人员类别不能为空</ion-note>-->
            </div>
            <div class="form-select">
              <ion-label>人员类别<span class="danger">*</span></ion-label>
              <ion-select name="ordinaryPersonTypeID" id="ordinaryPersonTypeID" okText="确定" cancelText="取消"
                          v-model="baseData.ordinaryPersonTypeID"
                          interface="action-sheet" placeholder="请选择人员类别" @ionChange="ordinaryPersonTypeChange"
                          style="width:100%;text-align:left;">
                <ion-select-option v-for="(it,key) in ordinaryPersonTypeList" :key="key" :value="it.value">
                  {{ it.name }}
                </ion-select-option>
              </ion-select>
            </div>
            <div style="width:100%;overflow: hidden;height: 30px;"></div>
            <div class="form-title">
              大学基本信息
              <div style="float: right;">
                <ion-label style="color: red;font-size: 14px;" @click="dxExpand=!dxExpand">{{
                    dxExpand ? "收起" : "展开"
                  }}
                </ion-label>
              </div>
            </div>
            <div v-if="dxExpand">
              <div class="form-input">
                <ion-label>毕业院校<span v-show="isGraduating" class="danger">*</span></ion-label>
                <ion-input name="finishSchool" id="finishSchool" style="text-align: left;" class="custom"
                           :clear-input="true"
                           placeholder="请输入毕业院校" v-model="baseData.finishSchool"></ion-input>
              </div>
              <div class="form-select">
                <ion-label>是否非全日制</ion-label>
                <ion-select name="isFullTime" id="isFullTime" okText="确定" cancelText="取消"
                            v-model="baseData.isFullTime"
                            interface="action-sheet" placeholder="请选择是否非全日制"
                            style="width:100%;text-align:left;">
                  <ion-select-option v-for="(it,key) in isFullTimeList" :key="key" :value="it.value">
                    {{ it.name }}
                  </ion-select-option>
                </ion-select>
              </div>
              <div class="form-input">
                <ion-label>专业</ion-label>
                <ion-input name="professionID" id="profession" style="text-align: left;" class="custom"
                           :clear-input="true"
                           placeholder="请输入专业" v-model="baseData.profession"></ion-input>
              </div>
              <div class="form-input">
                <ion-label>学制(年)<span v-show="isGraduating" class="danger">*</span></ion-label>
                <ion-input type="number" :min="0" name="educationalSystem" id="educationalSystem"
                           style="text-align: left;" class="custom" @ion-blur="educationalSystemBlur"
                           placeholder="请输入学制" v-model="baseData.educationalSystem"></ion-input>
              </div>
              <div class="form-input">
                <ion-label>毕业日期<span v-show="isGraduating" class="danger">*</span></ion-label>
                <div class="dateTimeBox">
                  <ion-datetime-button datetime="showFinishDate"
                                       style="position:absolute;left:10px;"></ion-datetime-button>
                  <ion-modal :keep-contents-mounted="true">
                    <ion-datetime name="showFinishDate" id="showFinishDate" v-model="baseData.showFinishDate"
                                  dataformatas="YYYY-MM-DD" presentation="month-year" cancel-text="取消"
                                  done-text="确定"
                                  :show-default-buttons="true" @ionChange="finishDateChange()">
                    </ion-datetime>
                  </ion-modal>
                </div>
              </div>
              <div style="width:100%;overflow: hidden;height: 30px;"></div>
              <div class="form-select">
                <ion-label>困难状况</ion-label>
                <ion-select name="difficultSituationID" id="difficultSituationID" okText="确定" cancelText="取消"
                            v-model="baseData.difficultSituationID"
                            interface="action-sheet" placeholder="请选择困难状况"
                            style="width:100%;text-align:left;">
                  <ion-select-option v-for="(it,key) in difficultSituationList" :key="key" :value="it.value">
                    {{ it.name }}
                  </ion-select-option>
                </ion-select>
              </div>
              <div class="form-input">
                <ion-label>入学前户口所在地</ion-label>
                <ion-input name="esHouseholdRegistration" id="esHouseholdRegistration" style="text-align: left;"
                           class="custom"
                           :clear-input="true"
                           placeholder="请输入入学前户口所在地" v-model="baseData.esHouseholdRegistration"></ion-input>
              </div>
            </div>
            <div style="width:100%;overflow: hidden;height: 30px;"></div>
        <div class="form-title">
          其他信息
          <div style="float: right;">
            <ion-label style="color: red;font-size: 14px;" @click="expand=!expand">{{expand?"收起":"展开"}}</ion-label>
          </div>
        </div>
        <div v-if="expand">
          <div class="form-input">
            <ion-label>社会保障卡号</ion-label>
            <ion-input name="socialSecurityCard" id="socialSecurityCard"  style="text-align: left;"  class="custom" :clear-input="true"
                       placeholder="请输入社会保障卡号" v-model="baseData.socialSecurityCard" ></ion-input>
          </div>
          <div class="form-select">
          <ion-label>政治面貌</ion-label>
            <ion-select name="politicsStatusID"  id="politicsStatusID" okText="确定" cancelText="取消" v-model="baseData.politicsStatusID"
                        interface="action-sheet" placeholder="请选择政治面貌" style="width:100%;text-align:left;" >
              <ion-select-option v-for=" (it,key) in politicsStatusList" :key="key" :value="it.value">
                {{ it.name }}
              </ion-select-option>
            </ion-select>
          </div>
          <div class="form-select">
            <ion-label>民族</ion-label>
            <ion-select name="nationID"  id="nationID" okText="确定" cancelText="取消" v-model="baseData.nation"
                        interface="action-sheet" placeholder="请选择民族" style="width:100%;text-align:left;" >
              <ion-select-option v-for=" (it,key) in nationTypeList" :key="key" :value="it.value">
                {{ it.name }}
              </ion-select-option>
            </ion-select>
          </div>
          <div class="form-input">
            <ion-label>职业资格类别</ion-label>
            <div>
              <ion-input placeholder="请选择职业资格类别" label-placement="stacked" style="float: left;width:78%;"
                         v-model="baseData.occupationalCategoryName" class="custom" readonly >
              </ion-input>
              <ion-item style="width:22%;float: right;padding:0px;margin: 0px;">
                <category-selection  :OccupationalID="baseData.occupationalCategory" @SetOccupationalID="onSetOccupationalID"></category-selection>
              </ion-item>
            </div>
          </div>
          <div class="form-select">
            <ion-label>职业资格等级</ion-label>
            <ion-select name="occupationalLevel"  id="occupationalLevel" okText="确定" cancelText="取消" v-model="baseData.occupationalLevel"
                        interface="action-sheet" placeholder="请选择职业资格类别" style="width:100%;text-align:left;" >
              <ion-select-option v-for=" (it,key) in occupationalLevelList" :key="key" :value="it.value">
                {{ it.name }}
              </ion-select-option>
            </ion-select>
          </div>
          <div class="form-input">
            <ion-label>籍贯</ion-label>
            <ion-input name="nativePlace" id="nativePlace"  style="text-align: left;" class="custom" :clear-input="true"
                       v-model="baseData.nativePlace" placeholder="请输入籍贯" ></ion-input>
          </div>
          <div class="form-input">
            <ion-label>出生地</ion-label>
            <ion-input name="birthPlace" id="birthPlace" style="text-align: left;" class="custom" :clear-input="true"
                       v-model="baseData.birthPlace" placeholder="请输入出生地"></ion-input>
          </div>
          <div style="width:100%;overflow: hidden;height: 30px;"></div>
          <div class="form-select">
            <ion-label>户口性质</ion-label>
            <ion-select name="familyNatureID"  id="familyNatureID" okText="确定" cancelText="取消" v-model="baseData.familyNatureID"
                        interface="action-sheet" placeholder="请选择户口性质" style="width:100%;text-align:left;">
              <ion-select-option v-for=" (it,key) in familyNatureList" :key="key" :value="it.value">
                {{ it.name }}
              </ion-select-option>
            </ion-select>
          </div>
          <div class="form-select">
          <ion-label>最高学历</ion-label>
            <ion-select name="cultureRank"  id="cultureRank" okText="确定" cancelText="取消" v-model="baseData.cultureRank"
                        interface="action-sheet" placeholder="请选择最高学历" style="width:100%;text-align:left;">
              <ion-select-option v-for=" (it,key) in cultureRankList" :key="key" :value="it.value">
                {{ it.name }}
              </ion-select-option>
            </ion-select>
          </div>
          <div class="form-select">
            <ion-label>健康状况</ion-label>
            <ion-select name="healthID"  id="healthID" okText="确定" cancelText="取消" v-model="baseData.healthID"
                        interface="action-sheet" placeholder="请选择健康状况" style="width:100%;text-align:left;">
              <ion-select-option v-for=" (it,key) in userHealthList" :key="key" :value="it.value">
                {{ it.name }}
              </ion-select-option>
            </ion-select>
          </div>
<!--          <div class="form-select">-->
<!--            <ion-label>血型</ion-label>-->
<!--            <ion-select name="bloodTypeID"  id="bloodTypeID" okText="确定" cancelText="取消" v-model="baseData.bloodTypeID"-->
<!--                        interface="action-sheet" placeholder="请选择血型" style="width:100%;text-align:left;">-->
<!--              <ion-select-option v-for=" (it,key) in bloodTypeList" :key="key" :value="it.value">-->
<!--                {{ it.name }}-->
<!--              </ion-select-option>-->
<!--            </ion-select>-->
<!--          </div>-->
          <div class="form-input">
            <ion-label>身高(cm)</ion-label>
            <ion-input name="height" id="height"  style="text-align: left;"  class="custom" :clear-input="true"
                       placeholder="请输入身高" v-model="baseData.height" ></ion-input>
          </div>
          <div class="form-input">
            <ion-label>视力</ion-label>
            <ion-input name="vision" id="vision"  style="text-align: left;" class="custom" :clear-input="true"
                       placeholder="如5.0" v-model="baseData.vision" ></ion-input>
          </div>
          <div class="form-input">
            <ion-label>体重(kg)</ion-label>
            <ion-input name="weight" id="weight"  style="text-align: left;" class="custom" :clear-input="true"
                       placeholder="请输入体重" v-model="baseData.weight" ></ion-input>
          </div>
          <div class="form-select">
            <ion-label>婚姻状况</ion-label>
            <ion-select name="maritalStatusID"  id="maritalStatusID" okText="确定" cancelText="取消" v-model="baseData.maritalStatusID"
                        interface="action-sheet" placeholder="请选择婚姻状况" style="width:100%;text-align:left;">
              <ion-select-option v-for=" (it,key) in maritalStatusList" :key="key" :value="it.value">
                {{ it.name }}
              </ion-select-option>
            </ion-select>
          </div>
<!--      <div class="form-select">
            <ion-label>省份</ion-label>
            <ion-select name="provinceCode"  id="provinceCode" okText="确定" cancelText="取消" v-model="baseData.provinceCode"
                        interface="action-sheet" placeholder="请选择省份" style="width:100%;text-align:left;" @change="provinceChange()" >
              <ion-select-option v-for=" (it,key) in provinceList" :key="key" :value="it.value">
                {{ it.name }}
              </ion-select-option>
            </ion-select>
          </div>-->

          <div class="form-input">
            <ion-label>联系人员</ion-label>
            <ion-input name="userName" id="userName"  style="text-align: left;" class="custom" :clear-input="true"
                       placeholder="请输入联系人员" v-model="baseData.userName" ></ion-input>
          </div>
<!--          <div class="form-input">-->
<!--            <ion-label>邮政编码</ion-label>-->
<!--            <ion-input name="birthPlace" id="postalCode" style="text-align: left;" class="custom" :clear-input="true"-->
<!--                       placeholder="请输入邮政编码" v-model="baseData.postalCode"></ion-input>-->
<!--          </div>-->
          <div class="form-input">
            <ion-label>电子邮箱</ion-label>
            <ion-input name="email" id="email"  style="text-align: left;" class="custom" :clear-input="true"
                       placeholder="请输入电子邮箱" v-model="baseData.email" ></ion-input>
          </div>
          <div class="form-input">
            <ion-label>户籍详细地址</ion-label>
            <ion-textarea name="familyAddress" id="familyAddress"  class="custom" rows="4"
                          placeholder="请输入户籍详细地址" v-model="baseData.familyAddress"
                          style="border-bottom: 1px solid #fff2e8;"></ion-textarea>
          </div>
          <div class="form-input">
            <ion-label>个人评价</ion-label>
            <ion-textarea name="hobby" id="hobby"  class="custom" rows="4"
                          placeholder="请输入个人评价" v-model="baseData.hobby"
                          style="border-bottom: 1px solid #fff2e8;"></ion-textarea>
          </div>
          <div class="form-input">
            <ion-label>个人技能</ion-label>
            <ion-textarea name="personalSkills" id="personalSkills" class="custom" rows="4"
                          placeholder="请输入个人技能" v-model="baseData.personalSkills"
                          style="border-bottom: 1px solid #fff2e8;"></ion-textarea>
          </div>
          <div class="form-input">
            <ion-label>标签</ion-label>
            <ion-row>
              <ion-col size="auto" v-for="(itemLabel,keyLabel) in baseData.listLabel" :key="keyLabel">
                <ion-button color="primary" size="small">{{ itemLabel.labelName }}</ion-button>
              </ion-col>
              <ion-col>
                <ion-item style="float: right;padding:0px;margin: 0px;">
                  <label-selection :big-type="2" :list-label="baseData.listLabel" :title="'人员标签'"
                                   @resultBack="onResultBackLabels"></label-selection>
                </ion-item>
              </ion-col>
            </ion-row>
          </div>
          <div class="form-input">
            <ion-label>
              图片上传
            </ion-label>
            <b-image v-if="baseData.jobUserID" :file-ref-id="baseData.jobUserID" :readonly="false"
                     :is-single="false"></b-image>
          </div>
        </div>
      </ion-list>

          <ion-list  v-if="curStepData.statusVal==2" >
            <div class="form-title">
              教育经历
              <ion-icon :icon="addCircleOutline"  class="iconBtn" style="float:right;"
                        @click="onPathForward('./educationEdit',null,null,null, null,2)"></ion-icon>
            </div>
            <div class="bw-vue-list">
              <div class="list-content" v-if="!loading">
                <ion-list>
                  <div v-for="(record,key) in educationList" :key="key" >
                    <ion-item-sliding>
                      <ion-item detail @click="onPathForward('./educationEdit',record.educationID,null,null, null,2)">
                        <ion-label>
                          <h2>{{record.schoolName}}</h2>
                          <p>{{dayjs(record.schoolTime).format("YYYY-MM-DD")}}至{{dayjs(record.overTime).format("YYYY-MM-DD")}}</p>
                        </ion-label>
                      </ion-item>
                      <ion-item-options>
                        <ion-item-option color="danger" @click="setDelAlertOpen(true, record.educationID)">
                          <ion-icon :icon="trashOutline"></ion-icon>
                        </ion-item-option>
                      </ion-item-options>
                    </ion-item-sliding>
                  </div>
                </ion-list>
              </div>
            </div>
            <b-empty v-if="educationList.length==0"  :loading="loading" />
          </ion-list>

          <ion-list  v-if="curStepData.statusVal==3" >
            <div class="form-title">
              工作经验
              <ion-icon :icon="addCircleOutline"  class="iconBtn" style="float:right;"
                        @click="onPathForward('./experienceEdit',null,null,null, null,3)"></ion-icon>
            </div>
            <div class="bw-vue-list">
              <div class="list-content" v-if="!loading">
                <ion-list>
                  <div v-for="(record,key) in experienceList" :key="key">
                    <ion-item-sliding>
                      <ion-item detail @click="onPathForward('./experienceEdit',null,record.experienceID,null,null,3)">
                        <ion-label>
                          <h2>{{record.workAddress}}</h2>
                          <p>{{dayjs(record.startTime).format("YYYY-MM-DD")}}至{{dayjs(record.endTime).format("YYYY-MM-DD")}}</p>
                        </ion-label>
                      </ion-item>
                      <ion-item-options>
                        <ion-item-option color="danger" @click="setDelAlertOpen(true, record.experienceID)">
                          <ion-icon :icon="trashOutline"></ion-icon>
                        </ion-item-option>
                      </ion-item-options>
                    </ion-item-sliding>
                  </div>
                </ion-list>
              </div>
            </div>
            <b-empty v-if="experienceList.length==0"  :loading="loading" />
          </ion-list>

          <ion-list  v-if="curStepData.statusVal==4">
            <div class="form-title">
              求职意向
              <ion-icon :icon="addCircleOutline"  class="iconBtn" style="float:right;"
                        @click="onPathForward('./jobHuntEdit',null,null,null,null,4)"></ion-icon>
            </div>
            <div class="bw-vue-list">
              <div class="list-content" v-if="!loading">
                <ion-list>
                  <div v-for="(record,key) in jobHuntList" :key="key">
                    <ion-item-sliding>
                      <ion-item detail @click="onPathForward('./jobHuntEdit',null,null,record.jobHuntID,null,4)">
                        <ion-label>
                          <h2>{{record.professionName}}</h2>
                          <p>期望薪资：{{record.minSalary}}-{{record.maxSalary}}</p>
                        </ion-label>
                      </ion-item>
                      <ion-item-options>
                        <ion-item-option color="danger" @click="setDelAlertOpen(true, record.jobHuntID)">
                          <ion-icon :icon="trashOutline"></ion-icon>
                        </ion-item-option>
                      </ion-item-options>
                    </ion-item-sliding>
                  </div>
                </ion-list>
              </div>
            </div>
            <b-empty  v-if="jobHuntList.length==0"  :loading="loading" />
          </ion-list>

          <ion-list v-if="curStepData.statusVal==5">
            <div class="form-title">
              个人荣誉
              <ion-icon :icon="addCircleOutline" class="iconBtn" style="float:right;"
                        @click="onPathForward('./honorEdit',null,null,null,null,5)"></ion-icon>
            </div>
            <div class="bw-vue-list">
              <div class="list-content" v-if="!loading">
                <ion-list>
                  <div v-for="(record,key) in honorList" :key="key">
                    <ion-item-sliding>
                      <ion-item detail @click="onPathForward('./honorEdit',null,null,null, record.honorID,5)">
                        <ion-label>
                          <h2>{{ record.honorName }}</h2>
                          <p>获得时间：{{ dayjs(record.getTime).format("YYYY-MM-DD") }}</p>
                        </ion-label>
                      </ion-item>
                      <ion-item-options>
                        <ion-item-option color="danger" @click="setDelAlertOpen(true, record.honorID)">
                          <ion-icon :icon="trashOutline"></ion-icon>
                        </ion-item-option>
                      </ion-item-options>
                    </ion-item-sliding>
                  </div>
                </ion-list>
              </div>
            </div>
            <b-empty v-if="jobHuntList.length==0" :loading="loading"/>
          </ion-list>
        <!--<ion-refresher pulling-text="下拉刷新" @ionRefresh="onRefresh"></ion-refresher>-->
        <ion-infinite-scroll v-if="curStepData.statusVal!=1" threshold="100px" @ionInfinite="onScroll($event)">
          <ion-infinite-scroll-content
              :loadingText="pageParams.total>pageParams.pageIndex*pageParams.pageSize?'正在加载...':'暂无更多'"
              loadingSpinner="bubbles">
          </ion-infinite-scroll-content>
        </ion-infinite-scroll>
        </div>
      </form>
    </ion-content>
    <ion-footer>
      <ion-toolbar>
          <ion-button style="width: 100%;" @click="onSave" v-if="curStepData.statusVal==1">保存并下一步</ion-button>
        <div v-if="curStepData.statusVal!=1" >
          <ion-button style="width: 48%;float:left;margin-left: 1%;" @click="onBack" >上一步</ion-button>
          <ion-button style="width: 48%;margin-right: 1%;" @click="onSave" v-if="curStepData.statusVal!=5">下一步
          </ion-button>
          <ion-button style="width: 48%;margin-right: 1%;" @click="onFinish" v-if="curStepData.statusVal==5">完 成
          </ion-button>
        </div>

      </ion-toolbar>
    </ion-footer>

    <ion-alert
        :is-open="delAlertOpen"
        header="删除确认"
        message="确定要删除该信息吗？"
        :buttons="delAlertButtons"
        @didDismiss="setDelAlertOpen(false, null)"
    ></ion-alert>

    <ion-alert
        :is-open="infoAlertOpen"
        :header="infoAlterData.title"
        :message="infoAlterData.message"
        :buttons="infoAlertButtons"
        @didDismiss="setInfoAlertOpen(false)"
    ></ion-alert>
    <ion-loading
        :is-open="delLoading"
        message="删除中..."
        @didDismiss="setDelLoadingOpen(false)" >
    </ion-loading>
  </ion-page>
</template>
<script lang="ts">
import {arrowBackOutline,addCircleOutline,trashOutline} from 'ionicons/icons';
import {reactive,defineComponent, computed,watch,ref,toRefs} from "vue";
import {post, postByDataAndParams} from "@/api/common";
import {useRoute, useRouter} from "vue-router";
import {required} from "@vuelidate/validators";
import {useVuelidate} from "@vuelidate/core";
import {getRegionCodeList,getStreetCodeList} from "@/api/system/area";
import {getJobUserById,baseInfoSave} from "@/api/jobUserInfo";
import {getEducationListByJobUserID} from "@/api/education";
import {getExperienceListByJobUserID} from "@/api/experience";
import {getJobHuntListByJobUserID} from "@/api/jobHuntInfo";
import {getSiteDataList} from "@/api/siteInfo";
import {getSysDictionaryList} from '@/api/system/dictionary';
import {alertController, onIonViewDidEnter} from "@ionic/vue";
import dayjs from "dayjs";
import {useUserStore} from "@/store/modules/user";
import CategorySelection from "@/components/ocCategorySelection.vue";
import {getPosition} from "@/utils/position";
import LabelSelection from "@/components/labelSelection.vue";
import crtyptoHelp from "@/utils/crypto";
import BImage from "@/components/bImage.vue";
import {getHonorListByJobUserID} from "@/api/honor/honor";

interface SelectProps {
  name: string,
  value: string
}
interface StepParams{
  name: string,
  statusVal: number
}

interface BaseData {
  baseData: {
    jobUserID: any,
    loginUserID: any,
    siteID: any,
    name: any,
    identityNumber: any,
    sex: any,
    userMobile: any,
    address: any,
    jobStatusID: any,
    keyPersonTypeID: any,
    politicsStatusID: any,
    birthPlace: any,
    birthDay: any,
    familyNatureID: any,
    cultureRank: any,
    healthID: any,
    height: any,
    vision: any,
    weight: any,
    maritalStatusID: any,
    provinceCode: any,
    regionCode: any,
    streetCode: any,
    userName: any,
    familyAddress: any,
    postalCode: any,
    email: any,
    hobby: any,
    personalSkills: any,
    socialSecurityCard: any,
    finishSchool: any,
    finishDate: any,
    showFinishDate: any,
    profession: any,
    nativePlace: any,
    isFullTime: any,
    occupationalCategory: any,
    occupationalCategoryName: any,
    occupationalLevel: any,
    longitude: any,
    latitude: any,
    listLabel: any,
    ordinaryPersonTypeID: any,
    educationalSystem: any,
    difficultSituationID: any,
    esHouseholdRegistration: any,
  }
}
export default defineComponent({
  name: 'jobUserEdit',
  components: {BImage, CategorySelection, LabelSelection},
  setup() {
    const userStore = useUserStore();
    const userInfo = ref(userStore.getUserInfo);

    const router = useRouter();
    const route = useRoute();
    const isAllowCommit = ref(true);
    const expand = ref<boolean>(false);
    const dxExpand = ref<boolean>(false);
    const loading = ref(true);
    const siteInfoList = ref<SelectProps[]>([]);
    const curStepData = ref<StepParams>({
      name:"",
      statusVal: 1
    });
    const stepList = ref([
        {title: '基础信息', desc: '个人基础信息', val: 1},
        {title: '教育经历', desc: '完善教育经历', val: 2},
        {title: '工作经验', desc: '完善工作经验', val: 3},
        {title: '求职意向', desc: '个人求职意向', val: 4},
      {title: '个人荣誉', desc: '完善个人荣誉', val: 5},
    ]);
    const genderList = ref<SelectProps[]>([]);
    const jobUserStatusList = ref<SelectProps[]>([]);
    const keyPersonTypeList = ref<SelectProps[]>([]);
    const ordinaryPersonTypeList = ref<SelectProps[]>();
    const cultureRankList = ref<SelectProps[]>([]);
    const userHealthList = ref<SelectProps[]>([]);
    const bloodTypeList  = ref<SelectProps[]>([]);
    const maritalStatusList  = ref<SelectProps[]>([]);
    const provinceList  = ref<SelectProps[]>([{name:'广东省',value:'440000000000000'}]);
    const nationTypeList  = ref<SelectProps[]>([]);
    const isFullTimeList  = ref<SelectProps[]>([]);
    //const occupationalCategoryList  = ref<SelectProps[]>([]);
    const occupationalLevelList  = ref<SelectProps[]>([]);
    const difficultSituationList = ref<SelectProps[]>();
    const familyNatureList = ref([]);
    const politicsStatusList = ref([]);
    const regionList  = ref<SelectProps[]>([]);
    const streetList  = ref<SelectProps[]>([]);
    const educationList = ref([]);
    const experienceList = ref([]);
    const jobHuntList = ref([]);
    const honorList = ref([]);
    const isEdit =ref(false);
    const baseInfoData = reactive<BaseData>({
      baseData:{
        jobUserID:null,
        loginUserID:'',
        siteID:null,
        name:null,
        identityNumber: null,
        sex: 1,
        userMobile: null,
        address: null,
        jobStatusID: null,
        keyPersonTypeID: null,
        politicsStatusID:null,
        birthPlace:null,
        birthDay:dayjs().format("YYYY-MM-DD"),
        familyNatureID:null,
        cultureRank:null,
        healthID:null,
        //bloodTypeID:null,
        height:null,
        vision:null,
        weight:null,
        maritalStatusID:null,
        provinceCode:null,
        regionCode:null,
        streetCode:null,
        userName:null,
        familyAddress:null,
        postalCode:null,
        email:'',
        hobby:null,
        personalSkills:null,
        socialSecurityCard:"",
        finishSchool:null,
        finishDate:"",
        showFinishDate:dayjs().format('YYYY-MM-DD'),
        profession:null,
        nativePlace:null,
        isFullTime:null,
        occupationalCategory:null,
        occupationalCategoryName:null,
        occupationalLevel: null,
        longitude: null,
        latitude: null,
        listLabel: null,
        ordinaryPersonTypeID: null,
        educationalSystem: null,
        difficultSituationID: null,
        esHouseholdRegistration: null,
      }});
    const pageParams = reactive({
      pageIndex: 1,
      pageSize: 5,
      total:0,
      jobUserID:''
    });
    const baseDataRule = computed(()=>{
      return {baseData:{
          regionCode:{required},
          streetCode:{required},
          name:{required},
          birthDay: {required},
          sex:{required},
          userMobile:{required},
          address:{required},
          jobStatusID:{required},
          keyPersonTypeID:{required},
        }}
    });
    const baseDataValid = useVuelidate(baseDataRule,baseInfoData);

    // 删除警告弹窗开关
    const delAlertOpen = ref(false);

    // 删除数据
    const delID = ref("");
    const postUrl = ref("jobUserService/education/deleteEducation");
    const actionName = ref("删除教育经历信息");
    // 删除加载
    const delLoading = ref(false);
    // 信息弹窗开关
    const infoAlertOpen = ref(false);
    // 删除警告弹窗按钮定义
    const infoAlertButtons = [
      {
        text: '确定',
        role: 'confirm',
        handler: () => {
          reload(baseInfoData.baseData.jobUserID,curStepData.value.statusVal);
        },
      },
    ];
    // 设置要删除的教育经历
    function setDelAlertOpen(value: boolean, id: any) {
      delAlertOpen.value = value;
      if(id != null) {
        delID.value = id;
      }
    }
    // 设置信息提示弹窗开关
    function setInfoAlertOpen(value: boolean) {
      infoAlertOpen.value = value;
    }
    // 设置删除弹窗开启关闭
    function setDelLoadingOpen(value: boolean) {
      delLoading.value = value;
    }
    // 信息弹窗内容
    const infoAlterData = reactive({
      title:"",
      message:""
    });

    // 删除警告弹窗按钮定义
    const delAlertButtons = [
      {
        text: '取消',
        role: 'cancel',
        handler: () => {
           console.log("取消了删除");
        },
      },
      {
        text: '确定',
        role: 'confirm',
        handler: () => {
          delLoading.value = true;
          postUrl.value = "jobUserService/education/deleteEducation";
          actionName.value = "删除教育经历";
          if(curStepData.value.statusVal!=2){
            postUrl.value = curStepData.value.statusVal==3 ?"jobUserService/experience/deleteExperience":"jobUserService/jobHunt/delete";
            actionName.value = curStepData.value.statusVal==3 ?"删除工作经验":"删除求职意向";
          }
          const param = {
            loginUserID: userInfo.value.userID
          }
          postByDataAndParams(postUrl.value, [delID.value], curStepData.value.statusVal == 4 ? param : {}, actionName.value).then((res) => {
            /*infoAlterData.title = "提示";
            infoAlterData.message = "删除成功";
            setInfoAlertOpen(true);*/
          }).finally(()=>{
            delLoading.value = false;
            reload(baseInfoData.baseData.jobUserID,curStepData.value.statusVal);
          });
        },
      },
    ];
    const presentAlert = async (message: string) => {
      const alert = await alertController.create({
        header: '错误！',
        message: message,
        buttons: [
          '确定'
        ],
      });

      await alert.present();
    }

    const onResultBackLabels = (data: any) => {
      baseInfoData.baseData.listLabel = data;
    }

    const onBack = () => {
      curStepData.value.statusVal-=1;
      if(curStepData.value.statusVal > 0){
        router.push({path:"./edit", query: {reload:0,educationID:null,jobHuntID:null,jobUserID: baseInfoData.baseData.jobUserID,status:curStepData.value.statusVal}});
      }else{
        router.push("./list");
      }
    }

    const inputDataValidate = () =>{
      isAllowCommit.value = true;
      const identReg = /^[1-9]\d{5}(18|19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[1-2][0-9]|3[0-1])\d{3}([0-9Xx])$/;
      if (baseInfoData.baseData.identityNumber) {
        if(!identReg.test(baseInfoData.baseData.identityNumber)){
          presentAlert("输入的身份证号码有误!");
          isAllowCommit.value = false;
        }else{
          // 计算身份证校验码
          const weights = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
          const checkCode = ['1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2'];
          let sum = 0;
          for(let i = 0; i<weights.length;i++){
            sum += weights[i] * parseInt(String(baseInfoData.baseData.identityNumber).substring(i,i+1));
          }
          if(String(baseInfoData.baseData.identityNumber).substring(17,18)!=checkCode[sum%11]){
            presentAlert("输入的身份证号码有误!");
            console.log("lastOne",checkCode[sum%11]);
            isAllowCommit.value = false;
          }
        }

      }
      const mobileReg = /^1[3|4|5|6|7|8|9]\d{9}$/;
      if(baseInfoData.baseData.userMobile != null){
        if(!mobileReg.test(baseInfoData.baseData.userMobile)){
          presentAlert("输入的联系电话有误!");
          isAllowCommit.value = false;
        }
      }
      const emailReg = /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/;
      if(baseInfoData.baseData.email!=""&&baseInfoData.baseData.email!=null){
        if(!emailReg.test(baseInfoData.baseData.email)){
          presentAlert("输入的电子邮箱有误!");
          isAllowCommit.value = false;
        }
      }
    };

    const onSetOccupationalID = (data: any)=>{
      baseInfoData.baseData.occupationalCategory = data.value;
      baseInfoData.baseData.occupationalCategoryName = data.text;
    }

    const onSave = async function (){
      console.log(baseInfoData.baseData)
      if (curStepData.value.statusVal==1){
        const isFormCorrect = await baseDataValid.value.$validate();
        if(isGraduating.value&&baseInfoData.baseData.finishDate==null){
          await presentAlert("请选择毕业日期！");
          return null;
        }
        if (isGraduating.value && baseInfoData.baseData.educationalSystem == null) {
          await presentAlert("请输入学制！");
          return null;
        }
        if (isGraduating.value && baseInfoData.baseData.finishSchool == null) {
          await presentAlert("请输入毕业院校！");
          return null;
        }
        if(!isFormCorrect){
            await presentAlert("请填写完整的信息！");
            return null;
        }
        inputDataValidate();
        if(isAllowCommit.value){
          console.log("当前数据",baseInfoData.baseData);
          const userMobile = baseInfoData.baseData.userMobile;
          const identityNumber = baseInfoData.baseData.identityNumber;
          baseInfoData.baseData.userMobile = crtyptoHelp.encryptDesText(userMobile);
          baseInfoData.baseData.identityNumber = crtyptoHelp.encryptDesText(identityNumber);
          baseInfoSave(baseInfoData.baseData).then(result => {
            if (result) {
              router.push({path: './edit', query: {reload:0,jobUserID: baseInfoData.baseData.jobUserID,status:2}});
            }
          }, () => {
            baseInfoData.baseData.userMobile = userMobile;
            baseInfoData.baseData.identityNumber = identityNumber;
          });
        }
      }
      else if (curStepData.value.statusVal==2){
         await router.push({path: './edit', query: {reload:0,jobUserID: baseInfoData.baseData.jobUserID,status:3}});
      }else if (curStepData.value.statusVal==3){
        await router.push({path: './edit', query: {reload:0,jobUserID: baseInfoData.baseData.jobUserID,status:4}});
      } else if (curStepData.value.statusVal == 4) {
        await router.push({path: './edit', query: {reload: 0, jobUserID: baseInfoData.baseData.jobUserID, status: 5}});
      }
    }

    const onPathForward = (pathValue: string, educationIDValue: any, experienceIDValue: any, jobHuntIDValue: any, honorIDValue: any, statusValue: any) => {
      router.push({
        path: pathValue,
        query: {
          reload: 1,
          educationID: educationIDValue,
          experienceID: experienceIDValue,
          jobHuntID: jobHuntIDValue,
          honorID: honorIDValue,
          jobUserID: baseInfoData.baseData.jobUserID,
          status: statusValue,
          isEdit: isEdit.value == true ? 1 : 0
        }
      });
    }
    const onPathRedirect = (statusValue:any)=>{
      if(isEdit.value) router.push({path: './edit', query: {reload:0,jobUserID: baseInfoData.baseData.jobUserID,status:statusValue}});
    }


    const onScroll = (e: any) => {
        setTimeout(() => {
          e.target.complete();
          if (pageParams.total > pageParams.pageIndex * pageParams.pageSize) {
            pageParams.pageSize += 5;
            loadData(pageParams.jobUserID,curStepData.value.statusVal);
          }
        }, 500);
    }

    const onFinish = () => {
      router.push("./list");
    }

    /*下拉字典查询*/
    const getSelectorDataList = async function(){
      const genderResult :any = await getSysDictionaryList("Gender");
      genderList.value = genderResult;
      const jobUserStatusResult :any = await getSysDictionaryList("JobStatus");
      jobUserStatusList.value = jobUserStatusResult;
      const keyPersonTypeResult :any = await getSysDictionaryList("KeyPersonType");
      keyPersonTypeList.value = keyPersonTypeResult;
      const ordinaryPersonTypeResult: any = await getSysDictionaryList("OrdinaryPersonType");
      ordinaryPersonTypeList.value = ordinaryPersonTypeResult;
      const cultureRankResult :any = await getSysDictionaryList("HighestDegree");
      cultureRankList.value = cultureRankResult;
      const userHealthResult :any = await getSysDictionaryList("Health");
      userHealthList.value = userHealthResult;
      const bloodTypeResult :any = await getSysDictionaryList("BloodType");
      bloodTypeList.value = bloodTypeResult;
      const maritalStatusResult :any = await getSysDictionaryList("MaritalStatus");
      maritalStatusList.value = maritalStatusResult;
      const politicsStatusResult :any = await getSysDictionaryList("PoliticsStatus");
      politicsStatusList.value = politicsStatusResult;
      const familyNatureResult :any = await getSysDictionaryList("FamilyNature");
      familyNatureList.value = familyNatureResult;
      const nationTypeListResult :any = await getSysDictionaryList("NationType");
      nationTypeList.value = nationTypeListResult;
      const isFullTimeListResult :any = await getSysDictionaryList("IsFullTime");
      isFullTimeList.value = isFullTimeListResult;
      const difficultSituationResult: any = await getSysDictionaryList("DifficultSituation");
      difficultSituationList.value = difficultSituationResult;
      //const occupationalCategoryListResult :any = await getSysDictionaryList("OccupationalCategory");
      //occupationalCategoryList.value = occupationalCategoryListResult;
      const occupationalLevelListResult :any = await getSysDictionaryList("OccupationalLevel");
      occupationalLevelList.value = occupationalLevelListResult;
    }

    const getSiteInfoList = async function(){
      const siteInfoResult :any = await getSiteDataList();
      siteInfoList.value = siteInfoResult;
    }
    const getRegionList = async function(){
      const regionResult: any = await getRegionCodeList();
      regionList.value = regionResult;
    }
    const getStreetList = async function(){
      if (baseInfoData.baseData.regionCode != null){
        const streetResult: any = await getStreetCodeList(baseInfoData.baseData.regionCode);
        streetList.value = streetResult;
      }
    }
    const finishDateChange = function(){
      baseInfoData.baseData.finishDate = baseInfoData.baseData.showFinishDate.substring(0,7);
      console.log(baseInfoData.baseData.finishDate);
    }
    const isGraduating = ref(false); // 大学基础信息是否为必填
    const ordinaryPersonTypeChange = function () {
      // 如果是应届高校毕业生，则大学基础信息部分字段为必填
      isGraduating.value = baseInfoData.baseData.ordinaryPersonTypeID == 2;
      dxExpand.value = isGraduating.value;
    }

    const regionChange = async function(){
      baseInfoData.baseData.streetCode = null;
      await getStreetList();
    }
    const provinceChange = async function(){
      baseInfoData.baseData.regionCode = null;
      await getRegionList();
      await regionChange();
    }
    const educationalSystemBlur = function () {
      if (baseInfoData.baseData.educationalSystem != null) {
        baseInfoData.baseData.educationalSystem = Math.floor(baseInfoData.baseData.educationalSystem);
      }
    }

    const loadData = async (jobUserID: any,status:any) => {
      loading.value = true;
      pageParams.jobUserID = jobUserID;
      baseInfoData.baseData.jobUserID = jobUserID;
      curStepData.value.statusVal = status;
      const loginUserInfo = useUserStore().getUserInfo;
      const curUserID = loginUserInfo.userID == undefined?"":loginUserInfo.userID;
      //console.log("当前jobUserID",jobUserID);
      if(curStepData.value.statusVal==1){
        const reqData = await getJobUserById(jobUserID,curUserID,true);
        isEdit.value = jobUserID != null;
        baseInfoData.baseData = reqData;
        if (!reqData.birthDay) {
          baseInfoData.baseData.birthDay = dayjs().format('YYYY-MM-DD');
        }
        baseInfoData.baseData.userMobile = crtyptoHelp.decryptDesText(baseInfoData.baseData.userMobile);
        baseInfoData.baseData.identityNumber = crtyptoHelp.decryptDesText(baseInfoData.baseData.identityNumber);
        baseInfoData.baseData.loginUserID = curUserID;
        if(baseInfoData.baseData.keyPersonTypeID==2){
          isGraduating.value = true;
        }
        console.log('初始化baseData',baseInfoData.baseData);
        await getStreetList();
      }
      else if(curStepData.value.statusVal==2){
        const reqData :any = await getEducationListByJobUserID(pageParams);
        educationList.value = reqData.list;
        pageParams.total = reqData.total;
        //console.log("educationList",educationList.value);
      }
      else if(curStepData.value.statusVal==3){
        const reqData = await getExperienceListByJobUserID(pageParams);
        experienceList.value= reqData.list;
        pageParams.total = reqData.total;
        //console.log("experienceList",experienceList.value);
      }
      else if(curStepData.value.statusVal==4){
        const reqData = await getJobHuntListByJobUserID(pageParams);
        jobHuntList.value= reqData.list;
        pageParams.total = reqData.total;
        //console.log("jobHuntList",jobHuntList.value);
      } else if (curStepData.value.statusVal == 5) {
        await getHonorListByJobUserID(jobUserID).then((result: any) => {
          honorList.value = result;
          pageParams.total = result.length;
        })
      }
      if (jobUserID == null) {
        setLongitudeLatitude();
      }
      loading.value = false;
    };

    watch(() => route.query, () => {
      if (route.query.reload) {
        loadData(route.query.jobUserID,route.query.status);
      }
    });

    watch(() => baseInfoData.baseData.identityNumber, () => {
      if(baseInfoData.baseData.identityNumber != null && String(baseInfoData.baseData.identityNumber).length == 18){
        const identReg = /^[1-9]{1}[0-9]{14}$|^[1-9]{1}[0-9]{16}([0-9]|[xX])$/;
        if(identReg.test(baseInfoData.baseData.identityNumber)){
          const birthDayStr = String(baseInfoData.baseData.identityNumber).substring(6,14);
          const sexStr = String(baseInfoData.baseData.identityNumber).substring(16,17);
          baseInfoData.baseData.sex = parseInt(sexStr)%2 == 0 ? 2 : 1; //双女单男
          baseInfoData.baseData.birthDay = dayjs(birthDayStr).format("YYYY-MM-DD");
        }
      }
    });

    const reload = (jobUserID:any,status:any) => {
      pageParams.pageIndex = 1;
      dxExpand.value = false;
      expand.value = false;
      loadData(jobUserID,status);
    }

    // 设置经纬度
    function setLongitudeLatitude() {
      getPosition().then((data: any) => {
        console.log(data);
        if (data.longitude != null && data.latitude != null) {
          baseInfoData.baseData.longitude = data.longitude;
          baseInfoData.baseData.latitude = data.latitude;
        }
      })
    }

    onIonViewDidEnter(() => {
      if (route.query.reload)
        reload(route.query.jobUserID,route.query.status);
    });

    return {
      ...toRefs(baseInfoData),
      arrowBackOutline,
      addCircleOutline,
      trashOutline,
      route,
      router,
      isEdit,
      expand,
      dxExpand,
      loading,
      stepList,
      curStepData,
      baseDataValid,
      siteInfoList,
      genderList,
      nationTypeList,
      isFullTimeList,
      //occupationalCategoryList,
      occupationalLevelList,
      familyNatureList,
      politicsStatusList,
      pageParams,
      jobUserStatusList,
      keyPersonTypeList,
      ordinaryPersonTypeList,
      difficultSituationList,
      cultureRankList,
      userHealthList,
      bloodTypeList,
      maritalStatusList,
      provinceList,
      regionList,
      streetList,
      educationList,
      experienceList,
      jobHuntList,
      delID,
      delAlertButtons,
      infoAlertButtons,
      delAlertOpen,
      infoAlertOpen,
      delLoading,
      infoAlterData,
      isGraduating,
      honorList,
      finishDateChange,
      ordinaryPersonTypeChange,
      provinceChange,
      regionChange,
      onSetOccupationalID,
      onResultBackLabels,
      onSave,
      onBack,
      onFinish,
      onScroll,
      onPathForward,
      onPathRedirect,
      loadData,
      reload,
      setDelAlertOpen,
      setInfoAlertOpen,
      setDelLoadingOpen,
      getSiteInfoList,
      getSelectorDataList,
      getRegionList,
      getStreetList,
      dayjs,
      educationalSystemBlur
    }
  },
  mounted(){
    this.getSiteInfoList();
    this.getSelectorDataList();
    this.getRegionList();
    this.getStreetList();
  }
});
</script>
<style lang="less">
ion-select#sex.md.select-disabled.legacy-select::after{display: none;}
ion-select#siteID.md.select-disabled.legacy-select::after{display: none;}
ion-select#regionCode.md.select-disabled.legacy-select::after{display: none;}
.custom{
  --placeholder-color: gray;
  --placeholder-opacity: 0.5;
}

.title-item{
  margin-left: 15px;
  color:#1c3d70 !important;
  font-size: 14px !important;
  font-weight: bold;
}

.next-btn {
  width: 80px;
  border-radius: 5px;
  background-color:#3a7be0;
  color: #363432;
  font-size: 14px;
}

.iconBtn{
  width:24px;
  height:24px;
}

.stepFlex {
  margin: 0;
  display: flex;
  width: 100%;

  .stepFlex-item {
    position: relative;
    flex: 1;
    text-align: center;
    margin-top: -10px;

    .stepFlex-item-label {
      padding-top: 30px;
      font-size: 14px;

      .stepFlex-item-label-title{
        margin-top:30px;
      }

      .stepFlex-item-label-desc{
        margin-top:5px;color: #b9b9bd;
      }
    }
  }

  .greenCircle {
    top: calc(50% - 15px);
    left: calc(50% - 4px);
    position: absolute;
    z-index: 2;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #31A2FE;
  }

  .now {
    top: calc(50% - 18px);
    left: calc(50% - 8px);
    position: absolute;
    z-index: 3;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: #31A2FE;
    border: 4px solid #c5e8f9;
  }

  .grayCircle {
    top: calc(50% - 15px);
    left: calc(50% - 4px);
    position: absolute;
    z-index: 2;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #ccc;
  }

  .greenLine {
    width: 100%;
    top: calc(50% - 11px);
    left: calc(50% - 2px);
    height: 2px;
    background-color: #31A2FE;
    position: absolute;
  }

  .grayLine {
    height: 0;
    border: 1px dashed #ccc;
    width: 100%;
    top: calc(50% - 11px);
    left: calc(50% - 2px);
    position: absolute;
  }
}

.dateTimeBox {
  width: 100%;
  display: flex;
  margin-top: 5px;
  justify-content: space-between;
  align-content: center;
}
</style>