underwriting1.vue 44 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433
  1. <template>
  2. <view :style="getHeight" style="background-color: #F5F5F5;">
  3. <!-- 公共组件-每个页面必须引入 -->
  4. <public-module></public-module>
  5. <!-- 头部 -->
  6. <view class="carInfo w-100 px-3 box-sizing">
  7. <view class="d-flex">
  8. <view class="icon iconfont icon-tree-round-car flex-shrink topLeft"></view>
  9. <view class="topRight d-flex flex-1 p-3 flex-column" style="color: #FFFFFF;">
  10. <view class="d-flex flex-1">
  11. <view class="font-lg d-flex a-center">{{this.licenseNo}}
  12. <view class="icon iconfont icon-bianji1 ml-2" @tap="toCarInfo"></view>
  13. </view>
  14. </view>
  15. <view class="brandName">{{carInfo.modelcname}}</view>
  16. </view>
  17. </view>
  18. <view class="other d-flex j-sb px-3">
  19. <view class="d-flex flex-1 a-center">
  20. <view class="privilege d-flex a-center j-center flex-shrink px-2">特权</view>
  21. <view class="content">每月自动查违章,无违章领奖励</view>
  22. </view>
  23. <view class="flex-shrink icon iconfont icon-youjiantou d-flex a-center font-sm"></view>
  24. </view>
  25. </view>
  26. <!-- 车主信息 -->
  27. <view>
  28. <view class="personInfo">
  29. <view class="title d-flex a-center j-center j-sb">
  30. <text style="font-weight: bold;">车主</text>
  31. <view class="showStatus" @tap="controlShow('showOwerInfo')">{{showOwerInfo?'收起':'展开'}}</view>
  32. </view>
  33. <view class="content" v-if="showOwerInfo">
  34. <view class="row d-flex a-center">
  35. <view class="left">姓名:</view>
  36. <view class="right d-flex flex-1">{{ownerInfo.name}}</view>
  37. </view>
  38. <view class="row d-flex a-center">
  39. <view class="left">证件类型:</view>
  40. <view class="right d-flex flex-1">{{ownerInfo.identifyType}}</view>
  41. </view>
  42. <view class="row d-flex a-center">
  43. <view class="left">手机号:</view>
  44. <view class="right d-flex flex-1">{{ownerInfo.mobile}}</view>
  45. </view>
  46. <view class="row d-flex a-center">
  47. <view class="left">证件号:</view>
  48. <view class="right d-flex flex-1">{{ownerInfo.identifyNumber}}</view>
  49. </view>
  50. <view class="row d-flex a-center"
  51. style="height:auto;min-height: 80upx;padding: 15upx 0;box-sizing: border-box; ">
  52. <view class="left">地址:</view>
  53. <view class="right d-flex flex-1">{{ownerInfo.addr}}</view>
  54. </view>
  55. </view>
  56. </view>
  57. <!-- 投保人信息 -->
  58. <view class="personInfo">
  59. <view class="title d-flex a-center j-sb">
  60. <text style="font-weight: bold;">投保人</text>
  61. <view class="showStatus" @tap="controlShow('showPolicyHolderInfo')">
  62. {{showPolicyHolderInfo?'收起':'展开'}}
  63. </view>
  64. </view>
  65. <view class="content" v-if="showPolicyHolderInfo">
  66. <view class="row d-flex a-center">
  67. <view class="left">姓名:</view>
  68. <view class="right d-flex flex-1">{{policyHolderInfo.name}}</view>
  69. </view>
  70. <view class="row d-flex a-center">
  71. <view class="left">证件类型:</view>
  72. <view class="right d-flex flex-1">{{policyHolderInfo.identifyType}}</view>
  73. </view>
  74. <view class="row d-flex a-center">
  75. <view class="left">手机号:</view>
  76. <view class="right d-flex flex-1">{{policyHolderInfo.mobile}}</view>
  77. </view>
  78. <view class="row d-flex a-center">
  79. <view class="left">证件号:</view>
  80. <view class="right d-flex flex-1">{{policyHolderInfo.identifyNumber}}</view>
  81. </view>
  82. <view class="row d-flex a-center"
  83. style="height:auto;min-height: 80upx;padding: 15upx 0;box-sizing: border-box; ">
  84. <view class="left">地址:</view>
  85. <view class="right d-flex flex-1">{{policyHolderInfo.addr}}</view>
  86. </view>
  87. </view>
  88. </view>
  89. <!-- 被保人信息 -->
  90. <view class="personInfo">
  91. <view class="title d-flex a-center j-sb">
  92. <text style="font-weight: bold;">被保人</text>
  93. <view class="showStatus" @tap="controlShow('showInsuredPersonInfo')">
  94. {{showInsuredPersonInfo?'收起':'展开'}}
  95. </view>
  96. </view>
  97. <view class="content" v-if="showInsuredPersonInfo">
  98. <view class="row d-flex a-center">
  99. <view class="left">姓名:</view>
  100. <view class="right d-flex flex-1">{{insuredPersonInfo.name}}</view>
  101. </view>
  102. <view class="row d-flex a-center">
  103. <view class="left">证件类型:</view>
  104. <view class="right d-flex flex-1">{{insuredPersonInfo.identifyType}}</view>
  105. </view>
  106. <view class="row d-flex a-center">
  107. <view class="left">手机号:</view>
  108. <view class="right d-flex flex-1">{{insuredPersonInfo.mobile}}</view>
  109. </view>
  110. <view class="row d-flex a-center">
  111. <view class="left">证件号:</view>
  112. <view class="right d-flex flex-1">{{insuredPersonInfo.identifyNumber}}</view>
  113. </view>
  114. <view class="row d-flex a-center"
  115. style="height:auto;min-height: 80upx;padding: 15upx 0;box-sizing: border-box; ">
  116. <view class="left">地址:</view>
  117. <view class="right d-flex flex-1">{{insuredPersonInfo.addr}}</view>
  118. </view>
  119. </view>
  120. </view>
  121. <!-- 车辆影像信息Start -->
  122. <view class="imageInfo">
  123. <view class="title d-flex a-center j-sb">
  124. <text style="font-weight: bold;">车辆影像信息</text>
  125. <view class="showStatus" @tap="controlShow('showCarImageInfo')">{{showCarImageInfo?'收起':'展开'}}
  126. </view>
  127. </view>
  128. <view class="uni-uploader" v-if="showCarImageInfo">
  129. <view class="uni-uploader-body dis ">
  130. <view class="uni-uploader__files f-c dis a-c">
  131. <text>行驶证主页</text>
  132. <block v-for="(image,index) in imgList1" :key="index">
  133. <view class="uni-uploader__file">
  134. <image class="uni-uploader__img" :src="image.url" :data-src="image.url"
  135. @tap="previewImage($event,'imgList1')"></image>
  136. <view class="delImgIcon iconfont icon-cuo d-flex a-center j-center"
  137. @tap="delCheckImage(image,'carImageListId','imgList1')"></view>
  138. </view>
  139. </block>
  140. <view v-if="imgList1.length==0" class="uni-uploader__input-box"
  141. style="box-sizing: border-box;">
  142. <view class="uni-uploader__input" @tap="chooseImage('C01','carImageListId','imgList1')">
  143. </view>
  144. </view>
  145. </view>
  146. <view class="uni-uploader__files f-c dis a-c">
  147. <text>行驶证副本</text>
  148. <block v-for="(image,index) in imgList2" :key="index">
  149. <view class="uni-uploader__file">
  150. <image class="uni-uploader__img" :src="image.url" :data-src="image.url"
  151. @tap="previewImage($event,'imgList2')"></image>
  152. <view class="delImgIcon iconfont icon-cuo d-flex a-center j-center"
  153. @tap="delCheckImage(image,'carImageListId','imgList2')"></view>
  154. </view>
  155. </block>
  156. <view v-if="imgList2.length==0" class="uni-uploader__input-box"
  157. style="box-sizing: border-box;">
  158. <view class="uni-uploader__input" @tap="chooseImage('D01','carImageListId','imgList2')">
  159. </view>
  160. </view>
  161. </view>
  162. </view>
  163. </view>
  164. </view>
  165. <!-- 车辆影像信息End -->
  166. <!-- 车主影像信息Start -->
  167. <view class="imageInfo">
  168. <view class="title d-flex a-center j-sb">
  169. <text style="font-weight: bold;">车主影像信息</text>
  170. <view class="showStatus" @tap="controlShow('showOwnerImageInfo')">{{showOwnerImageInfo?'收起':'展开'}}
  171. </view>
  172. </view>
  173. <view class="uni-uploader" v-if="showOwnerImageInfo">
  174. <view class="uni-uploader-body dis ">
  175. <view class="uni-uploader__files dis f-c a-c">
  176. <text>正面</text>
  177. <block v-for="(image,index) in imgList3" :key="index">
  178. <view class="uni-uploader__file">
  179. <image class="uni-uploader__img" :src="image.url" :data-src="image.url"
  180. @tap="previewImage($event,'imgList3')"></image>
  181. <view class="delImgIcon iconfont icon-cuo d-flex a-center j-center"
  182. @tap="delCheckImage(image,'ownerImageListId','imgList3')"></view>
  183. </view>
  184. </block>
  185. <view v-if="imgList3.length==0" class="uni-uploader__input-box"
  186. style="box-sizing: border-box;">
  187. <view class="uni-uploader__input"
  188. @tap="chooseImage('C02','ownerImageListId','imgList3')"></view>
  189. </view>
  190. </view>
  191. <view class="uni-uploader__files dis f-c a-c">
  192. <text>反面</text>
  193. <block v-for="(image,index) in imgList4" :key="index">
  194. <view class="uni-uploader__file">
  195. <image class="uni-uploader__img" :src="image.url" :data-src="image.url"
  196. @tap="previewImage($event,'imgList4')"></image>
  197. <view class="delImgIcon iconfont icon-cuo d-flex a-center j-center"
  198. @tap="delCheckImage(image,'ownerImageListId','imgList4')"></view>
  199. </view>
  200. </block>
  201. <view v-if="imgList4.length==0" class="uni-uploader__input-box"
  202. style="box-sizing: border-box;">
  203. <view class="uni-uploader__input"
  204. @tap="chooseImage('D02','ownerImageListId','imgList4')"></view>
  205. </view>
  206. </view>
  207. </view>
  208. </view>
  209. </view>
  210. <!-- 车主影像信息End -->
  211. <!-- 投保人影像信息Start -->
  212. <view class="imageInfo">
  213. <view class="title d-flex a-center j-sb">
  214. <text style="font-weight: bold;">投保人影像信息</text>
  215. <view class="showStatus" @tap="controlShow('showPolicyImageInfo')">
  216. {{showPolicyImageInfo?'收起':'展开'}}
  217. </view>
  218. </view>
  219. <view class="uni-uploader" v-if="showPolicyImageInfo">
  220. <view class="uni-uploader-body dis ">
  221. <view class="uni-uploader__files dis f-c a-c">
  222. <text>正面</text>
  223. <block v-for="(image,index) in imgList5" :key="index">
  224. <view class="uni-uploader__file">
  225. <image class="uni-uploader__img" :src="image.url" :data-src="image.url"
  226. @tap="previewImage($event,'imgList5')"></image>
  227. <view class="delImgIcon iconfont icon-cuo d-flex a-center j-center"
  228. @tap="delCheckImage(image,'policyImageListId','imgList5')"></view>
  229. </view>
  230. </block>
  231. <view v-if="imgList5.length==0" class="uni-uploader__input-box"
  232. style="box-sizing: border-box;">
  233. <view class="uni-uploader__input"
  234. @tap="chooseImage('C03','policyImageListId','imgList5')"></view>
  235. </view>
  236. </view>
  237. <view class="uni-uploader__files dis f-c a-c">
  238. <text>反面</text>
  239. <block v-for="(image,index) in imgList6" :key="index">
  240. <view class="uni-uploader__file">
  241. <image class="uni-uploader__img" :src="image.url" :data-src="image.url"
  242. @tap="previewImage($event,'imgList6')"></image>
  243. <view class="delImgIcon iconfont icon-cuo d-flex a-center j-center"
  244. @tap="delCheckImage(image,'policyImageListId','imgList6')"></view>
  245. </view>
  246. </block>
  247. <view v-if="imgList6.length==0" class="uni-uploader__input-box"
  248. style="box-sizing: border-box;">
  249. <view class="uni-uploader__input"
  250. @tap="chooseImage('D03','policyImageListId','imgList6')"></view>
  251. </view>
  252. </view>
  253. </view>
  254. </view>
  255. </view>
  256. <!-- 投保人影像信息End -->
  257. <!-- 被保人影像信息Start -->
  258. <view class="imageInfo">
  259. <view class="title d-flex a-center j-sb">
  260. <text style="font-weight: bold;">被保人影像信息</text>
  261. <view class="showStatus" @tap="controlShow('showInsuredImageInfo')">
  262. {{showInsuredImageInfo?'收起':'展开'}}
  263. </view>
  264. </view>
  265. <view class="uni-uploader" v-if="showInsuredImageInfo">
  266. <view class="uni-uploader-body dis ">
  267. <view class="uni-uploader__files dis f-c a-c">
  268. <text>正面</text>
  269. <block v-for="(image,index) in imgList7" :key="index">
  270. <view class="uni-uploader__file">
  271. <image class="uni-uploader__img" :src="image.url" :data-src="image.url"
  272. @tap="previewImage($event,'imgList7')"></image>
  273. <view class="delImgIcon iconfont icon-cuo d-flex a-center j-center"
  274. @tap="delCheckImage(image,'insuredImageListId','imgList7')"></view>
  275. </view>
  276. </block>
  277. <view v-if="imgList7.length==0" class="uni-uploader__input-box"
  278. style="box-sizing: border-box;">
  279. <view class="uni-uploader__input"
  280. @tap="chooseImage('C04','insuredImageListId','imgList7')"></view>
  281. </view>
  282. </view>
  283. <view class="uni-uploader__files dis f-c a-c">
  284. <text>反面</text>
  285. <block v-for="(image,index) in imgList8" :key="index">
  286. <view class="uni-uploader__file">
  287. <image class="uni-uploader__img" :src="image.url" :data-src="image.url"
  288. @tap="previewImage($event,'imgList8')"></image>
  289. <view class="delImgIcon iconfont icon-cuo d-flex a-center j-center"
  290. @tap="delCheckImage(image,'insuredImageListId','imgList8')"></view>
  291. </view>
  292. </block>
  293. <view v-if="imgList8.length==0" class="uni-uploader__input-box"
  294. style="box-sizing: border-box;">
  295. <view class="uni-uploader__input"
  296. @tap="chooseImage('D04','insuredImageListId','imgList8')"></view>
  297. </view>
  298. </view>
  299. </view>
  300. </view>
  301. </view>
  302. <!-- 被保人影像信息End -->
  303. <!-- 新车影像信息Start -->
  304. <view class="imageInfo">
  305. <view class="title d-flex a-center j-sb">
  306. <text style="font-weight: bold;">新车照片</text>
  307. <view class="showStatus" @tap="controlShow('showNewCarImageInfo')">
  308. {{showNewCarImageInfo?'收起':'展开'}}
  309. </view>
  310. </view>
  311. <view class="uni-uploader" v-if="showNewCarImageInfo">
  312. <view class="uni-uploader-body dis ">
  313. <view class="uni-uploader__files dis f-c a-c">
  314. <text>新车合格证</text>
  315. <block v-for="(image,index) in imgNewCarQualified" :key="index">
  316. <view class="uni-uploader__file">
  317. <image class="uni-uploader__img" :src="image.url" :data-src="image.url"
  318. @tap="previewImage($event,'imgNewCarQualified')"></image>
  319. <view class="delImgIcon iconfont icon-cuo d-flex a-center j-center"
  320. @tap="delCheckImage(image,'imgNewCarinvoiceId','imgNewCarQualified')"></view>
  321. </view>
  322. </block>
  323. <view v-if="imgNewCarQualified.length==0" class="uni-uploader__input-box"
  324. style="box-sizing: border-box;">
  325. <view class="uni-uploader__input"
  326. @tap="chooseImage('XC00','imgNewCarinvoiceId','imgNewCarQualified')"></view>
  327. </view>
  328. </view>
  329. <view class="uni-uploader__files dis f-c a-c">
  330. <text>购车发票</text>
  331. <block v-for="(image,index) in imgNewCarInvoice" :key="index">
  332. <view class="uni-uploader__file">
  333. <image class="uni-uploader__img" :src="image.url" :data-src="image.url"
  334. @tap="previewImage($event,'imgNewCarInvoice')"></image>
  335. <view class="delImgIcon iconfont icon-cuo d-flex a-center j-center"
  336. @tap="delCheckImage(image,'imgNewCarinvoiceId','imgNewCarInvoice')"></view>
  337. </view>
  338. </block>
  339. <view v-if="imgNewCarInvoice.length==0" class="uni-uploader__input-box"
  340. style="box-sizing: border-box;">
  341. <view class="uni-uploader__input"
  342. @tap="chooseImage('GC00','imgNewCarinvoiceId','imgNewCarInvoice')"></view>
  343. </view>
  344. </view>
  345. </view>
  346. </view>
  347. </view>
  348. <!-- 新车影像信息End -->
  349. <!-- 验车照Start -->
  350. <view class="imageInfo">
  351. <view class="title d-flex a-center j-sb">
  352. <text style="font-weight: bold;">其他关系证明</text>
  353. <view class="showStatus" @tap="controlShow('showCarCheckImageInfo')">
  354. {{showCarCheckImageInfo?'收起':'展开'}}
  355. </view>
  356. </view>
  357. <view class="uni-uploader" v-if="showCarCheckImageInfo">
  358. <view class="uni-uploader-body">
  359. <view class="uni-uploader__files">
  360. <block v-for="(image,index) in imgRelationship" :key="index">
  361. <view class="uni-uploader__file">
  362. <image class="uni-uploader__img" :src="image.url" :data-src="image.url"
  363. @tap="previewImage($event,'imgRelationship')"></image>
  364. <view class="delImgIcon iconfont icon-cuo d-flex a-center j-center "
  365. @tap="delCheckImage('imgRelationship',index)"></view>
  366. </view>
  367. </block>
  368. <view class="uni-uploader__input-box" style="box-sizing: border-box;">
  369. <view class="uni-uploader__input"
  370. @tap="chooseImage('GX00','imgRelationshipid','imgRelationship')"></view>
  371. </view>
  372. </view>
  373. </view>
  374. </view>
  375. </view>
  376. <!-- 验车照End -->
  377. <!-- 特约 -->
  378. <block v-if="zijinengageListData.length>0">
  379. <template>
  380. <view class="appoint">
  381. <view class="title d-flex a-center j-sb">
  382. <text style="font-weight: bold;">特约</text>
  383. <view class="showStatus" @tap="controlShow('showAppoint')">{{showAppoint?'收起':'展开'}}</view>
  384. </view>
  385. <view class="content dis f-c j-c a-end" v-if="showAppoint">
  386. <u-button type="warning" size="mini" style="width: 80px;margin-top: 5px;"
  387. @click="show=true">特约选择</u-button>
  388. <view class="contributing dis f-c" v-for="(item,index) in zijinengageList">
  389. <text>{{item.clauseName}}</text>
  390. <u-input v-if="item.modifyFlag==1" :border="true" v-model="item.clauses" size="mini"
  391. type="textarea" :custom-style="{fontSize:'14px'}" />
  392. <text v-else>{{item.clauses}}</text>
  393. </view>
  394. </view>
  395. </view>
  396. </template>
  397. </block>
  398. <view class="advancePayment">
  399. <view class="title d-flex a-center j-sb">
  400. <text style="font-weight: bold;">保费</text>
  401. <view class="showStatus" @tap="controlShow('showAdvancePayment')">{{showAdvancePayment?'收起':'展开'}}
  402. </view>
  403. </view>
  404. <view class="content" v-if="showAdvancePayment">
  405. <block v-for="(item,index) in riskList" :key="index">
  406. <template v-if="item.riskCode == '0507'">
  407. <view class="row d-flex a-center j-sb">
  408. <view class="d-flex a-center">交强险</view>
  409. <view>¥{{jqpremium}}</view>
  410. </view>
  411. </template>
  412. </block>
  413. <view class="row d-flex a-center j-sb">
  414. <view>车船税</view>
  415. <view>¥{{taxAmount}}</view>
  416. </view>
  417. <block>
  418. <view class="row d-flex a-center j-sb">
  419. <view class="d-flex a-center">驾意险</view>
  420. <view>¥{{jypremium}}</view>
  421. </view>
  422. </block>
  423. <block v-for="(item,index) in riskList" :key="index">
  424. <template v-if="item.riskCode == '0510'">
  425. <view class="row d-flex a-center j-sb">
  426. <view class="d-flex a-center">商业险</view>
  427. <view>¥{{sypremium}}</view>
  428. </view>
  429. </template>
  430. </block>
  431. </view>
  432. </view>
  433. </view>
  434. <view style="height: 160upx;"></view>
  435. <view class="bottomBtn">
  436. <view class="agree d-flex a-center">
  437. <checkbox @tap="agreed" :checked="agree" style="transform:scale(0.6)"></checkbox> 我已确认并同意 <text
  438. class="tip">保险条款</text> | <text class="tip">投保须知</text> | <text class="tip">隐私条款</text>
  439. </view>
  440. <view class="btnView d-flex">
  441. <view class="d-flex flex-1 a-center">
  442. <view class="d-flex flex-column a-center listener">
  443. <view class="icon iconfont icon-xiaomishu"></view> 客服
  444. </view>
  445. <view style="font-weight: bold;font-size: 34upx;color: #333; ">¥{{sumPermium}}</view>
  446. </view>
  447. <view class="btn d-flex a-center j-center" @tap="submitAudit">申请核保</view>
  448. </view>
  449. </view>
  450. <u-modal v-model="show" title="特约选择" :scroll-height="{height: '300px'}">
  451. <view class="slot-content">
  452. <u-checkbox-group @change="tycheckboxGroupChange">
  453. <u-checkbox v-model="item.checked" active-color="rgb(255, 153, 0)"
  454. v-for="(item, index) in zijinengageListData" :key="index"
  455. :name="item.clauseCode">{{item.clauseName}}</u-checkbox>
  456. </u-checkbox-group>
  457. </view>
  458. </u-modal>
  459. <previewImage ref="previewImage" :opacity="0.8" :circular="true" :imgs="previewImgs"></previewImage>
  460. </view>
  461. </template>
  462. <script>
  463. import store from '@/store';
  464. import previewImage from '@/components/common/previewImage/previewImage.vue'; //引用插件
  465. // import wPicker from "@/components/w-picker/w-picker.vue";
  466. import {
  467. pathToBase64,
  468. base64ToPath
  469. } from '@/common/image-tools-base64.js';
  470. import * as imageConversion from 'image-conversion'
  471. export default {
  472. components: {
  473. // wPicker,
  474. previewImage
  475. },
  476. computed: {
  477. getHeight() {
  478. let height = uni.getSystemInfoSync().windowHeight;
  479. return `minHeight: ${height}px;`;
  480. }
  481. },
  482. data() {
  483. return {
  484. show: false,
  485. quoteno: "", //报价号
  486. previewImgs: [],
  487. sumPermium: "",
  488. carInfo: {},
  489. vehicleModel: {},
  490. companyId: "",
  491. licenseNo: "",
  492. riskList: [],
  493. kindList: [],
  494. name: "",
  495. icon: "",
  496. taxAmount: "",
  497. jqpremium: "",
  498. sypremium: "",
  499. jypremium: "",
  500. ownerInfo: {},
  501. policyHolderInfo: {},
  502. insuredPersonInfo: {},
  503. agree: false,
  504. jqappoint: "", //交强险特别约定
  505. syappoint: "", //商业特别约定
  506. identifyList: [{
  507. label: '身份证',
  508. id: "01"
  509. },
  510. {
  511. label: '护照',
  512. id: "02"
  513. },
  514. {
  515. label: '港澳台居民居住证',
  516. id: "03"
  517. },
  518. {
  519. label: '组织机构代码证',
  520. id: "04"
  521. },
  522. {
  523. label: '统一社会信用代码证',
  524. id: "05"
  525. },
  526. {
  527. label: '营业执照',
  528. id: "06"
  529. }
  530. ],
  531. showOwerInfo: false, //展示车主信息
  532. showPolicyHolderInfo: false, //展示投保人信息
  533. showInsuredPersonInfo: false, //展示被保人信息
  534. showProposalWay: false, //获取保单方式
  535. showAdvancePayment: false, //展示保费
  536. showAppoint: false, //展示特约
  537. showCarImageInfo: false, //显示车辆影像
  538. carImageListId: [],
  539. showOwnerImageInfo: false, //显示车主影像
  540. ownerImageListId: [],
  541. showPolicyImageInfo: false, //显示投保人影像
  542. policyImageListId: [],
  543. showInsuredImageInfo: false, //显示被保人影像
  544. insuredImageListId: [],
  545. showCarCheckImageInfo: false, //显示验车照影像
  546. imgRelationshipid: [],
  547. showNewCarImageInfo: false, //显示新车影像
  548. imgNewCarinvoiceId: [],
  549. existenceimg: 0,
  550. token: "",
  551. imgList1: [],
  552. imgList2: [],
  553. imgList3: [],
  554. imgList4: [],
  555. imgList5: [],
  556. imgList6: [],
  557. imgList7: [],
  558. imgList8: [],
  559. imgRelationship: [], //其他证明
  560. imgNewCarQualified: [], //合格证
  561. imgNewCarInvoice: [], //发票
  562. zijinengageListData: [],
  563. zijinengageList: [],
  564. }
  565. },
  566. async onLoad(params) {
  567. this.token = store.state.token
  568. if (!!params.companyId) {
  569. this.companyId = params.companyId;
  570. let param = {
  571. companyId: params.companyId
  572. };
  573. let res = await this.$http.post('/insurance/order/getByCompanyId', param);
  574. //获取前一个页面传过来的信息(车辆信息,人员信息,险种信息)
  575. this.icon = "";
  576. this.name = res.data.inscompany;
  577. this.quoteno = res.data.quoteno;
  578. this.carInfo = res.data.carinfo;
  579. this.ownerInfo = res.data.ownerinfo;
  580. this.policyHolderInfo = res.data.applyinfo;
  581. this.insuredPersonInfo = res.data.insureinfo;
  582. this.riskList = res.data.riskinfo;
  583. this.kindList = res.data.kindinfo;
  584. this.licenseNo = res.data.licenseno;
  585. this.sumPermium = res.data.sumpremium;
  586. this.taxAmount = res.data.taxamount;
  587. this.jqpremium = res.data.jqpremium;
  588. this.sypremium = res.data.sypremium;
  589. this.jypremium = res.data.jypremium;
  590. // 图片类型(C01车辆影像,C02车主身份证,C03投保人身份证,C04被保人身份证,C05验车照)
  591. this.imageEcho(this.quoteno)
  592. if (this.name == '紫金财险') {
  593. let Zijinres = await this.$http.post('/order/zijin/queryClauseData', param);
  594. this.zijinengageListData = Zijinres.data;
  595. let data = this.zijinengageListData.find(val => val.optType == 3)
  596. if (data) {
  597. this.zijinengageList.push({
  598. clauseCode: data.clauseCode,
  599. clauseName: data.clauseName,
  600. clauses: data.clauseContent,
  601. riskCode: data.riskCode,
  602. modifyFlag: data.modifyFlag,
  603. optType: data.optType,
  604. })
  605. }
  606. }
  607. // 影像获取完毕
  608. } else {
  609. uni.showModal({
  610. showCancel: false,
  611. title: "未查询到该订单"
  612. })
  613. }
  614. },
  615. methods: {
  616. tycheckboxGroupChange(detail) {
  617. this.zijinengageList = [];
  618. detail.map(val => {
  619. let list = this.zijinengageListData.find(item => item.clauseCode == val)
  620. this.zijinengageList.push({
  621. clauseCode: list.clauseCode,
  622. clauseName: list.clauseName,
  623. clauses: list.clauseContent,
  624. riskCode: list.riskCode,
  625. modifyFlag: list.modifyFlag,
  626. optType: list.optType,
  627. })
  628. })
  629. },
  630. //影像查询
  631. async imageEcho(quotenos) {
  632. let imgres = await this.$http.get('/ins/taskImage/findByQuoteNo?quoteNo=' + quotenos);
  633. if (imgres.code == "200") {
  634. Object.keys(imgres.data).forEach((keys) => {
  635. if (imgres.data[keys].url) {
  636. imgres.data[keys].url = this.$base.baseUrl + imgres.data[keys].url;
  637. switch (keys) {
  638. case 'C01':
  639. this.carImageListId.push({
  640. imageId: imgres.data[keys].imageId,
  641. imageType: imgres.data[keys].imageType,
  642. })
  643. this.imgList1.push(imgres.data[keys]);
  644. break;
  645. case 'D01':
  646. this.carImageListId.push({
  647. imageId: imgres.data[keys].imageId,
  648. imageType: imgres.data[keys].imageType,
  649. })
  650. this.imgList2.push(imgres.data[keys]);
  651. break;
  652. case 'C02':
  653. this.ownerImageListId.push({
  654. imageId: imgres.data[keys].imageId,
  655. imageType: imgres.data[keys].imageType,
  656. })
  657. this.imgList3.push(imgres.data[keys]);
  658. break;
  659. case 'D02':
  660. this.ownerImageListId.push({
  661. imageId: imgres.data[keys].imageId,
  662. imageType: imgres.data[keys].imageType,
  663. })
  664. this.imgList4.push(imgres.data[keys]);
  665. break;
  666. case 'C03':
  667. this.policyImageListId.push({
  668. imageId: imgres.data[keys].imageId,
  669. imageType: imgres.data[keys].imageType,
  670. })
  671. this.imgList5.push(imgres.data[keys]);
  672. break;
  673. case 'D03':
  674. this.policyImageListId.push({
  675. imageId: imgres.data[keys].imageId,
  676. imageType: imgres.data[keys].imageType,
  677. })
  678. this.imgList6.push(imgres.data[keys]);
  679. break;
  680. case 'C04':
  681. this.insuredImageListId.push({
  682. imageId: imgres.data[keys].imageId,
  683. imageType: imgres.data[keys].imageType,
  684. })
  685. this.imgList7.push(imgres.data[keys]);
  686. break;
  687. case 'D04':
  688. this.insuredImageListId.push({
  689. imageId: imgres.data[keys].imageId,
  690. imageType: imgres.data[keys].imageType,
  691. })
  692. this.imgList8.push(imgres.data[keys]);
  693. break;
  694. default:
  695. break;
  696. }
  697. }
  698. });
  699. }
  700. },
  701. // 重新选择车型
  702. toCarInfo() {
  703. this.navigate({
  704. url: '/pages/carInsure1/carInfo1',
  705. success: (res) => {
  706. res.eventChannel.emit("acceptData", {
  707. carInfo: this.carInfo,
  708. ownerInfo: this.ownerInfo,
  709. policyHolderInfo: this.policyHolderInfo,
  710. insuredPersonInfo: this.insuredPersonInfo,
  711. riskList: this.riskList,
  712. kindList: this.kindList
  713. })
  714. }
  715. }, "navigateTo", true);
  716. },
  717. //控制详情的展开和收起
  718. controlShow(type) {
  719. this[type] = !this[type];
  720. },
  721. //阅读并同意协议
  722. agreed() {
  723. if (this.agree == false) {
  724. this.agree = true;
  725. } else {
  726. this.agree = false;
  727. }
  728. },
  729. async chooseImage(type, imageIdList, imgurl) {
  730. let [chooseImageErr, chooseImageRes] = await uni.chooseImage({
  731. count: 1,
  732. sizeType: ['compressed']
  733. });
  734. chooseImageRes.tempFilePaths.map((ele, index) => {
  735. uni.uploadFile({
  736. url: this.$base.baseUrl + '/ins/taskImage/uploadFile',
  737. filePath: ele,
  738. name: "multipartFile",
  739. formData: {
  740. 'type': 'image',
  741. },
  742. header: {
  743. Authorization: this.token,
  744. },
  745. success: async (imgRes) => {
  746. let data = JSON.parse(imgRes.data);
  747. data.data.url = this.$base.baseUrl + data.data.url;
  748. if (data.code == "200") {
  749. console.log()
  750. if (this[imageIdList].some(v => v.imageType == type)) {
  751. this[imageIdList].map(val => {
  752. if (val.imageType == type) {
  753. val.imageId = data.data.id;
  754. }
  755. })
  756. } else {
  757. this[imageIdList].push({
  758. imageId: data.data.id,
  759. imageType: type,
  760. })
  761. }
  762. this[imgurl].push(data.data)
  763. }
  764. }
  765. });
  766. })
  767. },
  768. previewImage(e, type) {
  769. this.previewImgs = this[type];
  770. var current = e.currentTarget.dataset.src;
  771. this.$refs.previewImage.open(current); // 传入当前选中的图片地址或序号
  772. },
  773. //删除图片
  774. delCheckImage(param, IdList, srcList) {
  775. this[IdList].map((ele, index) => {
  776. if (param.imageId === ele.imageId) {
  777. this[IdList].splice(index, 1);
  778. }
  779. return ele;
  780. });
  781. this[srcList].map((ele, index) => {
  782. if (param.imageId === ele.imageId) {
  783. this[srcList].splice(index, 1);
  784. }
  785. return ele;
  786. });
  787. },
  788. // 上传影像并提交核保
  789. async submitAudit() {
  790. if (!this.agree) {
  791. return uni.showToast({
  792. title: '请阅读并同意协议',
  793. icon: "none",
  794. duration: 2000
  795. });
  796. }
  797. const mergedArray = [...this.carImageListId, ...this.ownerImageListId, ...this
  798. .policyImageListId, ...this.insuredImageListId, ...this.imgRelationshipid
  799. ];
  800. if (mergedArray.length > 0) {
  801. await this.$http.post('/ins/taskImage/uploadImages', {
  802. imageList: mergedArray,
  803. quoteNo: this.quoteno,
  804. })
  805. }
  806. uni.showModal({
  807. content: '是否确认提交核保?',
  808. success: async (res) => {
  809. if (res.confirm) {
  810. switch (this.name) {
  811. case "永安财险":
  812. let yaimage = await this.$http.post(
  813. '/order/yongAn/submitImage', {
  814. companyId: this.companyId
  815. });
  816. if (yaimage.code == '200') {
  817. let yaaudit = await this.$http.post(
  818. '/order/yongAn/audit', {
  819. companyId: this.companyId,
  820. jqappoint: "",
  821. syappoint: ""
  822. });
  823. if (yaaudit.code == '200') {
  824. uni.showModal({
  825. content: '订单自核成功',
  826. cancelText: '暂不缴费',
  827. confirmText: '立即缴费',
  828. success: (res1) => {
  829. if (res1.confirm) {
  830. uni.navigateTo({
  831. url: "/pages/carInsure1/payCode1?companyId=" +
  832. this
  833. .companyId
  834. })
  835. } else {
  836. this.navigate({
  837. url: "/pages/orders/orders"
  838. }, "switchTab",
  839. true);
  840. }
  841. }
  842. });
  843. } else {
  844. uni.showModal({
  845. content: '核保失败(' + yaaudit.msg + ')',
  846. cancelText: '返回订单',
  847. confirmText: '继续核保',
  848. success: async (res2) => {
  849. if (res2.confirm) {
  850. } else {
  851. this.navigate({
  852. url: "/pages/orders/orders"
  853. }, "switchTab",
  854. true);
  855. }
  856. }
  857. });
  858. }
  859. } else {
  860. uni.showModal({
  861. content: '影像上传失败(' + yaimage.msg + ')',
  862. cancelText: '返回订单',
  863. confirmText: '修改',
  864. success: async (res3) => {
  865. if (res3.confirm) {
  866. } else {
  867. this.navigate({
  868. url: "/pages/orders/orders"
  869. }, "switchTab",
  870. true);
  871. }
  872. }
  873. });
  874. }
  875. break;
  876. case "中煤财险":
  877. let zmimage = await this.$http.post(
  878. '/order/zhongMeiApi/submitImage', {
  879. companyId: this.companyId
  880. });
  881. if (zmimage.code == '200') {
  882. let zmaudit = await this.$http.post(
  883. '/order/zhongMeiApi/audit', {
  884. companyId: this.companyId,
  885. jqappoint: "",
  886. syappoint: ""
  887. });
  888. if (zmaudit.code == '200') {
  889. uni.showModal({
  890. content: '订单自核成功',
  891. cancelText: '暂不缴费',
  892. confirmText: '立即缴费',
  893. success: (res1) => {
  894. if (res1.confirm) {
  895. uni.navigateTo({
  896. url: "/pages/carInsure1/payCode1?companyId=" +
  897. this
  898. .companyId
  899. })
  900. } else {
  901. this.navigate({
  902. url: "/pages/orders/orders"
  903. }, "switchTab",
  904. true);
  905. }
  906. }
  907. });
  908. } else {
  909. uni.showModal({
  910. content: '核保失败(' + zmaudit.msg + ')',
  911. cancelText: '返回订单',
  912. confirmText: '修改',
  913. success: async (res2) => {
  914. if (res2.confirm) {
  915. } else {
  916. this.navigate({
  917. url: "/pages/orders/orders"
  918. }, "switchTab",
  919. true);
  920. }
  921. }
  922. });
  923. }
  924. } else {
  925. uni.showModal({
  926. content: '影像上传失败(' + zmimage.msg + ')',
  927. cancelText: '返回订单',
  928. confirmText: '修改',
  929. success: async (res3) => {
  930. if (res3.confirm) {
  931. } else {
  932. this.navigate({
  933. url: "/pages/orders/orders"
  934. }, "switchTab",
  935. true);
  936. }
  937. }
  938. });
  939. }
  940. break;
  941. case "永诚财险":
  942. let ycimage = await this.$http.post(
  943. '/api/yongCheng/uploadImage', {
  944. companyId: this.companyId
  945. });
  946. if (ycimage.code == '200') {
  947. let ycaudit = await this.$http.post(
  948. '/api/yongCheng/audit', {
  949. companyId: this.companyId,
  950. });
  951. if (ycaudit.code == '200') {
  952. uni.showModal({
  953. content: '订单自核成功',
  954. cancelText: '暂不缴费',
  955. confirmText: '立即缴费',
  956. success: (res1) => {
  957. if (res1.confirm) {
  958. uni.navigateTo({
  959. url: "/pages/carInsure1/payCode1?companyId=" +
  960. this
  961. .companyId
  962. })
  963. } else {
  964. this.navigate({
  965. url: "/pages/orders/orders"
  966. }, "switchTab",
  967. true);
  968. }
  969. }
  970. });
  971. } else {
  972. uni.showModal({
  973. content: '核保失败(' + ycaudit.msg + ')',
  974. cancelText: '返回订单',
  975. confirmText: '修改',
  976. success: async (res2) => {
  977. if (res2.confirm) {
  978. } else {
  979. this.navigate({
  980. url: "/pages/orders/orders"
  981. }, "switchTab",
  982. true);
  983. }
  984. }
  985. });
  986. }
  987. } else {
  988. uni.showModal({
  989. content: '影像上传失败(' + ycimage.msg + ')',
  990. cancelText: '返回订单',
  991. confirmText: '修改',
  992. success: async (res3) => {
  993. if (res3.confirm) {
  994. } else {
  995. this.navigate({
  996. url: "/pages/orders/orders"
  997. }, "switchTab",
  998. true);
  999. }
  1000. }
  1001. });
  1002. }
  1003. break;
  1004. case "国任财险":
  1005. let grimage = await this.$http.post(
  1006. '/api/guoRen/uploadImage', {
  1007. companyId: this.companyId
  1008. });
  1009. if (grimage.code == '200') {
  1010. let graudit = await this.$http.post(
  1011. '/api/guoRen/audit', {
  1012. companyId: this.companyId,
  1013. });
  1014. if (graudit.code == '200') {
  1015. uni.showModal({
  1016. content: '订单自核成功',
  1017. cancelText: '暂不缴费',
  1018. confirmText: '立即缴费',
  1019. success: (res1) => {
  1020. if (res1.confirm) {
  1021. uni.navigateTo({
  1022. url: "/pages/carInsure1/payCode1?companyId=" +
  1023. this
  1024. .companyId
  1025. })
  1026. } else {
  1027. this.navigate({
  1028. url: "/pages/orders/orders"
  1029. }, "switchTab",
  1030. true);
  1031. }
  1032. }
  1033. });
  1034. } else {
  1035. uni.showModal({
  1036. content: '核保失败(' + graudit.msg + ')',
  1037. cancelText: '返回订单',
  1038. confirmText: '修改',
  1039. success: async (res2) => {
  1040. if (res2.confirm) {
  1041. } else {
  1042. this.navigate({
  1043. url: "/pages/orders/orders"
  1044. }, "switchTab",
  1045. true);
  1046. }
  1047. }
  1048. });
  1049. }
  1050. } else {
  1051. uni.showModal({
  1052. content: '影像上传失败(' + grimage.msg + ')',
  1053. cancelText: '返回订单',
  1054. confirmText: '修改',
  1055. success: async (res3) => {
  1056. if (res3.confirm) {
  1057. } else {
  1058. this.navigate({
  1059. url: "/pages/orders/orders"
  1060. }, "switchTab",
  1061. true);
  1062. }
  1063. }
  1064. });
  1065. }
  1066. break;
  1067. case "紫金财险":
  1068. let zjimage = await this.$http.post(
  1069. '/order/zijin/submitImage', {
  1070. companyId: this.companyId
  1071. });
  1072. if (zjimage.code == '200') {
  1073. let zjaudit = await this.$http.post(
  1074. '/order/zijin/audit', {
  1075. companyId: this.companyId,
  1076. engageList: this.zijinengageList,
  1077. });
  1078. if (zjaudit.code == '200') {
  1079. uni.showModal({
  1080. content: '订单自核成功',
  1081. cancelText: '暂不缴费',
  1082. confirmText: '立即缴费',
  1083. success: (res1) => {
  1084. if (res1.confirm) {
  1085. uni.navigateTo({
  1086. url: "/pages/carInsure1/payCode1?companyId=" +
  1087. this
  1088. .companyId
  1089. })
  1090. } else {
  1091. this.navigate({
  1092. url: "/pages/orders/orders"
  1093. }, "switchTab",
  1094. true);
  1095. }
  1096. }
  1097. });
  1098. } else {
  1099. uni.showModal({
  1100. content: '核保失败(' + zjaudit.msg + ')',
  1101. cancelText: '返回订单',
  1102. confirmText: '修改',
  1103. success: async (res2) => {
  1104. if (res2.confirm) {
  1105. } else {
  1106. this.navigate({
  1107. url: "/pages/orders/orders"
  1108. }, "switchTab",
  1109. true);
  1110. }
  1111. }
  1112. });
  1113. }
  1114. } else {
  1115. uni.showModal({
  1116. content: '影像上传失败(' + zjimage.msg + ')',
  1117. cancelText: '返回订单',
  1118. confirmText: '修改',
  1119. success: async (res3) => {
  1120. if (res3.confirm) {
  1121. } else {
  1122. this.navigate({
  1123. url: "/pages/orders/orders"
  1124. }, "switchTab",
  1125. true);
  1126. }
  1127. }
  1128. });
  1129. }
  1130. break;
  1131. case "恒邦财险":
  1132. case "安盛天平":
  1133. case "众安财险":
  1134. case "中国人寿":
  1135. let pythonimage = await this.$http.post(
  1136. '/insurance/crawler/submitImage', {
  1137. subOrderNo: this.companyId
  1138. });
  1139. if (pythonimage.code == '200') {
  1140. let pythonaudit = await this.$http.post(
  1141. '/insurance/crawler/audit', {
  1142. subOrderNo: this.companyId,
  1143. });
  1144. if (pythonaudit.code == '200') {
  1145. uni.showModal({
  1146. content: '订单自核成功',
  1147. cancelText: '暂不缴费',
  1148. confirmText: '立即缴费',
  1149. success: (res1) => {
  1150. if (res1.confirm) {
  1151. uni.navigateTo({
  1152. url: "/pages/carInsure1/payCode1?companyId=" +
  1153. this
  1154. .companyId
  1155. })
  1156. } else {
  1157. this.navigate({
  1158. url: "/pages/orders/orders"
  1159. }, "switchTab",
  1160. true);
  1161. }
  1162. }
  1163. });
  1164. } else {
  1165. uni.showModal({
  1166. content: '核保失败(' + pythonaudit.msg + ')',
  1167. cancelText: '返回订单',
  1168. confirmText: '修改',
  1169. success: async (res2) => {
  1170. if (res2.confirm) {
  1171. } else {
  1172. this.navigate({
  1173. url: "/pages/orders/orders"
  1174. }, "switchTab",
  1175. true);
  1176. }
  1177. }
  1178. });
  1179. }
  1180. } else {
  1181. uni.showModal({
  1182. content: '影像上传失败(' + pythonimage.msg + ')',
  1183. cancelText: '返回订单',
  1184. confirmText: '修改',
  1185. success: async (res3) => {
  1186. if (res3.confirm) {
  1187. } else {
  1188. this.navigate({
  1189. url: "/pages/orders/orders"
  1190. }, "switchTab",
  1191. true);
  1192. }
  1193. }
  1194. });
  1195. }
  1196. break;
  1197. }
  1198. } else if (res.cancel) {}
  1199. }
  1200. });
  1201. }
  1202. }
  1203. }
  1204. </script>
  1205. <style lang="scss" scoped>
  1206. @import '@/style/mixin.scss';
  1207. /* 头部车辆信息和特权Start */
  1208. .carInfo {
  1209. height: 290upx;
  1210. background: -webkit-linear-gradient(0deg, rgba($themeColor, 0.6), rgba($themeColor, 0.8));
  1211. background-size: 100% 100%;
  1212. }
  1213. .carInfo .topLeft {
  1214. width: 120upx;
  1215. font-size: 90upx;
  1216. color: #FFFFFF;
  1217. }
  1218. .carInfo .topRight .brandName {
  1219. width: 400upx;
  1220. overflow: hidden;
  1221. text-overflow: ellipsis;
  1222. white-space: nowrap;
  1223. }
  1224. .carInfo .other {
  1225. background-color: #FFFFFF;
  1226. height: 80upx;
  1227. border-radius: 15upx;
  1228. box-sizing: border-box;
  1229. }
  1230. .carInfo .other .privilege {
  1231. background-color: rgba($themeColor, 0.6);
  1232. font-size: 24upx;
  1233. color: #FFFFFF;
  1234. font-weight: bold;
  1235. width: 60upx;
  1236. }
  1237. .carInfo .other .content {
  1238. width: 460upx;
  1239. margin-left: 15upx;
  1240. overflow: hidden;
  1241. text-overflow: ellipsis;
  1242. white-space: nowrap;
  1243. }
  1244. .carInfo .other .icon {
  1245. width: 30upx;
  1246. }
  1247. /* 头部车辆信息和特权End */
  1248. /* 人员信息Start */
  1249. .personInfo,
  1250. .advancePayment,
  1251. .imageInfo,
  1252. .appoint {
  1253. margin-bottom: 20upx;
  1254. background: #FFFFFF;
  1255. padding: 0upx 30upx;
  1256. }
  1257. .personInfo .title,
  1258. .advancePayment .title,
  1259. .imageInfo .title,
  1260. .appoint .title {
  1261. height: 80upx;
  1262. font-size: 32upx;
  1263. box-shadow: inset 0 -3upx 0px #fafafa;
  1264. }
  1265. .showStatus {
  1266. font-size: 26upx;
  1267. color: $themeColor;
  1268. }
  1269. .personInfo .content .row,
  1270. .advancePayment .content .row {
  1271. height: 80upx;
  1272. border-bottom: 1px solid #F9F9F9;
  1273. }
  1274. .personInfo .content .row .left,
  1275. .advancePayment .content .row .left {
  1276. width: 170upx;
  1277. flex-shrink: 0;
  1278. font-size: 28upx;
  1279. }
  1280. .appoint .content .row {
  1281. height: auto;
  1282. margin-top: 10upx;
  1283. }
  1284. .appoint .content .row>view {
  1285. width: 240upx;
  1286. flex-shrink: 1;
  1287. font-size: 28upx;
  1288. }
  1289. .appoint .content .row>textarea {
  1290. padding: 15upx;
  1291. box-sizing: border-box;
  1292. font-size: 26upx;
  1293. min-height: 160upx;
  1294. height: 100upx;
  1295. border: 1px solid #fafafa;
  1296. }
  1297. .personInfo .content .row .right,
  1298. .advancePayment .content .row .right,
  1299. .appoint .content .row .right {
  1300. font-size: 28upx;
  1301. }
  1302. /* 人员信息End */
  1303. .uni-uploader__file {
  1304. position: relative;
  1305. }
  1306. .delImgIcon {
  1307. width: 40upx;
  1308. height: 40upx;
  1309. background-color: #999;
  1310. position: absolute;
  1311. right: 0upx;
  1312. top: 0upx;
  1313. color: #FFFFFF;
  1314. }
  1315. /* 底部按钮Start */
  1316. .bottomBtn {
  1317. z-index: 99;
  1318. position: fixed;
  1319. bottom: 0;
  1320. left: 0;
  1321. right: 0;
  1322. border-top: 1px solid #F1F1F1;
  1323. background-color: #FFFFFF;
  1324. height: 150upx;
  1325. }
  1326. .bottomBtn .agree {
  1327. height: 60upx;
  1328. font-size: 24upx;
  1329. }
  1330. .bottomBtn .agree .tip {
  1331. color: $themeColor;
  1332. margin: 0upx 10upx;
  1333. }
  1334. .bottomBtn .btnView {
  1335. height: 100upx;
  1336. border-top: 1px solid #F1F1F1;
  1337. }
  1338. .bottomBtn .listener {
  1339. width: 120upx;
  1340. font-size: 20upx;
  1341. line-height: 1;
  1342. color: #999;
  1343. }
  1344. .bottomBtn .listener .icon {
  1345. font-size: 40upx;
  1346. padding: 0;
  1347. line-height: 1.2;
  1348. }
  1349. .bottomBtn .btn {
  1350. font-size: 34upx;
  1351. background-color: $themeColor;
  1352. color: #fff;
  1353. width: 280upx;
  1354. flex-shrink: 0;
  1355. }
  1356. .contributing {
  1357. width: 100%;
  1358. margin: 4px 0;
  1359. font-size: 14px;
  1360. text:nth-child(1) {
  1361. font-weight: bold;
  1362. color: #ff9000;
  1363. }
  1364. }
  1365. .slot-content {
  1366. padding: 10px;
  1367. box-sizing: border-box;
  1368. }
  1369. /* 底部按钮End */
  1370. </style>