subOrders.vue 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666
  1. <template>
  2. <view @click.native="init" class="page">
  3. <view class="car-header dis a-c">
  4. <image src="/static/image/car-insure/Group.png" mode="" style="width: 40px;height: 40px;"></image>
  5. <view class="dis f-c head-name">
  6. <text>{{licenseno}}</text>
  7. <view class="name1">
  8. <text style="margin-right: 10px;">{{insuredname}}</text>
  9. <text>{{modelcname}}</text>
  10. </view>
  11. </view>
  12. </view>
  13. <view class="pdd mt-3">
  14. <view class="sub-orders " v-for="(item,index) in sublist" :key="index">
  15. <view class="status dis a-c j-s">
  16. <view v-for="(statusitem, statusindex) in statusList" :key="statusindex" class="dis a-c"
  17. style="font-weight: bold;" v-if="item.orderstatus == statusitem.value">
  18. <image :src="statusitem.src" mode="" style="width: 22px;height: 22px;margin-right: 5px;">
  19. </image>
  20. <text :style="{color: statusitem.color}">{{statusitem.label}}</text>
  21. </view>
  22. <text>¥{{item.sumpremium}}</text>
  23. </view>
  24. <view class="orders-centre">
  25. <text>{{item.inscompany}}</text>
  26. <text>( {{item.agreementName}} )</text>
  27. <view class="sum dis f-wrap">
  28. <view v-if="item.jqpremium">交强险:¥{{item.jqpremium}}</view>
  29. <view v-if="item.sypremium">商业险:¥{{item.sypremium}}</view>
  30. <view>车船税:¥{{item.taxamount}}</view>
  31. <view v-if="item.jypremium">驾意险:¥{{item.jypremium}}</view>
  32. </view>
  33. <view v-if="item.auditopinion" class="dis f-c" style="font-size: 12px;">
  34. <text>审核意见</text>
  35. <text>{{item.auditopinion}}</text>
  36. </view>
  37. </view>
  38. <view class="orders-below dis j-end a-c">
  39. <text class="arrivalNavigations" :data-id="item.id" @tap.stop.prevent="Moremethods">更多
  40. <view class="arrivalNavigation" v-if="item.checked">
  41. <view class="d4"></view>
  42. <view class="sideNavigation">
  43. <view class="sideNavigation-btn">
  44. <view @click="bjdpreview(item.id)">报价单</view>
  45. <view v-if="item.orderstatus==2 && ['紫金财险'].includes(item.inscompany)"
  46. @click="cancelorder(item.id)">撤单</view>
  47. <view v-if="item.orderstatus==2" @click="revokeCode(item.id)">撤销二维码</view>
  48. <!-- <view @click="orderTrajectory(item.id)">订单轨迹</view> -->
  49. </view>
  50. </view>
  51. </view>
  52. </text>
  53. <u-button
  54. v-if="item.orderstatus==2 && ['恒邦财险','安盛天平','中国人寿','众安财险','太平财险','紫金财险','永诚财险','国任财险','大家财险','华泰财险','中煤财险','华农财险','渤海财险'].includes(item.inscompany)"
  55. size="mini" :custom-style="{fontSize:'14px'}" type="error" :plain="true"
  56. style="margin-right:10px;" @click="queryStatus(item.id,item.inscompany)">查询缴费状态</u-button>
  57. <u-button v-if="item.orderstatus==2" size="mini" type="error" style="margin-right:10px;"
  58. :custom-style="{fontSize:'14px'}" :plain="true" @click="Payment(item.id)">二维码</u-button>
  59. <u-button v-if="(item.orderstatus==4 || item.orderstatus==1) && item.inscompany=='华泰财险'" size="mini"
  60. :custom-style="{fontSize:'14px'}" type="error" :plain="true"
  61. @click="huataiunderwriting(item.id)" style="margin-right:10px;">更新订单</u-button>
  62. <u-button
  63. v-if="item.orderstatus==1 && ['中煤财险','永诚财险','国任财险','大家财险','渤海财险'].includes(item.inscompany)"
  64. style="margin-right:10px;" size="mini" type="error" :plain="true"
  65. :custom-style="{fontSize:'14px'}" @click="underwriting(item.id,item.inscompany)">更新订单</u-button>
  66. <u-button size="mini" type="primary" :custom-style="{fontSize:'14px'}" :plain="true"
  67. @click="detial(item.id)">查看详情</u-button>
  68. </view>
  69. </view>
  70. </view>
  71. <o-empty v-if="sublist.length==0" />
  72. <!-- <u-popup v-model="trajectoryShow" mode="center" border-radius="8" width="80%">
  73. <u-steps mode="number" :list="numList" :current="2" direction="column" style="padding: 20px;"></u-steps>
  74. </u-popup> -->
  75. </view>
  76. </template>
  77. <script>
  78. import store from '@/store';
  79. import {
  80. mapState,
  81. mapMutations
  82. } from "vuex"
  83. export default {
  84. data() {
  85. return {
  86. show: true,
  87. modeClass: 'fade',
  88. // trajectoryShow: false,
  89. // trajectoryList: [],
  90. MoreShow: false,
  91. moreindex: "",
  92. companyId: "",
  93. modelcname: "",
  94. orderno: "",
  95. insuredname: "",
  96. licenseno: "",
  97. sublist: [],
  98. numList: [{
  99. name: '报价中'
  100. }, {
  101. name: '待核保'
  102. },
  103. {
  104. name: '核保退回'
  105. }, {
  106. name: '已核保待缴费'
  107. }, {
  108. name: '已承保'
  109. },
  110. ],
  111. statusList: [{
  112. label: '报价中',
  113. value: 0,
  114. color: "#229805",
  115. src: "/static/image/car-insure/state1.png"
  116. },
  117. {
  118. label: '待核保',
  119. value: 1,
  120. color: "#FF5600",
  121. src: "/static/image/car-insure/state2.png"
  122. },
  123. {
  124. label: '已核保待缴费',
  125. value: 2,
  126. color: "#FF0F00",
  127. src: "/static/image/car-insure/state3.png"
  128. },
  129. {
  130. label: '已承保',
  131. value: 3,
  132. color: "#0052FF",
  133. src: "/static/image/car-insure/state4.png"
  134. },
  135. {
  136. label: '核保退回',
  137. value: 4,
  138. color: "#727272",
  139. src: "/static/image/car-insure/state5.png"
  140. }
  141. ],
  142. }
  143. },
  144. computed: {
  145. ...mapState(['userInfo']),
  146. },
  147. onLoad(params) {
  148. let item = JSON.parse(params.orderno);
  149. this.orderno = item.orderno;
  150. this.modelcname = item.modelcname;
  151. this.insuredname = item.insuredname;
  152. this.licenseno = item.licenseno;
  153. this.querylist();
  154. },
  155. methods: {
  156. handle(type) {
  157. this.show = !this.show
  158. this.modeClass = type
  159. },
  160. async querylist() {
  161. let params = {
  162. orderNo: this.orderno
  163. }
  164. let res = await this.$http.post('/insurance/order/querySuborder', params)
  165. this.sublist = res.data;
  166. this.sublist.map(val => {
  167. val.checked = false;
  168. return val;
  169. })
  170. },
  171. //更多操作
  172. Moremethods(e) {
  173. let id = e.currentTarget.dataset.id;
  174. let list = this.sublist;
  175. this.sublist = list.map(val => {
  176. if (val.id == id) {
  177. val.checked = !val.checked;
  178. } else {
  179. val.checked = false;
  180. }
  181. return val;
  182. })
  183. },
  184. //查看详情
  185. detial(id) {
  186. uni.navigateTo({
  187. url: "/pages/carInsure2/quoteDetail?companyId=" + id
  188. })
  189. },
  190. //付款码
  191. Payment(id) {
  192. let pro = this.userInfo.sysUser.managementSource;
  193. if (pro == '3') {
  194. uni.navigateTo({
  195. url: "/pages/carInsure1/payCode2?companyId=" + id
  196. })
  197. } else {
  198. uni.navigateTo({
  199. url: "/pages/orders1/paymentCode?companyId=" + id
  200. })
  201. }
  202. },
  203. //报价单
  204. bjdpreview(id) {
  205. let pro = this.userInfo.sysUser.managementSource;
  206. if (pro == '3') {
  207. uni.navigateTo({
  208. url: "/pages/orders/quotation1?companyId=" + id
  209. })
  210. } else {
  211. uni.navigateTo({
  212. url: "/pages/orders1/quotation?companyId=" + id
  213. })
  214. }
  215. },
  216. //撤销二维码
  217. async revokeCode(id) {
  218. let res = await this.$http.post('/order/qrCode/destructionQrCode?areaCompanyId=' + id)
  219. if (res.code == '200') {
  220. uni.showToast({
  221. title: res.msg,
  222. icon: 'success',
  223. duration: 1000
  224. });
  225. this.querylist();
  226. } else {
  227. uni.showToast({
  228. title: res.msg,
  229. icon: 'none',
  230. duration: 1000
  231. });
  232. }
  233. },
  234. async huataiunderwriting(id) {
  235. let params = {
  236. companyId: id,
  237. }
  238. let res = await this.$http.post('/order/huaTaiApi/auditStatusQuery', params)
  239. if (res.code == '200') {
  240. uni.showToast({
  241. title: res.msg,
  242. icon: 'success',
  243. duration: 1000
  244. });
  245. this.querylist();
  246. } else {
  247. uni.showToast({
  248. title: res.msg,
  249. icon: 'none',
  250. duration: 1000
  251. });
  252. }
  253. },
  254. //核保状态查询
  255. async underwriting(id, inscompany) {
  256. switch (inscompany) {
  257. case "中煤财险":
  258. let zmres = await this.$http.post('/order/zhongMeiApi/auditStatusQuery', {
  259. companyId: id
  260. })
  261. if (zmres.code == '200') {
  262. uni.showToast({
  263. title: zmres.msg,
  264. icon: 'none',
  265. duration: 1000
  266. });
  267. this.querylist();
  268. } else {
  269. uni.showToast({
  270. title: zmres.msg,
  271. icon: 'none',
  272. });
  273. }
  274. break;
  275. case "永诚财险":
  276. let ycres = await this.$http.get('/api/yongCheng/orderStatusBySuborderId/' + id);
  277. if (ycres.code == '200') {
  278. uni.showToast({
  279. title: ycres.msg,
  280. icon: 'none',
  281. duration: 2000
  282. });
  283. this.querylist();
  284. } else {
  285. uni.showToast({
  286. title: ycres.msg,
  287. icon: 'none',
  288. });
  289. }
  290. break;
  291. case "国任财险":
  292. let grres = await this.$http.post('/api/guoRen/updateOrderInfo', {
  293. companyId: id
  294. });
  295. if (grres.code == '200') {
  296. uni.showToast({
  297. title: grres.msg,
  298. icon: 'none',
  299. duration: 2000
  300. });
  301. this.querylist();
  302. } else {
  303. uni.showToast({
  304. title: grres.msg,
  305. icon: 'none',
  306. });
  307. }
  308. break;
  309. case "大家财险":
  310. let djres = await this.$http.post('/api/dajia/verifyPayment', {
  311. companyId: id
  312. });
  313. if (djres.code == '200') {
  314. uni.showToast({
  315. title: djres.msg,
  316. icon: 'none',
  317. duration: 2000
  318. });
  319. this.querylist();
  320. } else {
  321. uni.showToast({
  322. title: djres.msg,
  323. icon: 'none',
  324. });
  325. }
  326. break;
  327. case "渤海财险":
  328. let bhres = await this.$http.post('/order/boHaiApi/auditStatusQuery', {
  329. companyId: id
  330. });
  331. if (bhres.code == '200') {
  332. uni.showToast({
  333. title: bhres.msg,
  334. icon: 'none',
  335. duration: 2000
  336. });
  337. this.querylist();
  338. } else {
  339. uni.showToast({
  340. title: bhres.msg,
  341. icon: 'none',
  342. });
  343. }
  344. break;
  345. default:
  346. break;
  347. }
  348. },
  349. //撤单
  350. async cancelorder(item) {
  351. let res = await this.$http.post('/order/zijin/cancel', {
  352. companyId: item
  353. })
  354. if (res.code == '200') {
  355. uni.showToast({
  356. title: res.msg,
  357. icon: 'none',
  358. duration: 1000
  359. });
  360. this.querylist();
  361. } else {
  362. uni.showToast({
  363. title: res.msg,
  364. icon: 'none',
  365. });
  366. }
  367. },
  368. async queryStatus(id, inscompany) {
  369. switch (inscompany) {
  370. case "紫金财险":
  371. let zjres = await this.$http.post('/order/zijin/getOrderDetail', {
  372. companyId: id
  373. });
  374. if (zjres.code == '200') {
  375. uni.showToast({
  376. title: zjres.msg,
  377. icon: 'none',
  378. duration: 2000
  379. });
  380. this.querylist();
  381. } else {
  382. uni.showToast({
  383. title: zjres.msg,
  384. icon: 'none',
  385. });
  386. }
  387. break;
  388. case "大家财险":
  389. let djres = await this.$http.post('/api/dajia/verifyPayment', {
  390. companyId: id
  391. });
  392. if (djres.code == '200') {
  393. uni.showToast({
  394. title: djres.msg,
  395. icon: 'none',
  396. duration: 2000
  397. });
  398. this.querylist();
  399. } else {
  400. uni.showToast({
  401. title: djres.msg,
  402. icon: 'none',
  403. });
  404. }
  405. break;
  406. case "华泰财险":
  407. let htres = await this.$http.post('/order/huaTaiApi/paymentEnquiry', {
  408. companyId: id
  409. });
  410. if (htres.code == '200') {
  411. uni.showToast({
  412. title: htres.msg,
  413. icon: 'none',
  414. duration: 2000
  415. });
  416. this.querylist();
  417. } else {
  418. uni.showToast({
  419. title: htres.msg,
  420. icon: 'none',
  421. });
  422. }
  423. break;
  424. case "永诚财险":
  425. let ycres = await this.$http.get(
  426. '/api/yongCheng/orderStatusBySuborderId/' + id);
  427. if (ycres.code == '200') {
  428. uni.showToast({
  429. title: ycres.msg,
  430. icon: 'none',
  431. duration: 2000
  432. });
  433. this.querylist();
  434. } else {
  435. uni.showToast({
  436. title: ycres.msg,
  437. icon: 'none',
  438. });
  439. }
  440. break;
  441. case "国任财险":
  442. let grres = await this.$http.post('/api/guoRen/updateOrderInfo', {
  443. companyId: id
  444. });
  445. if (grres.code == '200') {
  446. uni.showToast({
  447. title: grres.msg,
  448. icon: 'none',
  449. duration: 2000
  450. });
  451. this.querylist();
  452. } else {
  453. uni.showToast({
  454. title: grres.msg,
  455. icon: 'none',
  456. });
  457. }
  458. break;
  459. case "中煤财险":
  460. let zmres = await this.$http.post('/order/zhongMeiApi/paymentEnquiry', {
  461. companyId: id
  462. });
  463. if (zmres.code == '200') {
  464. uni.showToast({
  465. title: zmres.msg,
  466. icon: 'none',
  467. duration: 2000
  468. });
  469. this.querylist();
  470. } else {
  471. uni.showToast({
  472. title: zmres.msg,
  473. icon: 'none',
  474. });
  475. }
  476. break;
  477. case "渤海财险":
  478. let bhres = await this.$http.post('/order/boHaiApi/getOrderDetail', {
  479. companyId: id
  480. });
  481. if (bhres.code == '200') {
  482. uni.showToast({
  483. title: bhres.msg,
  484. icon: 'none',
  485. duration: 2000
  486. });
  487. this.querylist();
  488. } else {
  489. uni.showToast({
  490. title: bhres.msg,
  491. icon: 'none',
  492. });
  493. }
  494. break;
  495. default:
  496. let pythonres = await this.$http.post('/insurance/crawler/verifyPayment', {
  497. subOrderNo: id
  498. });
  499. if (pythonres.code == '200') {
  500. uni.showToast({
  501. title: pythonres.msg,
  502. icon: 'none',
  503. duration: 2000
  504. });
  505. this.querylist();
  506. } else {
  507. uni.showToast({
  508. title: pythonres.msg,
  509. icon: 'none',
  510. });
  511. }
  512. break;
  513. }
  514. },
  515. init() {
  516. this.sublist = this.sublist.map(val => {
  517. val.checked = false;
  518. return val;
  519. })
  520. }
  521. }
  522. }
  523. </script>
  524. <style>
  525. page {
  526. background: #f2f2f2;
  527. }
  528. </style>
  529. <style lang="scss" scoped>
  530. .page {
  531. min-height: calc(100vh - 44px);
  532. background-color: #F8FAFE;
  533. padding: 16px 16px 30px 16px;
  534. }
  535. .car-header {
  536. width: 100%;
  537. height: auto;
  538. background: #FFFFFF;
  539. box-shadow: 0px 4px 10px 0px #DAE3F4;
  540. border-radius: 6px;
  541. padding: 8px 15px;
  542. .head-name {
  543. margin-left: 20px;
  544. &>text {
  545. font-weight: bold;
  546. font-size: 15px;
  547. color: #232832;
  548. }
  549. .name1 text {
  550. font-size: 14px;
  551. font-weight: bold;
  552. color: #333333;
  553. }
  554. }
  555. }
  556. .sub-orders {
  557. width: 100%;
  558. background: white;
  559. border-radius: 6px;
  560. padding: 10px;
  561. box-shadow: 0px 4px 10px 0px #DAE3F4;
  562. border-radius: 6px;
  563. margin-bottom: 10px;
  564. .status {
  565. padding-bottom: 8px;
  566. border-bottom: 1px solid #EFEFEF;
  567. >text {
  568. color: #FF5600;
  569. font-size: 16px;
  570. font-weight: bold;
  571. }
  572. }
  573. .orders-centre {
  574. padding: 6px 0;
  575. border-bottom: 1px solid #EFEFEF;
  576. >text {
  577. font-size: 15px;
  578. font-weight: bold;
  579. color: #232832;
  580. }
  581. .sum {
  582. view {
  583. width: 50%;
  584. color: #2D4D89;
  585. font-size: 13px;
  586. }
  587. }
  588. }
  589. .orders-below {
  590. padding-top: 10px;
  591. }
  592. }
  593. .strong {
  594. font-weight: bold;
  595. }
  596. .arrivalNavigations {
  597. font-size: 14px;
  598. color: rgba(51, 51, 51, 0.8);
  599. margin-right: auto;
  600. position: relative;
  601. }
  602. //从这里开始是弹出框的样式 不需要搜索框的 前面样式都不用加
  603. .arrivalNavigation {
  604. width: 250rpx;
  605. position: absolute;
  606. left: -10px;
  607. top: 30px;
  608. z-index: 99;
  609. .sideNavigation {
  610. width: 80px;
  611. background-color: #fff;
  612. box-shadow: 0px 4px 10px 0px #DAE3F4;
  613. border-radius: 10rpx;
  614. .sideNavigation-btn>view {
  615. text-align: center;
  616. font-size: 14px;
  617. color: #333333;
  618. text-align: center;
  619. padding: 6px 0;
  620. border-bottom: 1px solid #EFEFEF;
  621. &:last-child {
  622. border: none;
  623. }
  624. }
  625. }
  626. .d4 {
  627. width: 0;
  628. height: 0;
  629. margin-left: 22px;
  630. margin-top: -20rpx;
  631. border-width: 20rpx;
  632. border-style: solid;
  633. border-color: transparent #fff transparent transparent;
  634. transform: rotate(90deg);
  635. /*顺时针旋转90°*/
  636. }
  637. }
  638. </style>