index.vue 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701
  1. <template>
  2. <div class="fenghui">
  3. <!-- <div class="swith">
  4. <div class="title" @click="showLange = true">
  5. {{ langObjT[langType] }}
  6. <van-icon name="arrow-down" />
  7. </div>
  8. <van-popup v-model:show="showLange" destroy-on-close round position="bottom">
  9. <van-picker :model-value="[langType]" :columns="langObj" @cancel="showLange = false"
  10. @confirm="langChange" />
  11. </van-popup>
  12. </div> -->
  13. <van-image style="width: 100%;" :src="soundbyteJpg" />
  14. <br />
  15. <van-form @submit="onSubmit">
  16. <div class="submit">
  17. <van-cell-group inset>
  18. <!-- <h4 class="title" v-text="lang[langType].basicInformation"></h4> -->
  19. <!-- 姓名 -->
  20. <van-field label-width="7em" size="large"
  21. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].nameContent }]" required
  22. v-model="from.name" :label="lang[langType].name" :placeholder="lang[langType].nameContent" />
  23. <!-- 拼音 -->
  24. <van-field label-width="7em" size="large"
  25. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].pinyinContent }]"
  26. v-model="from.pinyin" :label="lang[langType].pinyin" required
  27. :placeholder="lang[langType].pinyinContent" />
  28. <!-- 性别 -->
  29. <van-field label-width="7em" size="large"
  30. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].genderContent }]"
  31. v-model="from.gender" :label="lang[langType].gender" required
  32. :placeholder="lang[langType].genderContent" />
  33. <!-- 手机号 -->
  34. <van-field label-width="7em" size="large"
  35. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].genderContent }]"
  36. v-model="from.contact" :label="lang[langType].contact" type="number" required
  37. :placeholder="lang[langType].contactContent" />
  38. <!-- 邮箱 -->
  39. <van-field label-width="7em" size="large"
  40. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].emailContent }]" required
  41. v-model="from.email" :label="lang[langType].email" :placeholder="lang[langType].emailContent" />
  42. <!-- 工作单位 -->
  43. <van-field label-width="7em" size="large"
  44. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].workUnit }]" required
  45. v-model="from.workUnit" :label="lang[langType].company"
  46. :placeholder="lang[langType].companyContent" />
  47. <!-- 生日 -->
  48. <van-field label-width="7em" size="large"
  49. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].birthdayContent }]"
  50. is-link readonly @click="showBirthday = true" v-model="from.birthday" required
  51. :label="lang[langType].birthday" :placeholder="lang[langType].birthdayContent" />
  52. <van-popup v-model:show="showBirthday" destroy-on-close round position="bottom">
  53. <van-date-picker @confirm="packerConfirm" :title="lang[langType].birthday"
  54. @cancal="showBirthday = false" :min-date="new Date(1970, 0, 1)" :max-date="new Date()" />
  55. </van-popup>
  56. <!-- 国家/地区 -->
  57. <van-field label-width="7em" size="large"
  58. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].CountryOrRegionContent }]"
  59. v-model="from.CountryOrRegion" :label="lang[langType].CountryOrRegion" required
  60. :placeholder="lang[langType].CountryOrRegionContent" />
  61. <!-- 省市 -->
  62. <van-field label-width="7em" size="large"
  63. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].provinceCityContent }]"
  64. v-model="from.provinceCity" :label="lang[langType].provinceCity" required
  65. :placeholder="lang[langType].provinceCityContent" />
  66. <!-- 单位类型 -->
  67. <van-field label-width="7em" size="large"
  68. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].unitTypeContent }]"
  69. v-model="from.unitType" :label="lang[langType].unitType" required
  70. :placeholder="lang[langType].unitTypeContent" />
  71. <!-- jobLevel 职务级别 -->
  72. <van-field label-width="7em" size="large"
  73. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].jobLevelContent }]"
  74. v-model="from.jobLevel" :label="lang[langType].jobLevel" required
  75. :placeholder="lang[langType].jobLevelContent" />
  76. <!-- title 称谓 -->
  77. <van-field label-width="7em" size="large" required
  78. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].titleContent }]"
  79. v-model="from.title" :label="lang[langType].title"
  80. :placeholder="lang[langType].titleContent" />
  81. <!-- otherTitle 其他称谓 -->
  82. <van-field label-width="7em" size="large" required
  83. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].otherTitleContent }]"
  84. v-model="from.otherTitle" :label="lang[langType].otherTitle"
  85. :placeholder="lang[langType].otherTitleContent" />
  86. <!-- chineseName 中文名 -->
  87. <van-field label-width="7em" size="large"
  88. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].chineseNameContent }]"
  89. v-model="from.chineseName" :label="lang[langType].chineseName" required
  90. :placeholder="lang[langType].chineseNameContent" />
  91. <!-- 身份证 -->
  92. <van-field label-width="7em" size="large"
  93. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].idCardContent }]"
  94. v-model="from.idCard" :label="lang[langType].idCard" required
  95. :placeholder="lang[langType].idCardContent" />
  96. <!-- 护照 -->
  97. <van-field label-width="7em" size="large"
  98. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].passportContent }]"
  99. v-model="from.passport" :label="lang[langType].passport" required
  100. :placeholder="lang[langType].passportContent" />
  101. <!-- 宗教 -->
  102. <van-field label-width="7em" size="large"
  103. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].beliefContent }]"
  104. v-model="from.belief" :label="lang[langType].belief" required
  105. :placeholder="lang[langType].beliefContent" />
  106. <!-- 外交职衔 -->
  107. <van-field label-width="7em" size="large"
  108. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].diplomaticRankContent }]"
  109. v-model="from.diplomaticRank" :label="lang[langType].diplomaticRank" required
  110. :placeholder="lang[langType].diplomaticRankContent" />
  111. <!-- 主要成就 -->
  112. <van-field label-width="7em" size="large" v-model="from.mainAchievements" rows="3" autosize
  113. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].mainAchievementsContent }]"
  114. :label="lang[langType].mainAchievements" type="textarea" required
  115. :placeholder="lang[langType].mainAchievementsContent" />
  116. <!-- 职务 -->
  117. <van-field label-width="7em" size="large" v-model="from.career" :label="lang[langType].career"
  118. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].careerContent }]" required
  119. :placeholder="lang[langType].careerContent" />
  120. <!-- 固话 -->
  121. <van-field label-width="7em" size="large"
  122. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].fixedLineContent }]"
  123. v-model="from.fixedLine" :label="lang[langType].fixedLine" type="number" required
  124. :placeholder="lang[langType].fixedLineContent" />
  125. <!-- 传真 -->
  126. <van-field label-width="7em" size="large"
  127. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].faxContent }]"
  128. v-model="from.fax" :label="lang[langType].fax" type="number" required
  129. :placeholder="lang[langType].faxContent" />
  130. <!-- 办公地址 -->
  131. <van-field label-width="7em" size="large" v-model="from.officeAddress" rows="3" autosize required
  132. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].officeAddressContent }]"
  133. :label="lang[langType].officeAddress" type="textarea"
  134. :placeholder="lang[langType].officeAddressContent" />
  135. <!-- 照片 -->
  136. <van-field label-width="7em" size="large" :placeholder="lang[langType].photoContent" required
  137. :rules="[{ required: true, trigger: 'onChange', message: lang[langType].photoContent }]"
  138. v-model="from.fileUrl" :label="lang[langType].photo">
  139. <template #input>
  140. <van-uploader :preview-full-image="false" accept="image/*" v-model="photo" :max-count="1"
  141. :max-size="524288000" @oversize="filesize" :after-read="beforeRead" result-type="file">
  142. </van-uploader>
  143. <p style="font-size: 12px;" v-text="lang[langType].photoSubContent"> </p>
  144. </template>
  145. </van-field>
  146. <!-- 饮食要求 -->
  147. <van-field label-width="7em" size="large" v-model="from.catering" rows="3" autosize
  148. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].cateringContent }]"
  149. :label="lang[langType].catering" type="textarea" required
  150. :placeholder="lang[langType].cateringContent" />
  151. <!-- 紧急联系人 -->
  152. <van-field label-width="7em" size="large" v-model="from.emergencyContact"
  153. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].emergencyContactContent }]"
  154. :label="lang[langType].emergencyContact" required
  155. :placeholder="lang[langType].emergencyContactContent" />
  156. <!-- 紧急联系人电话 -->
  157. <van-field label-width="7em" size="large" v-model="from.emergencyContactPhone" required
  158. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].emergencyContactPhoneContent }]"
  159. :label="lang[langType].emergencyContactPhone"
  160. :placeholder="lang[langType].emergencyContactPhoneContent" />
  161. <!-- 接受采访意向 -->
  162. <van-field label-width="7em" size="large" v-model="from.interview" :label="lang[langType].interview"
  163. required
  164. :rules="[{ required: true, trigger: 'onBlur', message: lang[langType].interviewContent }]"
  165. :placeholder="lang[langType].interviewContent">
  166. <template #input>
  167. <van-radio-group v-model="from.interview" direction="horizontal">
  168. <van-radio name="同意">同意</van-radio>
  169. <van-radio name="拒绝">拒绝</van-radio>
  170. </van-radio-group>
  171. </template>
  172. </van-field>
  173. <!-- 媒体类别 -->
  174. <van-field label-width="7em" size="large" v-model="from.media" :label="lang[langType].media"
  175. :placeholder="lang[langType].mediaContent" />
  176. <!-- 抵达中国航班 -->
  177. <van-field label-width="7em" size="large" v-model="from.flight" :label="lang[langType].flight"
  178. :placeholder="lang[langType].flightContent" />
  179. <!-- 抵达中国地点 -->
  180. <van-field label-width="7em" size="large" v-model="from.arrivalLocation"
  181. :label="lang[langType].arrivalLocation" :placeholder="lang[langType].arrivalLocationContent" />
  182. <!-- 抵达中国时间 -->
  183. <van-field label-width="7em" size="large" v-model="from.arrivalTime" is-link readonly
  184. @click="showArrivalTime = true" :label="lang[langType].arrivalTime"
  185. :placeholder="lang[langType].arrivalTimeContent" />
  186. <van-popup v-model:show="showArrivalTime" destroy-on-close round position="bottom">
  187. <van-picker :title="lang[langType].arrivalTime" :columns="dateTimeColumns"
  188. @confirm="handleConfirm" @calcan="showArrivalTime = false" />
  189. </van-popup>
  190. <!-- 中转交通方式 -->
  191. <van-field label-width="7em" size="large" v-model="from.transfer" :label="lang[langType].transfer"
  192. :placeholder="lang[langType].transferContent" />
  193. <!-- 中转时间 -->
  194. <van-field label-width="7em" size="large" v-model="from.transferTime"
  195. @click="showTransferTime = true" is-link readonly :label="lang[langType].transferTime"
  196. :placeholder="lang[langType].transferTimeContent" />
  197. <van-popup v-model:show="showTransferTime" destroy-on-close round position="bottom">
  198. <van-picker :title="lang[langType].arrivalTime" :columns="dateTimeColumns"
  199. @confirm="transferTimeConfirm" @calcan="showTransferTime = false" />
  200. </van-popup>
  201. <!-- 抵达西安交通方式 -->
  202. <van-field label-width="7em" size="large" v-model="from.reach" :label="lang[langType].reach"
  203. :placeholder="lang[langType].reachContent" />
  204. <!-- 抵达西安交通车次 -->
  205. <van-field label-width="7em" size="large" v-model="from.reachTrainNumber"
  206. :label="lang[langType].reachTrainNumber"
  207. :placeholder="lang[langType].reachTrainNumberContent" />
  208. <!-- 抵达西安地点 -->
  209. <van-field label-width="7em" size="large" v-model="from.reachLocation"
  210. :label="lang[langType].reachLocation" :placeholder="lang[langType].reachLocationContent" />
  211. <!-- 抵达西安时间 -->
  212. <van-field label-width="7em" size="large" v-model="from.reachTime" is-link readonly
  213. @click="showReachTime = true" :label="lang[langType].reachTime"
  214. :placeholder="lang[langType].reachTimeContent" />
  215. <van-popup v-model:show="showReachTime" destroy-on-close round position="bottom">
  216. <van-picker :title="lang[langType].reachTime" :columns="dateTimeColumns"
  217. @confirm="reachTimeConfirm" @calcan="showReachTime = false" />
  218. </van-popup>
  219. <!-- 接站地点 -->
  220. <van-field label-width="7em" size="large" v-model="from.pickUpLocation"
  221. :label="lang[langType].pickUpLocation" :placeholder="lang[langType].pickUpLocationContent" />
  222. <!-- 离开交通方式 -->
  223. <van-field label-width="7em" size="large" v-model="from.leavingTransportationMode"
  224. :label="lang[langType].leavingTransportationMode"
  225. :placeholder="lang[langType].leavingTransportationModeContent" />
  226. <!-- 离开车次 -->
  227. <van-field label-width="7em" size="large" v-model="from.leavingTrainNumber"
  228. :label="lang[langType].leavingTrainNumber"
  229. :placeholder="lang[langType].leavingTrainNumberContent" />
  230. <!-- 离开地点 -->
  231. <van-field label-width="7em" size="large" v-model="from.leavingLocation"
  232. :label="lang[langType].leavingLocation" :placeholder="lang[langType].leavingLocationContent" />
  233. <!-- 离开时间 -->
  234. <van-field label-width="7em" size="large" v-model="from.leavingTime" is-link readonly
  235. @click="showLeavingTime = true" :label="lang[langType].leavingTime"
  236. :placeholder="lang[langType].leavingTimeContent" />
  237. <van-popup v-model:show="showLeavingTime" destroy-on-close round position="bottom">
  238. <van-picker :title="lang[langType].leavingTime" :columns="dateTimeColumns"
  239. @confirm="leavingTimeConfirm" @calcan="showLeavingTime = false" />
  240. </van-popup>
  241. <!-- 入住时间 -->
  242. <van-field label-width="7em" size="large" v-model="from.checkInTime" is-link readonly
  243. @click="showCheckInTime = true" :label="lang[langType].checkInTime"
  244. :placeholder="lang[langType].checkInTimeContent" />
  245. <van-popup v-model:show="showCheckInTime" destroy-on-close round position="bottom">
  246. <van-picker :title="lang[langType].checkInTime" :columns="dateTimeColumns"
  247. @confirm="checkInTimeConfirm" @calcan="showCheckInTime = false" />
  248. </van-popup>
  249. <!-- 离店时间 -->
  250. <van-field label-width="7em" size="large" v-model="from.checkOutTime" is-link readonly
  251. @click="showCheckOutTime = true" :label="lang[langType].checkOutTime"
  252. :placeholder="lang[langType].checkOutTimeContent" />
  253. <van-popup v-model:show="showCheckOutTime" destroy-on-close round position="bottom">
  254. <van-picker :title="lang[langType].checkOutTime" :columns="dateTimeColumns"
  255. @confirm="checkOutTimeConfirm" @calcan="showCheckOutTime = false" />
  256. </van-popup>
  257. <!-- <br /> -->
  258. <!-- <h4 class="title" v-text="lang[langType].conference"></h4> -->
  259. <!-- <van-field label-width="7em" size="large" v-model="from.cardTypeName" is-link readonly
  260. :label="lang[langType].conferenceType" :placeholder="lang[langType].conferenceTypeContent"
  261. @click="showCardType = true" /> -->
  262. <!-- <van-popup v-model:show="showCardType" destroy-on-close round position="bottom">
  263. <van-picker :model-value="from.cardType" :columns="cardTypeList" @cancel="showCardType = false"
  264. @confirm="onConfirm" />
  265. </van-popup> -->
  266. <!-- <br /> -->
  267. <!-- <h4 class="title" v-text="lang[langType].orther"></h4> -->
  268. <van-field label-width="7em" size="large" v-model="from.message" rows="3" autosize
  269. :label="lang[langType].ortherNotes" type="textarea"
  270. :placeholder="lang[langType].ortherNotesContent" />
  271. </van-cell-group>
  272. </div>
  273. <br />
  274. <div class="introduce">
  275. <h4 class="text" v-text="lang[langType].forumTopic"> </h4>
  276. <p class="text" v-text="lang[langType].forumTopicContent"></p>
  277. <h4 class="text" v-text="lang[langType].wrestleMania"></h4>
  278. <p class="text" v-text="lang[langType].wrestleManiaContent"></p>
  279. <h4 class="text" v-text="lang[langType].venue"></h4>
  280. <p class="text" v-text="lang[langType].venueContent"></p>
  281. <h4 class="text" v-text="lang[langType].organization"></h4>
  282. <div class="text" v-text="lang[langType].organizationSub1"></div>
  283. <div class="text" v-text="lang[langType].organizationSub2"></div>
  284. <h4 class="text" v-text="lang[langType].scale"></h4>
  285. <div class="text" style="text-indent: 2em;" v-text="lang[langType].scaleContent"></div>
  286. </div>
  287. <van-button class="btn_bottom" block type="primary" native-type="submit">
  288. {{ lang[langType].submit }}
  289. </van-button>
  290. <div style="text-align: center;line-height: 2.5em;font-size: 12px;" v-text="lang[langType].copyright"></div>
  291. </van-form>
  292. </div>
  293. </template>
  294. <script setup>
  295. // import { onMounted, reactive } from "vue";
  296. import { ref, reactive, onBeforeUpdate, computed } from 'vue';
  297. import { showToast } from 'vant';
  298. import axios from 'axios';
  299. import config from '@/config/index.js';
  300. import soundbyteJpg from '../../assets/img/2025lameifenghui.png';
  301. import { getJoinType, saveData } from '@/api/2025.js';
  302. import langpkg from './lang.js';
  303. let arrivalTime = []
  304. const dateTimeColumns = computed(() => {
  305. const now = new Date();
  306. const years = Array.from({ length: now.getFullYear() - 1970 }, (_, i) => {
  307. const t = 1970 + i + ''
  308. return {
  309. text: t,
  310. value: t
  311. }
  312. }).reverse();
  313. const months = Array.from({ length: 12 }, (_, i) => {
  314. const m = (i + 1).toString().padStart(2, '0')
  315. return {
  316. text: m,
  317. value: m
  318. }
  319. });
  320. // 动态计算当前选中年月对应的天数
  321. const daysInMonth = new Date(
  322. parseInt(arrivalTime[0] || '0'),
  323. parseInt(arrivalTime[1] || '0'),
  324. 0
  325. ).getDate();
  326. const days = Array.from({ length: daysInMonth }, (_, i) => {
  327. const d = (i + 1).toString().padStart(2, '0')
  328. return {
  329. text: d,
  330. value: d
  331. }
  332. });
  333. const hours = Array.from({ length: 24 }, (_, i) => {
  334. const h = i.toString().padStart(2, '0')
  335. return {
  336. text: h,
  337. value: h
  338. }
  339. });
  340. const minutes = Array.from({ length: 60 }, (_, i) => {
  341. const m = i.toString().padStart(2, '0')
  342. return {
  343. text: m,
  344. value: m
  345. }
  346. });
  347. const seconds = Array.from({ length: 60 }, (_, i) => {
  348. const s = i.toString().padStart(2, '0')
  349. return {
  350. text: s,
  351. value: s
  352. }
  353. });
  354. return [years, months, days, hours, minutes, seconds];
  355. });
  356. /** const langObj = [
  357. { text: '中文', value: 'zh' },
  358. { text: 'English', value: 'en' },
  359. ]
  360. const langObjT = {
  361. zh: '中文',
  362. en: 'English',
  363. } */
  364. // import en from './en.json';
  365. /**
  366. * window.$originData.orginParames.title 页面标题
  367. * window.$originData.orginParames.parameters 固定参数值
  368. * window.$originData.urlParames url参数
  369. */
  370. const lang = ref(langpkg);
  371. const langType = ref(localStorage.getItem('langType') || 'zh');
  372. // const showLange = ref(false);
  373. // const showCardType = ref(false);
  374. const showArrivalTime = ref(false);
  375. const showTransferTime = ref(false);
  376. const showReachTime = ref(false);
  377. const showLeavingTime = ref(false);
  378. const showBirthday = ref(false);
  379. const showCheckInTime = ref(false);
  380. const showCheckOutTime = ref(false);
  381. const cardTypeList = ref([])
  382. const photo = ref([])
  383. const isFile = () => {
  384. return photo.value && photo.value.length;
  385. };
  386. // const langChange = ({ selectedValues }) => {
  387. // langType.value = selectedValues[0];
  388. // localStorage.setItem('langType', selectedValues[0]);
  389. // showLange.value = false;
  390. // };
  391. const from = reactive({
  392. name: '',
  393. idCard: '',
  394. career: '',
  395. contact: '',
  396. photoUrl: [],
  397. cardType: [],
  398. photo: [],
  399. birthday: '',
  400. message: '',
  401. arrivalTime: ''
  402. });
  403. onBeforeUpdate(() => { });
  404. getJoinType().then((res) => {
  405. cardTypeList.value = res.map((item) => {
  406. return {
  407. text: item.dictLabel,
  408. value: item.dictValue,
  409. }
  410. })
  411. })
  412. const filesize = () => showToast(lang.value[langType.value].fileSize);
  413. const packerConfirm = (values) => {
  414. showBirthday.value = false;
  415. from.birthday = values.selectedValues.join('-');
  416. }
  417. const handleConfirm = ({ selectedValues }) => {
  418. showArrivalTime.value = false;
  419. arrivalTime = selectedValues;
  420. from.arrivalTime = selectedValues.slice(0, 3).join('-') + ' ' + selectedValues.slice(3).join(':');
  421. }
  422. const transferTimeConfirm = ({ selectedValues }) => {
  423. showTransferTime.value = false;
  424. from.transferTime = selectedValues.slice(0, 3).join('-') + ' ' + selectedValues.slice(3).join(':');
  425. }
  426. const reachTimeConfirm = ({ selectedValues }) => {
  427. showReachTime.value = false;
  428. from.reachTime = selectedValues.slice(0, 3).join('-') + ' ' + selectedValues.slice(3).join(':');
  429. }
  430. const leavingTimeConfirm = ({ selectedValues }) => {
  431. showLeavingTime.value = false;
  432. from.leavingTime = selectedValues.slice(0, 3).join('-') + ' ' + selectedValues.slice(3).join(':');
  433. }
  434. const checkInTimeConfirm = ({ selectedValues }) => {
  435. showCheckInTime.value = false;
  436. from.checkInTime = selectedValues.slice(0, 3).join('-') + ' ' + selectedValues.slice(3).join(':');
  437. }
  438. const checkOutTimeConfirm = ({ selectedValues }) => {
  439. showCheckOutTime.value = false;
  440. from.checkOutTime = selectedValues.slice(0, 3).join('-') + ' ' + selectedValues.slice(3).join(':');
  441. }
  442. // 选择证件类型
  443. // const onConfirm = ({ selectedValues, selectedOptions }) => {
  444. // showCardType.value = false;
  445. // from.cardType = selectedValues;
  446. // from.cardTypeName = selectedOptions[0].text;
  447. // };
  448. const beforeRead = () => {
  449. if (!isFile()) showToast(lang.value[langType.value].changePhono);
  450. const item = photo.value[0]
  451. const oriData = new FormData();
  452. oriData.append('file', item.file);
  453. axios({
  454. method: 'post',
  455. url: config.base.Url2025 + 'dev/file/uploadDynamicReturnUrl',
  456. headers: {
  457. 'Content-Type': 'multipart/form-data',
  458. },
  459. data: oriData,
  460. }).then(res => {
  461. if (res.status !== 200 || res.data.code !== 0) {
  462. showToast(lang.value[langType.value].upFileError);
  463. from.photoUrl = []
  464. return
  465. }
  466. showToast(lang.value[langType.value].upFileSusscess);
  467. from.photoUrl = [{ url: res.data.data }]
  468. photo.value = [
  469. {
  470. url: res.data.data,
  471. file: item.file,
  472. }
  473. ]
  474. })
  475. return false;
  476. };
  477. // 选择权限范围
  478. const onSubmit = (values) => {
  479. console.log('submit', values);
  480. if (!isFile()) showToast(lang.value[langType.value].selectFile);
  481. saveData({
  482. name: from.name,
  483. photo: from.photoUrl[0].url,
  484. namePinyin: from.pinyin,
  485. gender: from.gender,
  486. phone: from.contact,
  487. email: from.email,
  488. birthday: from.birthday,
  489. workUnit: from.workUnit,
  490. countryRegion: from.CountryOrRegion,
  491. provinceCity: from.provinceCity,
  492. unitType: from.unitType,
  493. jobLevel: from.jobLevel,
  494. title: from.title,
  495. otherTitle: from.otherTitle,
  496. chineseName: from.chineseName,
  497. idCard: from.idCard,
  498. passportNumber: from.passport,
  499. religion: from.belief,
  500. diplomaticRank: from.diplomaticRank,
  501. majorAchievements: from.mainAchievements,
  502. position: from.career,
  503. telephone: from.fixedLine,
  504. fax: from.fax,
  505. officeAddress: from.officeAddress,
  506. dietaryRequirements: from.catering,
  507. allergen: from.allergies,
  508. emergencyContact: from.emergencyContact,
  509. emergencyContactPhone: from.emergencyContactPhone,
  510. interviewIntention: from.interview,
  511. mediaCategory: from.media,
  512. arrivalFlightChina: from.flight,
  513. arrivalLocationChina: from.arrivalLocation,
  514. arrivalTimeChina: from.arrivalTime,
  515. transferMode: from.transfer,
  516. transferTime: from.transferTime,
  517. arrivalModeXian: from.reach,
  518. arrivalNumberXian: from.reachTrainNumber,
  519. arrivalLocationXian: from.reachLocation,
  520. arrivalTimeXian: from.reachTime,
  521. pickupLocation: from.pickUpLocation,
  522. departureMode: from.leavingTransportationMode,
  523. departureNumber: from.leavingTrainNumber,
  524. departureLocation: from.leavingLocation,
  525. departureTime: from.leavingTime,
  526. checkInTime: from.checkInTime,
  527. checkOutTime: from.checkOutTime,
  528. remarks: from.message
  529. }).then(() => {
  530. showToast(lang.value[langType.value].registration);
  531. // 清空表单内容 from
  532. Object.keys(from).forEach((key) => {
  533. from[key] = '';
  534. });
  535. }).catch(() => {
  536. showToast(lang.value[langType.value].registrationError);
  537. });
  538. };
  539. </script>
  540. <style lang="scss">
  541. .fenghui {
  542. overflow-x: hidden;
  543. width: 100vw;
  544. max-width: 750px;
  545. margin: 0 auto;
  546. min-height: 100vh;
  547. // background: linear-gradient(270deg, #1C4DD6 0%, #1D18BC 100%);
  548. font-weight: 400;
  549. position: relative;
  550. font-family: Source Han Serif CN !important;
  551. .swith {
  552. position: absolute;
  553. right: 10px;
  554. top: 10px;
  555. z-index: 999;
  556. color: #fff;
  557. .title {
  558. cursor: pointer;
  559. }
  560. }
  561. input {
  562. text-align: right;
  563. }
  564. .text {
  565. padding: 8px 8px 0 8px;
  566. text-align: justify;
  567. line-height: 1.8em;
  568. font-size: 16px;
  569. color: #3D3D3D;
  570. }
  571. .introduce {
  572. background-color: #FAFAFA;
  573. padding-bottom: 10px;
  574. overflow: hidden;
  575. h4 {
  576. color: #031280;
  577. }
  578. }
  579. .van-hairline--bottom:after {
  580. border-bottom-width: 0px;
  581. }
  582. .van-button__text {
  583. font-size: 15px;
  584. font-weight: 400;
  585. color: #031280;
  586. }
  587. .icon {
  588. position: absolute;
  589. right: 10px;
  590. top: 50%;
  591. transform: translateY(-50%);
  592. }
  593. .btn_bottom {
  594. color: #ffffff;
  595. text-align: center;
  596. height: 60px;
  597. line-height: 60px;
  598. background: linear-gradient(270deg, #1D19BC 0%, #1C4CD5 100%);
  599. .van-button__text {
  600. color: #ffffff;
  601. }
  602. }
  603. .submit {
  604. .title {
  605. padding: 0 16px;
  606. }
  607. .van-cell-group,
  608. .van-cell {
  609. margin: 0%;
  610. }
  611. .van-field__body input {
  612. &::placeholder,
  613. &::-webkit-input-placeholder,
  614. &:-moz-placeholder,
  615. &::-moz-placeholder,
  616. &:-ms-input-placeholder {
  617. color: rgba(255, 255, 255, 0.6);
  618. }
  619. }
  620. }
  621. }
  622. </style>