premiumCalc1.vue 40 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290
  1. <template>
  2. <view class="page">
  3. <!-- 头部吸顶区域 -->
  4. <u-sticky zIndex="999" customNavHeight="0">
  5. <uni-NavBar headerTitle="计算保费" background="#fff" :isSlot="false" :rightSlot="true">
  6. <template #rightSlot>
  7. <view class="dis f-c a-c mr-3" @click="getWechatCustomer">
  8. <image src="/static/icon/customerService.png" mode="" style="width: 48rpx;height: 48rpx;">
  9. </image>
  10. <text style="font-size: 20rpx;color: #333;">客服</text>
  11. </view>
  12. <view class="dis f-c a-c " @click="home">
  13. <image src="/static/icon/home.png" mode="" style="width: 48rpx;height: 48rpx;"></image>
  14. <text style="font-size: 20rpx;color: #333;">首页</text>
  15. </view>
  16. </template>
  17. </uni-NavBar>
  18. <!-- 修改信息提示 -->
  19. <view class="hint dis a-start j-s">
  20. <text>{{carInfo.licenseNo}}的被保人为:{{insuredPersonInfo.name}}</text>
  21. <view class="rightBtn dis a-c j-c " @click="toCarInfo">点击修改</view>
  22. </view>
  23. </u-sticky>
  24. <!-- 报价区域 -->
  25. <view class="quoteArea">
  26. <!-- 投保配置信息 -->
  27. <view class="insuranceConfig">
  28. <u--form labelPosition="left" ref="ownerForm" labelWidth="100" errorType="message">
  29. <u-form-item label="即时起保" borderBottom>
  30. <u-radio-group placement="row" v-model="immediateCoverage" @change="immediateCoverageChange">
  31. <u-radio v-for="(item, index) in immediateCoverageList" :key="index" :label="item.label"
  32. :name="item.value" activeColor="#FDE935" iconColor='#333' labelColor="#333"
  33. style="margin-left: 10px">
  34. </u-radio>
  35. </u-radio-group>
  36. </u-form-item>
  37. <u-form-item label="交强起保日期" borderBottom @click="jqstartShow = true"
  38. v-if="['0330','0330034002','0330034001'].includes(productId)">
  39. <u--input v-model="jqstartDate" disabled disabledColor="#ffffff" clearable
  40. suffixIconStyle="color:#333;font-size:40rpx" placeholder="请选择起保日期"
  41. placeholderStyle="text-align:right;" border="none" style="pointer-events: none">
  42. </u--input>
  43. <image src="/static/icon/quote/dateIcon.png"
  44. style="width: 30rpx;height: 30rpx;margin-left: 10rpx;" mode="">
  45. </image>
  46. </u-form-item>
  47. <u-form-item label="商业起保日期" borderBottom @click="systartShow = true"
  48. v-if="['034001','034002','0330034002','0330034001'].includes(productId)">
  49. <u--input v-model="systartDate" disabled disabledColor="#ffffff" clearable
  50. suffixIconStyle="color:#333;font-size:40rpx" placeholder="请选择起保日期"
  51. placeholderStyle="text-align:right;" border="none" style="pointer-events: none">
  52. </u--input>
  53. <image src="/static/icon/quote/dateIcon.png"
  54. style="width: 30rpx;height: 30rpx;margin-left: 10rpx;" mode="">
  55. </image>
  56. </u-form-item>
  57. <u-form-item label="报价车型" borderBottom @click="brandModelPopup=true">
  58. <u--text :lines="1" bold :text="carInfo.brandName"></u--text>
  59. <u-icon class="ml-1" name="arrow-right" color="#333" size="11"></u-icon>
  60. </u-form-item>
  61. <u-form-item label="是否过户车" borderBottom>
  62. <u-radio-group placement="row" v-model="transferScene"
  63. @change="val=>transferChange(val,'transfer')">
  64. <u-radio v-for="(item, index) in transferList" :key="index" :label="item.label"
  65. :name="item.value" activeColor="#FDE935" iconColor='#333' labelColor="#333"
  66. style="margin-left: 10px">
  67. </u-radio>
  68. </u-radio-group>
  69. </u-form-item>
  70. <u-form-item label="是否商业过户" borderBottom>
  71. <u-radio-group placement="row" v-model="biTransferScene"
  72. @change="val=>transferChange(val,'biTransfer')">
  73. <u-radio v-for="(item, index) in biTransferList" :key="index" :label="item.label"
  74. :name="item.value" activeColor="#FDE935" iconColor='#333' labelColor="#333"
  75. style="margin-left: 10px">
  76. </u-radio>
  77. </u-radio-group>
  78. </u-form-item>
  79. <u-form-item label="是否二手车" :borderBottom="carInfo.transfer?true:false">
  80. <u-radio-group placement="row" v-model="secondHandCarScene"
  81. @change="val=>transferChange(val,'secondHandCar')">
  82. <u-radio v-for="(item, index) in secondHandCarList" :key="index" :label="item.label"
  83. :name="item.value" activeColor="#FDE935" iconColor='#333' labelColor="#333"
  84. style="margin-left: 10px">
  85. </u-radio>
  86. </u-radio-group>
  87. </u-form-item>
  88. <u-form-item label="转移登记日期" v-if="carInfo.transfer==true">
  89. <u--input v-model="carInfo.transferDate" disabled disabledColor="#ffffff" clearable
  90. suffixIconStyle="color:#333;font-size:40rpx" placeholder="请选择起保日期"
  91. placeholderStyle="text-align:right;" border="none" style="pointer-events: none">
  92. </u--input>
  93. <view class="suffixClass">
  94. <image src="/static/icon/quote/dateIcon.png" mode="">
  95. </image>
  96. </view>
  97. </u-form-item>
  98. </u--form>
  99. </view>
  100. <view class="quoteCompany mt-2">
  101. <view class="quoteCompanyItem dis f-c mb-2" v-for="(companyItem,compamyIndex) in quotableCompanyList"
  102. :key="compamyIndex" @click="dorderDetails(companyItem.result.ordersNo)">
  103. <view class="dis a-c j-s ">
  104. <!-- 左侧信息 -->
  105. <view class="dis a-c">
  106. <!-- 保险公司logo -->
  107. <image class="companyIcon mr-2" :src="companyItem.logo" mode=""></image>
  108. <view class="dis f-c ">
  109. <!-- 保险公司名称 -->
  110. <text class="companyName">{{companyItem.nameSimple}}</text>
  111. <!-- 选择方案 -->
  112. <view class="dis a-c">
  113. <view class="solution dis a-c" v-if="!companyItem.insurancePlanInfo"
  114. @click.stop="SchemeSelection(companyItem)">
  115. <text>选择方案</text>
  116. <u-icon name="arrow-right" color="#333" size="11"></u-icon>
  117. </view>
  118. <view class="solution dis a-c" @click.stop="checkSelection(compamyIndex)"
  119. v-if="companyItem.insurancePlanInfo">
  120. <text>查看方案</text>
  121. <u-icon name="arrow-right" color="#333" size="11"></u-icon>
  122. </view>
  123. <view class="solution dis a-c ml-2" @click.stop="SchemeSelection(companyItem)"
  124. v-if="companyItem.insurancePlanInfo">
  125. <text>重选</text>
  126. <u-icon name="arrow-right" color="#333" size="11"></u-icon>
  127. </view>
  128. </view>
  129. </view>
  130. </view>
  131. <!-- 右侧价格信息 -->
  132. <view class="sum-price dis f-c a-end" v-if="companyItem.quoteCode=='200'">
  133. <view class="totalPrice mb-1">
  134. <text>¥</text>
  135. <text>{{companyItem.result.costs.sumPremium}}</text>
  136. </view>
  137. <text class="discountedPrice">优惠 521.87</text>
  138. </view>
  139. <!-- 右侧loading加载组件 -->
  140. <lsLoading v-if="companyItem.quoteCode=='1'"></lsLoading>
  141. <!-- 右侧报价按钮 -->
  142. <view class="quoteBtn dis a-c j-c"
  143. v-if="companyItem.quoteCode=='0' || companyItem.quoteCode=='3'"
  144. @click.stop="individualQuote(companyItem)">
  145. 立即报价
  146. </view>
  147. </view>
  148. <!-- 报价失败原因 -->
  149. <view class="quoteFailureReason dis a-end " v-if="companyItem.quoteCode=='3'">
  150. <view class="iconText dis a-c ">
  151. <u-icon name="error-circle-fill" color="#F74141" size="16"></u-icon>
  152. <text>报价失败</text>
  153. </view>
  154. <u--text :lines="3" size="14" color="#666" style="text-indent: 160rpx;"
  155. :text="companyItem.msg ||'程序异常,请联系管理员'"></u--text>
  156. <view class="viewReason dis a-c j-end" @click.stop="quoteFailedReason(compamyIndex)">查看</view>
  157. </view>
  158. </view>
  159. </view>
  160. </view>
  161. <!-- 底部操作栏 -->
  162. <view class="footer dis a-c ">
  163. <view class="btn dis f-c a-c" @click="back">
  164. <image src="/static/icon/quote/back.png" mode=""></image>
  165. <text>上一步</text>
  166. </view>
  167. <view class="btn dis f-c a-c" @click="findOptimal">
  168. <image src="/static/icon/quote/optimal.png" mode=""></image>
  169. <text>查最优</text>
  170. </view>
  171. <view class="btn dis f-c a-c">
  172. <image src="/static/icon/quote/temporaryStorage.png" mode=""></image>
  173. <text>暂存</text>
  174. </view>
  175. <!-- 多家报价 -->
  176. <view class="batchQuotes dis a-c j-c" @click="multipleQuotes">
  177. <text>多家报价</text>
  178. <text class="sum" v-if="selectedInsurerCount>0">(已选{{selectedInsurerCount}}家)</text>
  179. </view>
  180. </view>
  181. <!-- 查看方案弹窗 -->
  182. <uni-Popup v-if="currentCompanyInfo" :show="checkSelectionPopup" @close="checkSelectionPopup=false"
  183. :closeable="false" headerTitle="厂牌型号" :headerSlot="true" overflow="auto" :headerStyle="{fontSize:'36rpx'}"
  184. maxHeight="1160rpx" mode="bottom" class="checkSelectionPopupClass">
  185. <template #header>
  186. <view class="dis a-c j-c">
  187. <image class="company-icon" :src="currentCompanyInfo.logo" mode=""></image>
  188. <text class="companyName">{{currentCompanyInfo.nameSimple}}</text>
  189. </view>
  190. </template>
  191. <template #content>
  192. <view class="checkSelectionPopup-body" v-if="currentCompanyInfo.insurancePlanInfo">
  193. <!-- 滚动区域 -->
  194. <view class="yellow-content">
  195. <!-- 交强险内容 -->
  196. <view class="content-item dis ">
  197. <!-- 标题 -->
  198. <view class="title dis j-c a-c ">
  199. <text>交强险/车船税</text>
  200. </view>
  201. <view class="right">
  202. <view class="riskView dis a-c j-s">
  203. <text>交强险</text>
  204. <text>投保</text>
  205. </view>
  206. <view class="riskView dis a-c j-s">
  207. <text>车船税</text>
  208. <text v-if="vehicleAndVesselTaxVo.taxRelifFlag=='1'">正常缴税</text>
  209. <view v-else class="dis a-c loadMore"
  210. @click="vehicleTaxIsExpanded=!vehicleTaxIsExpanded">
  211. <text>{{vehicleTaxIsExpanded?'收起':'展开'}}</text>
  212. <text>{{vehicleAndVesselTaxModel.taxRelifFlag}}信息</text>
  213. <u-icon :name="vehicleTaxIsExpanded?'arrow-up':'arrow-down'" class="ml-1 mr-1"
  214. color="#333" size="12"></u-icon>
  215. </view>
  216. </view>
  217. <view class="vehicleTaxInfo" v-if="vehicleTaxIsExpanded">
  218. <view class="item dis a-c j-s "
  219. v-if="vehicleAndVesselTaxVo.taxRelifFlag == 2 || vehicleAndVesselTaxVo.taxRelifFlag == 3">
  220. <text>减免税凭证号</text>
  221. <text>{{vehicleAndVesselTaxVo.extendChar2}}</text>
  222. </view>
  223. <view class="item dis a-c j-s" v-if="vehicleAndVesselTaxVo.taxRelifFlag == 4">
  224. <text>完税凭证号</text>
  225. <text>{{vehicleAndVesselTaxVo.paidFreeCertificate}}</text>
  226. </view>
  227. <view class="item dis a-c j-s "
  228. v-if="vehicleAndVesselTaxVo.taxRelifFlag == 2 || vehicleAndVesselTaxVo.taxRelifFlag == 3">
  229. <text>减免税原因</text>
  230. <text>{{vehicleAndVesselTaxModel.relifReason}}</text>
  231. </view>
  232. <view class="item dis a-c j-s " v-if="vehicleAndVesselTaxVo.taxRelifFlag == 3">
  233. <text>减税比例</text>
  234. <text>{{vehicleAndVesselTaxVo.taxRelief}}</text>
  235. </view>
  236. <view class="item dis a-c j-s " v-if="vehicleAndVesselTaxVo.taxRelifFlag !=1">
  237. <text>税务机关代码</text>
  238. <text>{{vehicleAndVesselTaxVo.taxComCode}}</text>
  239. </view>
  240. <view class="item dis a-c j-s " v-if="vehicleAndVesselTaxVo.taxRelifFlag !=1">
  241. <text>税务机关名称</text>
  242. <text>{{vehicleAndVesselTaxVo.taxComName}}</text>
  243. </view>
  244. <view class="item dis a-c j-s " v-if="vehicleAndVesselTaxVo.taxRelifFlag ==4">
  245. <text>完税凭证填发日期</text>
  246. <text>{{vehicleAndVesselTaxVo.taxDocumentDate}}</text>
  247. </view>
  248. <view class="item dis a-c j-s " v-if="vehicleAndVesselTaxVo.taxRelifFlag ==4">
  249. <text>完税凭证地区</text>
  250. <text>{{vehicleAndVesselTaxModel.taxPaidAreaCode}}</text>
  251. </view>
  252. </view>
  253. </view>
  254. </view>
  255. <!-- 商业险内容 -->
  256. <view class="content-item dis " style="border-color: #E3D5FF;"
  257. v-if="currentCompanyInfo.insurancePlanInfo.kinds.length">
  258. <!-- 标题 -->
  259. <view class="title dis j-c a-c " style="background-color:#F9F6FF;border-color:#F0E9FF;">
  260. <text>商业险</text>
  261. </view>
  262. <view class="right">
  263. <view class="riskView dis a-c j-s"
  264. v-for="(kindsItem,kindsIndex) in currentCompanyInfo.insurancePlanInfo.kinds"
  265. :key="kindsIndex">
  266. <text>{{kindsItem.kindName}}</text>
  267. <text v-if="['A','SY_WBDWGZ'].includes(kindsItem.kindCode)">投保</text>
  268. <text v-else-if="['D4', 'SY_FJ_YBW2'].includes(kindsItem.kindCode)"
  269. class="td">{{convertedValue(kindsItem.unitAmount)}}</text>
  270. <text v-else-if="['MJ1', 'MJ2', 'MJ3', 'MJ4'].includes(kindsItem.kindCode)"
  271. class="td">{{kindsItem.deductibleRate}}%</text>
  272. <text v-else-if="['TY1', 'TY2', 'TY3', 'TY4'].includes(kindsItem.kindCode)"
  273. class="td">{{kindsItem.serviceTimes}}次</text>
  274. <text v-else class="td">{{convertedValue(kindsItem.amount)}}</text>
  275. </view>
  276. </view>
  277. </view>
  278. <!-- 驾意险内容 -->
  279. <view class="content-item dis " style="border-color: #FFE1A4;"
  280. v-if="currentCompanyInfo.insurancePlanInfo.drivings.length">
  281. <!-- 标题 -->
  282. <view class="title dis j-c a-c " style="background-color:#FFFEF0;border-color:#FFF1D5;">
  283. <text>意外险</text>
  284. </view>
  285. <view class="right">
  286. <view class="riskView dis a-c j-s"
  287. v-for="(drivingsItem,drivingsIndex) in currentCompanyInfo.insurancePlanInfo.drivings"
  288. :key="drivingsIndex">
  289. <text style="width: 80%;">{{drivingsItem.productName}}</text>
  290. <text>x{{drivingsItem.quantity}}份</text>
  291. </view>
  292. </view>
  293. </view>
  294. </view>
  295. <view class="footer-btn dis a-c j-s">
  296. <view class="btn btns dis a-c j-c" @click="updateScheme">
  297. 修改方案
  298. </view>
  299. <view class="btn dis a-c j-c " @click="checkSelectionPopup=false">
  300. 关闭
  301. </view>
  302. </view>
  303. </view>
  304. </template>
  305. </uni-Popup>
  306. <!-- 车牌型号弹窗 -->
  307. <uni-Popup :show="brandModelPopup" @close="brandModelPopup=false" :closeable="false" headerTitle="厂牌型号"
  308. overflow="auto" :headerStyle="{fontSize:'36rpx'}" maxHeight="980rpx" mode="center" width="90%">
  309. <template #content>
  310. <view class="brandModelClass">
  311. <view class="cellView">
  312. <text>车系</text>
  313. <text>{{carInfo.modelCode}}</text>
  314. </view>
  315. <view class="cellView">
  316. <text>排量</text>
  317. <text>{{carInfo.displacement}}/L</text>
  318. </view>
  319. <view class="cellView">
  320. <text>座位数</text>
  321. <text>{{carInfo.seatCount}}/座</text>
  322. </view>
  323. <view class="cellView">
  324. <text>年款</text>
  325. <text>{{carInfo.carYear}}</text>
  326. </view>
  327. <view class="cellView">
  328. <text>新车购置价</text>
  329. <text>{{carInfo.purchasePrice}}/元</text>
  330. </view>
  331. <view class="footer-btn dis a-c j-c" @click="brandModelPopup=false">
  332. 关闭
  333. </view>
  334. </view>
  335. </template>
  336. </uni-Popup>
  337. <!-- 报价失败原因弹窗 -->
  338. <uni-Popup v-if="currentCompanyInfo" :show="quoteFailedReasonPopup" @close="quoteFailedReasonPopup=false"
  339. :closeable="false" headerTitle="厂牌型号" :headerSlot="true" overflow="auto" :headerStyle="{fontSize:'36rpx'}"
  340. maxHeight="980rpx" mode="center" width="90%" class="quoteFailedReasonClass">
  341. <template #header>
  342. <!-- 保险公司信息 -->
  343. <view class=" dis a-c ">
  344. <image class="company-icon" :src="currentCompanyInfo.logo" mode=""></image>
  345. <text class="companyName">{{currentCompanyInfo.nameSimple}}</text>
  346. <view class="quote-status">
  347. 报价失败
  348. </view>
  349. </view>
  350. </template>
  351. <template #content>
  352. <!-- 失败原因 -->
  353. <view class="quoteFailedReason-content">
  354. <view style="overflow-y: auto;max-height: 340rpx;">
  355. <u--text size="15" color="#666" :text="currentCompanyInfo.msg || '程序异常,请联系管理员'"></u--text>
  356. </view>
  357. <view class="PopupClose-Btn dis a-c j-c " @click="quoteFailedReasonPopup=false">
  358. 关闭
  359. </view>
  360. </view>
  361. </template>
  362. </uni-Popup>
  363. <!-- 查最优弹窗 -->
  364. <uni-Popup :show="findOptimalShow" @close='findOptimalShow=false' headerTitle="查最优">
  365. <template #content>
  366. <!-- 比价列表 -->
  367. <view class="findOptimalPopup">
  368. <zb-table style="border: 1rpx solid #FDE935;border-radius: 4rpx;" :columns="optimalColumn"
  369. :formatter="tableformatter" :border="false" :cell-header-style="cellheaderStyle"
  370. :data="optimalData"></zb-table>
  371. </view>
  372. </template>
  373. </uni-Popup>
  374. <!-- 自定义加载动画 -->
  375. <u-overlay :show="loadingShow" style="background-color: rgba(255, 255, 255, 0.6);">
  376. <view class="dis f-c a-c j-c " style="height: 100%;">
  377. <u-loading-icon></u-loading-icon>
  378. <text style="color: #909399;" class="mt-1">加载中</text>
  379. </view>
  380. </u-overlay>
  381. <!-- 交强起保日期 -->
  382. <u-datetime-picker :show="jqstartShow" v-model="jqstartvalue" mode="datetime" :formatter="formatter"
  383. @cancel="jqstartShow=false" @close="jqstartShow=false" :closeOnClickOverlay="true" @confirm="jqstartconfirm"
  384. confirmText="确定"></u-datetime-picker>
  385. <!-- 商业起保日期 -->
  386. <u-datetime-picker :show="systartShow" v-model="systartvalue" mode="datetime" :formatter="formatter"
  387. @cancel="systartShow=false" @close="systartShow=false" :closeOnClickOverlay="true" @confirm="systartconfirm"
  388. confirmText="确定"></u-datetime-picker>
  389. <!-- 自定义加载动画 -->
  390. <u-overlay :show="loadingShow" style="background-color: rgba(255, 255, 255, 0.6);">
  391. <view class="dis f-c a-c j-c " style="height: 100%;">
  392. <u-loading-icon></u-loading-icon>
  393. <text style="color: #909399;" class="mt-1">{{loadingText}}</text>
  394. </view>
  395. </u-overlay>
  396. </view>
  397. </template>
  398. <script>
  399. import lsLoading from '@/components/ls-loading/ls-loading.vue';
  400. import Mixin from './Mixin.js';
  401. export default {
  402. components: {
  403. lsLoading,
  404. },
  405. mixins: [Mixin], // 注入 Mixin
  406. data() {
  407. return {
  408. loadingShow: false, //加载
  409. loadingText: '加载中', //加载提示文字
  410. jqstartvalue: Number(new Date().setHours(0, 0, 0)), //交强起期
  411. systartvalue: Number(new Date().setHours(0, 0, 0)), //商业起期
  412. jqstartShow: false, //交强日期选择器
  413. systartShow: false, //商业日期选择器
  414. brandModelPopup: false, //厂牌型号弹窗
  415. findOptimalShow: false, //查最优弹窗
  416. quoteFailedReasonPopup: false, //报价失败原因弹窗
  417. checkSelectionPopup: false, //查看方案弹窗
  418. vehicleTaxIsExpanded: false, //车船税展开收起
  419. carInfo: {}, //车辆信息
  420. ownerInfo: {}, //车主信息
  421. policyHolderInfo: {}, //投保人信息
  422. insuredPersonInfo: {}, //被保人信息
  423. jqstartDate: "", //交强起保时日期
  424. jqendDate: "", //交强终保日期
  425. systartDate: "", //商业起保日期
  426. syendDate: "", //商业终保日期
  427. companyindex: 0,
  428. currentCompanyInfo: {},
  429. }
  430. },
  431. onShow() {},
  432. async onLoad(params) {
  433. this.loadingShow = true;
  434. try {
  435. if (params.ordersNo) {
  436. let res = await this.$http.get('/supplementOrder/getOrderDetail', {
  437. ordersNo: params.ordersNo
  438. });
  439. this.productId = res.data.order.productId; //险种id
  440. this.productName = res.data.order.productsName; //险种name
  441. this.quotableCompanyList = JSON.parse(JSON.stringify(res.data.insCompanyVo));
  442. this.order = res.data.order;
  443. this.costs = res.data.costs; //价格
  444. this.carInfo = res.data.carInfoVo; //车辆信息
  445. this.ownerInfo = res.data.ownersInfo; //车主信息
  446. this.policyHolderInfo = res.data.policyHolderInfo; //投保人信息
  447. this.insuredPersonInfo = res.data.insuredPersonInfo; //被保人信息
  448. this.kindInfoVo = res.data.kindInfoVo; //险种大类
  449. this.ciRiskInfoVo = res.data.ciRiskInfoVo; //交强险
  450. this.biRiskInfoVo = res.data.biRiskInfoVo; //商业险
  451. this.vehicleAndVesselTaxVo = res.data.vehicleAndVesselTaxVo; //车船税信息
  452. this.orderno = res.data.order.ordersNo;
  453. this.quoteno = res.data.order.quoteNo;
  454. await this.commpanyList(res.data);
  455. this.imageEcho(res.data.imageVoList) // 影像获取完毕
  456. if (this.ciRiskInfoVo) {
  457. if (this.isDateBeforeToday(this.ciRiskInfoVo.startDate)) {
  458. this.jqstartDate = this.nextday();
  459. this.jqendDate = this.oneYearPast(this.jqstartDate)
  460. this.ciRiskInfoVo.startDate = this.nextday()
  461. this.ciRiskInfoVo.endDate = this.oneYearPast(this.jqstartDate)
  462. } else {
  463. this.jqstartDate = this.ciRiskInfoVo.startDate;
  464. this.jqendDate = this.ciRiskInfoVo.endDate;
  465. }
  466. }
  467. if (this.biRiskInfoVo) {
  468. if (this.isDateBeforeToday(this.biRiskInfoVo.startDate)) {
  469. this.systartDate = this.nextday();
  470. this.syendDate = this.oneYearPast(this.systartDate)
  471. this.biRiskInfoVo.startDate = this.nextday()
  472. this.biRiskInfoVo.endDate = this.oneYearPast(this.systartDate)
  473. } else {
  474. this.systartDate = this.biRiskInfoVo.startDate;
  475. this.syendDate = this.biRiskInfoVo.endDate;
  476. }
  477. }
  478. } else {
  479. this.jqstartDate = this.nextday();
  480. this.jqendDate = this.oneYearPast(this.jqstartDate);
  481. this.systartDate = this.nextday();
  482. this.syendDate = this.oneYearPast(this.jqstartDate);
  483. const eventChannel = this.getOpenerEventChannel()
  484. // 监听acceptData事件,获取上一页面通过eventChannel传送到当前页面的数据
  485. await eventChannel.on('acceptData', (data) => {
  486. console.log(data);
  487. this.carInfo = data.carInfo; //车辆信息
  488. this.ownerInfo = data.ownerInfo; //车主信息
  489. this.policyHolderInfo = data.policyHolderInfo; //投保人信息
  490. this.vehicleAndVesselTaxVo.identifyNumber = this.policyHolderInfo.identifyNumber;
  491. this.vehicleAndVesselTaxVo.taxpayerName = this.policyHolderInfo.name;
  492. this.insuredPersonInfo = data.insuredPersonInfo; //被保人信息
  493. this.carImageListId = data.carImageListId; //车辆
  494. this.ownerImageListId = data.ownerImageListId; //车主
  495. this.policyHolderImageListId = data.policyHolderImageListId; //投保
  496. this.insuredPersonImageListId = data.insuredPersonImageListId; //被保人
  497. this.productId = data.productId; //险种id
  498. this.productName = data.productName; //险种name
  499. this.riskTypeEchoProcessing(this.productId)
  500. this.quotableCompanyList = JSON.parse(JSON.stringify(data
  501. .quotableCompanyList)); //可报价公司
  502. this.commpanyList(); //保险公司数据结构处理
  503. console.log(this.quotableCompanyList);
  504. })
  505. }
  506. this.loadingShow = false;
  507. } catch (error) {
  508. this.loadingShow = false;
  509. }
  510. },
  511. computed: {
  512. //已选保险公司数量
  513. selectedInsurerCount() {
  514. return this.quotableCompanyList.filter(val => val.insurancePlanInfo !== null).length;
  515. },
  516. //获取车船税类型
  517. taxRelifFlagName() {
  518. let info = this.car_tax_codeoptions.find(ele => ele.value === this.vehicleAndVesselTaxVo.taxRelifFlag)
  519. return info?.description;
  520. },
  521. },
  522. methods: {
  523. // 跳转报价详情
  524. dorderDetails(orderno) {
  525. uni.navigateTo({
  526. url: '/pages/quote/quoteRecordDetail?ordersNo=' + orderno
  527. })
  528. },
  529. // 修改信息
  530. toCarInfo() {
  531. uni.navigateTo({
  532. url: '/pages/quote/quoteInfo',
  533. success: (res) => {
  534. res.eventChannel.emit(
  535. "acceptData", {
  536. carInfo: this
  537. .carInfo, //车辆信息
  538. ownerInfo: this
  539. .ownerInfo, //车主信息
  540. policyHolderInfo: this
  541. .policyHolderInfo, //投保人信息
  542. insuredPersonInfo: this
  543. .insuredPersonInfo, //被保人信息
  544. carImageListId: this
  545. .carImageListId, //车辆
  546. ownerImageListId: this
  547. .ownerImageListId, //车主
  548. policyHolderImageListId: this
  549. .policyHolderImageListId, //投保
  550. insuredPersonImageListId: this
  551. .insuredPersonImageListId, //被保人
  552. productId: this.productId, //险种id
  553. productName: this.productName, //险种名称
  554. quoteno: this.quoteno,
  555. })
  556. }
  557. }, "navigateTo", true);
  558. },
  559. // 单独报价
  560. async individualQuote(item) {
  561. if (this.carInfo.licenseNo.length == '8' && this.carInfo.energyTypeCode == '0') {
  562. return uni.showToast({
  563. icon: "none",
  564. title: '检测到能源种类错误,与车辆信息不符。请修改后继续操作',
  565. duration: 3000
  566. });
  567. }
  568. if (!item.insurancePlanInfo) {
  569. uni.showToast({
  570. title: "请选择方案后,在进行报价",
  571. icon: 'none',
  572. });
  573. } else {
  574. this.riskTypeEchoProcessing(this.productId); //更新险种大类日期
  575. let param = {
  576. licenseNo: this.carInfo.licenseNo,
  577. vinNo: this.carInfo.vinNo,
  578. engineNo: this.carInfo.engineNo,
  579. };
  580. let orders = await this.$http.get('/unify/order/getQuoteNo', param);
  581. if (orders.code == '200') {
  582. this.quoteno = orders.msg;
  583. let mergedArray = [];
  584. let mergedArrayList = mergedArray.concat(this.carImageListId, this
  585. .ownerImageListId, this
  586. .policyHolderImageListId, this.insuredPersonImageListId)
  587. if (mergedArrayList.length > 0) {
  588. await this.$http.post('/unify/order/imageSave', {
  589. imageVoList: mergedArrayList,
  590. order: {
  591. quoteNo: this.quoteno,
  592. }
  593. })
  594. }
  595. this.quotableCompanyList = this.quotableCompanyList.map((ele, index) => {
  596. if (ele.id == item.id) {
  597. // 动态调用报价接口
  598. ele.quoteCode = '1';
  599. this.quoteInsurance(index, ele.id);
  600. }
  601. return ele
  602. });
  603. } else if (orders.code == '1001') {
  604. this.Generateshow = true;
  605. } else {
  606. uni.showToast({
  607. title: orders.msg,
  608. icon: 'none',
  609. });
  610. }
  611. }
  612. },
  613. // 多家报价
  614. async multipleQuotes() {
  615. var allAreFalse = this.quotableCompanyList.every(function(element) {
  616. return element.insurancePlanInfo == null;
  617. });
  618. if (!allAreFalse) {
  619. if (this.carInfo.licenseNo.length == '8' && this.carInfo.energyTypeCode == '0') {
  620. return uni.showToast({
  621. icon: "none",
  622. title: '检测到能源种类错误,与车辆信息不符。请修改后继续操作',
  623. duration: 3000
  624. });
  625. }
  626. this.riskTypeEchoProcessing(this.productId); //更新险种大类日期
  627. let param = {
  628. licenseNo: this.carInfo.licenseNo,
  629. vinNo: this.carInfo.vinNo,
  630. engineNo: this.carInfo.engineNo,
  631. };
  632. let orders = await this.$http.get('/unify/order/getQuoteNo', param);
  633. if (orders.code == '200') {
  634. this.quoteno = orders.msg;
  635. let mergedArray = [];
  636. let mergedArrayList = mergedArray.concat(this.carImageListId, this
  637. .ownerImageListId, this
  638. .policyHolderImageListId, this.insuredPersonImageListId)
  639. console.log(mergedArrayList);
  640. if (mergedArrayList.length > 0) {
  641. await this.$http.post('/unify/order/imageSave', {
  642. imageVoList: mergedArrayList,
  643. order: {
  644. quoteNo: this.quoteno,
  645. }
  646. })
  647. }
  648. this.quotableCompanyList = this.quotableCompanyList.map((ele, index) => {
  649. if (ele.insurancePlanInfo !== null) {
  650. // 动态调用报价接口
  651. ele.quoteCode = '1';
  652. this.quoteInsurance(index, ele.id);
  653. }
  654. return ele
  655. });
  656. } else if (orders.code == '1001') {
  657. this.Generateshow = true;
  658. } else {
  659. uni.showToast({
  660. title: orders.msg,
  661. icon: 'none',
  662. });
  663. }
  664. } else {
  665. uni.showToast({
  666. title: "请选择方案后,在进行报价",
  667. icon: 'none',
  668. });
  669. }
  670. },
  671. // 调用统一报价接口
  672. async quoteInsurance(companyIndex, companyId) {
  673. const company = this.quotableCompanyList[companyIndex];
  674. console.log(company);
  675. const isTaxSource = company.isTaxSource;
  676. const params = {
  677. order: {
  678. agreementId: company.dispatchAgreementId,
  679. insuranceCompanyCode: companyId,
  680. quoteNo: this.quoteno,
  681. productId: this.productId,
  682. orderSource: '1',
  683. },
  684. accidentalDrivings: company.insurancePlanInfo.drivings,
  685. kindInfoVo: company.insurancePlanInfo.kinds,
  686. ciRiskInfoVo: ['0330', '0330034002', '0330034001'].includes(this.productId) ? this
  687. .ciRiskInfoVo : null,
  688. biRiskInfoVo: ['034001', '034002', '0330034002', '0330034001'].includes(this.productId) ? this
  689. .biRiskInfoVo : null,
  690. carInfoVo: this.carInfo,
  691. ownersInfo: this.ownerInfo,
  692. policyHolderInfo: this.policyHolderInfo,
  693. insuredPersonInfo: this.insuredPersonInfo,
  694. vehicleAndVesselTaxVo: this.vehicleAndVesselTaxVo,
  695. isTaxSource: isTaxSource == 1 ? isTaxSource : null,
  696. systemType: '2'
  697. };
  698. try {
  699. let res = await this.$http.post('/unify/order/quote', params);
  700. company.msg = res.msg;
  701. if (res.code == "200") {
  702. company.result = res.data;
  703. const updatedItem = {
  704. ...company,
  705. quoteCode: 200
  706. };
  707. this.quotableCompanyList.splice(companyIndex, 1, updatedItem);
  708. } else {
  709. const updatedItem = {
  710. ...company,
  711. quoteCode: '3'
  712. };
  713. this.quotableCompanyList.splice(companyIndex, 1, updatedItem);
  714. company.msg = res.msg;
  715. console.log(company);
  716. return;
  717. }
  718. } catch (error) {
  719. const updatedItem = {
  720. ...company,
  721. quoteCode: '3'
  722. };
  723. this.quotableCompanyList.splice(companyIndex, 1, updatedItem);
  724. company.msg = '接口请求超时,请重新尝试';
  725. }
  726. },
  727. //选择方案
  728. async SchemeSelection(item) {
  729. uni.navigateTo({
  730. url: '/pages/quote/chooseOption1',
  731. success: (res) => {
  732. res.eventChannel.emit("acceptData", {
  733. params: {
  734. companyId: item.id,
  735. productId: this.productId,
  736. },
  737. nameSimple: item.nameSimple,
  738. logo: item.logo,
  739. cnName: item.cnName,
  740. jqstartDate: this.jqstartDate,
  741. jqendDate: this.jqendDate,
  742. systartDate: this.systartDate,
  743. syendDate: this.syendDate,
  744. productName: this.productName,
  745. quotableCompanyList: this.quotableCompanyList,
  746. identifyNumber: this.policyHolderInfo.identifyNumber,
  747. taxpayerName: this.policyHolderInfo.name,
  748. })
  749. }
  750. }, "navigateTo", true);
  751. },
  752. // 修改方案
  753. updateScheme() {
  754. uni.navigateTo({
  755. url: '/pages/quote/chooseOption1',
  756. success: (res) => {
  757. res.eventChannel.emit("acceptData", {
  758. params: {
  759. companyId: this.currentCompanyInfo.id,
  760. productId: this.productId,
  761. },
  762. nameSimple: this.currentCompanyInfo.nameSimple,
  763. logo: this.currentCompanyInfo.logo,
  764. cnName: this.currentCompanyInfo.cnName,
  765. jqstartDate: this.jqstartDate,
  766. jqendDate: this.jqendDate,
  767. systartDate: this.systartDate,
  768. syendDate: this.syendDate,
  769. productName: this.productName,
  770. quotableCompanyList: this.quotableCompanyList,
  771. identifyNumber: this.policyHolderInfo.identifyNumber,
  772. taxpayerName: this.policyHolderInfo.name,
  773. })
  774. }
  775. }, "navigateTo", true);
  776. this.checkSelectionPopup = false;
  777. },
  778. //查最优
  779. async findOptimal() {
  780. let res = await this.$http.get('/supplementOrder/comparePrice?quoteNo=' + this.quoteno);
  781. if (res.code == '200') {
  782. this.optimalData = res.data;
  783. this.findOptimalShow = true;
  784. }
  785. },
  786. //查看方案弹窗
  787. checkSelection(index) {
  788. this.currentCompanyInfo = this.quotableCompanyList[index];
  789. console.log(this.currentCompanyInfo);
  790. this.checkSelectionPopup = true;
  791. },
  792. // 报价原因弹窗
  793. quoteFailedReason(index) {
  794. this.currentCompanyInfo = this.quotableCompanyList[index];
  795. this.quoteFailedReasonPopup = true;
  796. },
  797. //即时投保切换更新投保日期
  798. immediateCoverageChange(e) {
  799. if (e == 1) {
  800. const date = new Date();
  801. date.setHours(date.getHours() + 2);
  802. date.setMinutes(0)
  803. date.setSeconds(0)
  804. this.jqstartDate = this.transformTime(date)
  805. this.jqendDate = this.oneYearPast(date);
  806. this.systartDate = this.transformTime(date)
  807. this.syendDate = this.oneYearPast(date);
  808. } else {
  809. this.jqstartDate = this.nextday();
  810. this.jqendDate = this.oneYearPast(this.jqstartDate);
  811. this.systartDate = this.nextday();
  812. this.syendDate = this.oneYearPast(this.systartDate);
  813. }
  814. },
  815. //交强日期事件
  816. jqstartconfirm(e) {
  817. this.jqstartDate = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM') + ':00';
  818. this.jqendDate = this.oneYearPast(this.jqstartDate)
  819. this.jqstartShow = false;
  820. },
  821. // 商业日期事件
  822. systartconfirm(e) {
  823. this.systartDate = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM') + ':00';
  824. this.syendDate = this.oneYearPast(this.systartDate)
  825. this.systartShow = false;
  826. },
  827. //数字格式化
  828. convertedValue(num) {
  829. if (!num) {
  830. return "-";
  831. }
  832. if (num < 10000) {
  833. return num.toString();
  834. } else if (num < 100000000) {
  835. return (Math.floor(num / 10000 * 10) / 10) + '万';
  836. } else {
  837. return (Math.floor(num / 100000000 * 10) / 10) + '亿';
  838. }
  839. },
  840. }
  841. }
  842. </script>
  843. <style lang="scss" scoped>
  844. ::v-deep {
  845. .u-input__content__subfix-icon {
  846. margin-left: 12rpx;
  847. image {
  848. width: 30rpx;
  849. height: 30rpx;
  850. }
  851. }
  852. /* 调整输入框光标靠右 */
  853. .uni-input-input {
  854. text-align: right !important;
  855. font-weight: bold;
  856. }
  857. /* 设置表单项非input元素靠右布局 */
  858. .u-form-item__body__right {
  859. margin-left: auto;
  860. flex: unset;
  861. }
  862. .u-form-item__body {
  863. padding: 24rpx 0;
  864. box-sizing: border-box;
  865. }
  866. .u-form-item__body__left__content__label {
  867. color: #333;
  868. }
  869. /* 覆盖表单下边框颜色 */
  870. .u-form-item .u-line {
  871. border-bottom: 1rpx solid #eee;
  872. }
  873. }
  874. page {
  875. background-color: #f8f8f8;
  876. }
  877. .page {
  878. background-color: #f8f8f8;
  879. height: 100%;
  880. /* 提示信息样式 */
  881. .hint {
  882. padding: 16rpx 30rpx;
  883. box-sizing: border-box;
  884. background: #FFFBD7;
  885. border-radius: 0rpx 0rpx 0rpx 0rpx;
  886. font-size: 30rpx;
  887. color: #333;
  888. .rightBtn {
  889. padding: 6rpx 20rpx;
  890. box-sizing: border-box;
  891. background: rgba(253, 233, 53, 0.3);
  892. border-radius: 40rpx 40rpx 40rpx 40rpx;
  893. border: 1rpx solid #FDE935;
  894. font-size: 26rpx;
  895. color: #333;
  896. }
  897. }
  898. .quoteArea {
  899. padding: 20rpx 30rpx 170rpx;
  900. box-sizing: border-box;
  901. }
  902. /* 投保配置 */
  903. .insuranceConfig {
  904. padding: 0 30rpx;
  905. box-sizing: border-box;
  906. width: 100%;
  907. background: #FFFFFF;
  908. border-radius: 10rpx 10rpx 10rpx 10rpx;
  909. }
  910. }
  911. /* 厂牌型号弹窗 */
  912. .brandModelClass {
  913. padding: 30rpx 40rpx 40rpx;
  914. box-sizing: border-box;
  915. .cellView {
  916. padding: 10rpx 0;
  917. box-sizing: border-box;
  918. font-size: 30rpx;
  919. display: flex;
  920. justify-content: space-between;
  921. align-items: center;
  922. text:first-child {
  923. color: #666;
  924. }
  925. text:last-child {
  926. color: #333;
  927. font-weight: bold;
  928. }
  929. }
  930. .footer-btn {
  931. width: 100%;
  932. padding: 20rpx;
  933. box-sizing: border-box;
  934. background: rgba(253, 233, 53, 0.1);
  935. border-radius: 45rpx 45rpx 45rpx 45rpx;
  936. border: 1rpx solid #FDE935;
  937. margin-top: 30rpx;
  938. }
  939. }
  940. /* 报价公司 */
  941. .quoteCompany {
  942. .quoteCompanyItem {
  943. padding: 30rpx;
  944. box-sizing: border-box;
  945. background: #FFFFFF;
  946. border-radius: 10rpx 10rpx 10rpx 10rpx;
  947. .companyIcon {
  948. width: 90rpx;
  949. height: 90rpx;
  950. }
  951. .companyName {
  952. font-size: 34rpx;
  953. color: #333;
  954. font-weight: bold;
  955. margin-bottom: 18rpx;
  956. }
  957. .solution {
  958. font-size: 28rpx;
  959. color: #666;
  960. }
  961. .sum-price {
  962. color: #FF540A;
  963. .totalPrice {
  964. font-weight: bold;
  965. text:first-child {
  966. font-size: 26rpx;
  967. }
  968. text:last-child {
  969. font-size: 40rpx;
  970. }
  971. }
  972. .discountedPrice {
  973. font-size: 24rpx;
  974. }
  975. }
  976. // 报价按钮
  977. .quoteBtn {
  978. padding: 11rpx 22rpx;
  979. box-sizing: border-box;
  980. background: #FDE935;
  981. border-radius: 50rpx 50rpx 50rpx 50rpx;
  982. font-size: 30rpx;
  983. color: #1F1F1F;
  984. }
  985. .quoteFailureReason {
  986. width: 100%;
  987. background: #FAFAFA;
  988. margin-top: 20rpx;
  989. border-radius: 10rpx 10rpx 10rpx 10rpx;
  990. padding: 10rpx;
  991. box-sizing: border-box;
  992. font-size: 28rpx;
  993. color: #F74141;
  994. position: relative;
  995. .iconText {
  996. position: absolute;
  997. top: 10rpx;
  998. left: 10rpx;
  999. text {
  1000. margin-left: 5rpx;
  1001. }
  1002. }
  1003. .viewReason {
  1004. background: #FAFAFA;
  1005. position: absolute;
  1006. bottom: 10rpx;
  1007. right: 10rpx;
  1008. color: #FFAC1D;
  1009. }
  1010. }
  1011. }
  1012. }
  1013. // 报价失败原因弹窗
  1014. .quoteFailedReasonClass {
  1015. .company-icon {
  1016. width: 50rpx;
  1017. height: 50rpx;
  1018. }
  1019. .companyName {
  1020. font-size: 36rpx;
  1021. color: #333;
  1022. font-weight: bold;
  1023. margin-left: 10rpx;
  1024. margin-right: 20rpx;
  1025. }
  1026. .quote-status {
  1027. padding: 4rpx 10rpx;
  1028. box-sizing: border-box;
  1029. background: #FFECEC;
  1030. border-radius: 2rpx 2rpx 2rpx 2rpx;
  1031. font-size: 24rpx;
  1032. color: #F74141;
  1033. font-weight: bold;
  1034. }
  1035. .quoteFailedReason-content {
  1036. padding: 40rpx;
  1037. box-sizing: border-box;
  1038. .PopupClose-Btn {
  1039. background: rgba(253, 233, 53, 0.1);
  1040. border: 1rpx solid #FDE935;
  1041. padding: 22rpx 20rpx;
  1042. box-sizing: border-box;
  1043. border-radius: 45rpx;
  1044. font-size: 30rpx;
  1045. color: #333;
  1046. margin-top: 40rpx;
  1047. }
  1048. }
  1049. }
  1050. // 查看方案弹窗
  1051. .checkSelectionPopupClass {
  1052. .company-icon {
  1053. width: 50rpx;
  1054. height: 50rpx;
  1055. }
  1056. .companyName {
  1057. font-size: 36rpx;
  1058. color: #333;
  1059. font-weight: bold;
  1060. margin-left: 10rpx;
  1061. }
  1062. .checkSelectionPopup-body {
  1063. padding: 30rpx 40rpx;
  1064. box-sizing: border-box;
  1065. .yellow-content {
  1066. overflow-y: auto;
  1067. padding-bottom: 116rpx;
  1068. }
  1069. .content-item {
  1070. border-radius: 4rpx;
  1071. border: 1rpx solid #FFD9D9;
  1072. margin-bottom: 30rpx;
  1073. .title {
  1074. width: 16%;
  1075. padding: 10rpx;
  1076. box-sizing: border-box;
  1077. background: #FFF8F8;
  1078. border-right: 1rpx solid #FFE5E5;
  1079. border-radius: 4rpx 0 0 4rpx;
  1080. font-size: 28rpx;
  1081. color: #333;
  1082. font-weight: bold;
  1083. text {
  1084. text-align: center;
  1085. }
  1086. }
  1087. .right {
  1088. flex: 1;
  1089. padding: 0 20rpx;
  1090. box-sizing: border-box;
  1091. .riskView {
  1092. margin: 15rpx 0;
  1093. >text:first-child {
  1094. font-size: 28rpx;
  1095. color: #666;
  1096. }
  1097. >text:last-child {
  1098. font-size: 28rpx;
  1099. color: #333;
  1100. font-weight: bold;
  1101. }
  1102. .loadMore {
  1103. font-size: 28rpx;
  1104. color: #333;
  1105. font-weight: bold;
  1106. }
  1107. }
  1108. .vehicleTaxInfo {
  1109. flex: 1;
  1110. width: 100%;
  1111. background: #F9F9F9;
  1112. padding: 0 10rpx;
  1113. box-sizing: border-box;
  1114. border-radius: 10rpx 10rpx 10rpx 10rpx;
  1115. margin-bottom: 15rpx;
  1116. .item {
  1117. padding: 15rpx 0;
  1118. box-sizing: border-box;
  1119. text:first-child {
  1120. font-size: 28rpx;
  1121. color: #666;
  1122. }
  1123. text:last-child {
  1124. font-size: 28rpx;
  1125. color: #333;
  1126. font-weight: bold;
  1127. }
  1128. }
  1129. }
  1130. }
  1131. }
  1132. .footer-btn {
  1133. position: fixed;
  1134. bottom: 0;
  1135. left: 0;
  1136. right: 0;
  1137. padding: 25rpx 30rpx 55rpx;
  1138. box-sizing: border-box;
  1139. background: linear-gradient(0deg, #FFFFFF 0%, rgba(255, 254, 245, 0.7) 100%);
  1140. border-radius: 0rpx 0rpx 0rpx 0rpx;
  1141. backdrop-filter: blur(12rpx);
  1142. .btn {
  1143. width: 100%;
  1144. background: #FDE935;
  1145. padding: 20rpx 20rpx;
  1146. box-sizing: border-box;
  1147. border-radius: 58rpx 58rpx 58rpx 58rpx;
  1148. font-size: 36rpx;
  1149. color: #1F1F1F;
  1150. }
  1151. //操作按钮特殊样式
  1152. .btns {
  1153. background: transparent;
  1154. border: 1rpx solid #FDE935;
  1155. padding: 19rpx 20rpx;
  1156. margin-right: 30rpx;
  1157. }
  1158. }
  1159. }
  1160. }
  1161. .footer {
  1162. position: fixed;
  1163. bottom: 0;
  1164. left: 0;
  1165. right: 0;
  1166. padding: 25rpx 30rpx 55rpx;
  1167. box-sizing: border-box;
  1168. backdrop-filter: blur(12rpx);
  1169. background: linear-gradient(0deg, #FFFFFF 0%, rgba(255, 254, 245, 0.7) 100%);
  1170. .btn {
  1171. margin-right: 36rpx;
  1172. image {
  1173. width: 48rpx;
  1174. height: 48rpx;
  1175. }
  1176. text {
  1177. font-size: 20rpx;
  1178. color: #333;
  1179. }
  1180. }
  1181. .batchQuotes {
  1182. flex: 1;
  1183. background: #FDE935;
  1184. border-radius: 58rpx 58rpx 58rpx 58rpx;
  1185. padding: 26rpx 60rpx;
  1186. box-sizing: border-box;
  1187. color: #1F1F1F;
  1188. text:first-child {
  1189. font-size: 36rpx;
  1190. font-weight: bold;
  1191. line-height: 1;
  1192. }
  1193. .sum {
  1194. font-size: 28rpx;
  1195. }
  1196. }
  1197. }
  1198. // 查最优弹窗
  1199. .findOptimalPopup {
  1200. height: 1200rpx;
  1201. padding: 30rpx 40rpx;
  1202. box-sizing: border-box;
  1203. }
  1204. .suffixClass {
  1205. margin-left: 10rpx;
  1206. font-size: 30rpx;
  1207. }
  1208. </style>