details.vue 27 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012
  1. <template>
  2. <view class="">
  3. <uni-section title="基本信息" style="padding: 0 62rpx;" titleColor="5F5F5F" titleFontSize="28rpx">
  4. <template v-slot:right>
  5. <text style="color: #5F5F5F;">
  6. {{form.claimNo}}
  7. </text>
  8. </template>
  9. <uni-forms ref="form1" :modelValue="form" :border="true" label-width="80">
  10. <uni-forms-item name="consumerName" label="联系人">
  11. <uni-easyinput v-model="form.consumerName" class="right-align" placeholder-class="placeholder-right"
  12. placeholder="请输入联系人" :inputBorder="false" :disabled="true" :clearable="false"></uni-easyinput>
  13. </uni-forms-item>
  14. <uni-forms-item name="consumerPhone" label="电话" required>
  15. <uni-easyinput v-model="form.consumerPhone" class="right-align" type="number"
  16. placeholder-class="placeholder-right" placeholder="请输入电话" :inputBorder="false" :disabled="true"
  17. :clearable="false" maxlength="11" @change="photoChange"></uni-easyinput>
  18. </uni-forms-item>
  19. <uni-forms-item name="vehicleNumber" label="车牌号">
  20. <view style="display: flex;align-items: center;">
  21. <!-- <uni-easyinput v-model="form.vehicleNumber" class="right-align"
  22. placeholder-class="placeholder-right" placeholder="请输入车牌号" :inputBorder="false"
  23. :disabled="true" :clearable="false" @change="carNoVerify" maxlength="8"
  24. @click="handleInputFocus"></uni-easyinput> -->
  25. <view style="display: flex;align-items: center;height: 36px;width: 100%;">
  26. <view @click="handleInputFocus()" style="width: 100%;text-align: right;padding: 0 20rpx;"
  27. :style="form.vehicleNumber?'color:#000;':'color:#B5B4B4;font-size: 24rpx;'">
  28. {{form.vehicleNumber||'请输入车牌号'}}
  29. </view>
  30. </view>
  31. <uni-icons v-if="!(true)" type="camera" size="24" color='#03803B'
  32. @click="allClick('识别车牌号')"></uni-icons>
  33. </view>
  34. </uni-forms-item>
  35. <uni-forms-item name="tyreNo" label="胎号">
  36. <view style="display: flex;align-items: center;">
  37. <uni-easyinput v-model="form.tyreNo" class="right-align" placeholder-class="placeholder-right"
  38. placeholder="请输入胎号" :inputBorder="false" :disabled="true" :clearable="false"
  39. @change="getMaterialDetail"></uni-easyinput>
  40. <uni-icons v-if="!(true)" type="scan" size="24" color='#03803B'
  41. @click="allClick('识别胎号')"></uni-icons>
  42. </view>
  43. </uni-forms-item>
  44. <uni-forms-item name="tyreSpecs" label="规格型号">
  45. <uni-easyinput v-model="form.tyreSpecs" class="right-align" placeholder-class="placeholder-right"
  46. placeholder="" :inputBorder="false" :disabled="true" :clearable="false"></uni-easyinput>
  47. </uni-forms-item>
  48. <uni-forms-item name="brandItem" label="花纹">
  49. <uni-easyinput v-model="form.brandItem" class="right-align" placeholder-class="placeholder-right"
  50. placeholder="" :inputBorder="false" :disabled="true" :clearable="false"></uni-easyinput>
  51. </uni-forms-item>
  52. <uni-forms-item name="brandName" label="品牌">
  53. <uni-easyinput v-model="form.brandName" class="right-align" placeholder-class="placeholder-right"
  54. placeholder="" :inputBorder="false" :disabled="true" :clearable="false"></uni-easyinput>
  55. </uni-forms-item>
  56. <uni-forms-item name="tireQuantity" label="轮胎数量">
  57. <uni-easyinput v-model="form.tireQuantity" class="right-align" placeholder-class="placeholder-right"
  58. placeholder="请输入数量" :inputBorder="false" :disabled="true" type="number"
  59. @blur="intBlur('tireQuantity',form.tireQuantity)" :clearable="false"></uni-easyinput>
  60. </uni-forms-item>
  61. <uni-forms-item name="claimAmount" label="索赔金额">
  62. <uni-easyinput v-model="form.claimAmount" class="right-align" placeholder-class="placeholder-right"
  63. placeholder="" :inputBorder="false" :disabled="true" type="number"
  64. @blur="handleBlur(form.claimAmount)" :clearable="false"></uni-easyinput>
  65. </uni-forms-item>
  66. <uni-forms-item name="claimReason" label="理赔原因">
  67. <uni-easyinput v-model="form.claimReason" class="right-align" type="textarea"
  68. placeholder-class="placeholder-right" placeholder="请输入内容" :inputBorder="false"
  69. :del-icon="!(true)" :disabled="true"></uni-easyinput>
  70. </uni-forms-item>
  71. </uni-forms>
  72. </uni-section>
  73. <uni-section title="相应图片信息" style="padding: 0 62rpx 60rpx 62rpx;margin-top: 30rpx;" titleColor="5F5F5F"
  74. titleFontSize="28rpx">
  75. <view class="photo-upload">
  76. <view>
  77. <view class="photo-upload-text">示例照片</view>
  78. <view>
  79. <image class="photo-upload-img" src="@/static/images/home/claim/em4.png" />
  80. </view>
  81. </view>
  82. <view>
  83. <view class="photo-upload-text" style="color: #03803B;">病象</view>
  84. <view class="photo-upload-upload">
  85. <uni-file-picker v-model="form.file1" return-type="object" limit="1" :imageStyles="imageStyles"
  86. file-mediatype="image" @select="fileSelect1" @delete="fileDelete" :del-icon="false"
  87. :sourceType="['camera']" :readonly="!form.file1">
  88. <image class="photo-upload-img2" src="@/static/images/home/claim/upload.png" />
  89. </uni-file-picker>
  90. </view>
  91. </view>
  92. </view>
  93. <view class="photo-upload">
  94. <view>
  95. <view class="photo-upload-text">示例照片</view>
  96. <view>
  97. <image class="photo-upload-img" src="@/static/images/home/claim/em2.png" />
  98. </view>
  99. </view>
  100. <view>
  101. <view class="photo-upload-text" style="color: #03803B;">轮胎DOT</view>
  102. <view class="photo-upload-upload">
  103. <uni-file-picker v-model="form.file2" return-type="object" limit="1" :imageStyles="imageStyles"
  104. file-mediatype="image" @select="fileSelect2" @delete="fileDelete" :del-icon="false"
  105. :sourceType="['camera']" :readonly="!form.file2">
  106. <image class="photo-upload-img2" src="@/static/images/home/claim/upload.png" />
  107. </uni-file-picker>
  108. </view>
  109. </view>
  110. </view>
  111. <view class="photo-upload">
  112. <view>
  113. <view class="photo-upload-text">示例照片</view>
  114. <view>
  115. <image class="photo-upload-img" src="@/static/images/home/claim/em3.png" />
  116. </view>
  117. </view>
  118. <view>
  119. <view class="photo-upload-text" style="color: #03803B;">花纹深度</view>
  120. <view class="photo-upload-upload">
  121. <uni-file-picker v-model="form.file3" return-type="object" limit="1" :imageStyles="imageStyles"
  122. file-mediatype="image" @select="fileSelect3" @delete="fileDelete" :del-icon="false"
  123. :sourceType="['camera']" :readonly="!form.file3">
  124. <image class="photo-upload-img2" src="@/static/images/home/claim/upload.png" />
  125. </uni-file-picker>
  126. </view>
  127. </view>
  128. </view>
  129. </uni-section>
  130. <u-keyboard ref="uKeyboard" mode="car" :show="carShow" @change="carChange" @backspace="backspace"
  131. :showCancel="false" :showConfirm="false" @close="carShow=false" :safeAreaInsetBottom="true"
  132. :autoChange="true"></u-keyboard>
  133. </view>
  134. </template>
  135. <script>
  136. import http from '@/http/api.js'
  137. import {
  138. clientId,
  139. clientSecret
  140. } from '@/common/setting'
  141. import {
  142. submit,
  143. getDetail,
  144. fileRemove,
  145. submitApproval,
  146. revokeApproval,
  147. getMaterialDetail
  148. } from '@/api/home/claim.js'
  149. export default {
  150. data() {
  151. return {
  152. carShow: false,
  153. form: {
  154. file1: null,
  155. file2: null,
  156. file3: null,
  157. file4: null,
  158. vehicleNumber: '',
  159. tyreNo: null,
  160. tyreSpecs: null,
  161. claimSourceType: 1,
  162. tireQuantity: 1,
  163. claimAmount: null,
  164. claimAttachmentList: [],
  165. },
  166. imageStyles: {
  167. width: 145,
  168. height: 145,
  169. border: false,
  170. },
  171. mapObject: {
  172. text: 'name',
  173. value: 'code',
  174. children: 'children'
  175. },
  176. addressData: [],
  177. labelList: [],
  178. corpsTypeList: [],
  179. storeAttributesList: [],
  180. chainAttributeList: [],
  181. signingLevelList: [],
  182. }
  183. },
  184. onLoad(option) {
  185. this.addressData = JSON.parse(uni.getStorageSync("addressData"))
  186. if (option && option.id) {
  187. this.getDetail(option.id)
  188. }
  189. },
  190. methods: {
  191. // 处理输入框聚焦事件
  192. handleInputFocus() {
  193. if (this.form.auditStatus > 0 || this.form.claimSourceType > 1) return
  194. this.carShow = true;
  195. },
  196. // 按键被点击(点击退格键不会触发此事件)
  197. carChange(val) {
  198. // 将每次按键的值拼接到value变量中,注意+=写法
  199. if (this.form.vehicleNumber.length < 8) {
  200. this.form.vehicleNumber += val;
  201. }
  202. },
  203. // 退格键被点击
  204. backspace() {
  205. if (this.form.vehicleNumber.length) this.form.vehicleNumber = this.form.vehicleNumber.substr(0, this.form
  206. .vehicleNumber.length - 1);
  207. },
  208. photoChange(val) {
  209. if (val) {
  210. if (!/^[1][3,4,5,7,8,9][0-9]{9}$/.test(val)) {
  211. uni.showToast({
  212. title: '请输入正确电话',
  213. icon: 'none'
  214. });
  215. return;
  216. }
  217. }
  218. },
  219. carNoVerify(plateNumber) {
  220. if (plateNumber) {
  221. const PROVINCES = [
  222. '京', '津', '冀', '晋', '蒙', '辽', '吉', '黑',
  223. '沪', '苏', '浙', '皖', '闽', '赣', '鲁', '豫',
  224. '鄂', '湘', '粤', '桂', '琼', '川', '贵', '云',
  225. '渝', '藏', '陕', '甘', '青', '宁', '新', '台',
  226. '港', '澳'
  227. ]
  228. const AGENCY_PATTERN = /^[A-HJ-NP-Z]$/
  229. const BLUE_PLATE_PATTERN = /^[0-9A-HJ-NP-Z]{5}$/
  230. // 绿牌能源类型标识
  231. const ENERGY_TYPES = {
  232. 'D': '纯电动',
  233. 'F': '非纯电动'
  234. }
  235. const GREEN_PLATE_PATTERN = /^[0-9A-HJ-NP-Z]{6}$/
  236. const plate = plateNumber.toUpperCase().trim()
  237. // 长度检查
  238. if (plate.length !== 7 && plate.length !== 8) {
  239. uni.showToast({
  240. title: '请输入有效的车牌号!',
  241. icon: 'none'
  242. });
  243. return false
  244. }
  245. // 省份简称检查
  246. if (!PROVINCES.includes(plate.charAt(0))) {
  247. uni.showToast({
  248. title: '请输入有效的车牌号!',
  249. icon: 'none'
  250. });
  251. return false
  252. }
  253. // 发牌机关代号检查
  254. if (!AGENCY_PATTERN.test(plate.charAt(1))) {
  255. return uni.showToast({
  256. title: '请输入有效的车牌号!',
  257. icon: 'none'
  258. });
  259. }
  260. // 蓝牌检查
  261. if (plate.length === 7) {
  262. const serial = plate.substring(2)
  263. if (!(BLUE_PLATE_PATTERN.test(serial) && !/[IO]/.test(serial))) {
  264. uni.showToast({
  265. title: '请输入有效的车牌号!',
  266. icon: 'none'
  267. });
  268. return false
  269. }
  270. }
  271. // 绿牌检查
  272. if (plate.length === 8) {
  273. const energyType = plate.charAt(2)
  274. const serial = plate.substring(2)
  275. if (!((energyType === 'D' || energyType === 'F'))) {
  276. uni.showToast({
  277. title: '请输入有效的车牌号!',
  278. icon: 'none'
  279. });
  280. return false
  281. }
  282. if (!(GREEN_PLATE_PATTERN.test(serial) && !/[IO]/.test(serial))) {
  283. uni.showToast({
  284. title: '请输入有效的车牌号!',
  285. icon: 'none'
  286. });
  287. return false
  288. }
  289. }
  290. }
  291. return true
  292. },
  293. allClick(name) {
  294. if (!(this.form.auditStatus > 0 || this.form.claimSourceType > 1)) {
  295. if (name == '识别车牌号') {
  296. let _this = this
  297. uni.chooseImage({
  298. count: 1, //默认9
  299. sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
  300. sourceType: ['camera'],
  301. success: function(file) {
  302. uni.showLoading({
  303. title: '加载中',
  304. mask: true
  305. });
  306. uni.uploadFile({
  307. url: http.config.baseURL +
  308. '/gubersail-app/appClaim/recognizeLicensePlateNumber', // 仅为示例,非真实的接口地址
  309. filePath: file.tempFilePaths[0],
  310. header: {
  311. // 客户端认证参数
  312. 'Authorization': 'Basic ' + Base64.encode(clientId + ':' +
  313. clientSecret),
  314. 'Blade-Auth': 'bearer ' + uni.getStorageSync('accessToken')
  315. },
  316. name: 'file',
  317. success: (res) => {
  318. const data = JSON.parse(res.data)
  319. console.log(data)
  320. _this.form.vehicleNumber = data.data
  321. uni.showToast({
  322. title: data.msg,
  323. icon: 'none',
  324. duration: 2000
  325. });
  326. },
  327. fail: (err) => {
  328. uni.showToast({
  329. title: err,
  330. icon: 'none',
  331. duration: 2000
  332. });
  333. },
  334. complete: () => {
  335. uni.hideLoading()
  336. }
  337. })
  338. }
  339. });
  340. }
  341. if (name == '识别胎号') {
  342. let _this = this
  343. uni.scanCode({
  344. scanType: ['barCode'],
  345. onlyFromCamera: true,
  346. success: function(res) {
  347. _this.form.tyreNo = res.result
  348. _this.getMaterialDetail(res.result)
  349. }
  350. });
  351. }
  352. }
  353. },
  354. getMaterialDetail(val) {
  355. if (val) {
  356. let obj = {
  357. tireNumber: val
  358. }
  359. getMaterialDetail(obj).then(res => {
  360. console.log(res.data)
  361. if (res.data) {
  362. this.form.tyreSpecs = res.data.sizeId
  363. this.form.brandItem = res.data.pattern
  364. this.form.brandName = res.data.brand
  365. } else {
  366. uni.showToast({
  367. title: res.msg,
  368. icon: 'none'
  369. });
  370. this.form.tyreSpecs = null
  371. this.form.brandItem = null
  372. this.form.brandName = null
  373. }
  374. })
  375. } else {
  376. this.form.tyreSpecs = null
  377. this.form.brandItem = null
  378. this.form.brandName = null
  379. }
  380. },
  381. removeByIdFilter(arr, id) {
  382. return arr.filter(item => item.id !== id);
  383. },
  384. // handleInput(value) {
  385. // const decimalRegex = /^-?\d+\.\d+$/ // 小数正则
  386. // if (decimalRegex.test(value)) {
  387. // uni.showToast({
  388. // title: '请输入整数',
  389. // icon: 'none'
  390. // });
  391. // }
  392. // },
  393. intBlur(name, value) {
  394. if (!this.form[name]) return
  395. // 使用toFixed处理小数位
  396. try {
  397. const num = parseFloat(this.form[name])
  398. if (!isNaN(num)) {
  399. this.form[name] = Math.floor(num)
  400. }
  401. } catch (e) {
  402. console.error('格式化错误', e)
  403. }
  404. },
  405. handleBlur(value) {
  406. if (!this.form.claimAmount) return
  407. // 使用toFixed处理小数位
  408. try {
  409. const num = parseFloat(this.form.claimAmount)
  410. if (!isNaN(num)) {
  411. this.form.claimAmount = num.toFixed(4)
  412. }
  413. } catch (e) {
  414. console.error('格式化错误', e)
  415. }
  416. },
  417. fileDelete(row) {
  418. if (row.tempFile.id) {
  419. uni.showLoading({
  420. title: '加载中',
  421. mask: true
  422. });
  423. fileRemove(row.tempFile.id).then(res => {
  424. uni.showToast({
  425. title: '删除成功',
  426. icon: 'none'
  427. });
  428. this.form.claimAttachmentList = this.removeByIdFilter(this.form.claimAttachmentList, row
  429. .tempFile.id);
  430. }).finally(() => {
  431. uni.hideLoading()
  432. });
  433. }
  434. },
  435. getFileExtension(filename) {
  436. return filename.slice(((filename.lastIndexOf(".") - 1) >>> 0) + 2);
  437. },
  438. fileSelect1(files) {
  439. files.tempFiles.forEach(file => {
  440. uni.showLoading({
  441. title: '加载中',
  442. mask: true
  443. });
  444. uni.uploadFile({
  445. url: http.config.baseURL +
  446. '/blade-resource/oss/endpoint/put-file', // 仅为示例,非真实的接口地址
  447. filePath: file.path,
  448. header: {
  449. // 客户端认证参数
  450. 'Authorization': 'Basic ' + Base64.encode(clientId + ':' + clientSecret),
  451. 'Blade-Auth': 'bearer ' + uni.getStorageSync('accessToken')
  452. },
  453. name: 'file',
  454. success: (res) => {
  455. const data = JSON.parse(res.data).data
  456. this.form.file1 = {
  457. ...this.form.file1,
  458. url: data.link,
  459. name: data.originalName,
  460. extname: this.getFileExtension(data.originalName),
  461. size: file.size,
  462. }
  463. uni.showToast({
  464. title: '上传成功',
  465. icon: 'none'
  466. });
  467. },
  468. fail: (err) => {
  469. uni.showToast({
  470. title: '上传失败',
  471. icon: 'none'
  472. });
  473. },
  474. complete: () => {
  475. uni.hideLoading()
  476. }
  477. })
  478. })
  479. },
  480. fileSelect2(files) {
  481. files.tempFiles.forEach(file => {
  482. uni.showLoading({
  483. title: '加载中',
  484. mask: true
  485. });
  486. uni.uploadFile({
  487. url: http.config.baseURL +
  488. '/blade-resource/oss/endpoint/put-file', // 仅为示例,非真实的接口地址
  489. filePath: file.path,
  490. header: {
  491. // 客户端认证参数
  492. 'Authorization': 'Basic ' + Base64.encode(clientId + ':' + clientSecret),
  493. 'Blade-Auth': 'bearer ' + uni.getStorageSync('accessToken')
  494. },
  495. name: 'file',
  496. success: (res) => {
  497. const data = JSON.parse(res.data).data
  498. this.form.file2 = {
  499. ...this.form.file2,
  500. url: data.link,
  501. name: data.originalName,
  502. extname: this.getFileExtension(data.originalName),
  503. size: file.size,
  504. }
  505. uni.showToast({
  506. title: '上传成功',
  507. icon: 'none'
  508. });
  509. },
  510. fail: (err) => {
  511. uni.showToast({
  512. title: '上传失败',
  513. icon: 'none'
  514. });
  515. },
  516. complete: () => {
  517. uni.hideLoading()
  518. }
  519. })
  520. })
  521. },
  522. fileSelect3(files) {
  523. files.tempFiles.forEach(file => {
  524. uni.showLoading({
  525. title: '加载中',
  526. mask: true
  527. });
  528. uni.uploadFile({
  529. url: http.config.baseURL +
  530. '/blade-resource/oss/endpoint/put-file', // 仅为示例,非真实的接口地址
  531. filePath: file.path,
  532. header: {
  533. // 客户端认证参数
  534. 'Authorization': 'Basic ' + Base64.encode(clientId + ':' + clientSecret),
  535. 'Blade-Auth': 'bearer ' + uni.getStorageSync('accessToken')
  536. },
  537. name: 'file',
  538. success: (res) => {
  539. const data = JSON.parse(res.data).data
  540. this.form.file3 = {
  541. ...this.form.file3,
  542. url: data.link,
  543. name: data.originalName,
  544. extname: this.getFileExtension(data.originalName),
  545. size: file.size,
  546. }
  547. uni.showToast({
  548. title: '上传成功',
  549. icon: 'none'
  550. });
  551. },
  552. fail: (err) => {
  553. uni.showToast({
  554. title: '上传失败',
  555. icon: 'none'
  556. });
  557. },
  558. complete: () => {
  559. uni.hideLoading()
  560. }
  561. })
  562. })
  563. },
  564. fileSelect4(files) {
  565. files.tempFiles.forEach(file => {
  566. uni.showLoading({
  567. title: '加载中',
  568. mask: true
  569. });
  570. uni.uploadFile({
  571. url: http.config.baseURL +
  572. '/blade-resource/oss/endpoint/put-file', // 仅为示例,非真实的接口地址
  573. filePath: file.path,
  574. header: {
  575. // 客户端认证参数
  576. 'Authorization': 'Basic ' + Base64.encode(clientId + ':' + clientSecret),
  577. 'Blade-Auth': 'bearer ' + uni.getStorageSync('accessToken')
  578. },
  579. name: 'file',
  580. success: (res) => {
  581. const data = JSON.parse(res.data).data
  582. this.form.file4 = {
  583. ...this.form.file4,
  584. url: data.link,
  585. name: data.originalName,
  586. extname: this.getFileExtension(data.originalName),
  587. size: file.size,
  588. }
  589. uni.showToast({
  590. title: '上传成功',
  591. icon: 'none'
  592. });
  593. },
  594. fail: (err) => {
  595. uni.showToast({
  596. title: '上传失败',
  597. icon: 'none'
  598. });
  599. },
  600. complete: () => {
  601. uni.hideLoading()
  602. }
  603. })
  604. })
  605. },
  606. async submit() {
  607. if (!this.form.consumerPhone) {
  608. uni.showToast({
  609. title: '请输入电话',
  610. icon: 'none'
  611. });
  612. return
  613. }
  614. if (!/^[1][3,4,5,7,8,9][0-9]{9}$/.test(this.form.consumerPhone)) {
  615. uni.showToast({
  616. title: '请输入正确电话',
  617. icon: 'none'
  618. });
  619. return;
  620. }
  621. if (!this.carNoVerify(this.form.vehicleNumber)) {
  622. return
  623. }
  624. if (!this.form.file1) {
  625. uni.showToast({
  626. title: '请上传病象',
  627. icon: 'none'
  628. });
  629. return
  630. }
  631. if (!this.form.file2) {
  632. uni.showToast({
  633. title: '请上传轮胎DOT',
  634. icon: 'none'
  635. });
  636. return
  637. }
  638. if (!this.form.file3) {
  639. uni.showToast({
  640. title: '请上传花纹深度',
  641. icon: 'none'
  642. });
  643. return
  644. }
  645. // if (!this.form.file4) {
  646. // uni.showToast({
  647. // title: '请上传鼓包处照片',
  648. // icon: 'none'
  649. // });
  650. // return
  651. // }
  652. let obj = await this.convertData(this.$deepClone(this.form))
  653. uni.showLoading({
  654. title: '加载中',
  655. mask: true
  656. });
  657. submit(obj).then(res => {
  658. setTimeout(() => {
  659. uni.showToast({
  660. title: '保存成功',
  661. icon: 'none',
  662. });
  663. }, 10);
  664. uni.setStorageSync('isUpdate', true)
  665. this.getDetail(res.data.id)
  666. })
  667. .catch(() => {
  668. uni.hideLoading()
  669. });
  670. },
  671. async approval() {
  672. if (!this.form.consumerPhone) {
  673. uni.showToast({
  674. title: '请输入电话',
  675. icon: 'none'
  676. });
  677. return
  678. }
  679. if (!this.carNoVerify(this.form.vehicleNumber)) {
  680. return
  681. }
  682. if (!/^[1][3,4,5,7,8,9][0-9]{9}$/.test(this.form.consumerPhone)) {
  683. uni.showToast({
  684. title: '请输入正确电话',
  685. icon: 'none'
  686. });
  687. return;
  688. }
  689. if (!this.form.file1) {
  690. uni.showToast({
  691. title: '请上传病象',
  692. icon: 'none'
  693. });
  694. return
  695. }
  696. if (!this.form.file2) {
  697. uni.showToast({
  698. title: '请上传轮胎DOT',
  699. icon: 'none'
  700. });
  701. return
  702. }
  703. if (!this.form.file3) {
  704. uni.showToast({
  705. title: '请上传花纹深度',
  706. icon: 'none'
  707. });
  708. return
  709. }
  710. // if (!this.form.file4) {
  711. // uni.showToast({
  712. // title: '请上传鼓包处照片',
  713. // icon: 'none'
  714. // });
  715. // return
  716. // }
  717. let form = await this.convertData(this.$deepClone(this.form))
  718. let obj = {
  719. id: this.form.id
  720. }
  721. let _this = this
  722. uni.showModal({
  723. title: '提示',
  724. content: '是否提交审核?',
  725. success: function(res) {
  726. if (res.confirm) {
  727. uni.showLoading({
  728. title: '加载中',
  729. mask: true
  730. });
  731. submit(form).then(res => {
  732. submitApproval(obj).then(res => {
  733. setTimeout(() => {
  734. uni.showToast({
  735. title: '操作成功',
  736. icon: 'none',
  737. duration: 2000
  738. });
  739. }, 10);
  740. _this.getDetail(_this.form.id)
  741. })
  742. .catch(() => {
  743. uni.hideLoading()
  744. });
  745. })
  746. .catch(() => {
  747. uni.hideLoading()
  748. });
  749. }
  750. }
  751. });
  752. },
  753. revoke() {
  754. let obj = {
  755. id: this.form.id
  756. }
  757. let _this = this
  758. uni.showModal({
  759. title: '提示',
  760. content: '是否撤销审核?',
  761. success: function(res) {
  762. if (res.confirm) {
  763. uni.showLoading({
  764. title: '加载中',
  765. mask: true
  766. });
  767. revokeApproval(obj).then(res => {
  768. setTimeout(() => {
  769. uni.showToast({
  770. title: '操作成功',
  771. icon: 'none',
  772. duration: 2000
  773. });
  774. }, 10);
  775. _this.getDetail(_this.form.id)
  776. })
  777. .catch(() => {
  778. uni.hideLoading()
  779. });
  780. }
  781. }
  782. });
  783. },
  784. getDetail(id) {
  785. let obj = {
  786. id: id
  787. }
  788. uni.showLoading({
  789. title: '加载中',
  790. mask: true
  791. });
  792. getDetail(obj).then(res => {
  793. res.data.claimAttachmentList.forEach(item => {
  794. if (item.fileProperties == 1) {
  795. res.data.file1 = {
  796. ...item,
  797. url: item.fileUrl,
  798. name: item.fileName,
  799. extname: item.fileType,
  800. size: item.fileSize,
  801. }
  802. }
  803. if (item.fileProperties == 2) {
  804. res.data.file2 = {
  805. ...item,
  806. url: item.fileUrl,
  807. name: item.fileName,
  808. extname: item.fileType,
  809. size: item.fileSize,
  810. }
  811. }
  812. if (item.fileProperties == 3) {
  813. res.data.file3 = {
  814. ...item,
  815. url: item.fileUrl,
  816. name: item.fileName,
  817. extname: item.fileType,
  818. size: item.fileSize,
  819. }
  820. }
  821. // if (item.fileProperties == 4) {
  822. // res.data.file4 = {
  823. // ...item,
  824. // url: item.fileUrl,
  825. // name: item.fileName,
  826. // extname: item.fileType,
  827. // size: item.fileSize,
  828. // }
  829. // }
  830. })
  831. this.form = res.data
  832. })
  833. .finally(() => {
  834. uni.hideLoading()
  835. });
  836. },
  837. async convertData(obj) {
  838. let fileList = []
  839. if (obj.file1 && Object.keys(obj.file1).length) {
  840. fileList.push({
  841. ...obj.file1,
  842. fileProperties: 1,
  843. })
  844. }
  845. if (obj.file2 && Object.keys(obj.file2).length) {
  846. fileList.push({
  847. ...obj.file2,
  848. fileProperties: 2,
  849. })
  850. }
  851. if (obj.file3 && Object.keys(obj.file3).length) {
  852. fileList.push({
  853. ...obj.file3,
  854. fileProperties: 3,
  855. })
  856. }
  857. // if (obj.file4 && Object.keys(obj.file4).length) {
  858. // fileList.push({
  859. // ...obj.file4,
  860. // fileProperties: 4
  861. // })
  862. // }
  863. //附件明细为空时直接赋值
  864. if (obj.claimAttachmentList.length == 0) {
  865. fileList.forEach(item => {
  866. obj.claimAttachmentList.push({
  867. fileProperties: item.fileProperties,
  868. fileUrl: item.url,
  869. fileName: item.name,
  870. fileType: item.extname,
  871. fileSize: item.size,
  872. })
  873. })
  874. } else {
  875. //附件明细有明细区分赋值
  876. fileList.forEach(item => {
  877. if (obj.claimAttachmentList.filter(row => row.fileProperties == item.fileProperties)
  878. .length == 0) {
  879. //原附件明细不存在,直接push新元素
  880. obj.claimAttachmentList.push({
  881. fileProperties: item.fileProperties,
  882. fileUrl: item.url,
  883. fileName: item.name,
  884. fileType: item.extname,
  885. fileSize: item.size,
  886. })
  887. } else {
  888. //原附件存在明细时,对应赋值
  889. obj.claimAttachmentList.forEach(row => {
  890. if (item.fileProperties == row.fileProperties) {
  891. row.fileUrl = item.url
  892. row.fileName = item.name
  893. row.fileType = item.extname
  894. row.fileSize = item.size
  895. }
  896. })
  897. }
  898. })
  899. }
  900. console.log(obj)
  901. return obj
  902. }
  903. }
  904. }
  905. </script>
  906. <style lang="scss" scoped>
  907. .right-align {
  908. text-align: right;
  909. }
  910. .photo {
  911. margin-left: 20rpx;
  912. width: 38rpx;
  913. height: 32rpx;
  914. }
  915. .photo-upload {
  916. display: flex;
  917. justify-content: space-around;
  918. margin-top: 45rpx;
  919. .photo-upload-text {
  920. font-weight: 400;
  921. font-size: 28rpx;
  922. color: #5F5F5F;
  923. line-height: 32rpx;
  924. text-align: center;
  925. margin-bottom: 15rpx;
  926. }
  927. .photo-upload-img {
  928. width: 280rpx;
  929. height: 280rpx;
  930. background: #D13B34;
  931. border-radius: 7rpx;
  932. }
  933. .photo-upload-upload {
  934. width: 280rpx;
  935. height: 280rpx;
  936. background: #F6F6F6;
  937. border-radius: 7rpx;
  938. display: flex;
  939. justify-content: center;
  940. align-items: center;
  941. .photo-upload-img2 {
  942. width: 219rpx;
  943. height: 219rpx;
  944. }
  945. }
  946. }
  947. ::v-deep .uni-file-picker__container {
  948. margin: 0 !important;
  949. }
  950. ::v-deep .file-picker__box-content {
  951. margin: 0 !important;
  952. }
  953. ::v-deep .file-picker__progress {
  954. display: none;
  955. }
  956. ::v-deep .uni-section .uni-section-header {
  957. font-weight: bold !important;
  958. padding: 12px 0px !important;
  959. border-bottom: 2px solid #F6F6F6;
  960. }
  961. ::v-deep .file-picker__box {
  962. width: 280rpx !important;
  963. height: 280rpx !important;
  964. }
  965. .slot-content-item {
  966. border-radius: 13rpx;
  967. border: 2rpx solid #03803B;
  968. padding: 1rpx 5rpx;
  969. color: #03803B;
  970. }
  971. .slot-content-item-placeholder {
  972. font-weight: 400 !important;
  973. font-size: 28rpx !important;
  974. height: 38rpx !important;
  975. color: #B5B4B4 !important;
  976. }
  977. .slot-box {
  978. gap: 5px;
  979. display: flex;
  980. flex-wrap: wrap;
  981. justify-content: flex-end;
  982. }
  983. </style>