input.vue 31 KB

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