zhaopianZiliao.vue 6.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208
  1. <template>
  2. <view class="jz-content-box">
  3. <view class="upload-img-box">
  4. <jiazhengUpload @getFileUrl="getTouxiang" bottomText="上传头像和生活照"></jiazhengUpload>
  5. </view>
  6. <view class="form-label-switch">
  7. <view class="phone-form-label"><text class="form-label-require"></text>身份证照片</view>
  8. <!-- <switch @change="switchSfzChange" color="#3fd2a1" style="transform:scale(0.7)" /> -->
  9. </view>
  10. <view class="ziliao-upload-box">
  11. <view class="upload-item-box">
  12. <jiazhengUpload @getFileUrl="getSfzTouxiang" bottomText="上传身份证头像面"></jiazhengUpload>
  13. </view>
  14. <view class="upload-item-box">
  15. <jiazhengUpload @getFileUrl="getSfzGuohui" bottomText="上传身份证国徽面"></jiazhengUpload>
  16. </view>
  17. </view>
  18. <view class="form-label-switch form-top-margin">
  19. <view class="phone-form-label"><text class="form-label-require"></text>工作生活照</view>
  20. <!-- <switch @change="switchGzChange" color="#3fd2a1" style="transform:scale(0.7)" /> -->
  21. </view>
  22. <view class="zhaopianZiliao-shenfenzhengImg">
  23. <view class="ziliao-upload-box">
  24. <view v-if="shenghuizhaoList.length>0">
  25. <view v-for="(item, index) in shenghuizhaoList" :key="index">
  26. <img style="width: 100rpx;height: 100rpx;" :src="item" alt="">
  27. <view @click="deleteShenghuoZhao(item,index)">删除</view>
  28. </view>
  29. </view>
  30. <view>
  31. <jiazhengUpload changjingType="more" @getFileUrl="getGzShenghuozhao"></jiazhengUpload>
  32. </view>
  33. </view>
  34. </view>
  35. <view class="form-label-switch form-top-margin">
  36. <view class="phone-form-label"><text class="form-label-require"></text>资格类照片</view>
  37. <!-- <switch @change="switchZgChange" color="#3fd2a1" style="transform:scale(0.7)" /> -->
  38. </view>
  39. <view class="zhaopianZiliao-shenfenzhengImg">
  40. <view class="ziliao-upload-box">
  41. <view v-if="zigezhaoList.length>0">
  42. <view v-for="(item, index) in zigezhaoList" :key="index">
  43. <img style="width: 100rpx;height: 100rpx;" :src="item" alt="">
  44. <view @click="deleteZigeZhao(item,index)">删除</view>
  45. </view>
  46. </view>
  47. <view>
  48. <jiazhengUpload changjingType="more" @getFileUrl="getZigezhao"></jiazhengUpload>
  49. </view>
  50. </view>
  51. </view>
  52. <view class="form-label-select">
  53. <view class="phone-form-label"><text class="form-label-require"></text>最近体检日期</view>
  54. <uni-datetime-picker class="form-radio-picker" type="date" @change="changeTijian">
  55. <view class="form-radio-select">
  56. <view>{{tijianDate}}</view>
  57. <icon></icon>
  58. </view>
  59. </uni-datetime-picker>
  60. </view>
  61. <view class="form-label-select">
  62. <view class="phone-form-label"><text class="form-label-require"></text>健康证日期</view>
  63. <uni-datetime-picker class="form-radio-picker" type="date" @change="changeJiankang">
  64. <view class="form-radio-select">
  65. <view>{{jiankangDate}}</view>
  66. <icon></icon>
  67. </view>
  68. </uni-datetime-picker>
  69. </view>
  70. <view class="zpzl-tip-box form-top-margin">
  71. <view>体检报告文件</view>
  72. <view class="red-tip">(*如未经同意,体检报告均不展示在简历中;在系统中预约的体检,如有电子报告,会自动关联到简历中) </view>
  73. <view>
  74. <checkbox-group>
  75. <checkbox :checked="tijianbaogaoFlag" @click="changeTijianbaogao" color="#3fd2a1"
  76. style="transform:scale(0.65)" />
  77. 已经同意,上传个人体检报告
  78. </checkbox-group>
  79. </view>
  80. <view class="scbg-tip">
  81. 还没有上传的体验报告<br>
  82. 可点击下方上传体检报告
  83. </view>
  84. <button type="default" class="phone-green-btn scbg-btn">+从手机上传体检报告(pdf)</button>
  85. </view>
  86. <view class="page-btn-box">
  87. <button type="default" @click="goUp" class="phone-white-btn">上一步</button>
  88. <button type="default" @click="goNext" class="phone-green-btn">下一步</button>
  89. </view>
  90. </view>
  91. </template>
  92. <script>
  93. import {
  94. getAliyunPolicy
  95. } from "@/api/jiazheng.js"
  96. import jiazhengUpload from "./common/jiazhengUpload.vue"
  97. export default {
  98. data() {
  99. return {
  100. shenghuizhaoList: [],
  101. zigezhaoList: [],
  102. icon: '',
  103. idcardUrl1: '',
  104. idcardUrl2: '',
  105. shenghuoUrls: '',
  106. tijianDate: '',
  107. tijianUrl: '',
  108. jiankangDate: '',
  109. tijianbaogaoFlag: false,
  110. zhengshuUrls: '',
  111. }
  112. },
  113. components: {
  114. jiazhengUpload
  115. },
  116. methods: {
  117. getTouxiang(data) {
  118. this.icon = data
  119. console.log('getTouxiang', data);
  120. },
  121. getSfzTouxiang(data) {
  122. this.idcardUrl1 = data
  123. console.log('getSfzTouxiang', data);
  124. },
  125. getSfzGuohui(data) {
  126. this.idcardUrl2 = data
  127. console.log('getSfzGuohui', data);
  128. },
  129. getGzShenghuozhao(data) {
  130. console.log('getGzShenghuozhao', data);
  131. this.shenghuizhaoList.push(data);
  132. },
  133. getZigezhao(data) {
  134. console.log('getZigezhao', data);
  135. this.zigezhaoList.push(data);
  136. },
  137. deleteZigeZhao(data, index) {
  138. this.zigezhaoList.splice(index, 1);
  139. },
  140. deleteShenghuoZhao(data, index) {
  141. this.shenghuizhaoList.splice(index, 1);
  142. },
  143. changeTijian(data) {
  144. console.log('data', data);
  145. this.tijianDate = data
  146. },
  147. changeJiankang(data) {
  148. console.log('data', data);
  149. this.jiankangDate = data
  150. },
  151. changeTijianbaogao(data) {
  152. this.tijianbaogaoFlag = !this.tijianbaogaoFlag
  153. },
  154. switchSfzChange(data) {
  155. console.log('data', data);
  156. },
  157. switchGzChange(data) {
  158. console.log('data', data);
  159. },
  160. switchZgChange(data) {
  161. console.log('data', data);
  162. },
  163. goNext() {
  164. this.formData = {
  165. icon: this.icon,
  166. idcardUrl1: this.idcardUrl1,
  167. idcardUrl2: this.idcardUrl2,
  168. tijianbaogaoFlag: this.tijianbaogaoFlag,
  169. shenghuoUrls: this.shenghuizhaoList.join(','),
  170. zhengshuUrls: this.zigezhaoList.join(','),
  171. tijianDate: this.tijianDate,
  172. jiankangDate: this.jiankangDate,
  173. tijianUrl: this.tijianUrl,
  174. }
  175. console.log('this.formData', this.formData);
  176. this.$emit('goNext', this.formData, 2);
  177. },
  178. goUp() {
  179. // if(!this.formData.agree){
  180. // uni.showToast({
  181. // title: "请勾选本人同意!",
  182. // icon: 'none',
  183. // duration: 2000
  184. // })
  185. // return false
  186. // }
  187. this.$emit('goUp', {}, 2);
  188. },
  189. },
  190. created() {
  191. // setTimeout(()=>{
  192. // this.$refs.datePicker.show()
  193. // },1000)
  194. },
  195. };
  196. </script>