Du kannst nicht mehr als 25 Themen auswählen Themen müssen mit entweder einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

drivingLicense.vue 8.5KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324
  1. <template>
  2. <div>
  3. <custom-header title="车辆信息" :back="config.hasReturn === 'true'"></custom-header>
  4. <div style="padding: 20rpx 0">
  5. <form-builder-vue :formData.value="formData" :config="config" @uploadImgOcr="uploadImg" @submit="submit">
  6. </form-builder-vue>
  7. </div>
  8. </div>
  9. </template>
  10. <script setup lang='ts'>
  11. import CustomHeader from '@/components/CustomHeader.vue';
  12. import formBuilderVue from '@/components/form-builder/form-builder-vue3'
  13. // import Agreement from '@/components/Agreement.vue';
  14. import {
  15. TypeData,
  16. Index
  17. } from '@/components/form-builder/tools'
  18. // import {
  19. // IdCard
  20. // } from '../../static/data/testData.js'
  21. import {
  22. reactive,
  23. ref,
  24. nextTick
  25. } from 'vue'
  26. import {
  27. onLoad
  28. } from '@dcloudio/uni-app';
  29. import {
  30. request
  31. } from '@/utils/network/request'
  32. import {
  33. useQdOrderStore
  34. } from '@/stores/qdOrder.js'
  35. import {
  36. etcCarOcrCard,
  37. ocrAllQuery,
  38. fileUpload,
  39. fileURL
  40. } from "@/utils/network/api.js";
  41. import fromData from './fromData.js'
  42. const qdOrderStore = useQdOrderStore()
  43. onLoad((opin) => {
  44. let qdOrderNo: any
  45. if (opin && opin.qdOrderNo) {
  46. qdOrderNo = opin.qdOrderNo
  47. uni.setStorageSync('qdOrderNo', opin.qdOrderNo)
  48. }else{
  49. qdOrderNo = uni.getStorageSync('qdOrderNo')
  50. }
  51. request('ac8756cc31eb4816b8eaeb71907ff9c1', {
  52. data: {
  53. qdOrderNo,
  54. pageStep: 2
  55. }
  56. }).then((res) => {
  57. let data = JSON.parse(res.bizContent)
  58. formData.value = JSON.parse(data.config.tableConfig)
  59. qdOrderStore.setQdOrder(data.qdOrder)
  60. nextTick(() => {
  61. submitQuery.channelId = data.qdOrder.promoterChannelNum + '00000001'
  62. if (data.qdOrder.vanType == 1) {
  63. // 客车
  64. checkCarTpe(true)
  65. submitQuery.type = 0
  66. } else {
  67. // 货车
  68. checkCarTpe(false)
  69. isTractorHandle(data.qdOrder.isTractor)
  70. submitQuery.type = 1
  71. }
  72. })
  73. delete data.config.tableConfig
  74. config.value = Object.assign(data.config, config.value)
  75. })
  76. })
  77. function isTractorHandle(isTractor) {
  78. const index = Index('车辆用户类型', formData.value);
  79. if (isTractor === 0) {
  80. formData.value[index].disabled = false
  81. }
  82. }
  83. // 货车或者客车切换
  84. function checkCarTpe(key) {
  85. // true为客车,false为货车
  86. formData.value[Index('总质量(kg)', formData.value)].show = key
  87. formData.value[Index('整备质量(kg)', formData.value)].show = key
  88. formData.value[Index('核定载质量(kg)', formData.value)].show = key
  89. formData.value[Index('准牵引总质量(kg)', formData.value)].show = key
  90. formData.value[Index('车轴数', formData.value)].show = key
  91. const dataItem = formData.value[Index('车辆用户类型', formData.value)]
  92. dataItem.disabled = true
  93. dataItem[dataItem.value] = 0;
  94. }
  95. let config = ref < any > ({
  96. submitName: '下一步',
  97. titleWidth: 250,
  98. isHeader: true
  99. })
  100. let submitQuery = reactive < any > ({
  101. orderId: "", //订单ID
  102. man: "", //所有人
  103. character: "", //使用性质
  104. register: "", //注册日期
  105. customerId: "", //用户编号
  106. vehicleId: "",
  107. vehicleIdNum: "", //车牌编号
  108. issueDate: "", //发证日期
  109. vehPosImgUrl: "", //行驶证正面
  110. vehNegImgUrl: "", //行驶证证反面
  111. type: "0", //0,客车 1.货车
  112. useUserType: 0, //车辆用户类型
  113. useUserTypeName: "普通车",
  114. vehicleSign: 2, //前/后装标识
  115. vin: "", //车辆识别代号
  116. engineNum: "", //发动机号码
  117. vehicleType: "", //车辆类型
  118. vehicleModel: "", //行驶证品牌型号
  119. approvedCount: undefined, //核定人数
  120. totalMass: undefined, //总质量
  121. maintenaceMass: undefined, //整备质量
  122. permittedWeight: "", //核定载质量
  123. vehicleDimensions: "", //车辆尺寸
  124. permittedTowWeight: "", //准牵引总质量
  125. axleCount: "", //车轴数
  126. ownerName: "", //车主姓名
  127. ownerIdType: "", //车主证件类型
  128. ownerIdNum: "", //车主证件号码
  129. ownPosImgUrl: "", //车主证件正面图片
  130. ownNegImgUrl: "", //车主证件反面图片
  131. agreementId: "", //签约编号
  132. channelId: "5201018892300000001", //编号渠道
  133. scenePayType: "", //
  134. transportIdNum: "", //道路运输证编号
  135. licenseIdNum: "", //经营许可证编号
  136. vehBodyUrl: "", //车身照片
  137. // proxyUrl: "", //委托书地址
  138. })
  139. let formData = ref < any > (fromData)
  140. // 将ocr识别的信息展示到页面
  141. function handleDataList(dataObj: any, data) {
  142. for (let item of dataObj) {
  143. const dataItem = formData.value[Index(item.title, formData.value)]
  144. const value = data[item.key]
  145. if (value !== undefined && !dataItem.show) {
  146. if (item.isNumber) {
  147. dataItem[dataItem.value] = parseInt(value)
  148. } else if (item.substring) {
  149. dataItem[dataItem.value] = value.substring(0, value.length - item.substring)
  150. } else {
  151. dataItem[dataItem.value] = value
  152. }
  153. }
  154. }
  155. }
  156. // 行驶证主业或副业处理
  157. const cardImageOcr = (fileList, item) => {
  158. let imageType;
  159. if (item.title == '行驶证主页') {
  160. imageType = '1'
  161. } else if (item.title == '行驶证副页') {
  162. imageType = '2'
  163. }
  164. const promoterChannelNum = qdOrderStore.qdOrderVal.promoterChannelNum || qdOrderStore.qdOrderVal.value
  165. .promoterChannelNum
  166. const data = {
  167. source: "1",
  168. agencyId: promoterChannelNum,
  169. imageType: imageType,
  170. fileName: fileList.fileName,
  171. imageBase64: fileList.path,
  172. };
  173. request(etcCarOcrCard, {
  174. data: data,
  175. }).then((res) => {
  176. let data: any = JSON.parse(res.bizContent)
  177. const itemData = formData.value[Index(item.title, formData.value)]
  178. itemData[itemData.value] = data.imageUrl
  179. // item[item.value] = data.imageUrl
  180. if (imageType == '1') {
  181. // 需要处理展示的页面
  182. // 正面
  183. const ocrData = [{
  184. title: '车牌号',
  185. key: 'plate_a'
  186. }, {
  187. title: '车辆类型',
  188. key: 'vehicle'
  189. }, {
  190. title: '使用性质',
  191. key: 'character'
  192. }, {
  193. title: '发动机号码',
  194. key: 'engine'
  195. }, {
  196. title: '品牌型号',
  197. key: 'model'
  198. }, {
  199. title: '车辆识别代码',
  200. key: 'vin'
  201. }, {
  202. title: '所有人',
  203. key: 'man'
  204. }, {
  205. title: '发证日期',
  206. key: 'issue'
  207. }, {
  208. title: '注册日期',
  209. key: 'register'
  210. }]
  211. // 处理数据展示
  212. handleDataList(ocrData, data)
  213. } else {
  214. const ocrData = [{
  215. title: '准牵引总质量(kg)',
  216. key: 'towing',
  217. isNumber: true,
  218. }, {
  219. title: '核定载人数',
  220. key: 'apc',
  221. isNumber: true,
  222. }, {
  223. title: '核定载质量(kg)',
  224. isNumber: true,
  225. key: 'alc'
  226. }, {
  227. title: '总质量(kg)',
  228. isNumber: true,
  229. key: 'gross'
  230. }, {
  231. title: '整备质量(kg)',
  232. isNumber: true,
  233. key: 'unladen'
  234. }, {
  235. title: '外廓尺寸',
  236. key: 'overall',
  237. substring: 2,
  238. }]
  239. // 处理数据展示
  240. handleDataList(ocrData, data)
  241. }
  242. });
  243. };
  244. // 车身照识别
  245. const cardFileImageUpdate = (fileList, item) => {
  246. var data = {
  247. fileBase64: fileList.path,
  248. };
  249. request(fileUpload, {
  250. data: data,
  251. }).then((res) => {
  252. let data: any = JSON.parse(res.bizContent)
  253. const dataItem = formData.value[Index(item.title, formData.value)]
  254. dataItem[dataItem.value] = data.data.url;
  255. });
  256. };
  257. //图像文件上传
  258. function uploadImg(fileList, item) {
  259. if (item.title == '行驶证主页' || item.title == '行驶证副页') {
  260. cardImageOcr(fileList, item)
  261. } else {
  262. cardFileImageUpdate(fileList, item)
  263. }
  264. }
  265. function submit(item: any) {
  266. let vehicleColor: any, vehiclePlate: any
  267. if (!qdOrderStore.qdOrderVal.vehicleColor || qdOrderStore.qdOrderVal.vehicleColor === 0) {
  268. vehicleColor = qdOrderStore.qdOrderVal.vehicleColor
  269. vehiclePlate = qdOrderStore.qdOrderVal.vehiclePlate
  270. } else {
  271. vehicleColor = qdOrderStore.qdOrderVal.value?.vehicleColor
  272. vehiclePlate = qdOrderStore.qdOrderVal.value?.vehiclePlate
  273. }
  274. // submitQuery.vehicleId =
  275. // item.vehiclePlate + "_" + vehicleColor;
  276. submitQuery.vehicleId =
  277. vehiclePlate + "_" + vehicleColor;
  278. const orderId = qdOrderStore.qdOrderVal.qtOrderNo || qdOrderStore.orderInfo.orderId
  279. if (!orderId) {
  280. uni.showModal({
  281. title: '提示',
  282. content: '订单编号为空,请返回邮寄地址页面重新提交',
  283. success: function(res) {
  284. }
  285. });
  286. return
  287. }
  288. let data = {
  289. ...item,
  290. orderId
  291. }
  292. for (let dataItem in submitQuery) {
  293. if (submitQuery[dataItem] || submitQuery[dataItem] === 0 && !data[dataItem]) {
  294. data[dataItem] = submitQuery[dataItem]
  295. }
  296. }
  297. let {
  298. commitInterface,
  299. jumpPage
  300. } = config.value
  301. request(commitInterface || '18', {
  302. data,
  303. }).then((res) => {
  304. if (res.statusCode === 0) {
  305. uni.navigateTo({
  306. url: '/' + jumpPage,
  307. animationType: 'pop-in',
  308. animationDuration: 500
  309. })
  310. }
  311. })
  312. }
  313. </script>
  314. <style lang='scss' scoped>
  315. </style>