input.vue 30 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106
  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. @touchstart="uploadScaleStart"
  255. @touchmove="uploadScaleMove"
  256. @touchend="uploadScaleEnd"
  257. @tap="mouseDown"
  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 in listData">{{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. form: {
  308. name: '',
  309. sex: '',
  310. idcard: '',
  311. telphone: '',
  312. education: '',
  313. school: '',
  314. graduation_time: '',
  315. work_unit: '',
  316. unit_contact: '',
  317. unit_tel: '',
  318. apply_post: '',
  319. major: '',
  320. working_years: '',
  321. recent_photos: '',
  322. idcard_face_photo: '',
  323. idcard_national_photo: '',
  324. commitment_electr_signature: ''
  325. },
  326. lineColor: 'black',
  327. slideValue: 50,
  328. handwriting: '',
  329. goodsId: null,
  330. listData: [], //页面数据
  331. fileList1: [], //个人近照
  332. fileList2: [], //人像
  333. fileList3: [], //国徽
  334. openVerify: false, // 控制是否手动验证
  335. id: null, //获取修改ID内容
  336. remark: '', //反馈文本
  337. remarkStatus: false, //是否存在审核结果反馈
  338. // nextStatus: false, //是否有下一步
  339. copyData: [], //备份数据
  340. rules: {
  341. name: [
  342. {
  343. required: true,
  344. message: '请输入姓名',
  345. trigger: ['change', 'blur']
  346. }
  347. ],
  348. sex: [
  349. {
  350. required: true,
  351. message: '请选择性别',
  352. trigger: 'change'
  353. }
  354. ],
  355. idcard: [
  356. {
  357. required: true,
  358. message: '请输入身份证号',
  359. trigger: ['change', 'blur']
  360. },
  361. {
  362. validator: (rule, value, callback) => {
  363. return this.$u.test.idCard(value);
  364. },
  365. message: '身份证号不正确',
  366. trigger: ['change', 'blur']
  367. }
  368. ],
  369. telphone: [
  370. {
  371. required: true,
  372. message: '请输入手机号码',
  373. trigger: ['change', 'blur']
  374. },
  375. {
  376. validator: (rule, value, callback) => {
  377. var vartest = /^([0-9]{3,4}-)?[0-9]{7,8}$/;
  378. if (this.$u.test.mobile(value) || vartest.test(value)) {
  379. return true;
  380. } else {
  381. return false;
  382. }
  383. },
  384. message: '手机号码不正确',
  385. trigger: ['change', 'blur']
  386. }
  387. ],
  388. education: [
  389. {
  390. required: true,
  391. message: '请选择学历',
  392. trigger: 'change'
  393. }
  394. ],
  395. school: [
  396. {
  397. required: true,
  398. message: '请输入毕业院校',
  399. trigger: ['change', 'blur']
  400. }
  401. ],
  402. graduation_time: [
  403. {
  404. required: true,
  405. message: '请选择毕业时间',
  406. trigger: 'change'
  407. }
  408. ],
  409. work_unit: [
  410. {
  411. required: true,
  412. message: '请输入工作单位',
  413. trigger: ['change', 'blur']
  414. }
  415. ],
  416. unit_contact: [
  417. {
  418. required: true,
  419. message: '请输入单位联系人',
  420. trigger: ['change', 'blur']
  421. }
  422. ],
  423. unit_tel: [
  424. {
  425. required: true,
  426. message: '请输入单位联系电话',
  427. trigger: ['change', 'blur']
  428. },
  429. {
  430. validator: (rule, value, callback) => {
  431. var vartest = /^([0-9]{3,4}-)?[0-9]{7,8}$/;
  432. var vartest1 = /^([0-9]{3,4})?[0-9]{7,8}$/;
  433. if (this.$u.test.mobile(value) || vartest.test(value) || vartest1.test(value)) {
  434. return true;
  435. } else {
  436. return false;
  437. }
  438. },
  439. message: '单位联系电话不正确',
  440. trigger: ['change', 'blur']
  441. }
  442. ],
  443. apply_post: [
  444. {
  445. required: true,
  446. message: '请输入报名岗位',
  447. trigger: ['change', 'blur']
  448. }
  449. ],
  450. major: [
  451. {
  452. required: true,
  453. message: '请输入所学专业',
  454. trigger: ['change', 'blur']
  455. }
  456. ],
  457. working_years: [
  458. {
  459. required: true,
  460. message: '请选择工作年限',
  461. trigger: 'change'
  462. }
  463. ],
  464. recent_photos: [
  465. {
  466. required: true,
  467. message: '请上传个人近照',
  468. trigger: ['change', 'blur']
  469. }
  470. ],
  471. idcard_face_photo: [
  472. {
  473. required: true,
  474. message: '请上传身份证正面照',
  475. trigger: ['change', 'blur']
  476. }
  477. ],
  478. idcard_national_photo: [
  479. {
  480. required: true,
  481. message: '请上传身份证国徽照',
  482. trigger: ['change', 'blur']
  483. }
  484. ],
  485. commitment_electr_signature: [
  486. {
  487. required: true,
  488. message: '请签写承诺书电子签',
  489. trigger: ['change', 'blur']
  490. }
  491. ]
  492. },
  493. isRequired: false
  494. };
  495. },
  496. created() {
  497. this.$store.getters.dictObj;
  498. },
  499. async onLoad(option) {
  500. this.goodsId = Number(option.id);
  501. await this.getGoodsDetail()
  502. this.getInfo();
  503. },
  504. onReady(res) {
  505. this.handwriting = new Handwriting({
  506. lineColor: this.lineColor,
  507. slideValue: this.slideValue, // 0, 25, 50, 75, 100
  508. canvasName: 'handWriting'
  509. });
  510. this.$refs.uForm.setRules(this.rules);
  511. },
  512. computed: { ...mapGetters(['dictObj']) },
  513. methods: {
  514. getGoodsDetail() {
  515. return new Promise(resolve => {
  516. this.$api.goodsDetail(this.goodsId).then(res => {
  517. this.goodsData = res.data.data;
  518. resolve()
  519. })
  520. })
  521. },
  522. agree() {
  523. this.agreementModal = false;
  524. },
  525. refuseAgreement() {
  526. uni.navigateBack({
  527. delta:1
  528. })
  529. },
  530. clearFun(key) {
  531. this.form[key] = '';
  532. },
  533. //清除按钮
  534. clearWatch(key) {
  535. if (this.form[key]) {
  536. return true;
  537. } else {
  538. return false;
  539. }
  540. },
  541. cahngeText() {
  542. this.$set(this.form, 'name', '唐');
  543. console.log(this.form.name, 123);
  544. },
  545. uploadDatas(data) {
  546. var self = this;
  547. if (self.remarkStatus) {
  548. var arsty = {};
  549. for (let k in data) {
  550. for (let j in self.copyData) {
  551. if (k === j) {
  552. if (self.copyData[j].value === data[k]) {
  553. arsty[k] = {
  554. fieldKey: k,
  555. value: data[k],
  556. fieldName: (function() {
  557. for (let i = 0; i < self.listData.length; i++) {
  558. if (self.listData[i].fieldKey == k) {
  559. return self.listData[i].fieldName;
  560. }
  561. }
  562. })(),
  563. status: 0
  564. };
  565. } else {
  566. arsty[k] = {
  567. fieldKey: k,
  568. value: data[k],
  569. fieldName: (function() {
  570. for (let i = 0; i < self.listData.length; i++) {
  571. if (self.listData[i].fieldKey == k) {
  572. return self.listData[i].fieldName;
  573. }
  574. }
  575. })(),
  576. status: 1
  577. };
  578. }
  579. }
  580. }
  581. }
  582. var datas = {
  583. id: this.id,
  584. goodsId: this.goodsId,
  585. keyValue: JSON.stringify(arsty)
  586. };
  587. this.$api.editbaseprofiletp(datas).then(res => {
  588. if (res.data.code === 200) {
  589. this.$method.showToast('提交成功');
  590. uni.navigateBack();
  591. }
  592. });
  593. } else {
  594. var objs = {};
  595. for (let k in data) {
  596. objs[k] = {
  597. fieldKey: k,
  598. value: data[k],
  599. fieldName: (function() {
  600. for (let i = 0; i < self.listData.length; i++) {
  601. if (self.listData[i].fieldKey == k) {
  602. return self.listData[i].fieldName;
  603. }
  604. }
  605. })(),
  606. status: 0
  607. };
  608. }
  609. var datas = {
  610. goodsId: this.goodsId,
  611. keyValue: JSON.stringify(objs)
  612. };
  613. this.$api.addbaseprofiletp(datas).then(res => {
  614. if (res.data.code === 200) {
  615. this.$method.showToast('提交成功');
  616. uni.navigateBack();
  617. }
  618. });
  619. }
  620. },
  621. backPage() {
  622. uni.navigateBack();
  623. },
  624. //提交表单
  625. async submitApi() {
  626. var data = JSON.parse(JSON.stringify(this.form));
  627. if (data['sex']) {
  628. data.sex = this.dictObj['sys_user_sex'][Number(data.sex)];
  629. }
  630. if (data['education']) {
  631. data.education = this.dictObj['edu_level'][Number(data.education)];
  632. }
  633. if (data['working_years']) {
  634. data.working_years = this.dictObj['working_years'][Number(data.working_years)];
  635. }
  636. if (data['recent_photos']) {
  637. data.recent_photos = await this.$method.uploadFile(data.recent_photos, 0);
  638. }
  639. if (data['idcard_face_photo']) {
  640. data.idcard_face_photo = await this.$method.uploadFile(data.idcard_face_photo, 0);
  641. }
  642. if (data['idcard_national_photo']) {
  643. data.idcard_national_photo = await this.$method.uploadFile(data.idcard_national_photo, 0);
  644. }
  645. if (data['commitment_electr_signature']) {
  646. data.commitment_electr_signature = await this.$method.uploadFile(data.commitment_electr_signature, 0);
  647. }
  648. this.uploadDatas(data);
  649. },
  650. //验证表单
  651. resultForm(int) {
  652. if (this.openVerify) {
  653. if (this.isRequired) {
  654. this.submitApi();
  655. } else {
  656. this.$refs.uForm.validate(valid => {
  657. if (valid) {
  658. if (int === 1) {
  659. this.submitApi();
  660. }
  661. } else {
  662. console.log('验证失败');
  663. }
  664. });
  665. }
  666. }
  667. },
  668. async submits() {
  669. var ast = this.listData.some(item => {
  670. return item.fieldKey === 'commitment_electr_signature';
  671. });
  672. if (ast) {
  673. await this.subCanvas();
  674. }
  675. this.openVerify = true;
  676. this.resultForm(1);
  677. },
  678. async changePhotoListHeader1(lists, name) {
  679. console.log(lists[0].url);
  680. if (lists.length) {
  681. this.fileList1 = lists;
  682. if (lists[0].url.indexOf('//tmp') !== -1) {
  683. this.$set(this.form, 'recent_photos', await this.$method.imageInfos(lists[0].url));
  684. }
  685. } else {
  686. this.fileList1 = [];
  687. this.$set(this.form, 'recent_photos', '');
  688. console.log(3, this.form.recent_photos);
  689. }
  690. this.$nextTick(function() {
  691. console.log(4);
  692. this.resultForm();
  693. });
  694. },
  695. async changePhotoListHeader2(lists, name) {
  696. if (lists.length) {
  697. this.fileList2 = lists;
  698. if (lists[0].url.indexOf('//tmp') !== -1) {
  699. this.$set(this.form, 'idcard_face_photo', await this.$method.imageInfos(lists[0].url));
  700. }
  701. } else {
  702. this.fileList2 = [];
  703. this.$set(this.form, 'idcard_face_photo', '');
  704. }
  705. this.$nextTick(function() {
  706. this.resultForm();
  707. });
  708. },
  709. async changePhotoListHeader3(lists, name) {
  710. if (lists.length) {
  711. this.fileList3 = lists;
  712. if (lists[0].url.indexOf('//tmp') !== -1) {
  713. this.$set(this.form, 'idcard_national_photo', await this.$method.imageInfos(lists[0].url));
  714. }
  715. } else {
  716. this.fileList3 = [];
  717. this.$set(this.form, 'idcard_national_photo', '');
  718. }
  719. this.$nextTick(function() {
  720. this.resultForm();
  721. });
  722. },
  723. getTimes(key) {
  724. if (this.form[key]) {
  725. return this.form[key];
  726. } else {
  727. return '请选择时间';
  728. }
  729. },
  730. getarrays(key) {
  731. if (key === 'sex') {
  732. return this.dictObj['sys_user_sex'];
  733. }
  734. if (key === 'education') {
  735. return this.dictObj['edu_level'];
  736. }
  737. if (key === 'working_years') {
  738. return this.dictObj['working_years'];
  739. }
  740. },
  741. returnName(key) {
  742. if (key === 'sex') {
  743. if (this.form[key]) {
  744. return this.dictObj['sys_user_sex'][Number(this.form[key])];
  745. } else {
  746. return '请选择性别';
  747. }
  748. }
  749. if (key === 'education') {
  750. if (this.form[key]) {
  751. return this.dictObj['edu_level'][Number(this.form[key])];
  752. } else {
  753. return '请选择学历';
  754. }
  755. }
  756. if (key === 'working_years') {
  757. if (this.form[key]) {
  758. return this.dictObj['working_years'][Number(this.form[key])];
  759. } else {
  760. return '请选择工作年限';
  761. }
  762. }
  763. },
  764. /**
  765. * getbaseprofiletpgetInfo接口返回值result.data.data不存在的话说明是第一次填写资料
  766. */
  767. getInfo() {
  768. var self = this;
  769. this.$api.getbaseprofiletpId(this.goodsId).then(res => {
  770. self.listData = JSON.parse(res.data.data.keyValue);
  771. self.isRequired = self.listData.every(ims => {
  772. return ims.required === false;
  773. });
  774. this.$nextTick(() => {
  775. this.agreementModal = true;
  776. })
  777. self.$api.getbaseprofiletpgetInfo({ goodsId: self.goodsId }).then(result => {
  778. if (result.data.code === 200) {
  779. if (!result.data.data) {
  780. self.$api.getbaseprofiletplistProfile({ pageNum: 1, pageSize: 1, status: 1 }).then(kit => {
  781. if (kit.data.rows.length) {
  782. var ajson = JSON.parse(kit.data.rows[0].keyValue);
  783. self.listData.forEach((zyitem, zyindex) => {
  784. for (let k in ajson) {
  785. if (zyitem.fieldKey == k && ajson[k].value) {
  786. if (k === 'sex') {
  787. const sexIndex = self.dictObj['sys_user_sex'].indexOf(ajson[k].value) + '';
  788. self.$set(self.form, k, sexIndex);
  789. } else if (k === 'education') {
  790. const sexIndex = self.dictObj['edu_level'].indexOf(ajson[k].value) + '';
  791. self.$set(self.form, k, sexIndex);
  792. } else if (k === 'working_years') {
  793. const sexIndex = self.dictObj['working_years'].indexOf(ajson[k].value) + '';
  794. self.$set(self.form, k, sexIndex);
  795. } else if (k === 'recent_photos') {
  796. self.$set(self.form, k, ajson[k].value);
  797. if (ajson[k].value) {
  798. self.fileList1 = [{ url: baseUrls.BASE_IMG_URL + ajson[k].value }];
  799. }
  800. } else if (k === 'idcard_face_photo') {
  801. self.$set(self.form, k, ajson[k].value);
  802. if (ajson[k].value) {
  803. self.fileList2 = [{ url: baseUrls.BASE_IMG_URL + ajson[k].value }];
  804. }
  805. } else if (k === 'idcard_national_photo') {
  806. self.$set(self.form, k, ajson[k].value);
  807. if (ajson[k].value) {
  808. self.fileList3 = [{ url: baseUrls.BASE_IMG_URL + ajson[k].value }];
  809. }
  810. } else {
  811. if(k === 'name'){
  812. self.$set(self.form, k, this.$store.state.userInfo.realname);
  813. } else if(k === 'idcard'){
  814. self.$set(self.form, k, this.$store.state.userInfo.idCard);
  815. } else if(k === 'telphone'){
  816. self.$set(self.form, k, this.$store.state.userInfo.telphone);
  817. } else if(k !== 'commitment_electr_signature'){
  818. self.$set(self.form, k, ajson[k].value);
  819. }
  820. }
  821. }
  822. }
  823. });
  824. }
  825. });
  826. }
  827. if (result.data.data && result.data.data.status === 3) {
  828. self.remark = result.data.data.text;
  829. self.remarkStatus = true;
  830. self.id = result.data.data.id;
  831. var arrays = JSON.parse(result.data.data.keyValue);
  832. self.copyData = JSON.parse(JSON.stringify(arrays));
  833. for (let k in arrays) {
  834. if (k === 'sex') {
  835. if (arrays[k].value) {
  836. const sexIndex = self.dictObj['sys_user_sex'].indexOf(arrays[k].value) + '';
  837. self.$set(self.form, k, sexIndex);
  838. }
  839. } else if (k === 'education') {
  840. if (arrays[k].value) {
  841. const sexIndex = self.dictObj['edu_level'].indexOf(arrays[k].value) + '';
  842. self.$set(self.form, k, sexIndex);
  843. }
  844. } else if (k === 'working_years') {
  845. if (arrays[k].value) {
  846. const sexIndex = self.dictObj['working_years'].indexOf(arrays[k].value) + '';
  847. self.$set(self.form, k, sexIndex);
  848. }
  849. } else if (k === 'recent_photos') {
  850. self.$set(self.form, k, arrays[k].value);
  851. if (arrays[k].value) {
  852. self.fileList1 = [{ url: baseUrls.BASE_IMG_URL + arrays[k].value }];
  853. }
  854. } else if (k === 'idcard_face_photo') {
  855. self.$set(self.form, k, arrays[k].value);
  856. if (arrays[k].value) {
  857. self.fileList2 = [{ url: baseUrls.BASE_IMG_URL + arrays[k].value }];
  858. }
  859. } else if (k === 'idcard_national_photo') {
  860. self.$set(self.form, k, arrays[k].value);
  861. if (arrays[k].value) {
  862. self.fileList3 = [{ url: baseUrls.BASE_IMG_URL + arrays[k].value }];
  863. }
  864. } else {
  865. self.$set(self.form, k, arrays[k].value);
  866. }
  867. }
  868. } else if (result.data.data && (result.data.data.status === 1 || result.data.data.status === 2)) {
  869. uni.showModal({
  870. showCancel: false,
  871. content:
  872. result.data.data.status === 1
  873. ? '该商品审核资料已通过,不可重复提交资料'
  874. : result.data.data.status === 2
  875. ? '该商品审核资料处于待审核状态,不可重复提交资料'
  876. : '请联系管理员',
  877. success: function(k) {
  878. if (k.confirm) {
  879. uni.navigateBack();
  880. }
  881. }
  882. });
  883. }
  884. }
  885. });
  886. });
  887. },
  888. bindPickerChange(key, e) {
  889. this.$set(this.form, key, e.detail.value);
  890. this.$nextTick(function() {
  891. this.resultForm();
  892. });
  893. },
  894. bindDateChange(key, e) {
  895. this.form[key] = e.detail.value;
  896. },
  897. retDraw() {
  898. this.handwriting.retDraw();
  899. this.$set(this.form, 'commitment_electr_signature', '');
  900. this.$nextTick(function() {
  901. this.resultForm();
  902. });
  903. },
  904. uploadScaleStart(event) {
  905. this.handwriting.uploadScaleStart(event);
  906. },
  907. uploadScaleMove(event) {
  908. this.handwriting.uploadScaleMove(event);
  909. },
  910. uploadScaleEnd(event) {
  911. this.handwriting.uploadScaleEnd(event);
  912. },
  913. subCanvas() {
  914. return new Promise((resolve, reject) => {
  915. var self = this;
  916. if (self.form.commitment_electr_signature) {
  917. resolve();
  918. return;
  919. }
  920. self.handwriting
  921. .saveCanvas()
  922. .then(res => {
  923. if (this.handwriting.linePrack.length) {
  924. this.$set(this.form, 'commitment_electr_signature', res);
  925. }
  926. resolve(res);
  927. })
  928. .catch(err => {
  929. uni.showToast({
  930. title: '签名上传失败',
  931. icon: 'error'
  932. });
  933. });
  934. });
  935. }
  936. }
  937. };
  938. </script>
  939. <style>
  940. page {
  941. background: #eaeef1;
  942. }
  943. </style>
  944. <style scope lang="scss">
  945. .ctoples {
  946. position: absolute;
  947. top: 0;
  948. left: 0;
  949. padding: 2rpx 23rpx;
  950. display: inline-block;
  951. background-color: rgba(0, 0, 0, 0.4);
  952. font-size: 28rpx;
  953. color: #fff;
  954. border-bottom-right-radius: 24rpx;
  955. }
  956. .handWriting {
  957. width: 100%;
  958. height: 100%;
  959. }
  960. /deep/ .u-collapse-title {
  961. color: #FF3B30;
  962. font-size: 24rpx;
  963. }
  964. .collapse-item {
  965. color: #666;
  966. font-size: 24rpx;
  967. padding-bottom: 30rpx;
  968. }
  969. .dis_stys {
  970. display: flex;
  971. align-items: center;
  972. justify-content: space-between;
  973. }
  974. .handCenter {
  975. background: #f7f7f7;
  976. border: 2rpx solid #eeeeee;
  977. border-radius: 24rpx;
  978. width: 100%;
  979. height: 300rpx;
  980. overflow: hidden;
  981. }
  982. .headerSDels {
  983. height: 58rpx;
  984. padding: 0rpx 24rpx;
  985. font-weight: bold;
  986. display: flex;
  987. align-items: center;
  988. flex-direction: row-reverse;
  989. }
  990. .listBox {
  991. margin: 24rpx 32rpx 0rpx;
  992. box-shadow: 0rpx 0rpx 16rpx 4rpx rgba(145, 156, 178, 0.1);
  993. border-radius: 32rpx;
  994. background-color: #fff;
  995. overflow: hidden;
  996. }
  997. .imgBoxs {
  998. width: 156rpx;
  999. height: 203rpx;
  1000. }
  1001. .imgBoxs2 {
  1002. width: 171rpx;
  1003. height: 108rpx;
  1004. }
  1005. .submit_btn {
  1006. width: 526rpx;
  1007. height: 80rpx;
  1008. background: #007aff;
  1009. border-radius: 40rpx;
  1010. text-align: center;
  1011. line-height: 80rpx;
  1012. color: #ffffff;
  1013. margin: 30rpx auto;
  1014. }
  1015. .picker {
  1016. text-align: right;
  1017. }
  1018. input {
  1019. text-align: right;
  1020. }
  1021. .bodyBox {
  1022. background: #ffffff;
  1023. border-radius: 24rpx;
  1024. width: 100%;
  1025. }
  1026. .topBox {
  1027. height: 80rpx;
  1028. background: #ffffff;
  1029. border-radius: 24rpx;
  1030. width: 100%;
  1031. display: flex;
  1032. justify-content: space-between;
  1033. line-height: 80rpx;
  1034. padding: 0 20rpx;
  1035. font-size: 24rpx;
  1036. }
  1037. .modal {
  1038. .agreement {
  1039. width: 640rpx;
  1040. height: 740rpx;
  1041. background: #FFFFFF;
  1042. display: flex;
  1043. flex-direction: column;
  1044. .body {
  1045. flex:1;
  1046. .content {
  1047. padding:30rpx 40rpx 28rpx;
  1048. line-height: 40rpx;
  1049. font-size: 26rpx;
  1050. color:#666;
  1051. .bold {
  1052. color:#333;
  1053. font-size: 26rpx;
  1054. font-weight: bold;
  1055. }
  1056. .center {
  1057. text-align: center;
  1058. }
  1059. }
  1060. }
  1061. .footer {
  1062. height:140rpx;
  1063. border-top:1px solid #EEEEEE;
  1064. display: flex;
  1065. align-items: center;
  1066. justify-content: center;
  1067. .btn {
  1068. margin:0 12rpx;
  1069. width: 200rpx;
  1070. height: 80rpx;
  1071. color:#007AFF;
  1072. font-size: 30rpx;
  1073. text-align: center;
  1074. line-height: 80rpx;
  1075. background: #F5F5F5;
  1076. border-radius: 40rpx 40rpx 40rpx 40rpx;
  1077. &.ok {
  1078. width: 336rpx;
  1079. height: 80rpx;
  1080. background: #007AFF;
  1081. color:#fff;
  1082. }
  1083. &.close {
  1084. color:#fff;
  1085. width: 560rpx;
  1086. height: 80rpx;
  1087. background: #007AFF;
  1088. border-radius: 40rpx 40rpx 40rpx 40rpx;
  1089. }
  1090. }
  1091. }
  1092. }
  1093. }
  1094. </style>