subOrders.vue 16 KB

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