You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

renewal-confirm.vue 22KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852
  1. <template>
  2. <view class="selectCar-box">
  3. <view class="details">
  4. <view class="title"> 基础信息 </view>
  5. <view class="details-item">
  6. <view> 订单编号: </view>
  7. <text>{{ orderInfos.orderId }}</text>
  8. </view>
  9. <view class="details-item">
  10. <view> 用户名称: </view>
  11. <text>{{ orderInfos.ownerName }}</text>
  12. </view>
  13. <view class="details-item">
  14. <view> 用户证件类型: </view>
  15. <text>{{ getCodeName('CERTIFICATE_TYPE',orderInfos.ownerIdtype) }}</text>
  16. </view>
  17. <view class="details-item">
  18. <view> 用户证件号: </view>
  19. <text>{{ orderInfos.ownerIdnum }}</text>
  20. </view>
  21. <view class="details-item">
  22. <view> 订单车牌号: </view>
  23. <text style="color: #00b38b">{{ orderInfos.vehiclePlate }}</text>
  24. </view>
  25. <view class="details-item">
  26. <view> 车牌颜色: </view>
  27. <text style="color: #00b38b">{{
  28. orderInfos.vehiclePlateColorStr
  29. }}</text>
  30. </view>
  31. <view class="details-item">
  32. <view> 收费车型: </view>
  33. <text>{{ orderInfos.vehicleType }}</text>
  34. </view>
  35. </view>
  36. <view class="title"> 卡信息 </view>
  37. <view class="card">
  38. <view class="card-left">
  39. <image :src="`${$imgUrl}card2.png`" mode=""></image>
  40. <view class="card-center">
  41. <view class="card-center-head"> {{orderInfos.cardId}} </view>
  42. <view class="tips">
  43. <text>储蓄卡</text>
  44. <text class="tips-card">{{getCodeName('CARD_STATE_TYPE',orderInfos.cardStatus)}}</text>
  45. </view>
  46. <view class="choose-item1"> 有效期:{{orderInfos.cardExpireTime }}</view>
  47. </view>
  48. </view>
  49. <view class="choose-item" @click="choose(1)">
  50. <view class="active" v-if="flag.includes(1)">
  51. </view>
  52. </view>
  53. </view>
  54. <view class="title"> OBU设备信息 </view>
  55. <view class="card">
  56. <view class="card-left">
  57. <image :src="`${$imgUrl}card1.png`" mode=""></image>
  58. <view class="card-center">
  59. <view class="card-center-head"> {{orderInfos.obuId}} </view>
  60. <view class="tips">
  61. <!-- <text>储蓄卡</text> -->
  62. <text class="tips-card">{{getCodeName('OBU_STATE_TYPE',orderInfos.obuStatus)}}</text>
  63. </view>
  64. <view class="choose-item1"> 有效期:{{orderInfos.obuExpireTime }} </view>
  65. </view>
  66. </view>
  67. <view class="choose-item" @click="choose(2)">
  68. <view class="active" v-if="flag.includes(2)">
  69. </view>
  70. </view>
  71. </view>
  72. <button class="submit" @click="toPage" v-if="!state.flag">卡签续期</button>
  73. <button class="submit" @click="toBack" v-else="state.flag">返回服务中心</button>
  74. <view class="mask" v-show="state.showPopup">
  75. <view class="main">
  76. <view class="top">
  77. <image class="icon-close" :src="`${$imgUrl}common/icon-close.png`" @click="cancel"></image>
  78. </view>
  79. <image class="icon-success" :src="`${$imgUrl}bluetooth/card-success.png`"></image>
  80. <view class="title">{{state.successName}}续期成功!</view>
  81. </view>
  82. </view>
  83. </view>
  84. </template>
  85. <script setup>
  86. import {
  87. getCodeName
  88. } from "@/datas/queryKey.js";
  89. import {
  90. reactive,
  91. ref
  92. } from "vue";
  93. import {
  94. navTo
  95. } from "@/utils/utils";
  96. import {
  97. onLoad,
  98. onUnload,
  99. onShow
  100. } from "@dcloudio/uni-app";
  101. import {
  102. request
  103. } from "@/utils/network/request.js";
  104. import {
  105. orderDetail,
  106. cardRenewal,
  107. writeCardBack,
  108. cardModifyConfirm,
  109. obuRenewal,
  110. modifyObuVehicleInfo,
  111. obuActivation,
  112. renewalTimeApi
  113. } from "@/utils/network/api.js";
  114. import {
  115. getVehiclePlateColor
  116. } from "@/datas/vehiclePlateColor";
  117. import {
  118. searchVehicleInfoQuery
  119. } from "@/utils/publicRequest";
  120. const cmd = require("../../../static/etcUtil/cmdConfig.js");
  121. import {
  122. IntegerToHexString,
  123. AsciToHexString,
  124. } from "@/utils/util/fileData.js";
  125. import {
  126. stringToJson
  127. } from "@/utils/network/encryption";
  128. const tools = require("../../../static/etcUtil/tools.js");
  129. const bluetoothUtil = require("../../../static/etcUtil/index.js");
  130. const state = reactive({
  131. showPopup: false,
  132. flag: false,
  133. successName: ""
  134. })
  135. const flag = reactive([])
  136. const type = ref('')
  137. const fileDataStrings = reactive({
  138. approvedCount: 0, //核载人数
  139. cardId: "", //卡号
  140. obuId: "", //obu号
  141. obuId: "", //obu号
  142. packageNum: "", //套餐编号
  143. axleCount: 0, //轴数
  144. axleDistance: "", //轴距
  145. engineNum: "", //发动机
  146. vehicleVin: "",
  147. vehicleEngineNum: "",
  148. cardStatus: "",
  149. obuStatus: "",
  150. type: 0, //类型
  151. userType: 0, //用户类型
  152. vehiclePlate: "", //车牌
  153. vehiclePlateColor: 0, //车牌颜色
  154. vehicleDimensions: "",
  155. outlineL: 0, //外廓 长
  156. outlineW: 0, //外廓 宽
  157. outlineH: 0, //外廓 高
  158. wheelCount: "", //车轮数
  159. vehicleIdNo: "", //车牌号
  160. vehiclePlateColorStr: "",
  161. customerTel: "",
  162. customerId: "",
  163. orderId: ""
  164. });
  165. let cmdRandNum = '';
  166. const orderInfos = reactive({
  167. orderId: "",
  168. ownerName: "",
  169. ownerIdtype: "",
  170. ownerIdnum: "",
  171. vehiclePlate: "",
  172. vehiclePlateColorStr: "",
  173. vehiclePlateColor: "",
  174. vehicleType: "",
  175. cardId: "",
  176. cardStatus: "",
  177. obuId: "",
  178. obuStatus: "",
  179. cardEnableTime: "",
  180. obuEnableTime: "",
  181. cardExpireTime: "",
  182. obuExpireTime: ""
  183. });
  184. let orderInfo = {};
  185. onLoad((option) => {
  186. //请求订单详情
  187. queryOrderDetail(option.id);
  188. getOrderDetails(option.id)
  189. });
  190. onShow((option) => {
  191. uni.$on('bluetoothLink', res => {
  192. console.log(res);
  193. if (res.status) {
  194. // 分别写
  195. if (flag.length == 1) {
  196. for (var i = 0; i < flag.length; i++) {
  197. if (flag[i] == 1) {
  198. state.successName = '卡'
  199. getCardRenewal()
  200. } else {
  201. state.successName = '签'
  202. getObuRenewal()
  203. }
  204. }
  205. } else {
  206. state.successName = '卡签'
  207. // 两个都要写,
  208. getCardRenewal()
  209. }
  210. }
  211. })
  212. })
  213. onUnload(() => {
  214. //移除监听
  215. uni.$off('bluetoothLink')
  216. })
  217. const choose = (data) => {
  218. if (!flag.includes(data)) {
  219. flag.push(data)
  220. console.log(flag);
  221. } else {
  222. flag.splice(flag.indexOf(data), 1)
  223. console.log(flag);
  224. }
  225. if (flag.length == 2) {
  226. type.value = '3'
  227. } else if (flag[0] == 1) {
  228. type.value = '1'
  229. } else {
  230. type.value = '2'
  231. }
  232. }
  233. //获取订单详情
  234. const queryOrderDetail = (id) => {
  235. const options = {
  236. type: 2,
  237. data: {
  238. id: id,
  239. },
  240. method: "POST",
  241. showLoading: true,
  242. };
  243. request(orderDetail, options).then((res) => {
  244. let orderInfo = JSON.parse(res.bizContent);
  245. console.log("orderInfo", orderInfo);
  246. orderInfos.orderId = orderInfo.orderId;
  247. orderInfos.ownerName = orderInfo.ownerName;
  248. orderInfos.ownerIdtype = orderInfo.ownerIdtype;
  249. orderInfos.ownerIdnum = orderInfo.ownerIdnum;
  250. orderInfos.vehiclePlate = orderInfo.vehiclePlate;
  251. orderInfos.vehiclePlateColorStr = orderInfo.vehiclePlateColorStr;
  252. orderInfos.vehiclePlateColor = orderInfo.vehiclePlateColor;
  253. orderInfos.vehicleType = orderInfo.vehicleType;
  254. orderInfos.cardId = orderInfo.cardId;
  255. orderInfos.cardStatus = orderInfo.cardStatus;
  256. orderInfos.obuId = orderInfo.obuId;
  257. orderInfos.obuStatus = orderInfo.obuStatus;
  258. // orderInfos.cardEnableTime = orderInfo.cardEnableTime.substring(0, 10);
  259. // orderInfos.obuEnableTime = orderInfo.obuEnableTime.substring(0, 10);
  260. orderInfos.cardExpireTime = orderInfo.cardExpireTime;
  261. orderInfos.obuExpireTime = orderInfo.obuExpireTime;
  262. console.log("orderInfos.cardExpiretime", orderInfos.cardExpiretime, orderInfo.cardExpiretime)
  263. });
  264. };
  265. //卡续期 请求
  266. const getCardRenewal = () => {
  267. const options = {
  268. type: 2,
  269. data: {
  270. cardId: orderInfos.cardId,
  271. },
  272. method: "POST",
  273. showLoading: true,
  274. };
  275. request(cardRenewal, options).then((res) => {
  276. let result = stringToJson(res.bizContent);
  277. let cmdArray = result.command.split(",");
  278. console.log(cmdArray);
  279. console.log(result.cosRecordId);
  280. if (cmdArray.length > 0) {
  281. tools.showLoadingAlert("正在执行指令");
  282. bluetoothUtil.transCmd(cmdArray, "10", function(res) {
  283. tools.hideLoadingAlert();
  284. let status = res[cmdArray.length - 1].substring(res[cmdArray.length - 1].length -
  285. 4, res[cmdArray.length - 1].length);
  286. if (status == "9000") {
  287. getCommandBack(result.command, result.cosRecordId, res.toString());
  288. }
  289. })
  290. }
  291. })
  292. };
  293. /**
  294. * 写卡指令返回 请求
  295. */
  296. const getCommandBack = (command, cosRecordId, response) => {
  297. console.log('======循环写卡指令中======')
  298. tools.showLoadingAlert("加载中");
  299. let options = {
  300. type: 2, //type: 2,JSON格式提交数据(默认表单形式提交)
  301. data: {
  302. cardId: orderInfos.cardId,
  303. orderId: orderInfos.orderId,
  304. command: command,
  305. response: response,
  306. cosRecordId: cosRecordId,
  307. cosType: 2
  308. }, //请求参数
  309. method: "POST", //提交方式(默认POST)
  310. showLoading: true, //是否显示加载中(默认显示)
  311. };
  312. //调用方式
  313. request(writeCardBack, options)
  314. .then((res) => {
  315. tools.hideLoadingAlert();
  316. let result = JSON.parse(res.bizContent);
  317. if (result.orderStatus == 1 || result.orderStatus == "1") {
  318. tools.showLoadingAlert("执行指令中");
  319. bluetoothUtil.transCmd(result.command.split(","), "10", function(res) {
  320. tools.hideLoadingAlert();
  321. let response = res.toString();
  322. getCommandBack(result.command, cosRecordId, response);
  323. });
  324. } else {
  325. getCardModifyConfirm(cosRecordId)
  326. }
  327. })
  328. };
  329. //卡信息变更确认
  330. const getCardModifyConfirm = (cosRecordId) => {
  331. const options = {
  332. type: 2,
  333. data: {
  334. cardId: orderInfos.cardId,
  335. operation: 1,
  336. cosRecordId: cosRecordId
  337. },
  338. method: "POST",
  339. showLoading: true,
  340. };
  341. request(cardModifyConfirm, options).then((res) => {
  342. // 只写卡
  343. if (flag.length == 1) {
  344. sure(1)
  345. state.showPopup = true;
  346. } else {
  347. // 为2要写签
  348. getObuRenewal()
  349. }
  350. })
  351. }
  352. //去连接蓝牙
  353. const toPage = () => {
  354. console.log("flag.length", flag, type)
  355. if (flag.length == 0) {
  356. uni.showToast({
  357. title: '请至少勾选一项',
  358. icon: 'none'
  359. });
  360. } else {
  361. console.log("getCurrentPages()", getCurrentPages())
  362. navTo("/pages/bluetooth/bluetooth?routeType=5"); //去连接蓝牙
  363. }
  364. };
  365. //返回列表
  366. const toBack = () => {
  367. uni.redirectTo({
  368. url: "/pages/service/service"
  369. })
  370. }
  371. //关闭弹窗
  372. const cancel = () => {
  373. state.flag = true;
  374. state.showPopup = false;
  375. uni.navigateTo({
  376. url: `/subpackage/after-sale/deviceInfo/deviceInfo`
  377. })
  378. }
  379. //签续期 请求
  380. const getObuRenewal = () => {
  381. let cmdArray1 = [cmd.HOME_DIRECTORY, cmd.OBU_SYSTEM_FILE, cmd.RANDOM_NUMBER];
  382. tools.showLoadingAlert("正在执行指令");
  383. bluetoothUtil.transCmd(cmdArray1, "20", function(res) {
  384. tools.hideLoadingAlert();
  385. var str = res[2].substring(res[2].length - 4, res[2].length);
  386. if (str == "9000") {
  387. cmdRandNum = res[2].substring(0, res[2].length - 4);
  388. const options = {
  389. type: 2,
  390. data: {
  391. obuId: orderInfos.obuId,
  392. random: cmdRandNum
  393. },
  394. method: "POST",
  395. showLoading: true,
  396. };
  397. request(obuRenewal, options).then((res) => {
  398. let datas = stringToJson(res.bizContent);
  399. console.log("899", datas, datas.data.APDU);
  400. if (datas.data.APDU) {
  401. tools.showLoadingAlert("正在执行指令");
  402. bluetoothUtil.transCmd([datas.data.APDU], "20", function(res) {
  403. tools.hideLoadingAlert();
  404. console.log("res=====", res, res[0])
  405. let cmdArr = [cmd.HOME_DIRECTORY, cmd.OBU_DF01, cmd.OBU_EF01, cmd
  406. .RANDOM_NUMBER
  407. ];
  408. bluetoothUtil.transCmd(cmdArr, "20", function(res) {
  409. console.log("chelaing======", res)
  410. var str = res[3].substring(res[3].length - 4, res[3]
  411. .length);
  412. if (str == "9000") {
  413. cmdRandNum = res[3].substring(0, res[3].length -
  414. 4);
  415. console.log("0000000000000000000000000")
  416. getFileData((demos) => {
  417. modifyVehicle(demos);
  418. })
  419. } else {
  420. tools.alertF("RANDOM_NUMBER指令长度不符" + res[1]);
  421. }
  422. })
  423. })
  424. }
  425. })
  426. } else {
  427. tools.alertF("RANDOM_NUMBER指令长度不符" + res[1]);
  428. }
  429. })
  430. };
  431. //获取fileData
  432. const getFileData = (fun) => {
  433. //调用方式
  434. request('6ed853e432fb4811a3c0d7d27034bd39', {
  435. type: 2, //type: 2,JSON格式提交数据(默认表单形式提交)
  436. data: {
  437. fileData: fileDataStrings.vehiclePlate,
  438. nLen: 24
  439. }, //请求参数
  440. method: "POST", //提交方式(默认POST)
  441. showLoading: true, //是否显示加载中(默认显示)
  442. }).then((les) => {
  443. let result = stringToJson(les.bizContent);
  444. console.log(result, '=========123')
  445. let res1 = result.gbkFileData; //车牌号
  446. let res2 = IntegerToHexString(fileDataStrings.vehiclePlateColor, 4); //车牌颜色
  447. let res3 = IntegerToHexString(fileDataStrings.type, 2); //类型
  448. let userTypeNumber = fileDataStrings.userType == 'PERSONAL_USER' ? 1 : 2
  449. let res4 = IntegerToHexString(userTypeNumber, 2); //用户类型
  450. let res5 = IntegerToHexString(fileDataStrings.outlineL, 4); //车辆尺寸 长
  451. let res6 = IntegerToHexString(fileDataStrings.outlineW, 2); //车辆尺寸 宽
  452. let res7 = IntegerToHexString(fileDataStrings.outlineH, 2); //车辆尺寸 高
  453. let res8 = IntegerToHexString(4, 2); //获取轮数
  454. let res9 = IntegerToHexString(fileDataStrings.axleCount, 2); //轴数
  455. let res10 = IntegerToHexString(null, 4); //轴距32
  456. let res11 = IntegerToHexString(fileDataStrings.approvedCount, 6); //核载人数
  457. let res12 = AsciToHexString(fileDataStrings.vehicleVin, 32); //车编号
  458. let res13 = AsciToHexString(fileDataStrings.vehicleEngineNum, 32); //发动机
  459. fun(res1 + res2 + res3 + res4 + res5 + res6 + res7 + res8 + res9 + res10 + res11 + res12 + res13);
  460. })
  461. };
  462. /**
  463. * 修改车辆信息 请求
  464. */
  465. const modifyVehicle = (ites) => {
  466. tools.showLoadingAlert("加载中");
  467. console.log('======修改车辆信息======', ites)
  468. let options = {
  469. type: 2, //type: 2,JSON格式提交数据(默认表单形式提交)
  470. data: {
  471. Status: "0",
  472. random: cmdRandNum,
  473. obuSerailNo: orderInfos.obuId,
  474. fileData: ites,
  475. orderId: orderInfos.orderId,
  476. }, //请求参数
  477. method: "POST", //提交方式(默认POST)
  478. showLoading: true, //是否显示加载中(默认显示)
  479. };
  480. //调用方式
  481. request(modifyObuVehicleInfo, options)
  482. .then((res) => {
  483. tools.hideLoadingAlert();
  484. const datas = stringToJson(res.bizContent);
  485. console.log("modifyObuVehicleInfo", modifyObuVehicleInfo, datas)
  486. tools.showLoadingAlert("正在执行指令");
  487. if (datas.data.APDU) {
  488. bluetoothUtil.transCmd([datas.data.APDU], "20", function(res) {
  489. console.log('执行指令结果', res)
  490. tools.hideLoadingAlert();
  491. if (res[0] == "9000") {
  492. //再次获取随机数
  493. let cmdArr = [cmd.HOME_DIRECTORY, cmd.RANDOM_NUMBER];
  494. bluetoothUtil.transCmd(cmdArr, '20', function(res) {
  495. var str = res[1].substring(res[1].length - 4, res[1].length);
  496. if (str == "9000") {
  497. cmdRandNum = res[1].substring(0, res[1].length - 4);
  498. getObuActivation();
  499. } else {
  500. tools.alertF("RANDOM_NUMBER指令长度不符" + res[1]);
  501. }
  502. })
  503. }
  504. });
  505. }
  506. })
  507. };
  508. /**
  509. * VFJ-OBU在线激活 请求
  510. */
  511. const getObuActivation = () => {
  512. console.log('======VFJ-OBU在线激活======')
  513. tools.showLoadingAlert("加载中");
  514. let options = {
  515. type: 2, //type: 2,JSON格式提交数据(默认表单形式提交)
  516. data: {
  517. random: cmdRandNum,
  518. obuSerailNo: orderInfos.obuId,
  519. orderId: orderInfos.orderId,
  520. }, //请求参数
  521. method: "POST", //提交方式(默认POST)
  522. showLoading: true, //是否显示加载中(默认显示)
  523. };
  524. //调用方式
  525. request(obuActivation, options)
  526. .then((res) => {
  527. tools.hideLoadingAlert();
  528. console.log("在线激活 请求");
  529. console.log(stringToJson(res.bizContent));
  530. const datas = stringToJson(res.bizContent);
  531. tools.showLoadingAlert("执行指令");
  532. console.log("在线激活 请求==========================", datas, datas.data.APDU);
  533. bluetoothUtil.transCmd([datas.data.APDU], "20", function(res) {
  534. tools.hideLoadingAlert();
  535. console.log("在线激活 请求", res);
  536. if (res[0] == "9000") {
  537. sure(2)
  538. state.showPopup = true;
  539. }
  540. });
  541. })
  542. .catch((err) => {
  543. console.log(err);
  544. });
  545. };
  546. //获取订单详情
  547. const getOrderDetails = (id) => {
  548. console.log('======获取订单信息======')
  549. const options = {
  550. type: 2,
  551. data: {
  552. id: id,
  553. },
  554. method: "POST",
  555. showLoading: true,
  556. };
  557. request(orderDetail, options).then((res) => {
  558. orderInfo = JSON.parse(res.bizContent);
  559. console.log("orderInfo", orderInfo);
  560. console.log("orderInfores", res);
  561. if (orderInfo) {
  562. fileDataStrings.userType = orderInfo.userType; //用户类型
  563. fileDataStrings.cardId = orderInfo.cardId;
  564. fileDataStrings.packageNum = orderInfo.packageNum;
  565. fileDataStrings.obuId = orderInfo.obuId;
  566. fileDataStrings.customerTel = orderInfo.customerTel;
  567. fileDataStrings.customerId = orderInfo.customerId;
  568. fileDataStrings.orderId = orderInfo.orderId;
  569. let vehicleId = orderInfo.vehiclePlate + "_" + orderInfo.vehiclePlateColor
  570. searchVehicleInfoQuery(vehicleId).then((orderInfo) => {
  571. fileDataStrings.approvedCount = parseInt(orderInfo.approvedCount); //核载人数
  572. fileDataStrings.vehicleVin = orderInfo.vin;
  573. fileDataStrings.vehicleEngineNum = orderInfo.engineNum;
  574. fileDataStrings.axleCount = parseInt(orderInfo.axleCount); //轴数
  575. fileDataStrings.engineNum = orderInfo.engineNum; //发动机
  576. fileDataStrings.type = parseInt(orderInfo.type); //类型
  577. fileDataStrings.vehiclePlate = orderInfo.vehiclePlate; //车牌
  578. fileDataStrings.vehiclePlateColor = orderInfo.vehiclePlateColor; //车牌颜色
  579. console.log("车辆信息", orderInfo)
  580. fileDataStrings.vehicleDimensions = orderInfo.vehicleDimensions;
  581. let arr = orderInfo.vehicleDimensions.split("X");
  582. console.log("orderInfo.vehicleDimensions", orderInfo.vehicleDimensions.split("X"))
  583. fileDataStrings.outlineL = parseInt(arr[0]); //外廓 长
  584. fileDataStrings.outlineW = parseInt(arr[1]); //外廓 宽
  585. fileDataStrings.outlineH = parseInt(arr[2].substring(0, arr[2].length - 2)); //外廓 高
  586. fileDataStrings.vehicleIdNo = orderInfo.vehicleEngineNum; //车编号
  587. fileDataStrings.vehiclePlateColorStr = getVehiclePlateColor(orderInfo
  588. .vehiclePlateColor);
  589. console.log("fileDataStrings", fileDataStrings);
  590. })
  591. }
  592. });
  593. };
  594. const sure = (val) => {
  595. var data = {}
  596. if (val == 1) {
  597. data = {
  598. type: "1",
  599. cardId: fileDataStrings.cardId,
  600. }
  601. } else {
  602. data = {
  603. type: "2",
  604. obuId: fileDataStrings.obuId,
  605. }
  606. }
  607. const options = {
  608. type: 2,
  609. data: data,
  610. method: "POST",
  611. showLoading: true,
  612. };
  613. request(renewalTimeApi, options).then((res) => {
  614. })
  615. }
  616. </script>
  617. <style>
  618. page {
  619. width: 100%;
  620. height: 100%;
  621. background-color: #fff;
  622. }
  623. </style>
  624. <style lang="scss" scoped>
  625. .mask {
  626. background: rgba(0, 0, 0, .35);
  627. position: fixed;
  628. left: 0;
  629. top: 0;
  630. bottom: 0;
  631. right: 0;
  632. }
  633. .main {
  634. width: 560rpx;
  635. padding: 25rpx 20rpx 55rpx;
  636. text-align: center;
  637. background: #fff;
  638. position: absolute;
  639. left: 50%;
  640. top: 50%;
  641. transform: translate(-50%, -50%);
  642. border-radius: 20rpx;
  643. .top {
  644. text-align: right;
  645. .icon-close {
  646. width: 48rpx;
  647. height: 48rpx;
  648. }
  649. }
  650. .icon-success {
  651. width: 500rpx;
  652. height: 320rpx;
  653. margin-top: 22rpx;
  654. }
  655. .title {
  656. color: #333333;
  657. font-size: 40rpx;
  658. font-weight: 600;
  659. text-align: center;
  660. margin-top: 55rpx;
  661. }
  662. }
  663. .selectCar-box {
  664. // width: 100%;
  665. // height: 100%;
  666. padding: 30rpx;
  667. .title {
  668. font-size: 30rpx;
  669. font-family: Microsoft YaHei UI;
  670. font-weight: 400;
  671. color: #333333;
  672. margin-bottom: 30rpx;
  673. }
  674. .details {
  675. .title {
  676. font-size: 30rpx;
  677. font-family: Microsoft YaHei UI;
  678. font-weight: 400;
  679. color: #333333;
  680. margin-bottom: 30rpx;
  681. }
  682. .details-item {
  683. display: flex;
  684. font-size: 26rpx;
  685. font-family: Noto Sans S Chinese;
  686. font-weight: 400;
  687. color: #999999;
  688. margin-bottom: 30rpx;
  689. text {
  690. font-size: 26rpx;
  691. font-family: Noto Sans S Chinese;
  692. font-weight: 400;
  693. color: #333333;
  694. }
  695. }
  696. }
  697. .card {
  698. height: 150rpx;
  699. background: #ffffff;
  700. box-shadow: 0rpx 4rpx 13rpx 3rpx rgba(223, 223, 223, 0.8);
  701. border-radius: 20rpx;
  702. padding: 30rpx;
  703. display: flex;
  704. justify-content: space-between;
  705. align-items: center;
  706. margin-bottom: 60rpx;
  707. .card-left {
  708. display: flex;
  709. align-items: center;
  710. image {
  711. width: 100rpx;
  712. height: 90rpx;
  713. }
  714. .card-center {
  715. margin-left: 30rpx;
  716. .card-center-head {
  717. font-size: 32rpx;
  718. font-family: Noto Sans S Chinese;
  719. font-weight: 400;
  720. color: #333333;
  721. }
  722. .tips {
  723. font-size: 26rpx;
  724. font-family: Noto Sans S Chinese;
  725. font-weight: 400;
  726. color: #666666;
  727. .tips-card {
  728. width: 70rpx;
  729. height: 40rpx;
  730. background: #d3f2ef;
  731. border-radius: 6rpx;
  732. font-size: 20rpx;
  733. font-family: Noto Sans S Chinese;
  734. font-weight: 400;
  735. color: #0a8f8a;
  736. padding: 5rpx 10rpx;
  737. margin-left: 20rpx;
  738. }
  739. }
  740. }
  741. }
  742. .choose-item1 {
  743. margin-right: 20rpx;
  744. /* width: 50rpx; */
  745. // height: 50rpx;
  746. /* border: 1rpx solid #00B38B; */
  747. border-radius: 50%;
  748. // display: flex;
  749. // justify-content: center;
  750. // align-items: center;
  751. font-size: 25rpx;
  752. // align-self: end;
  753. .active {
  754. width: 38rpx;
  755. height: 38rpx;
  756. background: #00b38b;
  757. border-radius: 50%;
  758. }
  759. }
  760. .choose-item {
  761. margin-right: 20rpx;
  762. width: 50rpx;
  763. height: 50rpx;
  764. border: 1rpx solid #00B38B;
  765. border-radius: 50%;
  766. display: flex;
  767. justify-content: center;
  768. align-items: center;
  769. .active {
  770. width: 38rpx;
  771. height: 38rpx;
  772. background: #00B38B;
  773. border-radius: 50%;
  774. }
  775. }
  776. }
  777. .remark {
  778. font-size: 26rpx;
  779. font-family: Microsoft YaHei UI;
  780. font-weight: 400;
  781. color: #666666;
  782. text-indent: 30rpx;
  783. margin-bottom: 30rpx;
  784. }
  785. .submit {
  786. margin-top: 100rpx;
  787. width: 670rpx;
  788. height: 80rpx;
  789. background: linear-gradient(-90deg, #43a1e0 0%, #13e7c1 100%);
  790. border-radius: 40rpx;
  791. font-size: 32rpx;
  792. font-family: Noto Sans S Chinese;
  793. font-weight: 400;
  794. color: #ffffff;
  795. line-height: 80rpx;
  796. }
  797. }
  798. </style>