input.vue 32 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183
  1. <template>
  2. <view style="padding: 30rpx;">
  3. <nav-bar title="填写审核资料"></nav-bar>
  4. <view v-show="!agreementModal">
  5. <view class="topBox">
  6. <view>
  7. <u-icon name="error-circle-fill" color="#FF3B30" size="28"></u-icon>
  8. <text style="color: #FF3B30;margin-left: 10rpx;">学习前请提交完整审核资料</text>
  9. </view>
  10. <view style="color: #007AFF;" @click="backPage">稍后再填</view>
  11. </view>
  12. <u-collapse v-if="remarkStatus" :item-style="itemStyle" event-type="close" ref="collapse">
  13. <u-collapse-item title="审核结果反馈">
  14. <view style="padding-bottom: 30rpx;">
  15. <text class="collapse-item">{{ remark }}</text>
  16. </view>
  17. </u-collapse-item>
  18. </u-collapse>
  19. <view class="bodyBox" style="margin-top: 30rpx;padding:0 20rpx;">
  20. <u-form :model="form" ref="uForm" :error-type="errorType">
  21. <template v-for="(item,index) in listData" >
  22. <u-form-item
  23. :key="index"
  24. v-if="item.fieldKey == 'name'"
  25. :label="item.fieldName"
  26. :required="item.required"
  27. :label-width="auto"
  28. :prop="item.required ? item.fieldKey : ''"
  29. >
  30. <u-input v-model="form.name" :placeholder="`请输入${item.fieldName}`" />
  31. </u-form-item>
  32. <u-form-item
  33. :key="index"
  34. v-if="item.fieldKey == 'idcard'"
  35. :label="item.fieldName"
  36. :required="item.required"
  37. :label-width="auto"
  38. :prop="item.required ? item.fieldKey : ''"
  39. >
  40. <u-input v-model="form.idcard" :placeholder="`请输入${item.fieldName}`" />
  41. </u-form-item>
  42. <u-form-item
  43. :key="index"
  44. v-if="item.fieldKey == 'telphone'"
  45. :label="item.fieldName"
  46. :required="item.required"
  47. :label-width="auto"
  48. :prop="item.required ? item.fieldKey : ''"
  49. >
  50. <u-input v-model="form.telphone" :placeholder="`请输入${item.fieldName}`" />
  51. </u-form-item>
  52. <u-form-item
  53. :key="index"
  54. v-if="item.fieldKey == 'school'"
  55. :label="item.fieldName"
  56. :required="item.required"
  57. :label-width="auto"
  58. :prop="item.required ? item.fieldKey : ''"
  59. >
  60. <u-input v-model="form.school" :placeholder="`请输入${item.fieldName}`" />
  61. </u-form-item>
  62. <u-form-item
  63. :key="index"
  64. v-if="item.fieldKey == 'work_unit'"
  65. :label="item.fieldName"
  66. :required="item.required"
  67. :label-width="auto"
  68. :prop="item.required ? item.fieldKey : ''"
  69. >
  70. <u-input v-model="form.work_unit" :placeholder="`请输入${item.fieldName}`" />
  71. </u-form-item>
  72. <u-form-item
  73. :key="index"
  74. v-if="item.fieldKey == 'unit_contact'"
  75. :label="item.fieldName"
  76. :required="item.required"
  77. :label-width="auto"
  78. :prop="item.required ? item.fieldKey : ''"
  79. >
  80. <u-input v-model="form.unit_contact" :placeholder="`请输入${item.fieldName}`" />
  81. </u-form-item>
  82. <u-form-item
  83. :key="index"
  84. v-if="item.fieldKey == 'unit_tel'"
  85. :label="item.fieldName"
  86. :required="item.required"
  87. :label-width="auto"
  88. :prop="item.required ? item.fieldKey : ''"
  89. >
  90. <u-input v-model="form.unit_tel" :placeholder="`请输入${item.fieldName}`" />
  91. </u-form-item>
  92. <u-form-item
  93. :key="index"
  94. v-if="item.fieldKey == 'apply_post'"
  95. :label="item.fieldName"
  96. :required="item.required"
  97. :label-width="auto"
  98. :prop="item.required ? item.fieldKey : ''"
  99. >
  100. <u-input v-model="form.apply_post" :disabled="apply_post_disabled" :placeholder="`请输入${item.fieldName}`" />
  101. </u-form-item>
  102. <u-form-item
  103. :key="index"
  104. v-if="item.fieldKey == 'major'"
  105. :label="item.fieldName"
  106. :required="item.required"
  107. :label-width="auto"
  108. :prop="item.required ? item.fieldKey : ''"
  109. >
  110. <u-input v-model="form.major" :placeholder="`请输入${item.fieldName}`" />
  111. </u-form-item>
  112. <u-form-item
  113. :key="index"
  114. v-if="item.inputType == 2"
  115. :label="item.fieldName"
  116. :label-width="auto"
  117. :required="item.required"
  118. :prop="item.required ? item.fieldKey : ''"
  119. >
  120. <picker @change="bindPickerChange(item.fieldKey, $event)" :value="form[item.fieldKey]" :range="getarrays(item.fieldKey)">
  121. <view class="picker">
  122. {{ returnName(item.fieldKey) }}
  123. <image
  124. src="@/static/icon/clears.png"
  125. v-if="clearWatch(item.fieldKey)"
  126. @click.stop="clearFun(item.fieldKey)"
  127. mode=""
  128. style="width:30rpx;height:30rpx;vertical-align: middle;margin-left:10rpx;"
  129. ></image>
  130. </view>
  131. </picker>
  132. </u-form-item>
  133. <u-form-item
  134. :key="index"
  135. v-if="item.inputType == 5"
  136. :label="item.fieldName"
  137. :label-width="auto"
  138. :required="item.required"
  139. :prop="item.required ? item.fieldKey : ''"
  140. >
  141. <picker mode="date" :value="form[item.fieldKey]" @change="bindDateChange(item.fieldKey, $event)">
  142. <view class="picker">
  143. {{ getTimes(item.fieldKey) }}
  144. <image
  145. src="@/static/icon/clears.png"
  146. v-if="clearWatch(item.fieldKey)"
  147. @click.stop="clearFun(item.fieldKey)"
  148. mode=""
  149. style="width:30rpx;height:30rpx;vertical-align: middle;margin-left:10rpx;"
  150. ></image>
  151. </view>
  152. </picker>
  153. </u-form-item>
  154. <u-form-item
  155. :key="index"
  156. v-if="item.inputType == 3 && item.fieldKey !== 'commitment_electr_signature'"
  157. :label="item.fieldName"
  158. :required="item.required"
  159. :label-width="auto"
  160. label-position="top"
  161. :prop="item.required ? item.fieldKey : ''"
  162. >
  163. <text v-if="item.fieldKey === 'recent_photos'" style="color: #999999;position: absolute;top: 20rpx;left: 130rpx;">竖向证件照 文件大小≤2M</text>
  164. <text
  165. v-if="item.fieldKey === 'idcard_face_photo' || item.fieldKey === 'idcard_national_photo'"
  166. style="color: #999999;position: absolute;top: 20rpx;left: 180rpx;"
  167. >
  168. 文件大小≤2M
  169. </text>
  170. <u-upload
  171. :show-progress="false"
  172. :max-size="2097152"
  173. @on-list-change="
  174. item.fieldKey === 'recent_photos'
  175. ? changePhotoListHeader1($event)
  176. : item.fieldKey === 'idcard_face_photo'
  177. ? changePhotoListHeader2($event)
  178. : item.fieldKey === 'idcard_national_photo'
  179. ? changePhotoListHeader3($event)
  180. : ''
  181. "
  182. :auto-upload="false"
  183. custom-btn="true"
  184. :action="action"
  185. :file-list="
  186. item.fieldKey === 'recent_photos'
  187. ? fileList1
  188. : item.fieldKey === 'idcard_face_photo'
  189. ? fileList2
  190. : item.fieldKey === 'idcard_national_photo'
  191. ? fileList3
  192. : ''
  193. "
  194. width="120"
  195. height="120"
  196. size-type="['compressed']"
  197. max-count="1"
  198. >
  199. <template v-slot:addBtn>
  200. <image
  201. :src="
  202. item.fieldKey === 'recent_photos'
  203. ? '/static/info_1.png'
  204. : item.fieldKey === 'idcard_face_photo'
  205. ? '/static/info_2.png'
  206. : item.fieldKey === 'idcard_national_photo'
  207. ? '/static/info_3.png'
  208. : ''
  209. "
  210. :style="
  211. item.fieldKey === 'recent_photos'
  212. ? 'width: 120rpx; height: 169rpx;'
  213. : item.fieldKey === 'idcard_face_photo'
  214. ? 'width: 120rpx; height: 82rpx;'
  215. : item.fieldKey === 'idcard_national_photo'
  216. ? 'width: 120rpx; height: 82rpx;'
  217. : ''
  218. "
  219. ></image>
  220. </template>
  221. </u-upload>
  222. </u-form-item>
  223. <view :key="index" v-if="item.inputType == 3 && item.fieldKey === 'commitment_electr_signature'">
  224. <u-form-item
  225. v-if="item.inputType == 3 && item.fieldKey === 'commitment_electr_signature'"
  226. label="承诺书"
  227. :required="item.required"
  228. :label-width="auto"
  229. label-position="top"
  230. >
  231. <view style="line-height: 40rpx;text-indent:2em">
  232. <text>
  233. 本人自愿做出如下承诺:本人己仔细阅读《广东省住房和城乡建设厅关于推进住房和城乡建设领域施工现场专业人员职业培训工作的通知》
  234. 全部内容并知晓和理解,本人的学历证书、身份证、工作年限、相片等所有资料完全真实、符合报名条件、资格审查要求和相关规定,本人在报名、审查、培训、测试等有关的事项中会严格道守相关规定和要求,如有虛假或与实际规定不符等情况造成的一切后果由本人承担。
  235. </text>
  236. <view style="line-height: 40rpx;text-indent:2em"><text>特此承诺!</text></view>
  237. </view>
  238. </u-form-item>
  239. <u-form-item
  240. v-if="item.inputType == 3 && item.fieldKey === 'commitment_electr_signature'"
  241. label="签名板"
  242. :required="item.required"
  243. :label-width="auto"
  244. label-position="top"
  245. :prop="item.required ? item.fieldKey : ''"
  246. >
  247. <view class="dis_stys">
  248. <text style="color: #999999;">请在下方签名区进行签名</text>
  249. <text @click="retDraw" mode="">清空</text>
  250. </view>
  251. <view class="handCenter">
  252. <canvas
  253. v-if="!form[item.fieldKey]"
  254. class="handWriting"
  255. disable-scroll="true"
  256. :catchtouchmove="true"
  257. @touchstart="uploadScaleStart"
  258. @touchmove="uploadScaleMove"
  259. @touchend="uploadScaleEnd"
  260. canvas-id="handWriting"
  261. ></canvas>
  262. <view v-else style="width:100%;height: 100%;position: relative;">
  263. <view class="ctoples">图片</view>
  264. <image style="width:100%;height:100%;" :src="$method.splitImgHost(form[item.fieldKey])" mode=""></image>
  265. </view>
  266. </view>
  267. </u-form-item>
  268. </view>
  269. </template>
  270. </u-form>
  271. </view>
  272. <view @click="submits" class="submit_btn">提交资料</view>
  273. </view>
  274. <u-popup class="modal" catchtouchmove='return' v-model="agreementModal" mode="center" border-radius="24" :mask-close-able="false">
  275. <view class="agreement">
  276. <view class="body">
  277. <scroll-view scroll-y="true" style="height:600rpx;">
  278. <view class="content">
  279. <view>本产品(或服务)提供【{{goodsData.goodsName}}】课程的在线学习功能,为使用这些功能,我们需要使用您设备上的摄像头,并收集以下个人信息:
  280. <text v-for="(item,listIndex) in listData" :key="listIndex">{{item.fieldName}}、</text>
  281. <!-- 姓名、性别、身份证号码、移动电话号码、身份证照片、一寸照、证书名称/岗位、证书编号、有效期、人脸照片(每节课随机拍摄三张)、 -->
  282. 学习详细记录。</view>
  283. <view>我们会将上述信息提供至广东省建设执业注册管理中心等第三方组织使用,用于继续教育备案等。如果您拒绝,将导致这些功能无法实现,但不影响您使用本产品(或服务)的其他业务功能。</view>
  284. </view>
  285. </scroll-view>
  286. </view>
  287. <view class="footer">
  288. <view class="btn cancel" @click="refuseAgreement">取消</view>
  289. <view class="btn ok" @click="agree">同意并继续</view>
  290. </view>
  291. </view>
  292. </u-popup>
  293. </view>
  294. </template>
  295. <script>
  296. import * as baseUrls from '@/common/request.js';
  297. import { mapGetters } from 'vuex';
  298. import Handwriting from '@/common/signature.js';
  299. export default {
  300. data() {
  301. return {
  302. errorType: ['message'],
  303. agreementModal:true,
  304. goodsData:{},
  305. itemStyle: {
  306. marginTop: '20px',
  307. backgroundColor: '#fff',
  308. borderRadius: '24rpx',
  309. padding: '0rpx 20rpx'
  310. },
  311. isUploading:false,
  312. form: {
  313. name: '',
  314. sex: '',
  315. idcard: '',
  316. telphone: '',
  317. education: '',
  318. school: '',
  319. graduation_time: '',
  320. work_unit: '',
  321. unit_contact: '',
  322. unit_tel: '',
  323. apply_post: '',
  324. major: '',
  325. working_years: '',
  326. recent_photos: '',
  327. idcard_face_photo: '',
  328. idcard_national_photo: '',
  329. commitment_electr_signature: ''
  330. },
  331. lineColor: 'black',
  332. slideValue: 50,
  333. handwriting: '',
  334. goodsId: null,
  335. listData: [], //页面数据
  336. fileList1: [], //个人近照
  337. fileList2: [], //人像
  338. fileList3: [], //国徽
  339. openVerify: false, // 控制是否手动验证
  340. id: null, //获取修改ID内容
  341. remark: '', //反馈文本
  342. remarkStatus: false, //是否存在审核结果反馈
  343. // nextStatus: false, //是否有下一步
  344. copyData: [], //备份数据
  345. rules: {
  346. name: [
  347. {
  348. required: true,
  349. message: '请输入姓名',
  350. trigger: ['change', 'blur']
  351. }
  352. ],
  353. sex: [
  354. {
  355. required: true,
  356. message: '请选择性别',
  357. trigger: 'change'
  358. }
  359. ],
  360. idcard: [
  361. {
  362. required: true,
  363. message: '请输入身份证号',
  364. trigger: ['change', 'blur']
  365. },
  366. {
  367. validator: (rule, value, callback) => {
  368. return this.$u.test.idCard(value);
  369. },
  370. message: '身份证号不正确',
  371. trigger: ['change', 'blur']
  372. }
  373. ],
  374. telphone: [
  375. {
  376. required: true,
  377. message: '请输入手机号码',
  378. trigger: ['change', 'blur']
  379. },
  380. {
  381. validator: (rule, value, callback) => {
  382. var vartest = /^([0-9]{3,4}-)?[0-9]{7,8}$/;
  383. if (this.$u.test.mobile(value) || vartest.test(value)) {
  384. return true;
  385. } else {
  386. return false;
  387. }
  388. },
  389. message: '手机号码不正确',
  390. trigger: ['change', 'blur']
  391. }
  392. ],
  393. education: [
  394. {
  395. required: true,
  396. message: '请选择学历',
  397. trigger: 'change'
  398. }
  399. ],
  400. school: [
  401. {
  402. required: true,
  403. message: '请输入毕业院校',
  404. trigger: ['change', 'blur']
  405. }
  406. ],
  407. graduation_time: [
  408. {
  409. required: true,
  410. message: '请选择毕业时间',
  411. trigger: 'change'
  412. }
  413. ],
  414. work_unit: [
  415. {
  416. required: true,
  417. message: '请输入工作单位',
  418. trigger: ['change', 'blur']
  419. }
  420. ],
  421. unit_contact: [
  422. {
  423. required: true,
  424. message: '请输入单位联系人',
  425. trigger: ['change', 'blur']
  426. }
  427. ],
  428. unit_tel: [
  429. {
  430. required: true,
  431. message: '请输入单位联系电话',
  432. trigger: ['change', 'blur']
  433. },
  434. {
  435. validator: (rule, value, callback) => {
  436. var vartest = /^([0-9]{3,4}-)?[0-9]{7,8}$/;
  437. var vartest1 = /^([0-9]{3,4})?[0-9]{7,8}$/;
  438. if (this.$u.test.mobile(value) || vartest.test(value) || vartest1.test(value)) {
  439. return true;
  440. } else {
  441. return false;
  442. }
  443. },
  444. message: '单位联系电话不正确',
  445. trigger: ['change', 'blur']
  446. }
  447. ],
  448. apply_post: [
  449. {
  450. required: true,
  451. message: '请输入报名岗位',
  452. trigger: ['change', 'blur']
  453. }
  454. ],
  455. major: [
  456. {
  457. required: true,
  458. message: '请输入所学专业',
  459. trigger: ['change', 'blur']
  460. }
  461. ],
  462. working_years: [
  463. {
  464. required: true,
  465. message: '请选择工作年限',
  466. trigger: 'change'
  467. }
  468. ],
  469. recent_photos: [
  470. {
  471. required: true,
  472. message: '请上传个人近照',
  473. trigger: ['change', 'blur']
  474. }
  475. ],
  476. idcard_face_photo: [
  477. {
  478. required: true,
  479. message: '请上传身份证人像面',
  480. trigger: ['change', 'blur']
  481. }
  482. ],
  483. idcard_national_photo: [
  484. {
  485. required: true,
  486. message: '请上传身份证国徽面',
  487. trigger: ['change', 'blur']
  488. }
  489. ],
  490. commitment_electr_signature: [
  491. {
  492. required: true,
  493. message: '请签写承诺书电子签',
  494. trigger: ['change', 'blur']
  495. }
  496. ]
  497. },
  498. apply_post_disabled:false,
  499. isRequired: false
  500. };
  501. },
  502. created() {
  503. this.$store.getters.dictObj;
  504. },
  505. async onLoad(option) {
  506. this.goodsId = Number(option.id);
  507. await this.getGoodsDetail()
  508. this.getInfo();
  509. },
  510. onReady(res) {
  511. this.handwriting = new Handwriting({
  512. lineColor: this.lineColor,
  513. slideValue: this.slideValue, // 0, 25, 50, 75, 100
  514. canvasName: 'handWriting'
  515. });
  516. this.$refs.uForm.setRules(this.rules);
  517. },
  518. computed: { ...mapGetters(['dictObj','userInfo']) },
  519. watch:{
  520. userInfo(val, oldVal){//普通的watch监听
  521. if(val){
  522. this.listData.forEach(item => {
  523. if(item.fieldKey == "idcard") {
  524. this.form.idcard = this.userInfo.idCard;
  525. }
  526. if(item.fieldKey == "telphone") {
  527. this.form.telphone = this.userInfo.telphone;
  528. }
  529. if(item.fieldKey == "name") {
  530. this.form.name = this.userInfo.realname
  531. }
  532. })
  533. }
  534. },
  535. },
  536. methods: {
  537. getGoodsDetail() {
  538. return new Promise(resolve => {
  539. this.$api.goodsDetail(this.goodsId).then(res => {
  540. this.goodsData = res.data.data;
  541. if(this.goodsData.categoryName) {
  542. this.form.apply_post = this.goodsData.categoryName;
  543. if(this.goodsData.categoryName) {
  544. this.apply_post_disabled = true;
  545. }
  546. }
  547. resolve()
  548. })
  549. })
  550. },
  551. agree() {
  552. this.agreementModal = false;
  553. setTimeout(() => {
  554. this.$refs.collapse.init()
  555. },1000)
  556. },
  557. refuseAgreement() {
  558. uni.navigateBack({
  559. delta:1
  560. })
  561. },
  562. clearFun(key) {
  563. this.form[key] = '';
  564. },
  565. //清除按钮
  566. clearWatch(key) {
  567. if (this.form[key]) {
  568. return true;
  569. } else {
  570. return false;
  571. }
  572. },
  573. cahngeText() {
  574. this.$set(this.form, 'name', '唐');
  575. console.log(this.form.name, 123);
  576. },
  577. uploadDatas(data) {
  578. var self = this;
  579. if (self.remarkStatus) {
  580. var arsty = {};
  581. for (let k in data) {
  582. for (let j in self.copyData) {
  583. if (k === j) {
  584. if (self.copyData[j].value === data[k]) {
  585. arsty[k] = {
  586. fieldKey: k,
  587. value: data[k],
  588. fieldName: (function() {
  589. for (let i = 0; i < self.listData.length; i++) {
  590. if (self.listData[i].fieldKey == k) {
  591. return self.listData[i].fieldName;
  592. }
  593. }
  594. })(),
  595. status: 0
  596. };
  597. } else {
  598. arsty[k] = {
  599. fieldKey: k,
  600. value: data[k],
  601. fieldName: (function() {
  602. for (let i = 0; i < self.listData.length; i++) {
  603. if (self.listData[i].fieldKey == k) {
  604. return self.listData[i].fieldName;
  605. }
  606. }
  607. })(),
  608. status: 1
  609. };
  610. }
  611. }
  612. }
  613. }
  614. var datas = {
  615. id: this.id,
  616. goodsId: this.goodsId,
  617. keyValue: JSON.stringify(arsty)
  618. };
  619. if(this.isUploading) {
  620. return;
  621. }
  622. this.isUploading = true;
  623. this.$api.editbaseprofiletp(datas).then(res => {
  624. this.isUploading = false;
  625. if (res.data.code === 200) {
  626. this.$method.showToast('提交成功');
  627. uni.navigateBack();
  628. }
  629. });
  630. } else {
  631. var objs = {};
  632. for (let k in data) {
  633. objs[k] = {
  634. fieldKey: k,
  635. value: data[k],
  636. fieldName: (function() {
  637. for (let i = 0; i < self.listData.length; i++) {
  638. if (self.listData[i].fieldKey == k) {
  639. return self.listData[i].fieldName;
  640. }
  641. }
  642. })(),
  643. status: 0
  644. };
  645. }
  646. var datas = {
  647. goodsId: this.goodsId,
  648. profileTpId: this.goodsId,
  649. keyValue: JSON.stringify(objs)
  650. };
  651. if(this.isUploading) {
  652. return;
  653. }
  654. this.isUploading = true;
  655. this.$api.addbaseprofiletp(datas).then(res => {
  656. this.isUploading = false;
  657. if (res.data.code === 200) {
  658. this.$method.showToast('提交成功');
  659. uni.navigateBack();
  660. }
  661. });
  662. }
  663. },
  664. backPage() {
  665. uni.navigateBack();
  666. },
  667. //提交表单
  668. async submitApi() {
  669. var data = JSON.parse(JSON.stringify(this.form));
  670. if (data['sex']) {
  671. data.sex = this.dictObj['sys_user_sex'][Number(data.sex)];
  672. }
  673. if (data['education']) {
  674. data.education = this.dictObj['edu_level'][Number(data.education)];
  675. }
  676. if (data['working_years']) {
  677. data.working_years = this.dictObj['working_years'][Number(data.working_years)];
  678. }
  679. if (data['recent_photos']) {
  680. data.recent_photos = await this.$method.uploadFile(data.recent_photos, 0);
  681. }
  682. if (data['idcard_face_photo']) {
  683. data.idcard_face_photo = await this.$method.uploadFile(data.idcard_face_photo, 0);
  684. }
  685. if (data['idcard_national_photo']) {
  686. data.idcard_national_photo = await this.$method.uploadFile(data.idcard_national_photo, 0);
  687. }
  688. if (data['commitment_electr_signature']) {
  689. data.commitment_electr_signature = await this.$method.uploadFile(data.commitment_electr_signature, 0);
  690. }
  691. this.uploadDatas(data);
  692. },
  693. //验证表单
  694. resultForm(int) {
  695. if (this.openVerify) {
  696. if (this.isRequired) {
  697. this.submitApi();
  698. } else {
  699. if(int === 1) {
  700. this.errorType = ['toast'];
  701. } else {
  702. this.errorType = ['message'];
  703. }
  704. this.$nextTick(() => {
  705. this.$refs.uForm.validate(valid => {
  706. if (valid) {
  707. if (int === 1) {
  708. this.submitApi();
  709. }
  710. } else {
  711. this.errorType = ['message'];
  712. console.log(this.form)
  713. console.log('验证失败');
  714. }
  715. });
  716. })
  717. }
  718. }
  719. },
  720. async submits() {
  721. var ast = this.listData.some(item => {
  722. return item.fieldKey === 'commitment_electr_signature';
  723. });
  724. if (ast) {
  725. await this.subCanvas();
  726. }
  727. this.openVerify = true;
  728. this.resultForm(1);
  729. },
  730. async changePhotoListHeader1(lists, name) {
  731. console.log(lists)
  732. if (lists.length) {
  733. this.fileList1 = lists;
  734. console.log(lists,'lists1')
  735. if (lists[0].url.indexOf('//tmp') !== -1 || lists[0].url.indexOf('//temp') !== -1) {
  736. this.$set(this.form, 'recent_photos', await this.$method.imageInfos(lists[0].url));
  737. }
  738. } else {
  739. this.fileList1 = [];
  740. this.$set(this.form, 'recent_photos', '');
  741. console.log(3, this.form.recent_photos);
  742. }
  743. this.$nextTick(function() {
  744. console.log(4);
  745. this.resultForm();
  746. });
  747. },
  748. async changePhotoListHeader2(lists, name) {
  749. console.log(lists)
  750. if (lists.length) {
  751. this.fileList2 = lists;
  752. console.log(lists,'lists2')
  753. if (lists[0].url.indexOf('//tmp') !== -1 || lists[0].url.indexOf('//temp') !== -1) {
  754. this.$set(this.form, 'idcard_face_photo', await this.$method.imageInfos(lists[0].url));
  755. }
  756. } else {
  757. this.fileList2 = [];
  758. this.$set(this.form, 'idcard_face_photo', '');
  759. }
  760. this.$nextTick(function() {
  761. this.resultForm();
  762. });
  763. },
  764. async changePhotoListHeader3(lists, name) {
  765. console.log(lists)
  766. if (lists.length) {
  767. this.fileList3 = lists;
  768. console.log(lists,'lists3')
  769. if (lists[0].url.indexOf('//tmp') !== -1 || lists[0].url.indexOf('//temp') !== -1) {
  770. this.$set(this.form, 'idcard_national_photo', await this.$method.imageInfos(lists[0].url));
  771. }
  772. } else {
  773. this.fileList3 = [];
  774. this.$set(this.form, 'idcard_national_photo', '');
  775. }
  776. this.$nextTick(function() {
  777. this.resultForm();
  778. });
  779. },
  780. getTimes(key) {
  781. if (this.form[key]) {
  782. return this.form[key];
  783. } else {
  784. return '请选择时间';
  785. }
  786. },
  787. getarrays(key) {
  788. if (key === 'sex') {
  789. console.log(this.dictObj)
  790. return this.dictObj['sys_user_sex'];
  791. }
  792. if (key === 'education') {
  793. return this.dictObj['edu_level'];
  794. }
  795. if (key === 'working_years') {
  796. return this.dictObj['working_years'];
  797. }
  798. },
  799. returnName(key) {
  800. if (key === 'sex') {
  801. if (this.form[key]) {
  802. return this.dictObj['sys_user_sex'][Number(this.form[key])];
  803. } else {
  804. return '请选择性别';
  805. }
  806. }
  807. if (key === 'education') {
  808. if (this.form[key]) {
  809. return this.dictObj['edu_level'][Number(this.form[key])];
  810. } else {
  811. return '请选择学历';
  812. }
  813. }
  814. if (key === 'working_years') {
  815. if (this.form[key]) {
  816. return this.dictObj['working_years'][Number(this.form[key])];
  817. } else {
  818. return '请选择工作年限';
  819. }
  820. }
  821. },
  822. /**
  823. * getbaseprofiletpgetInfo接口返回值result.data.data不存在的话说明是第一次填写资料
  824. */
  825. getInfo() {
  826. var self = this;
  827. this.$api.getbaseprofiletpId(this.goodsId).then(res => {
  828. self.listData = JSON.parse(res.data.data.keyValue);
  829. self.listData.forEach(item => {
  830. if(item.fieldKey == "idcard") {
  831. this.form.idcard = this.userInfo.idCard;
  832. }
  833. if(item.fieldKey == "telphone") {
  834. this.form.telphone = this.userInfo.telphone;
  835. }
  836. if(item.fieldKey == "name") {
  837. this.form.name = this.userInfo.realname
  838. }
  839. })
  840. self.isRequired = self.listData.every(ims => {
  841. return ims.required === false;
  842. });
  843. this.$nextTick(() => {
  844. this.agreementModal = true;
  845. })
  846. self.$api.getbaseprofiletpgetInfo({ goodsId: self.goodsId }).then(result => {
  847. if (result.data.code === 200) {
  848. if (!result.data.data) {
  849. self.$api.getbaseprofiletplistProfile({ pageNum: 1, pageSize: 1, status: 1 }).then(kit => {
  850. if (kit.data.rows.length) {
  851. var ajson = JSON.parse(kit.data.rows[0].keyValue);
  852. self.listData.forEach((zyitem, zyindex) => {
  853. for (let k in ajson) {
  854. if (zyitem.fieldKey == k && ajson[k].value) {
  855. if (k === 'sex') {
  856. const sexIndex = self.dictObj['sys_user_sex'].indexOf(ajson[k].value) + '';
  857. self.$set(self.form, k, sexIndex);
  858. } else if (k === 'education') {
  859. const sexIndex = self.dictObj['edu_level'].indexOf(ajson[k].value) + '';
  860. self.$set(self.form, k, sexIndex);
  861. } else if (k === 'working_years') {
  862. const sexIndex = self.dictObj['working_years'].indexOf(ajson[k].value) + '';
  863. self.$set(self.form, k, sexIndex);
  864. } else if (k === 'recent_photos') {
  865. self.$set(self.form, k, ajson[k].value);
  866. if (ajson[k].value) {
  867. self.fileList1 = [{ url: baseUrls.BASE_IMG_URL + ajson[k].value }];
  868. }
  869. } else if (k === 'idcard_face_photo') {
  870. self.$set(self.form, k, ajson[k].value);
  871. if (ajson[k].value) {
  872. self.fileList2 = [{ url: baseUrls.BASE_IMG_URL + ajson[k].value }];
  873. }
  874. } else if (k === 'idcard_national_photo') {
  875. self.$set(self.form, k, ajson[k].value);
  876. if (ajson[k].value) {
  877. self.fileList3 = [{ url: baseUrls.BASE_IMG_URL + ajson[k].value }];
  878. }
  879. } else {
  880. if(k === 'name'){
  881. self.$set(self.form, k, this.$store.state.userInfo.realname);
  882. } else if(k === 'idcard'){
  883. self.$set(self.form, k, this.$store.state.userInfo.idCard);
  884. } else if(k === 'telphone'){
  885. self.$set(self.form, k, this.$store.state.userInfo.telphone);
  886. } else if(k !== 'commitment_electr_signature'){
  887. self.$set(self.form, k, ajson[k].value);
  888. }
  889. }
  890. }
  891. }
  892. });
  893. }
  894. });
  895. }
  896. if (result.data.data && result.data.data.status === 3) {
  897. self.remark = result.data.data.text;
  898. self.remarkStatus = true;
  899. self.id = result.data.data.id;
  900. var arrays = JSON.parse(result.data.data.keyValue);
  901. self.copyData = JSON.parse(JSON.stringify(arrays));
  902. for (let k in arrays) {
  903. if (k === 'sex') {
  904. if (arrays[k].value) {
  905. const sexIndex = self.dictObj['sys_user_sex'].indexOf(arrays[k].value) + '';
  906. self.$set(self.form, k, sexIndex);
  907. }
  908. } else if (k === 'education') {
  909. if (arrays[k].value) {
  910. const sexIndex = self.dictObj['edu_level'].indexOf(arrays[k].value) + '';
  911. self.$set(self.form, k, sexIndex);
  912. }
  913. } else if (k === 'working_years') {
  914. if (arrays[k].value) {
  915. const sexIndex = self.dictObj['working_years'].indexOf(arrays[k].value) + '';
  916. self.$set(self.form, k, sexIndex);
  917. }
  918. } else if (k === 'recent_photos') {
  919. self.$set(self.form, k, arrays[k].value);
  920. if (arrays[k].value) {
  921. self.fileList1 = [{ url: baseUrls.BASE_IMG_URL + arrays[k].value }];
  922. }
  923. } else if (k === 'idcard_face_photo') {
  924. self.$set(self.form, k, arrays[k].value);
  925. if (arrays[k].value) {
  926. self.fileList2 = [{ url: baseUrls.BASE_IMG_URL + arrays[k].value }];
  927. }
  928. } else if (k === 'idcard_national_photo') {
  929. self.$set(self.form, k, arrays[k].value);
  930. if (arrays[k].value) {
  931. self.fileList3 = [{ url: baseUrls.BASE_IMG_URL + arrays[k].value }];
  932. }
  933. } else {
  934. self.$set(self.form, k, arrays[k].value);
  935. }
  936. }
  937. } else if (result.data.data && (result.data.data.status === 1 || result.data.data.status === 2)) {
  938. uni.showModal({
  939. showCancel: false,
  940. content:
  941. result.data.data.status === 1
  942. ? '该商品审核资料已通过,不可重复提交资料'
  943. : result.data.data.status === 2
  944. ? '该商品审核资料处于待审核状态,不可重复提交资料'
  945. : '请联系管理员',
  946. success: function(k) {
  947. if (k.confirm) {
  948. uni.navigateBack();
  949. }
  950. }
  951. });
  952. }
  953. }
  954. });
  955. });
  956. },
  957. bindPickerChange(key, e) {
  958. this.$set(this.form, key, e.detail.value);
  959. this.$nextTick(function() {
  960. this.resultForm();
  961. });
  962. },
  963. bindDateChange(key, e) {
  964. this.form[key] = e.detail.value;
  965. },
  966. retDraw() {
  967. this.handwriting.retDraw();
  968. this.$set(this.form, 'commitment_electr_signature', '');
  969. this.$nextTick(function() {
  970. this.resultForm();
  971. });
  972. },
  973. uploadScaleStart(event) {
  974. this.handwriting.uploadScaleStart(event);
  975. },
  976. uploadScaleMove(event) {
  977. this.handwriting.uploadScaleMove(event);
  978. },
  979. uploadScaleEnd(event) {
  980. this.handwriting.uploadScaleEnd(event);
  981. },
  982. subCanvas() {
  983. return new Promise((resolve, reject) => {
  984. var self = this;
  985. if (self.form.commitment_electr_signature) {
  986. resolve();
  987. return;
  988. }
  989. self.handwriting
  990. .saveCanvas()
  991. .then(res => {
  992. console.log(res,'res')
  993. if (this.handwriting.linePrack.length) {
  994. this.$set(this.form, 'commitment_electr_signature', res);
  995. }
  996. resolve(res);
  997. })
  998. .catch(err => {
  999. uni.showToast({
  1000. title: '签名上传失败',
  1001. icon: 'error'
  1002. });
  1003. });
  1004. });
  1005. }
  1006. }
  1007. };
  1008. </script>
  1009. <style>
  1010. page {
  1011. background: #eaeef1;
  1012. }
  1013. </style>
  1014. <style scope lang="scss">
  1015. .ctoples {
  1016. position: absolute;
  1017. top: 0;
  1018. left: 0;
  1019. padding: 2rpx 23rpx;
  1020. display: inline-block;
  1021. background-color: rgba(0, 0, 0, 0.4);
  1022. font-size: 28rpx;
  1023. color: #fff;
  1024. border-bottom-right-radius: 24rpx;
  1025. }
  1026. .handWriting {
  1027. width: 100%;
  1028. height: 100%;
  1029. }
  1030. /deep/ .u-collapse-title {
  1031. color: #FF3B30;
  1032. font-size: 24rpx;
  1033. }
  1034. .collapse-item {
  1035. color: #666;
  1036. font-size: 24rpx;
  1037. padding-bottom: 30rpx;
  1038. }
  1039. .dis_stys {
  1040. display: flex;
  1041. align-items: center;
  1042. justify-content: space-between;
  1043. }
  1044. .handCenter {
  1045. background: #f7f7f7;
  1046. border: 2rpx solid #eeeeee;
  1047. border-radius: 24rpx;
  1048. width: 100%;
  1049. height: 300rpx;
  1050. overflow: hidden;
  1051. }
  1052. .headerSDels {
  1053. height: 58rpx;
  1054. padding: 0rpx 24rpx;
  1055. font-weight: bold;
  1056. display: flex;
  1057. align-items: center;
  1058. flex-direction: row-reverse;
  1059. }
  1060. .listBox {
  1061. margin: 24rpx 32rpx 0rpx;
  1062. box-shadow: 0rpx 0rpx 16rpx 4rpx rgba(145, 156, 178, 0.1);
  1063. border-radius: 32rpx;
  1064. background-color: #fff;
  1065. overflow: hidden;
  1066. }
  1067. .imgBoxs {
  1068. width: 156rpx;
  1069. height: 203rpx;
  1070. }
  1071. .imgBoxs2 {
  1072. width: 171rpx;
  1073. height: 108rpx;
  1074. }
  1075. .submit_btn {
  1076. width: 526rpx;
  1077. height: 80rpx;
  1078. background: #007aff;
  1079. border-radius: 40rpx;
  1080. text-align: center;
  1081. line-height: 80rpx;
  1082. color: #ffffff;
  1083. margin: 30rpx auto;
  1084. }
  1085. .picker {
  1086. text-align: right;
  1087. }
  1088. input {
  1089. text-align: right;
  1090. }
  1091. .bodyBox {
  1092. background: #ffffff;
  1093. border-radius: 24rpx;
  1094. width: 100%;
  1095. }
  1096. .topBox {
  1097. height: 80rpx;
  1098. background: #ffffff;
  1099. border-radius: 24rpx;
  1100. width: 100%;
  1101. display: flex;
  1102. justify-content: space-between;
  1103. line-height: 80rpx;
  1104. padding: 0 20rpx;
  1105. font-size: 24rpx;
  1106. }
  1107. .modal {
  1108. .agreement {
  1109. width: 640rpx;
  1110. height: 740rpx;
  1111. background: #FFFFFF;
  1112. display: flex;
  1113. flex-direction: column;
  1114. .body {
  1115. flex:1;
  1116. .content {
  1117. padding:30rpx 40rpx 28rpx;
  1118. line-height: 40rpx;
  1119. font-size: 26rpx;
  1120. color:#666;
  1121. .bold {
  1122. color:#333;
  1123. font-size: 26rpx;
  1124. font-weight: bold;
  1125. }
  1126. .center {
  1127. text-align: center;
  1128. }
  1129. }
  1130. }
  1131. .footer {
  1132. height:140rpx;
  1133. border-top:1px solid #EEEEEE;
  1134. display: flex;
  1135. align-items: center;
  1136. justify-content: center;
  1137. .btn {
  1138. margin:0 12rpx;
  1139. width: 200rpx;
  1140. height: 80rpx;
  1141. color:#007AFF;
  1142. font-size: 30rpx;
  1143. text-align: center;
  1144. line-height: 80rpx;
  1145. background: #F5F5F5;
  1146. border-radius: 40rpx 40rpx 40rpx 40rpx;
  1147. &.ok {
  1148. width: 336rpx;
  1149. height: 80rpx;
  1150. background: #007AFF;
  1151. color:#fff;
  1152. }
  1153. &.close {
  1154. color:#fff;
  1155. width: 560rpx;
  1156. height: 80rpx;
  1157. background: #007AFF;
  1158. border-radius: 40rpx 40rpx 40rpx 40rpx;
  1159. }
  1160. }
  1161. }
  1162. }
  1163. }
  1164. </style>