小牛集卡web 客户端
chenwei
8 days ago 2621fec0d7ce1db0a2302c6c1ac0f08b36ae8a63
commit | author | age
423585 1 <template>
C 2   <div class="fronthome-top">
3     <div class="fronthome-main">
4       <div class="enquiry-title">
5         <div class="letter">询价下单</div>
6         <div class="top-middle">
7           <i class="iconfont icon-express-package-full"></i>
8           <h4>物品 :</h4>
9           <span>{{ allOrder.TransportGoods }}</span>
10         </div>
11         <div class="top-right">
12           <div>
13             <img src="../../../public/img/index/gouxuan.svg" alt="" />
14             <span>港口达</span>
15           </div>
16           <div>
17             <img src="../../../public/img/index/gouxuan2.svg" alt="" />
e41faf 18             <span>{{ allOrder.OrderType == 1 ? "我要装" : "我要卸" }}</span>
423585 19           </div>
C 20         </div>
21       </div>
22       <div>
23         <div class="title-one">
24           <div>
25             <i class="iconfont icon-listmatou"></i>
26             <span class="bar">提箱地:</span>
27             <span>{{ allOrder.PickPlaceName }}</span>
28           </div>
29           <div>
30             <i class="iconfont icon-huoyunzhandizhiguanli"></i>
31             <span>{{ allOrder.OrderAddress }}</span>
32           </div>
33           <div>
34             <i class="iconfont icon-components-full"></i>
35             <span class="bar">还箱地:</span>
36             <span>{{ allOrder.ReturnPlaceName }}</span>
37           </div>
38         </div>
39         <div class="show-main">
40           <div class="table-title">
41             <span class="box">箱型</span>
42             <span class="time">到达时间</span>
43             <span class="type">类型</span>
44             <span class="info">箱子信息</span>
7f5659 45             <span class="number">数量(车)</span>
e41faf 46             <span style="width: 33px">箱量</span>
7f5659 47             <!-- <span class="number">箱量</span> -->
e41faf 48             <span style="width: 50px">价格</span>
C 49             <span style="width: 195px"></span>
423585 50           </div>
C 51
52           <box-type :orderall="allOrder" @pinche="acceptPin"></box-type>
53         </div>
54
55         <div class="inquiry-foot">
56           <div>
57             <img src="../../../public/img/index/tuidan.svg" alt="" />
58             <span>箱子具体信息[智能输入]</span>
59           </div>
60           <div>
61             <el-button
62               icon="el-icon-plus"
63               plain
64               size="small"
65               @click="addBoxDialog = true"
66               >新增箱子</el-button
67             >
68           </div>
69           <div>
e41faf 70             <span>额外:¥{{extraMoney}}</span>
C 71               <span>+运输:¥{{carriage}}=</span>
72             <span>合计:¥{{ totalMoney }}</span>
423585 73             <button @click="placeOrder">
C 74               <i class="iconfont icon-gouxuan"></i> 下 单
75             </button>
76           </div>
77         </div>
78       </div>
79     </div>
80
e41faf 81     <el-dialog title="新增箱子" :visible.sync="addBoxDialog" width="300px">
2621fe 82       <add-box @newbox="acceptNewBox"></add-box>
423585 83     </el-dialog>
C 84     <!-- 下单的弹窗 -->
85     <el-dialog
86       title="下单"
87       :visible.sync="orderDialog"
88       width="40%"
89       :before-close="handleClose"
90       class="place-order"
91     >
92       <div class="order">
93         <div class="title">
94           <span>支付订单</span>
e41faf 95           <span>合计¥{{ allOrder.TotalAmount }}</span>
423585 96         </div>
C 97         <div class="my">
98           <i class="el-icon-s-custom"></i>
99           <span>我的小牛币:{{ CusSurplusAmount }}</span>
100         </div>
101         <div class="sale">
102           <div><span>优惠:</span> <span>200.00</span></div>
103           <div>实付:<span>97800.00</span></div>
104         </div>
105         <div class="money-type">
106           <el-radio-group v-model="radio">
107             <el-radio :label="3">
108               <div class="xiaoniu">小牛币</div>
109             </el-radio>
110             <el-radio :label="6">
111               <div class="wx">
112                 <i class="iconfont icon-weixin"></i>
113                 <span> 微信支付</span>
114               </div>
115             </el-radio>
116           </el-radio-group>
117         </div>
118
119         <div class="linkman">
120           <div class="linkman-title">
121             <i class="el-icon-phone-outline"></i>
122             <span>联系方式</span>
123           </div>
124           <div class="link-man">
125             <div class="link-number">
126               <div class="man">
127                 <span>联系人:</span
128                 ><el-input
129                   v-model="portOrderSave.OrderContacts"
130                   clearable
131                 ></el-input>
132               </div>
133               <div class="phone">
134                 <span>联系电话:</span>
135                 <el-input
136                   v-model="portOrderSave.OrderContactsPhone"
137                   clearable
138                 ></el-input>
139               </div>
140             </div>
141             <div class="link-ramark">
142               <span>备注:</span
143               ><el-input
144                 type="textarea"
145                 v-model="portOrderSave.OrderRemark"
146               ></el-input>
147             </div>
148           </div>
149
7f5659 150           <!-- <div class="linkman-title shunfeng" v-if="isShowShun">
423585 151             <div>
C 152               <i class="iconfont icon-wuliuxinxi"></i>
153               <span>顺风达</span>
154               <span class="remind">注:顺风达评车总额将不进入支付总额内。</span>
155             </div>
156             <div class="money">
157               <span>拼车价:{{routerPrice}}</span>
158             </div>
159           </div>
160           <div class="link-man"  v-if="isShowShun">
161             <div class="link-number">
162               <div class="man shunfeng-time">
163                 <span>拼单截止时间:</span>
164                 <el-date-picker
165                   v-model="endtime"
166                   type="datetime"
167                   placeholder="选择日期时间"
168                 >
169                 </el-date-picker>
170               </div>
171             </div>
172             <div class="link-ramark shun-remark">
173               <span>备注:</span><el-input type="textarea" v-model="orderRemark"></el-input>
174             </div>
7f5659 175           </div> -->
423585 176         </div>
C 177         <div class="quan">我的优惠券</div>
178         <div class="reduce">
179           <div class="ticket" v-for="(item, index) in 8" :key="index">
180             <div class="money">{{ item }}<span>元</span></div>
181             <div class="text">优惠抵用券</div>
182           </div>
183         </div>
184       </div>
185       <span slot="footer" class="dialog-footer">
186         <el-button @click="orderDialog = false">取 消</el-button>
187         <el-button type="primary" @click="orderSure">确 定</el-button>
188       </span>
189     </el-dialog>
190   </div>
191 </template>
192 <script>
193 import BoxType from "@/components/agopage/comment/BoxType.vue";
194 import AddBox from "@/components/agopage/comment/AddBox.vue";
195 export default {
196   data() {
197     return {
198       checked: false,
199       num: 1,
200       orderDialog: false,
201       radio: 3,
202       addBoxDialog: false,
203       allOrder: {},
204       portOrderSave: {
205         CityId: "",
206         OrderType: 1,
207         PickPlace: "",
208         ReturnPlace: "",
209         CaPositionLongitude: "",
210         CaPositionLatitude: "",
211         OrderContacts: "",
212         OrderContactsPhone: "",
213         OrderPayType: 0,
214         OrderUseCoupon: 0,
215         CouponIdentifier: "",
216         Goods: "",
217         OrderRemark: "",
218         OrderDetailed: [],
219       },
220       CusSurplusAmount: 0,
221       myCoupon: [],
e41faf 222       orderRemark: "",
C 223       endtime: "",
224       isShowShun: false,
225       routerPrice: 0,
226       pid: "",
227
423585 228     };
e41faf 229   },
C 230   computed:{
231       //计算运输费用
232       carriage(){
233         var count=0;
234         if(this.allOrder.tempOrderForms!=undefined){
235               for(var i =0;i<this.allOrder.tempOrderForms.length;i++){
236           count+=(this.allOrder.tempOrderForms[i].tempOrder.BaseMoney)*(this.allOrder.tempOrderForms[i].tempOrder.ContainerNub);
237         }
238         }
239          return count;
240         },
241         // 计算额外费用
242         extraMoney(){
243           var count=0;
244         if(this.allOrder.tempOrderForms!=undefined){
245               for(var i =0;i<this.allOrder.tempOrderForms.length;i++){
246                 if(this.allOrder.tempOrderForms[i].tempOrder.IsUrgent){
247                     count+=(this.allOrder.tempOrderForms[i].tempOrder.UrgentMoney)*(this.allOrder.tempOrderForms[i].tempOrder.ContainerNub);
248                 }
249         }
250         }
251          return count;
252         },
253         // 合计费用
254         totalMoney(){
255               var count=0;
256               var count1=0;
257         if(this.allOrder.tempOrderForms!=undefined){
258               for(var i =0;i<this.allOrder.tempOrderForms.length;i++){
259           count+=(this.allOrder.tempOrderForms[i].tempOrder.BaseMoney)*(this.allOrder.tempOrderForms[i].tempOrder.ContainerNub);
260         }
261         }
262         if(this.allOrder.tempOrderForms!=undefined){
263               for(var i =0;i<this.allOrder.tempOrderForms.length;i++){
264                 if(this.allOrder.tempOrderForms[i].tempOrder.IsUrgent){
265                     count1+=(this.allOrder.tempOrderForms[i].tempOrder.UrgentMoney)*(this.allOrder.tempOrderForms[i].tempOrder.ContainerNub);
266                 }
267         }
268         }
269         return count+count1;
270         },
423585 271   },
C 272   components: {
273     BoxType,
274     AddBox,
275   },
276   created() {
277     this.getTempOrder();
278   },
279   methods: {
2621fe 280     //接收添加新箱子传过来的值
C 281     acceptNewBox(e){
282         this.addBoxDialog = e;
283     },
423585 284     orderSure() {
C 285       console.log(this.allOrder);
286       this.portOrderSave.CityId = "5dc90c98-475e-4529-bb3a-c3010a82b0e1";
e41faf 287       this.portOrderSave.OrderType = this.allOrder.OrderType;
C 288       this.portOrderSave.PickPlace =
289         this.allOrder.tempOrderForms[0].tempOrder.PickPlace;
290       this.portOrderSave.ReturnPlace =
291         this.allOrder.tempOrderForms[0].tempOrder.ReturnPlace;
292       this.portOrderSave.CaPositionLongitude =
293         this.allOrder.OrderAddressLongitude;
294       this.portOrderSave.CaPositionLatitude =
295         this.allOrder.OrderAddressLatitude;
423585 296       this.portOrderSave.CaAdress = this.allOrder.OrderAddress;
e41faf 297       //订单联系人和联系带电话备注之类的进行双向绑定了 ,可以直接输入值
423585 298       this.portOrderSave.OrderPayType = 0;
C 299       this.portOrderSave.OrderUseCoupon = 0;
300       this.portOrderSave.Goods = this.allOrder.TransportGoods;
e41faf 301       // 保存箱子详情
423585 302       for (var i = 0; i < this.allOrder.tempOrderForms.length; i++) {
e41faf 303         //有几条数据
423585 304
e41faf 305         if (
C 306           this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer.length >
307           0
308         ) {
309           // 详情修改成对象后
423585 310
e41faf 311           var arr = [];
C 312           for (
313             var j = 0;
314             j <
315             this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer.length;
316             j++
317           ) {
318             arr.push({
319               BolCode:
320                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
321                   .BolCode,
322               TradeCode:
323                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
324                   .TradeCode,
423585 325
e41faf 326               ShipAgent:
C 327                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
328                   .ShipAgent,
329               ContainerOwner:
330                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
331                   .ContainerOwner,
332               ContainerNo:
333                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
334                   .ContainerNo,
423585 335
e41faf 336               BoxSeal:
C 337                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
338                   .BoxSeal,
339               Weight:
340                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
341                   .Weight,
342             });
7f5659 343
e41faf 344             //箱子信息
7f5659 345
e41faf 346             //         this.portOrderSave.OrderDetailed.orderDetaileCnters.push({
C 347
348             //   BolCode: this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j].BolCode,
349             //   TradeCode: this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j].TradeCode,
350
351             //   ShipAgent:this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j].ShipAgent,
352             //   ContainerOwner: this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j].ContainerOwner,
353             //   ContainerNo: this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j].ContainerNo,
354
355             //   BoxSeal:this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j].BoxSeal,
356             //     Weight: this.allOrder.tempOrderForms[i].tempOrder.Weight
357             // });
358           }
359           this.portOrderSave.OrderDetailed.push({
360             CtnerId: this.allOrder.tempOrderForms[i].tempOrder.Container.CntrId,
361             TempOrderId: this.allOrder.tempOrderForms[i].tempOrder.TempOrderID,
362             CtnerNub: this.allOrder.tempOrderForms[i].tempOrder.ContainerNub,
363             SelfBox: this.allOrder.tempOrderForms[i].tempOrder.SelfBox ? 1 : 0,
364
365             OdtaskIsUrgent: this.allOrder.tempOrderForms[i].tempOrder.IsUrgent
366               ? 1
367               : 0,
368             Defaultset: 0,
369             ArriveTime: this.allOrder.tempOrderForms[i].tempOrder.ArriveTime,
370             orderDetaileCnters: arr,
371           });
372         } else {
373           console.log("应该不会存在把");
374           //   this.portOrderSave.OrderDetailed.push({
375           //       CtnerId: this.allOrder.tempOrderForms[i].tempOrder.TempOrderID,
376           // CtnerNub: this.allOrder.tempOrderForms[i].tempOrder.ContainerNub,
377           // SelfBox: this.allOrder.tempOrderForms[i].tempOrder.SelfBox?1:0,
378
379           // OdtaskIsUrgent: this.allOrder.tempOrderForms[i].tempOrder.IsUrgent?1:0,
380
381           // Defaultset: 0,
382           //  IsCarPooling: this.allOrder.tempOrderForms[i].tempOrder.IsCarPooling?1:0,
383
384           //   Weight: this.allOrder.tempOrderForms[i].tempOrder.Weight,
385           //    EndTime: this.endtime,
386           //      OrderRemark: this.orderRemark
387           //   })
423585 388           //  this.portOrderSave.OrderDetailed=[];
C 389         }
390       }
e41faf 391       console.log(this.portOrderSave);
423585 392       this.getPortOrderSave(this.portOrderSave);
C 393       this.orderDialog = false;
394     },
395     //提交订单
e41faf 396     async getPortOrderSave(model) {
423585 397       await this.$axios
e41faf 398         .post("/api/Order/PortOrderSave", this.$qs.stringify(model))
423585 399         .then((res) => {
C 400           console.log(this.portOrderSave);
e41faf 401           if(res.data){
C 402             this.$message({
403               message:"下单成功",
404               type:"success"
405             });
406             this.$router.push("/order");
407           }
408           console.log(res);
423585 409         })
C 410         .catch((err) => {
411           console.log(err);
412         });
413     },
414     //获取临时订单
415     async getTempOrder() {
416       await this.$axios
417         .post("/api/Order/GetTempOrderAll")
418         .then((res) => {
419           // console.log(res);
420           let model = {};
421           model = res.data;
422           var orderinQiry = {
423             TempOrderID: "",
424             OdiqWeight: "",
425             OdiqTemperature: "",
426             OdiqLong: "",
427             OdiqWidth: "",
428             OdiqHeight: "",
429             OdiqRemarks: "",
430             OdiqGoods: "",
431           };
432           for (var i = 0; i < model.tempOrderForms.length; i++) {
433             model.tempOrderForms[i].orderData = Object.assign({}, orderinQiry);
e41faf 434             if (model.tempOrderForms[i].tempOrder.IsCarPooling == 1) {
423585 435               this.isShowShun = true;
C 436             }
437           }
438           this.allOrder = model;
439           console.log(this.allOrder);
440         })
441         .catch((err) => {
442           console.log(err);
443         });
444     },
445     handleChange(value) {
446       console.log(value);
447     },
448     //接收拼车的信息
e41faf 449     acceptPin(e) {
C 450       if (e == "") {
451         this.pid = "";
423585 452         this.isShowShun = false;
e41faf 453       } else {
423585 454         this.pid = e;
e41faf 455         this.isShowShun = true;
423585 456       }
C 457     },
458     placeOrder() {
7f5659 459       console.log(this.allOrder);
423585 460       this.getPayCaptal();
C 461       this.getMyCoupon();
e41faf 462       // 下单前要判断信息是否完善,价格是否为0
C 463       for(var i =0;i<this.allOrder.tempOrderForms.length;i++){
464         if(this.allOrder.tempOrderForms[i].tempOrder.BaseMoney==0){
465            this.$message.error("请先询价");
466            return;
467         }
468         if(this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer.length==0){
469            this.$message.error("请完善箱子信息");
470            return;
471         }
423585 472       }
e41faf 473       // console.log(totalMoney);
C 474       console.log(this.totalMoney);
475
476       //是否有顺风达
477       // if(this.pid!=""){
478       //       this.getRoutePrice({
479       //   PickPlace:this.allOrder.tempOrderForms[0].tempOrder.PickPlace,
480       //   AddressLongitude:this.allOrder.OrderAddressLongitude,
481       //   AddressLatitude:this.allOrder.OrderAddressLatitude,
482       //   ReturnPlace:this.allOrder.tempOrderForms[0].tempOrder.ReturnPlace,
483       //   CtnerId:this.pid,
484       //   TransType:1,
485       // })
486       // }
487
423585 488       // this.getTempOrder();
C 489       this.orderDialog = true;
490     },
491     //获取运输价格
492     async getRoutePrice(model) {
493       await this.$axios
e41faf 494         .post(
C 495           "/api/Order/GetTransPortationRoutePrice",
496           this.$qs.stringify(model)
497         )
423585 498         .then((res) => {
e41faf 499           this.routerPrice = res.data;
423585 500         })
C 501         .catch((err) => {
502           console.log(err);
503         });
504     },
505     //获取余额和联系人
506     async getPayCaptal() {
507       await this.$axios
508         .post("/api/Order/GetMyPayCaptal")
509         .then((res) => {
510           this.CusSurplusAmount = res.data.CusSurplusAmount;
511           this.portOrderSave.OrderContacts = res.data.Contacts;
512           this.portOrderSave.OrderContactsPhone = res.data.ContactPhone;
513         })
514         .catch((err) => {
515           console.log(err);
516         });
517     },
518     //获取优惠券
519     async getMyCoupon() {
520       await this.$axios
521         .post("/api/Order/GetMyCoupon")
522         .then((res) => {
523           this.myCoupon = res.data;
524         })
525         .catch((err) => {
526           console.log(err);
527         });
528     },
529     handleClose(done) {
530       this.$confirm("确认关闭?")
531         .then((_) => {
532           done();
533         })
534         .catch((_) => {});
535     },
536   },
537 };
538 </script>
539 <style lang="less" scoped>
540 .fronthome-main {
541   display: block;
542   border: 1px solid #c3c3c3;
543   padding: 10px 20px;
544   border-radius: 3px;
545   box-shadow: 2px 2px 8px #c3c3c3;
546   box-sizing: border-box;
547 }
548 .fronthome-top {
549   margin-top: 20px;
550 }
551 .enquiry-title,
552 .title-one,
553 .table-title,
554 .show-data,
555 .inquiry-foot {
556   display: flex;
557   justify-content: space-between;
558 }
559 .enquiry-title {
560   padding-bottom: 10px;
561   font-size: 14px;
562 }
563 .letter {
564   color: #f6a438;
565 }
566 .title-one {
567   padding-top: 10px;
568   padding-bottom: 20px;
569   border-top: 1px solid #ecebeb;
570   font-size: 14px;
571   color: #888686;
572 }
573 .show-main {
574   padding-bottom: 10px;
575   border-bottom: 1px solid #e7e7e7;
576 }
577 .inquiry-foot {
578   padding: 10px 20px;
579 }
580 .top-middle,
581 .top-right {
582   display: flex;
583   align-items: center;
584 }
585 .top-middle i {
586   font-size: 20px;
587   color: #c3c3c3;
588   margin-right: 5px;
589 }
590 .top-middle span {
591   font-size: 12px;
592   color: #c3c3c3;
593 }
594 .top-right div {
595   display: flex;
596   align-items: center;
597   margin-right: 6px;
598 }
599 .top-right div span {
600   margin-left: 6px;
601 }
602 .title-one i {
603   font-size: 25px;
604   margin-right: 6px;
605 }
606 .title-one div {
607   display: flex;
608   align-items: center;
609 }
610 .title-one .bar {
611   font-size: 16px;
612   font-weight: bold;
613   color: #000;
614   margin-right: 10px;
615 }
616 .table-title {
617   padding-bottom: 10px;
618   color: #868686;
619 }
620 .table-title span {
621   text-align: center;
622 }
623 .table-title .box {
7f5659 624   width: 157px;
423585 625 }
C 626 .table-title .time {
627   width: 220px;
628 }
629 .table-title .weight {
630   width: 65px;
631 }
632 .table-title .info {
7f5659 633   width: 157px;
423585 634 }
C 635 .table-title .number {
636   width: 100px;
637 }
638 .table-title .type {
639   width: 82px;
640 }
641 .table-title .money {
642   width: 200px;
643   text-align: left;
644 }
645 .show-data .one,
646 .show-data .box {
647   border: 1px solid #f3f3f3;
648   height: 40px;
649   line-height: 40px;
650   padding: 0 5px;
651   border-radius: 3px;
652   color: #b2b2b2;
653   font-size: 14px;
654 }
655 .show-data .one .gp {
656   font-weight: bold;
657   font-size: 16px;
658   margin: 0 3px;
659 }
660 .show-data .money {
661   display: flex;
662   align-items: center;
663   width: 200px;
664   justify-content: space-between;
665 }
666 .show-data .weight {
667   /deep/.el-input {
668     width: 65px;
669   }
670 }
671 .show-data .type {
672   display: flex;
673   flex-direction: column;
674 }
675 .show-data .number {
676   /deep/.el-input-number {
677     width: 100px;
678   }
679   /deep/.el-input-number .el-input__inner {
680     padding: 0 25px;
681   }
682   /deep/.el-input-number__increase {
683     width: 25px;
684   }
685   /deep/.el-input-number__decrease {
686     width: 25px;
687   }
688 }
689 .show-data .money div:first-child {
690   color: #d9001b;
691   font-size: 14px;
692 }
693 .show-data .money div:last-child button {
694   padding: 7px 12px;
695   color: #fff;
696   background-color: #f59a23;
697   font-weight: bold;
698   border: none;
699   outline: none;
700   cursor: pointer;
701   border-radius: 6px;
702 }
703 .inquiry-foot div:first-child {
704   display: flex;
705   align-items: center;
706   color: #868686;
707 }
708 .inquiry-foot div:last-child {
709   display: flex;
710   align-items: center;
711   color: #d9001b;
712   font-weight: 550;
713 }
714 .inquiry-foot div:last-child button {
715   border: none;
716   outline: none;
717   padding: 8px 15px;
718   border-radius: 6px;
719   cursor: pointer;
720   background-color: #f59a23;
721   color: #fff;
722   font-weight: bold;
723   margin-left: 20px;
724 }
725 .inquiry-foot div:first-child span {
726   margin-left: 6px;
727   text-decoration: underline;
728 }
729
730 //弹窗样式
731 .order .title {
732   display: flex;
733   justify-content: space-between;
734 }
735 .order .title span:first-child {
736   color: #f59a23;
737 }
738 .order .title span:last-child {
739   color: #d9001b;
740   font-weight: bold;
741 }
742 .place-order {
743   font-size: 16px;
744 }
745 .place-order {
746   /deep/.el-dialog__body {
747     padding: 0 30px;
748   }
749 }
750 .order .my {
751   padding: 15px 0px;
752   display: flex;
753   justify-content: center;
754   color: #000;
755 }
756 .order .my i {
757   font-size: 20px;
758   margin-right: 10px;
759 }
760 .order .sale div {
761   text-align: center;
762   line-height: 30px;
763 }
764 .order .sale div:last-child {
765   color: #d9001b;
766   font-weight: bold;
767 }
768 .order .money-type {
769   padding: 10px 0;
770   /deep/.el-radio {
771     display: flex;
772     align-items: center;
773   }
774   /deep/.el-radio-group {
775     display: flex;
776     justify-content: center;
777   }
778 }
779 .money-type .xiaoniu,
780 .wx {
781   border: 1px solid #c3c3c3;
782   padding: 6px 20px;
783   border-radius: 6px;
784 }
785 .wx i {
786   color: #07c160;
787 }
788 .reduce {
789   display: flex;
790   padding: 10px 0;
791   border-top: 1px solid #e7e7e7;
792   justify-content: space-between;
793   flex-wrap: wrap;
794 }
795 .quan {
796   padding: 10px 0;
797   font-weight: bold;
798   color: #000;
799 }
800 .reduce .ticket {
801   border: 1px solid #d6d4d4;
802   border-radius: 6px;
803   display: flex;
804   margin-bottom: 10px;
805   // padding: 15px 30px;
806   box-shadow: 3px 3px 3px #d6d4d4;
807 }
808 .reduce .ticket .money {
809   font-weight: bold;
810   font-size: 18px;
811   border-right: 1px solid #c3c3c3;
812   padding: 10px 10px;
813 }
814 .reduce .ticket .text {
815   background-color: #f59a23;
816   color: #fff;
817   font-weight: bold;
818   padding: 10px 25px;
819   border-top-right-radius: 6px;
820   border-bottom-right-radius: 6px;
821 }
822 .link-number,
823 .link-ramark,
824 .man,
825 .phone {
826   display: flex;
827   align-items: center;
828 }
829 .link-number .man span {
830   width: 58px;
831 }
832 .link-number {
833   padding: 10px 0px;
834 }
835 .link-number .phone span {
836   margin-left: 10px;
837   width: 80px;
838 }
839 .link-number {
840   /deep/.el-input {
841     width: auto;
842   }
843 }
844 .link-ramark span {
845   width: 60px;
846 }
847 .linkman-title {
848   padding-bottom: 10px;
849   border-bottom: 1px solid #c3c3c3;
850 }
851 .linkman-title i {
852   margin-right: 10px;
853   font-size: 20px;
854 }
855 .linkman-title span {
856   font-size: 16px;
857 }
858 .linkman .shunfeng {
859   margin-top: 10px;
860   display: flex;
861   justify-content: space-between;
862 }
863 .linkman .shunfeng .remind {
864   font-size: 12px;
865   color: #f6a438;
866   margin-left: 20px;
867 }
868 .linkman .shunfeng .money {
869   color: #d9001b;
870 }
871 .link-number .shunfeng-time span {
872   width: 100px;
873 }
874 .shun-remark span {
875   width: 103px;
876   padding-right: 10px;
877   text-align: right;
878 }
879 </style>