addVehicle.vue 49 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536
  1. <!-- 管理车辆 -->
  2. <template>
  3. <view @click='hidden' class="content">
  4. <view class="flex s-row container">
  5. <view class="flex row">
  6. <view class="left-text">车型</view>
  7. <view class="color" @click="selectCarModel">{{dataDetails.carCategory}} {{dataDetails.carType}}</view>
  8. <view>></view>
  9. <u-picker :show="carModel" :columns="carModelColumns" :closeOnClickOverlay='true' @close='carModelClose'
  10. @cancel='carModelClose' @confirm='confirmCarModel' @change="changeCarModel"></u-picker>
  11. </view>
  12. <view class="title">道路运输证</view>
  13. <view @click="uploadImg(8)" class="picture picture8" v-if="!dataDetails.operationCertificate">
  14. <image class="xj-image" src="@/static/images/mine/ic_shanchuan@2x.png"></image>
  15. <view class="text">上传道路运输证</view>
  16. </view>
  17. <view v-if="dataDetails.operationCertificate" @click.stop="uploadImg(8)" class="preview-card-img picture">
  18. <view @click.stop="delCard(8)">
  19. <image class='del-card' src="@/static/images/common/quxiao@2x.png">
  20. </image>
  21. </view>
  22. <image class="" :src="dataDetails.operationCertificate" mode="aspectFit"></image>
  23. </view>
  24. <view class="flex row">
  25. <view class="left-text">道路运输证号</view>
  26. <u--input placeholder="输入道路运输证号" inputAlign='right' border="none"
  27. v-model="dataDetails.operationCertificateNumber">
  28. </u--input>
  29. </view>
  30. <view class="flex row flex-space-between">
  31. <view class="left-text">道路运输证有效期</view>
  32. <view class="" @click="selectValidityPeriod(4)">
  33. {{dataDetails.operationCertificateValidityDate?dataDetails.operationCertificateValidityDate:'选择有效期>'}}
  34. </view>
  35. </view>
  36. <view v-if="sign == '挂车'">
  37. <view class="title">挂车道路运输证</view>
  38. <view @click="uploadImg(9)" class="picture picture9" v-if="!dataDetails.trailerOperationCertificate">
  39. <image class="xj-image" src="@/static/images/mine/ic_shanchuan@2x.png"></image>
  40. <view class="text">上传挂车道路运输证</view>
  41. </view>
  42. <view v-if="dataDetails.trailerOperationCertificate" @click.stop="uploadImg(9)"
  43. class="preview-card-img picture">
  44. <view @click.stop="delCard(9)">
  45. <image class='del-card' src="@/static/images/common/quxiao@2x.png">
  46. </image>
  47. </view>
  48. <image class="" :src="dataDetails.trailerOperationCertificate" mode="aspectFit"></image>
  49. </view>
  50. </view>
  51. <view class="flex row" v-if="sign == '挂车'">
  52. <view class="left-text">挂车道路运输证号</view>
  53. <u--input placeholder="输入挂车道路运输证号" inputAlign='right' border="none"
  54. v-model="dataDetails.trailerOperationCertificateNumber">
  55. </u--input>
  56. </view>
  57. <view class="flex row flex-space-between" v-if="sign == '挂车'">
  58. <view class="left-text">挂车道路运输证有效期</view>
  59. <view class="" @click="selectValidityPeriod(5)">
  60. {{dataDetails.trailerOperationCertificateValidityDate?dataDetails.trailerOperationCertificateValidityDate:'选择有效期>'}}
  61. </view>
  62. </view>
  63. <view class="title" v-if="sign == '挂车'">牵引车行驶证主页</view>
  64. <view class="title" v-if="sign == '非挂车'">行驶证主页</view>
  65. <view @click="uploadImg(3)" class="picture picture3" v-if="!dataDetails.drivingLicenseHomePage">
  66. <image class="xj-image" src="@/static/images/mine/ic_shanchuan@2x.png"></image>
  67. <view class="text" v-if="sign == '挂车'">上传牵引车行驶证主页</view>
  68. <view class="text" v-else>上传行驶证主页</view>
  69. </view>
  70. <view v-if="dataDetails.drivingLicenseHomePage" @click.stop="uploadImg(3)" class="preview-card-img picture">
  71. <view @click.stop="delCard(3)">
  72. <image class='del-card' src="@/static/images/common/quxiao@2x.png">
  73. </image>
  74. </view>
  75. <image class="" :src="dataDetails.drivingLicenseHomePage" mode="aspectFit"></image>
  76. </view>
  77. <view class="title" v-if="sign == '挂车'">牵引车行驶证副页</view>
  78. <view class="title" v-if="sign == '非挂车'">行驶证副页</view>
  79. <view @click="uploadImg(4)" class="picture picture4" v-if="!dataDetails.drivingLicenseBackPage">
  80. <image class="xj-image" src="@/static/images/mine/ic_shanchuan@2x.png"></image>
  81. <view class="text" v-if="sign == '挂车'">上传牵引车行驶证副页</view>
  82. <view class="text" v-else>上传行驶证副页</view>
  83. </view>
  84. <view v-if="dataDetails.drivingLicenseBackPage" @click.stop="uploadImg(4)" class="preview-card-img picture">
  85. <view @click.stop="delCard(4)">
  86. <image class='del-card' src="@/static/images/common/quxiao@2x.png">
  87. </image>
  88. </view>
  89. <image class="" :src="dataDetails.drivingLicenseBackPage" mode="aspectFit"></image>
  90. </view>
  91. <view class="flex row flex-space-between">
  92. <view class="left-text">行驶证档案编号</view>
  93. <u--input placeholder="输入行驶证档案编号" inputAlign='right' border="none"
  94. v-model="dataDetails.drivingLicenseNumber">
  95. </u--input>
  96. </view>
  97. <view class="flex row flex-space-between">
  98. <view class="left-text">注册日期</view>
  99. <view class="" @click="selectValidityPeriod(6)">
  100. {{dataDetails.drivingLicenseRegistrationDate?dataDetails.drivingLicenseRegistrationDate:'选择注册日期>'}}
  101. </view>
  102. </view>
  103. <view class="flex row flex-space-between">
  104. <view class="left-text">发证日期</view>
  105. <view class="" @click="selectValidityPeriod(7)">
  106. {{dataDetails.drivingLicenseIssueDate?dataDetails.drivingLicenseIssueDate:'选择发证日期>'}}
  107. </view>
  108. </view>
  109. <view class="flex row flex-space-between">
  110. <view class="left-text">行驶证有效期</view>
  111. <view class="" @click="selectValidityPeriod(1)">
  112. {{dataDetails.drivingLicenseValidityDate?dataDetails.drivingLicenseValidityDate:'选择有效截止日期>'}}
  113. </view>
  114. </view>
  115. <view class="flex row flex-space-between">
  116. <view class="left-text">使用性质</view>
  117. <u--input placeholder="输入使用性质" inputAlign='right' border="none" v-model="dataDetails.useNature"
  118. disabled>
  119. </u--input>
  120. </view>
  121. <view class="flex row flex-space-between">
  122. <view class="left-text">发证机关</view>
  123. <u--input placeholder="输入发证机关" inputAlign='right' border="none" maxlength="25" v-model="dataDetails.lssuingAuthority">
  124. </u--input>
  125. </view>
  126. <view class="flex row noborder">
  127. <view class="left-text">车辆能源类型</view>
  128. <view style='text-align:right;width:50%;' class="" @click="driveType">
  129. {{dataDetails.energyType?dataDetails.energyType:'选择车辆能源类型>'}}>
  130. </view>
  131. </view>
  132. <view class="" v-if="sign == '挂车'">
  133. <view class="title">挂车行驶证主页</view>
  134. <view @click="uploadImg(5)" class="picture picture5" v-if="!dataDetails.trailerLicenseHomePage">
  135. <image class="xj-image" src="@/static/images/mine/ic_shanchuan@2x.png"></image>
  136. <view class="text">上传挂车行驶证主页</view>
  137. </view>
  138. <view v-if="dataDetails.trailerLicenseHomePage" @click.stop="uploadImg(5)"
  139. class="preview-card-img picture">
  140. <view @click.stop="delCard(5)">
  141. <image class='del-card' src="@/static/images/common/quxiao@2x.png">
  142. </image>
  143. </view>
  144. <image class="" :src="dataDetails.trailerLicenseHomePage" mode="aspectFit"></image>
  145. </view>
  146. </view>
  147. <view v-if="sign == '挂车'">
  148. <view class="title">挂车行驶证副页</view>
  149. <view @click="uploadImg(6)" class="picture picture6" v-if="!dataDetails.trailerLicenseBackPage">
  150. <image class="xj-image" src="@/static/images/mine/ic_shanchuan@2x.png"></image>
  151. <view class="text">上传挂车行驶证副页</view>
  152. </view>
  153. <view v-if="dataDetails.trailerLicenseBackPage" @click.stop="uploadImg(6)"
  154. class="preview-card-img picture">
  155. <view @click.stop="delCard(6)">
  156. <image class='del-card' src="@/static/images/common/quxiao@2x.png">
  157. </image>
  158. </view>
  159. <image class="" :src="dataDetails.trailerLicenseBackPage" mode="aspectFit"></image>
  160. </view>
  161. </view>
  162. <view class="flex row flex-space-between" v-if="sign == '挂车'">
  163. <view class="left-text">挂车行驶证档案编号</view>
  164. <u--input placeholder="输入挂车行驶证档案编号" inputAlign='right' border="none"
  165. v-model="dataDetails.trailerLicenseNumber">
  166. </u--input>
  167. </view>
  168. <view class="flex row flex-space-between" v-if="sign == '挂车'">
  169. <view class="left-text">注册日期</view>
  170. <view class="" @click="selectValidityPeriod(8)">
  171. {{dataDetails.trailerLicenseRegistrationDate?dataDetails.trailerLicenseRegistrationDate:'选择注册日期>'}}
  172. </view>
  173. </view>
  174. <view class="flex row flex-space-between" v-if="sign == '挂车'">
  175. <view class="left-text">发证日期</view>
  176. <view class="" @click="selectValidityPeriod(9)">
  177. {{dataDetails.trailerLicenseIssueDate?dataDetails.trailerLicenseIssueDate:'选择发证日期>'}}
  178. </view>
  179. </view>
  180. <view class="flex row flex-space-between" v-if="sign == '挂车'">
  181. <view class="left-text">挂车行驶证有效期</view>
  182. <view class="" @click="selectValidityPeriod(2)">
  183. {{dataDetails.trailerLicenseValidityDate?dataDetails.trailerLicenseValidityDate:'选择有效截止日期>'}}
  184. </view>
  185. </view>
  186. <view class="flex row flex-space-between" v-if="sign == '挂车'">
  187. <view class="left-text">使用性质</view>
  188. <u--input placeholder="输入使用性质" inputAlign='right' border="none" v-model="dataDetails.guaUseNature"
  189. disabled>
  190. </u--input>
  191. </view>
  192. <view class="flex row flex-space-between" v-if="sign == '挂车'">
  193. <view class="left-text">发证机关</view>
  194. <u--input placeholder="输入发证机关" inputAlign='right' border="none" maxlength="25"
  195. v-model="dataDetails.guaLssuingAuthority">
  196. </u--input>
  197. </view>
  198. <!-- 牵引车 -->
  199. <view class="flex row" v-if="sign == '挂车'">
  200. <view class="left left-text">牵引车车牌号</view>
  201. <view class="right flex">
  202. <input class="car-uumber" v-model='dataDetails.carNumber' @click.stop="handleShowKeyboard(index)"
  203. :disabled="true" placeholder="输入牵引车车牌号" name="input"></input>
  204. </view>
  205. </view>
  206. <view class="flex row" v-if="sign == '非挂车'">
  207. <view class="left left-text">车牌号</view>
  208. <view class="right flex">
  209. <input class="car-uumber" v-model='dataDetails.carNumber' @click.stop="handleShowKeyboard(index)"
  210. :disabled="true" placeholder="输入车牌号" name="input"></input>
  211. </view>
  212. </view>
  213. <view class="flex row flex-space-between">
  214. <view class="left-text">车牌颜色</view>
  215. <view class='flex'>
  216. <view class="color" @click="selectNoColor">{{dataDetails.carNumberColour}}</view>
  217. <view>></view>
  218. </view>
  219. </view>
  220. <view class="flex row">
  221. <view class="left-text">车辆所属车主</view>
  222. <input style='text-align:right;' placeholder="输入车主姓名" v-model="dataDetails.owner" type="text">
  223. <!-- <u--input inputAlign='left' border="none"> -->
  224. </u--input>
  225. </view>
  226. <view class="flex row" v-if="sign == '非挂车'">
  227. <view class="left-text">总质量(千克)</view>
  228. <u--input type='number' placeholder="输入总质量" inputAlign='right' border="none" v-model="dataDetails.carTotalWeight">
  229. </u--input>
  230. </view>
  231. <view class="flex row" v-if="sign == '挂车'">
  232. <view class="left-text">整备质量(千克)</view>
  233. <u--input type='number' placeholder="输入整备质量" inputAlign='right' border="none" v-model="dataDetails.servicingWeight">
  234. </u--input>
  235. </view>
  236. <view class="flex row noborder" v-if="sign == '挂车'">
  237. <view style='width:390rpx;' class="left-text">牵引车外廓尺寸(毫米)</view>
  238. </view>
  239. <view class="flex row noborder" v-if="sign == '非挂车'">
  240. <view class="left-text">外廓尺寸(毫米)</view>
  241. </view>
  242. <view class="flex row noborder input-ckg">
  243. <view class="input-positon">
  244. <!-- <input type='number' class="input" placeholder="长" border="none"
  245. v-model="dataDetails.carLong"> -->
  246. <u--input type='number' class="input" placeholder="长" inputAlign='left' border="none"
  247. v-model="dataDetails.carLong">
  248. </u--input>
  249. <view class="position-right">
  250. mm
  251. </view>
  252. </view>
  253. <view class="star">*</view>
  254. <view class="input-positon">
  255. <!-- <input type='number' class="input" placeholder="宽" border="none"
  256. v-model="dataDetails.carWidth"> -->
  257. <u--input type='number' placeholder="宽" inputAlign='left' border="none" v-model="dataDetails.carWidth">
  258. </u--input>
  259. <view class="position-right">
  260. mm
  261. </view>
  262. </view>
  263. <view class="star">*</view>
  264. <view class="input-positon">
  265. <!-- <input type='number' class="input" placeholder="高" border="none"
  266. v-model="dataDetails.carHeight"> -->
  267. <u--input type='number' placeholder="高" inputAlign='left' border="none" v-model="dataDetails.carHeight">
  268. </u--input>
  269. <view class="position-right">
  270. mm
  271. </view>
  272. </view>
  273. </view>
  274. <view class="flex row noborder s-row">
  275. <view class="left-text" style="width: 100%;" v-if="sign == '挂车'">上传人和牵引车合影(牵引车牌号可见)</view>
  276. <view class="left-text" style="width: 100%;" v-if="sign == '非挂车'">上传人车合影(车头车牌号可见)</view>
  277. <u-upload class="uview-upload" :fileList="fileList1" @afterRead="afterRead($event,'1')"
  278. @delete="deletePic" name="1" multiple :maxCount="1"></u-upload>
  279. </view>
  280. <!-- 挂车 -->
  281. <view v-if="sign == '挂车'">
  282. <view class="flex row">
  283. <view class="left left-text">挂车车牌号</view>
  284. <view class="right flex">
  285. <input class="car-uumber" v-model='dataDetails.guaCarNumber'
  286. @click.stop="handleShowKeyboard1(index)" :disabled="true" placeholder-class= "phsy" placeholder="输入挂车牌号"
  287. name="input"></input>
  288. </view>
  289. </view>
  290. <view class="flex row">
  291. <view class="left-text">车辆所属车主</view>
  292. <u--input placeholder="输入车主姓名" inputAlign='right' border="none" v-model="dataDetails.guaOwner">
  293. </u--input>
  294. </view>
  295. <view class="flex row">
  296. <view class="left-text">整备质量(千克)</view>
  297. <u--input type='number' placeholder="输入整备质量" inputAlign='right' border="none"
  298. v-model="dataDetails.guaServicingWeight">
  299. </u--input>
  300. </view>
  301. <view class="flex row">
  302. <view class="left-text">核定载质量(千克)</view>
  303. <u--input type='number' placeholder="输入核定载质量" inputAlign='right' border="none"
  304. v-model="dataDetails.guaCarApprovedWeight">
  305. </u--input>
  306. </view>
  307. <view class="flex row noborder">
  308. <view style='width:390rpx;' class="left-text">挂车外廓尺寸(毫米)</view>
  309. </view>
  310. <view class="flex row noborder input-ckg">
  311. <view class="input-positon">
  312. <u--input type='number' class="input" placeholder="长" inputAlign='left' border="none"
  313. v-model="dataDetails.guaCarLong">
  314. </u--input>
  315. <view class="position-right">
  316. mm
  317. </view>
  318. </view>
  319. <view class="star">*</view>
  320. <view class="input-positon">
  321. <u--input type='number' placeholder="宽" inputAlign='left' border="none" v-model="dataDetails.guaCarWidth">
  322. </u--input>
  323. <view class="position-right">
  324. mm
  325. </view>
  326. </view>
  327. <view class="star">*</view>
  328. <view class="input-positon">
  329. <u--input type='number' placeholder="高" inputAlign='left' border="none" v-model="dataDetails.guaCarHeight">
  330. </u--input>
  331. <view class="position-right">
  332. mm
  333. </view>
  334. </view>
  335. </view>
  336. <view class="flex row noborder s-row">
  337. <view class="left-text" style="width: 100%;">上传人和挂车合影(挂车车牌号可见)</view>
  338. <u-upload class="uview-upload" :fileList="fileList2" @afterRead="afterRead1($event,'2')"
  339. @delete="deletePic" name="2" multiple :maxCount="1"></u-upload>
  340. </view>
  341. </view>
  342. <!-- <view class="level1-title">证件信息</view> -->
  343. </view>
  344. <view class='submit-btn-wrap'>
  345. <view class="submit-btn" @click="submit">提交</view>
  346. </view>
  347. <master-keyboard ref="keyboard" keyboardtype="car" :show="keyShow" :randomNumber="true" :newCar="false"
  348. :defaultValue="carNumber" @keyboardClick="handleClick"></master-keyboard>
  349. <master-keyboard ref="keyboard1" :guastatus='true' keyboardtype="car" :show="keyShow1" :randomNumber="true" :newCar="false"
  350. :defaultValue="carNumber1" @keyboardClick="handleClick1"></master-keyboard>
  351. <u-toast ref="uToast"></u-toast>
  352. <u-action-sheet :actions="$helper.imgTypeList" :title="$helper.imgType" :show="isShowimgType"
  353. @select="imgTypeSelect" :closeOnClickOverlay="true" :closeOnClickAction="true" @close="isShowimgType=false">
  354. </u-action-sheet>
  355. <u-picker :show="carColor" :columns="colorColumns" :closeOnClickOverlay='true' @close='colorClose'
  356. @cancel='colorClose' @confirm='confirmColor' ></u-picker>
  357. <u-picker :show="isShowValidity" ref="uPicker" :columns="validityPeriod" @confirm="confirmValidityPeriod"
  358. :closeOnClickOverlay='true' @close='isShowValidity=false' @cancel='isShowValidity=false'>
  359. </u-picker>
  360. <u-picker :show="isShowCarType" ref="uPicker" :columns="carTypeList" @confirm="confirmCarType"
  361. :closeOnClickOverlay='true' @close='isShowCarType=false' @cancel='isShowCarType=false'>
  362. </u-picker>
  363. </view>
  364. </template>
  365. <script>
  366. import uploadImage from '@/components/ossutil/uploadFile.js';
  367. import permision from "@/js_sdk/wa-permission/permission.js"
  368. import keyboard from "@/components/master-keyboard/master-keyboard.vue";
  369. var _this;
  370. import {
  371. mapState
  372. } from 'vuex';
  373. export default {
  374. data() {
  375. return {
  376. index: '',
  377. keyShow: false,
  378. keyShow1: false,
  379. carNumber: '',
  380. carNumber1: "",
  381. dataDetails: {
  382. // driverId: '',
  383. // carNumber: '',
  384. carNumberColour: '黄色',
  385. carCategory: '挂车',
  386. carType: '高栏',
  387. useNature: "营业特种车",
  388. guaUseNature: "营运挂车",
  389. energyType:"汽油",
  390. owner:''
  391. // carTotalWeight: '',
  392. // carApprovedWeight: '',
  393. // carLong: '',
  394. // carWidth: '',
  395. // carHeight: '',
  396. // addressUrl: ''
  397. },
  398. carTypeList:[["汽油","柴油","油电混合","纯电动","插电式混合动力","增程式"]],
  399. isShowCarType:false,
  400. carModelColumns: [
  401. ['挂车', '非挂车'],
  402. ['高栏', '集装箱', '自卸车']
  403. ],
  404. carModelColumnData: [
  405. ['高栏', '集装箱', '自卸车'],
  406. ['重型仓栏']
  407. ],
  408. colorColumns: [
  409. ['黄色', '蓝色']
  410. ],
  411. carColor: false,
  412. carModel: false,
  413. fileList1: [],
  414. fileList2: [],
  415. ValidityPeriodType: "",
  416. validityPeriod: [],
  417. isShowValidity: false,
  418. uploadType: '',
  419. isShowimgType: false,
  420. sign: "挂车"
  421. };
  422. },
  423. computed: {
  424. ...mapState(['hasLogin', 'userInfo', 'firstAuthentication']),
  425. },
  426. onLoad(options) {
  427. _this = this;
  428. this.dataDetails.commonId = this.userInfo.id
  429. this.get_camera_permission()
  430. this.validityPeriod = this.$helper.makeValidityPeriod()
  431. },
  432. methods: {
  433. async get_camera_permission() {
  434. var photol=await permision.requestAndroidPermission("android.permission.CAMERA")
  435. if(photol == false){
  436. uni.showModal({
  437. title: '提示',
  438. content: '您已经关闭相册权限,去设置',
  439. success: function (res) {
  440. if (res.confirm) {
  441. permision.gotoAppPermissionSetting()
  442. // plus.runtime.openURL("app-settings:");
  443. } else if (res.cancel) {
  444. console.log('用户点击取消');
  445. }
  446. }
  447. });
  448. }
  449. },
  450. driveType(){
  451. this.isShowCarType = true
  452. },
  453. confirmCarType(e){
  454. this.dataDetails.energyType = e.value[0]
  455. this.isShowCarType = false
  456. },
  457. hidden(){
  458. this.$refs.keyboard.open(false)
  459. },
  460. //挂车牌号弹出键盘
  461. handleShowKeyboard1(index) {
  462. if (this.dataDetails.guaCarNumber == '') {
  463. this.carNumber1 = ''
  464. } else {
  465. this.carNumber1 = this.dataDetails.guaCarNumber
  466. }
  467. if (this.$refs.keyboard1.open) {
  468. this.$refs.keyboard1.open(false) //true 键盘显示 false 键盘隐藏
  469. } else {
  470. this.$refs.keyboard1[0].open(false)
  471. }
  472. this.index = index
  473. if (this.$refs.keyboard1.open) {
  474. this.$refs.keyboard1.open(true) //true 键盘显示 false 键盘隐藏
  475. } else {
  476. this.$refs.keyboard1[0].open(true)
  477. }
  478. },
  479. handleClick1(e) {
  480. this.carNumber1 = e.value
  481. this.dataDetails.guaCarNumber = e.value //键盘输入值
  482. },
  483. delCard(type) {
  484. switch (type) {
  485. case 1:
  486. _this.dataDetails.operationCertificate = "" //道路运输证
  487. break;
  488. case 2:
  489. _this.dataDetails.trailerOperationCertificate = "" //挂车道路运输证
  490. break;
  491. case 3:
  492. _this.dataDetails.drivingLicenseHomePage = "" //牵引车行驶证
  493. break;
  494. case 4:
  495. _this.dataDetails.drivingLicenseBackPage = "" //牵引车行驶证副页
  496. break;
  497. case 5:
  498. _this.dataDetails.trailerLicenseHomePage = "" //挂车行驶证
  499. break;
  500. case 6:
  501. _this.dataDetails.trailerLicenseBackPage = ""//挂车行驶证副页
  502. break;
  503. }
  504. _this.$forceUpdate()
  505. },
  506. uploadImg(type) {
  507. this.uploadType = type
  508. this.imgTypeSelect()
  509. // this.isShowimgType = true
  510. },
  511. selectValidityPeriod(type) {
  512. this.ValidityPeriodType = type
  513. this.isShowValidity = true
  514. },
  515. // 上传图片
  516. imgTypeSelect(val) {
  517. // if (val.name == '相册') {
  518. uni.chooseImage({
  519. count: 1,
  520. success: function(res) {
  521. uploadImage("images", res.tempFilePaths[0], 'appData/',
  522. result => {
  523. // 上传成功回调函数
  524. console.log('图片地址-----', result)
  525. switch (_this.uploadType) {
  526. case 1:
  527. _this.dataDetails.driverLicenseHomePage = result
  528. break;
  529. case 2:
  530. _this.dataDetails.driverLicenseBackPage = result
  531. break;
  532. case 3:
  533. _this.dataDetails.drivingLicenseHomePage = result
  534. _this.$request.baseRequest('get',
  535. '/driverCarInfo/api/driveringLicenseShibie', {
  536. image: result,
  537. flag: 1
  538. }).then(res => {
  539. if (res.data) {
  540. _this.dataDetails.carNumber = res.data
  541. .carNum //车牌号
  542. _this.dataDetails.vehicleType = res.data.vehicleType
  543. _this.dataDetails.carCode =res.data.carCode
  544. _this.dataDetails.owner = res.data
  545. .owner //车辆所有人
  546. _this.$forceUpdate()
  547. }
  548. })
  549. .catch(res => {
  550. uni.$u.toast(res.message);
  551. });
  552. break;
  553. case 4:
  554. _this.dataDetails.drivingLicenseBackPage = result
  555. _this.$request.baseRequest('get',
  556. '/driverCarInfo/api/driveringLicenseShibie', {
  557. image: result,
  558. flag: 2
  559. }).then(res => {
  560. if (res.data) {
  561. if (res.data.issuingAuthority) { //行驶证发证机关
  562. _this.dataDetails.lssuingAuthority = res
  563. .data.issuingAuthority
  564. }
  565. if (res.data
  566. .licenseRegistrationDate) { //行驶证注册日期
  567. _this.dataDetails
  568. .drivingLicenseRegistrationDate = res
  569. .data.licenseRegistrationDate
  570. }
  571. if (res.data.licenseIssueDate) { //行驶证发证日期
  572. _this.dataDetails.drivingLicenseIssueDate =
  573. res.data.licenseIssueDate
  574. }
  575. _this.dataDetails.drivingLicenseValidityDate =
  576. res.data.driveringEndDate //行驶证有效期
  577. _this.dataDetails.drivingLicenseNumber = res
  578. .data.driveringNum //行驶证档案编号
  579. if (_this.sign == "非挂车") {
  580. if (res.data.servicingMass && res.data
  581. .servicingMass.indexOf("kg") != -1) {
  582. res.data.servicingMass = res.data
  583. .servicingMass.slice(0, res.data
  584. .servicingMass.length - 2)
  585. }
  586. _this.dataDetails.carTotalWeight = res.data
  587. .servicingMass //总质量
  588. }
  589. if(res.data.approvedLoadMass.indexOf("kg") != -1){
  590. res.data.approvedLoadMass = res.data.approvedLoadMass.slice(0, res.data.approvedLoadMass.length - 2)
  591. }
  592. _this.dataDetails.carApprovedWeight = res.data
  593. .approvedLoadMass //核定载质量
  594. if (res.data.size && res.data.size.indexOf(
  595. "mm") != -1) {
  596. res.data.size = res.data.size.slice(0, res
  597. .data.size.length - 2);
  598. }
  599. _this.dataDetails.carLong = res.data.size
  600. .split("X")[0] //车长
  601. _this.dataDetails.carWidth = res.data.size
  602. .split("X")[1] //车宽
  603. _this.dataDetails.carHeight = res.data.size
  604. .split("X")[2] //车高
  605. _this.$forceUpdate()
  606. }
  607. })
  608. .catch(res => {
  609. uni.$u.toast(res.message);
  610. });
  611. break;
  612. case 5: //挂车行驶证
  613. _this.dataDetails.trailerLicenseHomePage = result
  614. _this.$request.baseRequest('get',
  615. '/driverCarInfo/api/driveringLicenseShibie', {
  616. image: result,
  617. flag: 1
  618. }).then(res => {
  619. if (res.data) {
  620. if (res.data.issuingAuthority) { //行驶证发证机关
  621. _this.dataDetails.guaLssuingAuthority = res
  622. .data.issuingAuthority
  623. }
  624. if (res.data.licenseRegistrationDate) { //行驶证注册日期
  625. _this.dataDetails
  626. .trailerLicenseRegistrationDate = res.data
  627. .licenseRegistrationDate
  628. }
  629. if (res.data.licenseIssueDate) { //行驶证发证日期
  630. _this.dataDetails.trailerLicenseIssueDate = res
  631. .data.licenseIssueDate
  632. }
  633. _this.dataDetails.guaCarNumber = res.data
  634. .carNum //车牌号
  635. _this.dataDetails.guaOwner = res.data
  636. .owner //车辆所有人
  637. _this.$forceUpdate()
  638. }
  639. })
  640. .catch(res => {
  641. uni.$u.toast(res.message);
  642. });
  643. break;
  644. case 6:
  645. _this.dataDetails.trailerLicenseBackPage = result
  646. _this.$request.baseRequest('get',
  647. '/driverCarInfo/api/driveringLicenseShibie', {
  648. image: result,
  649. flag: 2
  650. }).then(res => {
  651. if (res.data) {
  652. _this.dataDetails.trailerLicenseValidityDate =
  653. res.data.driveringEndDate //挂车行驶证有效期
  654. _this.dataDetails.trailerLicenseNumber = res
  655. .data.driveringNum //挂车行驶证档案编号
  656. if (res.data.servicingMass && res.data
  657. .servicingMass.indexOf("kg") != -1) {
  658. res.data.servicingMass = res.data
  659. .servicingMass.slice(0, res.data
  660. .servicingMass.length - 2)
  661. }
  662. if(res.data.approvedLoadMass.indexOf("kg") != -1){
  663. res.data.approvedLoadMass = res.data.approvedLoadMass.slice(0, res.data.approvedLoadMass.length - 2)
  664. }
  665. _this.dataDetails.guaServicingWeight = res.data.servicingMass //总质量
  666. _this.dataDetails.guaCarApprovedWeight = res.data.approvedLoadMass //核定载质量
  667. if (res.data.size && res.data.size.indexOf(
  668. "mm") != -1) {
  669. res.data.size = res.data.size.slice(0, res
  670. .data.size.length - 2);
  671. }
  672. _this.dataDetails.guaCarLong = res.data.size
  673. .split("X")[0] //车长
  674. _this.dataDetails.guaCarWidth = res.data.size
  675. .split("X")[1] //车宽
  676. _this.dataDetails.guaCarHeight = res.data.size
  677. .split("X")[2] //车高
  678. _this.$forceUpdate()
  679. }
  680. })
  681. .catch(res => {
  682. uni.$u.toast(res.message);
  683. });
  684. break;
  685. case 7:
  686. _this.dataDetails.qualificationCertificate = result
  687. break;
  688. case 8:
  689. _this.dataDetails.operationCertificate = result
  690. _this.$request.baseRequest('get',
  691. '/driverCarInfo/api/tranLicenseShibie', {
  692. image: result
  693. }).then(res => {
  694. if (res.data) {
  695. _this.dataDetails.operationCertificateNumber =
  696. res.data.tranNumber
  697. _this.dataDetails
  698. .operationCertificateValidityDate = res
  699. .data.tranEndDate
  700. _this.$forceUpdate()
  701. }
  702. })
  703. .catch(res => {
  704. uni.$u.toast(res.message);
  705. });
  706. break;
  707. case 9:
  708. _this.dataDetails.trailerOperationCertificate = result
  709. _this.$request.baseRequest('get',
  710. '/driverCarInfo/api/tranLicenseShibie', {
  711. image: result
  712. }).then(res => {
  713. if (res.data) {
  714. _this.dataDetails
  715. .trailerOperationCertificateNumber = res
  716. .data.tranNumber
  717. _this.dataDetails
  718. .trailerOperationCertificateValidityDate =
  719. res.data.tranEndDate
  720. _this.$forceUpdate()
  721. }
  722. })
  723. .catch(res => {
  724. uni.$u.toast(res.message);
  725. });
  726. break;
  727. }
  728. _this.$forceUpdate()
  729. }
  730. )
  731. }
  732. });
  733. // }
  734. },
  735. confirmValidityPeriod(e) {
  736. console.log('confirm', e)
  737. if(e.value[0]==''){
  738. this.$refs.uToast.show({
  739. type: 'error',
  740. message: "年份不能为空!",
  741. })
  742. return
  743. }else if(e.value[1]==''){
  744. this.$refs.uToast.show({
  745. type: 'error',
  746. message: "月份不能为空!",
  747. })
  748. return
  749. }else if(e.value[2]==''){
  750. this.$refs.uToast.show({
  751. type: 'error',
  752. message: "日期不能为空!",
  753. })
  754. return
  755. }
  756. var date=new Date()
  757. var text=''
  758. switch (this.ValidityPeriodType) {
  759. case 4:
  760. text='道路运输证已过期!'
  761. break
  762. case 5:
  763. text='挂车道路运输证已过期!'
  764. break
  765. case 1:
  766. text='行驶证已过期!'
  767. break
  768. case 2:
  769. text='挂车行驶证已过期!'
  770. break
  771. }
  772. if(this.ValidityPeriodType==1||this.ValidityPeriodType==2||this.ValidityPeriodType==4||this.ValidityPeriodType==5){
  773. if(e.value[0]<date.getFullYear()){
  774. this.$refs.uToast.show({
  775. type: 'error',
  776. message: text,
  777. })
  778. return
  779. }
  780. if(e.value[0]==date.getFullYear()&&Number(e.value[1])<(date.getMonth()+1)){
  781. this.$refs.uToast.show({
  782. type: 'error',
  783. message: text,
  784. })
  785. return
  786. }
  787. if(e.value[0]==date.getFullYear()&&Number(e.value[1])==(date.getMonth()+1)&&Number(e.value[2])<=(date.getDate())){
  788. this.$refs.uToast.show({
  789. type: 'error',
  790. message: text,
  791. })
  792. return
  793. }
  794. }
  795. switch (this.ValidityPeriodType) {
  796. case 0:
  797. this.dataDetails.driverLicenseValidityDate = e.value[0] + '-' + e.value[1] + '-' + e.value[2]
  798. break
  799. case 1:
  800. this.dataDetails.drivingLicenseValidityDate = e.value[0] + '-' + e.value[1] + '-' + e.value[2]
  801. break
  802. case 2:
  803. this.dataDetails.trailerLicenseValidityDate = e.value[0] + '-' + e.value[1] + '-' + e.value[2]
  804. break
  805. case 3:
  806. this.dataDetails.qualificationCertificateValidityDate = e.value[0] + '-' + e.value[1] + '-' + e
  807. .value[2]
  808. break
  809. case 4:
  810. this.dataDetails.operationCertificateValidityDate = e.value[0] + '-' + e.value[1] + '-' + e.value[
  811. 2]
  812. break
  813. case 5:
  814. this.dataDetails.trailerOperationCertificateValidityDate = e.value[0] + '-' + e.value[1] + '-' + e
  815. .value[2]
  816. case 6: //行驶证注册日期
  817. this.dataDetails.drivingLicenseRegistrationDate = e.value[0] + '-' + e.value[1] + '-' + e
  818. .value[2]
  819. break
  820. case 7: //行驶证发证日期
  821. this.dataDetails.drivingLicenseIssueDate = e.value[0] + '-' + e.value[1] + '-' + e
  822. .value[2]
  823. break
  824. case 8: //挂车行驶证注册日期
  825. this.dataDetails.trailerLicenseRegistrationDate = e.value[0] + '-' + e.value[1] + '-' + e
  826. .value[2]
  827. break
  828. case 9: //挂车行驶证发证日期
  829. this.dataDetails.trailerLicenseIssueDate = e.value[0] + '-' + e.value[1] + '-' + e
  830. .value[2]
  831. break
  832. }
  833. this.isShowValidity = false
  834. },
  835. // 车型切换
  836. changeCarModel(e) {
  837. const {
  838. columnIndex,
  839. index,
  840. // 微信小程序无法将picker实例传出来,只能通过ref操作
  841. picker = this.$refs.carTypePicker
  842. } = e
  843. if (columnIndex === 0) {
  844. // 模拟网络请求
  845. picker.setColumnValues(1, this.carModelColumnData[index])
  846. }
  847. },
  848. // 删除图片
  849. deletePic(event) {
  850. this[`fileList${event.name}`].splice(event.index, 1)
  851. },
  852. // 新增图片
  853. async afterRead(event, num) {
  854. // 当设置 mutiple 为 true 时, file 为数组格式,否则为对象格式
  855. let lists = [].concat(event.file)
  856. let fileListLen = this[`fileList${event.name}`].length
  857. lists.map((item) => {
  858. this[`fileList${event.name}`].push({
  859. ...item,
  860. status: 'uploading',
  861. message: '上传中'
  862. })
  863. })
  864. for (let i = 0; i < lists.length; i++) {
  865. const result = await this.uploadFilePromise(lists[i].url, num)
  866. let item = this[`fileList${event.name}`][fileListLen]
  867. this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
  868. status: 'success',
  869. message: '',
  870. url: result
  871. }))
  872. fileListLen++
  873. }
  874. },
  875. // 新增图片
  876. async afterRead1(event, num) {
  877. console.log(event)
  878. // 当设置 mutiple 为 true 时, file 为数组格式,否则为对象格式
  879. let lists = [].concat(event.file)
  880. let fileListLen = this[`fileList${event.name}`].length
  881. lists.map((item) => {
  882. this[`fileList${event.name}`].push({
  883. ...item,
  884. status: 'uploading',
  885. message: '上传中'
  886. })
  887. })
  888. for (let i = 0; i < lists.length; i++) {
  889. const result = await this.uploadFilePromise(lists[i].url, num)
  890. let item = this[`fileList${event.name}`][fileListLen]
  891. this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
  892. status: 'success',
  893. message: '',
  894. url: result
  895. }))
  896. fileListLen++
  897. }
  898. },
  899. uploadFilePromise(url, num) {
  900. uploadImage('image', url, 'appData/',
  901. result => {
  902. // 上传成功回调函数
  903. console.log('图片地址', result)
  904. if (num == 1) {
  905. if (!this.dataDetails.addressUrl) {
  906. this.dataDetails.addressUrl = result
  907. } else {
  908. this.dataDetails.addressUrl = this.dataDetails.addressUrl + ',' + result
  909. }
  910. } else if (num == 2) {
  911. if (!this.dataDetails.guaAddressUrl) {
  912. this.dataDetails.guaAddressUrl = result
  913. } else {
  914. this.dataDetails.guaAddressUrl = this.dataDetails.guaAddressUrl + ',' + result
  915. }
  916. }
  917. }
  918. )
  919. },
  920. //车牌号弹出键盘
  921. handleShowKeyboard(index) {
  922. if (this.dataDetails.carNumber == '') {
  923. this.carNumber = ''
  924. } else {
  925. this.carNumber = this.dataDetails.carNumber
  926. }
  927. if (this.$refs.keyboard.open) {
  928. this.$refs.keyboard.open(false) //true 键盘显示 false 键盘隐藏
  929. } else {
  930. this.$refs.keyboard[0].open(false)
  931. }
  932. this.index = index
  933. if (this.$refs.keyboard.open) {
  934. this.$refs.keyboard.open(true) //true 键盘显示 false 键盘隐藏
  935. } else {
  936. this.$refs.keyboard[0].open(true)
  937. }
  938. },
  939. //车牌号弹出键盘
  940. handleClick(e) {
  941. this.carNumber = e.value
  942. this.dataDetails.carNumber = e.value //键盘输入值
  943. },
  944. confirmColor(val) {
  945. this.dataDetails.carNumberColour = val.value[0]
  946. this.carColor = false
  947. },
  948. colorClose() {
  949. this.carColor = false
  950. },
  951. selectNoColor() {
  952. this.carColor = true
  953. },
  954. confirmCarModel(val) {
  955. if (val.value[0] == '挂车') {
  956. this.dataDetails.useNature = "营业特种车"
  957. this.dataDetails.guaUseNature = "营运挂车"
  958. } else if (val.value[0] == '非挂车') {
  959. this.dataDetails.useNature = "营运货车"
  960. }
  961. this.sign = val.value[0]
  962. // this.dataDetails.carType = val.value[0] + ' ' + val.value[1]
  963. this.dataDetails.carCategory = val.value[0]
  964. this.dataDetails.carType = val.value[1]
  965. this.carModel = false
  966. },
  967. carModelClose() {
  968. this.carModel = false
  969. },
  970. selectCarModel() {
  971. this.carModel = true
  972. },
  973. selectNoColor() {
  974. this.carColor = true
  975. },
  976. unloadGroupPhoto() {
  977. uni.chooseImage({
  978. count: 1,
  979. success: function(res) {
  980. console.log(JSON.stringify(res.tempFilePaths));
  981. uploadImage('image', res.tempFilePaths[0], 'appData/',
  982. result => {
  983. // 上传成功
  984. console.log('图片地址', result)
  985. }
  986. )
  987. }
  988. });
  989. },
  990. validate() {
  991. if (uni.$u.test.isEmpty(this.dataDetails.operationCertificate)) {
  992. this.$refs.uToast.show({
  993. type: 'error',
  994. message: "道路运输证不能为空!",
  995. })
  996. return true
  997. }
  998. if (uni.$u.test.isEmpty(this.dataDetails.operationCertificateNumber)) {
  999. this.$refs.uToast.show({
  1000. type: 'error',
  1001. message: "道路运输证号不能为空!",
  1002. })
  1003. return true
  1004. }
  1005. if (!uni.$u.test.rangeLength(this.dataDetails.operationCertificateNumber,[0,12])) {
  1006. this.$refs.uToast.show({
  1007. type: 'error',
  1008. message: "道路运输证号输入错误!",
  1009. })
  1010. return true
  1011. }
  1012. if (uni.$u.test.isEmpty(this.dataDetails.operationCertificateValidityDate)) {
  1013. this.$refs.uToast.show({
  1014. type: 'error',
  1015. message: "道路运输证有效期不能为空!",
  1016. })
  1017. return true
  1018. }
  1019. if (this.sign == '挂车') {
  1020. if (uni.$u.test.isEmpty(this.dataDetails.trailerOperationCertificate)) {
  1021. this.$refs.uToast.show({
  1022. type: 'error',
  1023. message: "挂车道路运输证不能为空!",
  1024. })
  1025. return true
  1026. }
  1027. if (uni.$u.test.isEmpty(this.dataDetails.trailerOperationCertificateNumber)) {
  1028. this.$refs.uToast.show({
  1029. type: 'error',
  1030. message: "挂车道路运输证号不能为空!",
  1031. })
  1032. return true
  1033. }
  1034. if (uni.$u.test.isEmpty(this.dataDetails.trailerOperationCertificateValidityDate)) {
  1035. this.$refs.uToast.show({
  1036. type: 'error',
  1037. message: "挂车道路运输证有效期不能为空!",
  1038. })
  1039. return true
  1040. }
  1041. }
  1042. if (uni.$u.test.isEmpty(this.dataDetails.drivingLicenseHomePage)) {
  1043. this.$refs.uToast.show({
  1044. type: 'error',
  1045. message: "行驶证主页不能为空!",
  1046. })
  1047. return true
  1048. }
  1049. if (uni.$u.test.isEmpty(this.dataDetails.drivingLicenseBackPage)) {
  1050. this.$refs.uToast.show({
  1051. type: 'error',
  1052. message: "行驶证副页不能为空!",
  1053. })
  1054. return true
  1055. }
  1056. if (uni.$u.test.isEmpty(this.dataDetails.drivingLicenseNumber)) {
  1057. this.$refs.uToast.show({
  1058. type: 'error',
  1059. message: "行驶证档案编号不能为空!",
  1060. })
  1061. return true
  1062. }
  1063. if (uni.$u.test.isEmpty(this.dataDetails.drivingLicenseRegistrationDate)) {
  1064. this.$refs.uToast.show({
  1065. type: 'error',
  1066. message: "行驶证注册日期不能为空!",
  1067. })
  1068. return true
  1069. }
  1070. if (uni.$u.test.isEmpty(this.dataDetails.drivingLicenseIssueDate)) {
  1071. this.$refs.uToast.show({
  1072. type: 'error',
  1073. message: "行驶证发证日期不能为空!",
  1074. })
  1075. return true
  1076. }
  1077. if (uni.$u.test.isEmpty(this.dataDetails.drivingLicenseValidityDate)) {
  1078. this.$refs.uToast.show({
  1079. type: 'error',
  1080. message: "行驶证有效期不能为空!",
  1081. })
  1082. return true
  1083. }
  1084. if (uni.$u.test.isEmpty(this.dataDetails.lssuingAuthority)) {
  1085. this.$refs.uToast.show({
  1086. type: 'error',
  1087. message: "行驶证发证机关不能为空!",
  1088. })
  1089. return true
  1090. }
  1091. if (uni.$u.test.isEmpty(this.dataDetails.energyType)) {
  1092. this.$refs.uToast.show({
  1093. type: 'error',
  1094. message: "能源类型不能为空!",
  1095. })
  1096. return true
  1097. }
  1098. if (this.sign == '挂车') {
  1099. if (uni.$u.test.isEmpty(this.dataDetails.trailerLicenseHomePage)) {
  1100. this.$refs.uToast.show({
  1101. type: 'error',
  1102. message: "挂车行驶证主页不能为空!",
  1103. })
  1104. return true
  1105. }
  1106. if (uni.$u.test.isEmpty(this.dataDetails.trailerLicenseBackPage)) {
  1107. this.$refs.uToast.show({
  1108. type: 'error',
  1109. message: "挂车行驶证副页不能为空!",
  1110. })
  1111. return true
  1112. }
  1113. if (uni.$u.test.isEmpty(this.dataDetails.trailerLicenseNumber)) {
  1114. this.$refs.uToast.show({
  1115. type: 'error',
  1116. message: "挂车行驶证档案编号不能为空!",
  1117. })
  1118. return true
  1119. }
  1120. if (uni.$u.test.isEmpty(this.dataDetails.trailerLicenseRegistrationDate)) {
  1121. this.$refs.uToast.show({
  1122. type: 'error',
  1123. message: "挂车行驶证注册日期不能为空!",
  1124. })
  1125. return true
  1126. }
  1127. if (uni.$u.test.isEmpty(this.dataDetails.trailerLicenseIssueDate)) {
  1128. this.$refs.uToast.show({
  1129. type: 'error',
  1130. message: "挂车行驶证发证日期不能为空!!",
  1131. })
  1132. return true
  1133. }
  1134. if (uni.$u.test.isEmpty(this.dataDetails.trailerLicenseValidityDate)) {
  1135. this.$refs.uToast.show({
  1136. type: 'error',
  1137. message: "挂车行驶证有效期不能为空!",
  1138. })
  1139. return true
  1140. }
  1141. if (uni.$u.test.isEmpty(this.dataDetails.guaLssuingAuthority)) {
  1142. this.$refs.uToast.show({
  1143. type: 'error',
  1144. message: "挂车行驶证发证机关不能为空!",
  1145. })
  1146. return true
  1147. }
  1148. }
  1149. // true 为校验不通过
  1150. if (uni.$u.test.isEmpty(this.dataDetails.carNumber)) {
  1151. this.$refs.uToast.show({
  1152. type: 'error',
  1153. message: "车牌号不能为空!",
  1154. })
  1155. return true
  1156. }
  1157. if (uni.$u.test.isEmpty(this.dataDetails.owner)) {
  1158. console.log(this.dataDetails.owner)
  1159. this.$refs.uToast.show({
  1160. type: 'error',
  1161. message: "车辆所属车主不能为空!",
  1162. })
  1163. return true
  1164. }
  1165. if (uni.$u.test.isEmpty(this.dataDetails.carTotalWeight) && this.sign == '非挂车') {
  1166. this.$refs.uToast.show({
  1167. type: 'error',
  1168. message: "总质量不能为空!",
  1169. })
  1170. return true
  1171. }
  1172. if (uni.$u.test.isEmpty(this.dataDetails.servicingWeight) && this.sign == '挂车') {
  1173. this.$refs.uToast.show({
  1174. type: 'error',
  1175. message: "整备质量不能为空!",
  1176. })
  1177. return true
  1178. }
  1179. if (uni.$u.test.isEmpty(this.dataDetails.carLong) || uni.$u.test.isEmpty(this.dataDetails.carWidth) || uni
  1180. .$u.test.isEmpty(this.dataDetails.carHeight)) {
  1181. this.$refs.uToast.show({
  1182. type: 'error',
  1183. message: "外廓尺寸不能为空!",
  1184. })
  1185. return true
  1186. }
  1187. if (this.sign == '挂车') {
  1188. if (uni.$u.test.isEmpty(this.dataDetails.trailerLicenseHomePage)) {
  1189. this.$refs.uToast.show({
  1190. type: 'error',
  1191. message: "挂车行驶证主页不能为空!",
  1192. })
  1193. return true
  1194. }
  1195. if (uni.$u.test.isEmpty(this.dataDetails.trailerLicenseBackPage)) {
  1196. this.$refs.uToast.show({
  1197. type: 'error',
  1198. message: "挂车行驶证副页不能为空!",
  1199. })
  1200. return true
  1201. }
  1202. if (uni.$u.test.isEmpty(this.dataDetails.trailerLicenseNumber)) {
  1203. this.$refs.uToast.show({
  1204. type: 'error',
  1205. message: "挂车行驶证档案编号不能为空!",
  1206. })
  1207. return true
  1208. }
  1209. if (uni.$u.test.isEmpty(this.dataDetails.guaCarNumber)) {
  1210. this.$refs.uToast.show({
  1211. type: 'error',
  1212. message: "挂车车牌号不能为空!",
  1213. })
  1214. return true
  1215. }
  1216. if (uni.$u.test.isEmpty(this.dataDetails.guaOwner)) {
  1217. this.$refs.uToast.show({
  1218. type: 'error',
  1219. message: "车辆所属车主不能为空!",
  1220. })
  1221. return true
  1222. }
  1223. if (uni.$u.test.isEmpty(this.dataDetails.guaServicingWeight)) {
  1224. this.$refs.uToast.show({
  1225. type: 'error',
  1226. message: "挂车整备质量不能为空!",
  1227. })
  1228. return true
  1229. }
  1230. if (uni.$u.test.isEmpty(this.dataDetails.guaCarApprovedWeight)) {
  1231. this.$refs.uToast.show({
  1232. type: 'error',
  1233. message: "挂车核定载质量不能为空!",
  1234. })
  1235. return true
  1236. }
  1237. if (uni.$u.test.isEmpty(this.dataDetails.guaCarLong) || uni.$u.test.isEmpty(this.dataDetails.guaCarWidth) || uni.$u.test.isEmpty(this.dataDetails.guaCarHeight)) {
  1238. this.$refs.uToast.show({
  1239. type: 'error',
  1240. message: "挂车外廓尺寸不能为空!",
  1241. })
  1242. return true
  1243. }
  1244. // if (this.dataDetails.fileList2.length == 0) {
  1245. // this.$refs.uToast.show({
  1246. // type: 'error',
  1247. // message: "人和挂车合影不能为空!",
  1248. // })
  1249. // return true
  1250. // }
  1251. }
  1252. return false
  1253. },
  1254. submit() {
  1255. this.dataDetails.driverId = uni.getStorageSync("firstAuthentication").id
  1256. // 校验
  1257. if (this.validate()) return
  1258. if (!this.dataDetails.carApprovedWeight) {
  1259. delete this.dataDetails.carApprovedWeight
  1260. }
  1261. if(this.dataDetails.carCategory == "非挂车"){
  1262. delete this.dataDetails.guaUseNature
  1263. }
  1264. if(this.dataDetails.carCategory == "挂车"){
  1265. this.dataDetails.guaCarNumber=this.dataDetails.guaCarNumber+'挂'
  1266. }
  1267. this.$request.baseRequest('post', '/driverCarInfo/api/addInfo', this.dataDetails).then(res => {
  1268. if (res.code == '200') {
  1269. this.$refs.uToast.show({
  1270. type: 'success',
  1271. message: "提交成功!",
  1272. complete() {
  1273. uni.navigateBack({
  1274. delta: 1
  1275. });
  1276. // uni.$u.route('/pages/mine/manageVehicles/index');
  1277. }
  1278. })
  1279. // this.$refs.uToast.show({
  1280. // ...params
  1281. // })
  1282. // uni.$u.route('/pages/mine/manageVehicles/index');
  1283. } else if (res.code == '400'){
  1284. uni.$u.toast('您输入的内容有问题,请检查后重新提交');
  1285. }else{
  1286. uni.$u.toast(res.message);
  1287. }
  1288. })
  1289. .catch(res => {
  1290. console.log(res)
  1291. uni.$u.toast(res.message);
  1292. });
  1293. },
  1294. },
  1295. }
  1296. </script>
  1297. <style lang="scss" scoped>
  1298. .container {
  1299. margin: 20rpx;
  1300. background: white;
  1301. padding: 0 20rpx;
  1302. border-radius: 20rpx;
  1303. padding-bottom: 200rpx;
  1304. .left-text {
  1305. // background: red;
  1306. width: 290rpx;
  1307. color: #333333;
  1308. display: flex;
  1309. align-items: center;
  1310. }
  1311. .row {
  1312. border-bottom: 1px solid #EEEEEE;
  1313. padding-bottom: 28rpx;
  1314. margin-top: 26rpx;
  1315. .ch-style {}
  1316. }
  1317. .row-ch {
  1318. padding-right: 250rpx;
  1319. box-sizing: border-box;
  1320. }
  1321. .row {
  1322. border-bottom: 1px solid #EEEEEE;
  1323. padding-bottom: 28rpx;
  1324. margin-top: 26rpx;
  1325. }
  1326. .left-text {
  1327. // background: red;
  1328. width: 320rpx;
  1329. color: #333333;
  1330. display: flex;
  1331. align-items: center;
  1332. }
  1333. .picture {
  1334. position: relative;
  1335. width: 100%;
  1336. height: 440rpx;
  1337. display: flex;
  1338. justify-content: center;
  1339. flex-direction: column;
  1340. align-items: center;
  1341. .text {
  1342. margin-top: 20rpx;
  1343. }
  1344. }
  1345. .picture1 {
  1346. background: url(../../../static/images/mine/jzz.png);
  1347. background-size: 100% 100%;
  1348. }
  1349. .picture2 {
  1350. background: url(../../../static/images/mine/jzf.png);
  1351. background-size: 100% 100%;
  1352. }
  1353. .picture3 {
  1354. background: url(../../../static/images/mine/xsz.png);
  1355. background-size: 100% 100%;
  1356. }
  1357. .picture4 {
  1358. background: url(../../../static/images/mine/xsf.png);
  1359. background-size: 100% 100%;
  1360. }
  1361. .picture5 {
  1362. background: url(../../../static/images/mine/gcxsz.png);
  1363. background-size: 100% 100%;
  1364. }
  1365. .picture6 {
  1366. background: url(../../../static/images/mine/gcxsf.png);
  1367. background-size: 100% 100%;
  1368. }
  1369. .picture7 {
  1370. background: url(../../../static/images/mine/cy.png);
  1371. background-size: 100% 100%;
  1372. }
  1373. .picture8 {
  1374. background: url(../../../static/images/mine/cy.png);
  1375. background-size: 100% 100%;
  1376. }
  1377. .picture9 {
  1378. background: url(../../../static/images/mine/cy.png);
  1379. background-size: 100% 100%;
  1380. }
  1381. .xj-image {
  1382. width: 100rpx;
  1383. height: 100rpx;
  1384. }
  1385. .title {
  1386. color: #999999;
  1387. margin: 20rpx 0;
  1388. }
  1389. }
  1390. .input-ckg {
  1391. height: 86rpx;
  1392. margin-top: 0 !important;
  1393. padding-bottom: 0 !important;
  1394. .u-input {
  1395. height: 100%;
  1396. background: #F7F8FA;
  1397. padding-left: 10rpx !important;
  1398. padding-right: 85rpx !important;
  1399. }
  1400. .star {
  1401. display: flex;
  1402. align-items: center;
  1403. margin: 0 10rpx;
  1404. }
  1405. .input-positon {
  1406. position: relative;
  1407. }
  1408. .position-right {
  1409. position: absolute;
  1410. right: 20rpx;
  1411. top: 0;
  1412. width: 60rpx;
  1413. height: 50rpx;
  1414. bottom: 0;
  1415. margin: auto;
  1416. }
  1417. }
  1418. .picture {
  1419. margin-top: 20rpx;
  1420. background: #F5F6FA;
  1421. width: 212rpx;
  1422. height: 212rpx;
  1423. border-radius: 10rpx;
  1424. display: flex;
  1425. flex-direction: column;
  1426. justify-content: center;
  1427. align-items: center;
  1428. color: #6A7282;
  1429. }
  1430. .submit-btn-wrap{
  1431. position: fixed;
  1432. z-index:1000;
  1433. bottom:0;left:0;
  1434. width:100%;
  1435. padding:40rpx 0;
  1436. background:#fff;
  1437. }
  1438. .submit-btn {
  1439. bottom: 40rpx;
  1440. width: 90%;
  1441. background: #2772FB;
  1442. color: white;
  1443. text-align: center;
  1444. margin:0 auto;
  1445. padding: 30rpx 0;
  1446. border-radius: 50rpx;
  1447. }
  1448. .del-card {
  1449. position: absolute;
  1450. top: -10rpx;
  1451. right: -6rpx;
  1452. width: 80rpx;
  1453. height: 80rpx;
  1454. z-index: 9;
  1455. }
  1456. /deep/.uni-input-input:disabled{
  1457. background:transparent;
  1458. }
  1459. .phsy {
  1460. // font-size: 20px !important;
  1461. color: #999 !important
  1462. }
  1463. .car-uumber{
  1464. text-align:right;
  1465. }
  1466. </style>