小牛集卡web 客户端
chenwei
2021-06-08 e41faf1640e2e71febf4ba347a301e0c043b6ce9
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">
423585 82       <add-box></add-box>
C 83     </el-dialog>
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: {
280     orderSure() {
281       console.log(this.allOrder);
282       this.portOrderSave.CityId = "5dc90c98-475e-4529-bb3a-c3010a82b0e1";
e41faf 283       this.portOrderSave.OrderType = this.allOrder.OrderType;
C 284       this.portOrderSave.PickPlace =
285         this.allOrder.tempOrderForms[0].tempOrder.PickPlace;
286       this.portOrderSave.ReturnPlace =
287         this.allOrder.tempOrderForms[0].tempOrder.ReturnPlace;
288       this.portOrderSave.CaPositionLongitude =
289         this.allOrder.OrderAddressLongitude;
290       this.portOrderSave.CaPositionLatitude =
291         this.allOrder.OrderAddressLatitude;
423585 292       this.portOrderSave.CaAdress = this.allOrder.OrderAddress;
e41faf 293       //订单联系人和联系带电话备注之类的进行双向绑定了 ,可以直接输入值
423585 294       this.portOrderSave.OrderPayType = 0;
C 295       this.portOrderSave.OrderUseCoupon = 0;
296       this.portOrderSave.Goods = this.allOrder.TransportGoods;
e41faf 297       // 保存箱子详情
423585 298       for (var i = 0; i < this.allOrder.tempOrderForms.length; i++) {
e41faf 299         //有几条数据
423585 300
e41faf 301         if (
C 302           this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer.length >
303           0
304         ) {
305           // 详情修改成对象后
423585 306
e41faf 307           var arr = [];
C 308           for (
309             var j = 0;
310             j <
311             this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer.length;
312             j++
313           ) {
314             arr.push({
315               BolCode:
316                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
317                   .BolCode,
318               TradeCode:
319                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
320                   .TradeCode,
423585 321
e41faf 322               ShipAgent:
C 323                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
324                   .ShipAgent,
325               ContainerOwner:
326                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
327                   .ContainerOwner,
328               ContainerNo:
329                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
330                   .ContainerNo,
423585 331
e41faf 332               BoxSeal:
C 333                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
334                   .BoxSeal,
335               Weight:
336                 this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j]
337                   .Weight,
338             });
7f5659 339
e41faf 340             //箱子信息
7f5659 341
e41faf 342             //         this.portOrderSave.OrderDetailed.orderDetaileCnters.push({
C 343
344             //   BolCode: this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j].BolCode,
345             //   TradeCode: this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j].TradeCode,
346
347             //   ShipAgent:this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j].ShipAgent,
348             //   ContainerOwner: this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j].ContainerOwner,
349             //   ContainerNo: this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j].ContainerNo,
350
351             //   BoxSeal:this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer[j].BoxSeal,
352             //     Weight: this.allOrder.tempOrderForms[i].tempOrder.Weight
353             // });
354           }
355           this.portOrderSave.OrderDetailed.push({
356             CtnerId: this.allOrder.tempOrderForms[i].tempOrder.Container.CntrId,
357             TempOrderId: this.allOrder.tempOrderForms[i].tempOrder.TempOrderID,
358             CtnerNub: this.allOrder.tempOrderForms[i].tempOrder.ContainerNub,
359             SelfBox: this.allOrder.tempOrderForms[i].tempOrder.SelfBox ? 1 : 0,
360
361             OdtaskIsUrgent: this.allOrder.tempOrderForms[i].tempOrder.IsUrgent
362               ? 1
363               : 0,
364             Defaultset: 0,
365             ArriveTime: this.allOrder.tempOrderForms[i].tempOrder.ArriveTime,
366             orderDetaileCnters: arr,
367           });
368         } else {
369           console.log("应该不会存在把");
370           //   this.portOrderSave.OrderDetailed.push({
371           //       CtnerId: this.allOrder.tempOrderForms[i].tempOrder.TempOrderID,
372           // CtnerNub: this.allOrder.tempOrderForms[i].tempOrder.ContainerNub,
373           // SelfBox: this.allOrder.tempOrderForms[i].tempOrder.SelfBox?1:0,
374
375           // OdtaskIsUrgent: this.allOrder.tempOrderForms[i].tempOrder.IsUrgent?1:0,
376
377           // Defaultset: 0,
378           //  IsCarPooling: this.allOrder.tempOrderForms[i].tempOrder.IsCarPooling?1:0,
379
380           //   Weight: this.allOrder.tempOrderForms[i].tempOrder.Weight,
381           //    EndTime: this.endtime,
382           //      OrderRemark: this.orderRemark
383           //   })
423585 384           //  this.portOrderSave.OrderDetailed=[];
C 385         }
386       }
e41faf 387       console.log(this.portOrderSave);
423585 388       this.getPortOrderSave(this.portOrderSave);
C 389       this.orderDialog = false;
390     },
391     //提交订单
e41faf 392     async getPortOrderSave(model) {
423585 393       await this.$axios
e41faf 394         .post("/api/Order/PortOrderSave", this.$qs.stringify(model))
423585 395         .then((res) => {
C 396           console.log(this.portOrderSave);
e41faf 397           if(res.data){
C 398             this.$message({
399               message:"下单成功",
400               type:"success"
401             });
402             this.$router.push("/order");
403           }
404           console.log(res);
423585 405         })
C 406         .catch((err) => {
407           console.log(err);
408         });
409     },
410     //获取临时订单
411     async getTempOrder() {
412       await this.$axios
413         .post("/api/Order/GetTempOrderAll")
414         .then((res) => {
415           // console.log(res);
416           let model = {};
417           model = res.data;
418           var orderinQiry = {
419             TempOrderID: "",
420             OdiqWeight: "",
421             OdiqTemperature: "",
422             OdiqLong: "",
423             OdiqWidth: "",
424             OdiqHeight: "",
425             OdiqRemarks: "",
426             OdiqGoods: "",
427           };
428           for (var i = 0; i < model.tempOrderForms.length; i++) {
429             model.tempOrderForms[i].orderData = Object.assign({}, orderinQiry);
e41faf 430             if (model.tempOrderForms[i].tempOrder.IsCarPooling == 1) {
423585 431               this.isShowShun = true;
C 432             }
433           }
434           this.allOrder = model;
435           console.log(this.allOrder);
436         })
437         .catch((err) => {
438           console.log(err);
439         });
440     },
441     handleChange(value) {
442       console.log(value);
443     },
444     //接收拼车的信息
e41faf 445     acceptPin(e) {
C 446       if (e == "") {
447         this.pid = "";
423585 448         this.isShowShun = false;
e41faf 449       } else {
423585 450         this.pid = e;
e41faf 451         this.isShowShun = true;
423585 452       }
C 453     },
454     placeOrder() {
7f5659 455       console.log(this.allOrder);
423585 456       this.getPayCaptal();
C 457       this.getMyCoupon();
e41faf 458       // 下单前要判断信息是否完善,价格是否为0
C 459       for(var i =0;i<this.allOrder.tempOrderForms.length;i++){
460         if(this.allOrder.tempOrderForms[i].tempOrder.BaseMoney==0){
461            this.$message.error("请先询价");
462            return;
463         }
464         if(this.allOrder.tempOrderForms[i].tempOrder.TempOrderContainer.length==0){
465            this.$message.error("请完善箱子信息");
466            return;
467         }
423585 468       }
e41faf 469       // console.log(totalMoney);
C 470       console.log(this.totalMoney);
471
472       //是否有顺风达
473       // if(this.pid!=""){
474       //       this.getRoutePrice({
475       //   PickPlace:this.allOrder.tempOrderForms[0].tempOrder.PickPlace,
476       //   AddressLongitude:this.allOrder.OrderAddressLongitude,
477       //   AddressLatitude:this.allOrder.OrderAddressLatitude,
478       //   ReturnPlace:this.allOrder.tempOrderForms[0].tempOrder.ReturnPlace,
479       //   CtnerId:this.pid,
480       //   TransType:1,
481       // })
482       // }
483
423585 484       // this.getTempOrder();
C 485       this.orderDialog = true;
486     },
487     //获取运输价格
488     async getRoutePrice(model) {
489       await this.$axios
e41faf 490         .post(
C 491           "/api/Order/GetTransPortationRoutePrice",
492           this.$qs.stringify(model)
493         )
423585 494         .then((res) => {
e41faf 495           this.routerPrice = res.data;
423585 496         })
C 497         .catch((err) => {
498           console.log(err);
499         });
500     },
501     //获取余额和联系人
502     async getPayCaptal() {
503       await this.$axios
504         .post("/api/Order/GetMyPayCaptal")
505         .then((res) => {
506           this.CusSurplusAmount = res.data.CusSurplusAmount;
507           this.portOrderSave.OrderContacts = res.data.Contacts;
508           this.portOrderSave.OrderContactsPhone = res.data.ContactPhone;
509         })
510         .catch((err) => {
511           console.log(err);
512         });
513     },
514     //获取优惠券
515     async getMyCoupon() {
516       await this.$axios
517         .post("/api/Order/GetMyCoupon")
518         .then((res) => {
519           this.myCoupon = res.data;
520         })
521         .catch((err) => {
522           console.log(err);
523         });
524     },
525     handleClose(done) {
526       this.$confirm("确认关闭?")
527         .then((_) => {
528           done();
529         })
530         .catch((_) => {});
531     },
532   },
533 };
534 </script>
535 <style lang="less" scoped>
536 .fronthome-main {
537   display: block;
538   border: 1px solid #c3c3c3;
539   padding: 10px 20px;
540   border-radius: 3px;
541   box-shadow: 2px 2px 8px #c3c3c3;
542   box-sizing: border-box;
543 }
544 .fronthome-top {
545   margin-top: 20px;
546 }
547 .enquiry-title,
548 .title-one,
549 .table-title,
550 .show-data,
551 .inquiry-foot {
552   display: flex;
553   justify-content: space-between;
554 }
555 .enquiry-title {
556   padding-bottom: 10px;
557   font-size: 14px;
558 }
559 .letter {
560   color: #f6a438;
561 }
562 .title-one {
563   padding-top: 10px;
564   padding-bottom: 20px;
565   border-top: 1px solid #ecebeb;
566   font-size: 14px;
567   color: #888686;
568 }
569 .show-main {
570   padding-bottom: 10px;
571   border-bottom: 1px solid #e7e7e7;
572 }
573 .inquiry-foot {
574   padding: 10px 20px;
575 }
576 .top-middle,
577 .top-right {
578   display: flex;
579   align-items: center;
580 }
581 .top-middle i {
582   font-size: 20px;
583   color: #c3c3c3;
584   margin-right: 5px;
585 }
586 .top-middle span {
587   font-size: 12px;
588   color: #c3c3c3;
589 }
590 .top-right div {
591   display: flex;
592   align-items: center;
593   margin-right: 6px;
594 }
595 .top-right div span {
596   margin-left: 6px;
597 }
598 .title-one i {
599   font-size: 25px;
600   margin-right: 6px;
601 }
602 .title-one div {
603   display: flex;
604   align-items: center;
605 }
606 .title-one .bar {
607   font-size: 16px;
608   font-weight: bold;
609   color: #000;
610   margin-right: 10px;
611 }
612 .table-title {
613   padding-bottom: 10px;
614   color: #868686;
615 }
616 .table-title span {
617   text-align: center;
618 }
619 .table-title .box {
7f5659 620   width: 157px;
423585 621 }
C 622 .table-title .time {
623   width: 220px;
624 }
625 .table-title .weight {
626   width: 65px;
627 }
628 .table-title .info {
7f5659 629   width: 157px;
423585 630 }
C 631 .table-title .number {
632   width: 100px;
633 }
634 .table-title .type {
635   width: 82px;
636 }
637 .table-title .money {
638   width: 200px;
639   text-align: left;
640 }
641 .show-data .one,
642 .show-data .box {
643   border: 1px solid #f3f3f3;
644   height: 40px;
645   line-height: 40px;
646   padding: 0 5px;
647   border-radius: 3px;
648   color: #b2b2b2;
649   font-size: 14px;
650 }
651 .show-data .one .gp {
652   font-weight: bold;
653   font-size: 16px;
654   margin: 0 3px;
655 }
656 .show-data .money {
657   display: flex;
658   align-items: center;
659   width: 200px;
660   justify-content: space-between;
661 }
662 .show-data .weight {
663   /deep/.el-input {
664     width: 65px;
665   }
666 }
667 .show-data .type {
668   display: flex;
669   flex-direction: column;
670 }
671 .show-data .number {
672   /deep/.el-input-number {
673     width: 100px;
674   }
675   /deep/.el-input-number .el-input__inner {
676     padding: 0 25px;
677   }
678   /deep/.el-input-number__increase {
679     width: 25px;
680   }
681   /deep/.el-input-number__decrease {
682     width: 25px;
683   }
684 }
685 .show-data .money div:first-child {
686   color: #d9001b;
687   font-size: 14px;
688 }
689 .show-data .money div:last-child button {
690   padding: 7px 12px;
691   color: #fff;
692   background-color: #f59a23;
693   font-weight: bold;
694   border: none;
695   outline: none;
696   cursor: pointer;
697   border-radius: 6px;
698 }
699 .inquiry-foot div:first-child {
700   display: flex;
701   align-items: center;
702   color: #868686;
703 }
704 .inquiry-foot div:last-child {
705   display: flex;
706   align-items: center;
707   color: #d9001b;
708   font-weight: 550;
709 }
710 .inquiry-foot div:last-child button {
711   border: none;
712   outline: none;
713   padding: 8px 15px;
714   border-radius: 6px;
715   cursor: pointer;
716   background-color: #f59a23;
717   color: #fff;
718   font-weight: bold;
719   margin-left: 20px;
720 }
721 .inquiry-foot div:first-child span {
722   margin-left: 6px;
723   text-decoration: underline;
724 }
725
726 //弹窗样式
727 .order .title {
728   display: flex;
729   justify-content: space-between;
730 }
731 .order .title span:first-child {
732   color: #f59a23;
733 }
734 .order .title span:last-child {
735   color: #d9001b;
736   font-weight: bold;
737 }
738 .place-order {
739   font-size: 16px;
740 }
741 .place-order {
742   /deep/.el-dialog__body {
743     padding: 0 30px;
744   }
745 }
746 .order .my {
747   padding: 15px 0px;
748   display: flex;
749   justify-content: center;
750   color: #000;
751 }
752 .order .my i {
753   font-size: 20px;
754   margin-right: 10px;
755 }
756 .order .sale div {
757   text-align: center;
758   line-height: 30px;
759 }
760 .order .sale div:last-child {
761   color: #d9001b;
762   font-weight: bold;
763 }
764 .order .money-type {
765   padding: 10px 0;
766   /deep/.el-radio {
767     display: flex;
768     align-items: center;
769   }
770   /deep/.el-radio-group {
771     display: flex;
772     justify-content: center;
773   }
774 }
775 .money-type .xiaoniu,
776 .wx {
777   border: 1px solid #c3c3c3;
778   padding: 6px 20px;
779   border-radius: 6px;
780 }
781 .wx i {
782   color: #07c160;
783 }
784 .reduce {
785   display: flex;
786   padding: 10px 0;
787   border-top: 1px solid #e7e7e7;
788   justify-content: space-between;
789   flex-wrap: wrap;
790 }
791 .quan {
792   padding: 10px 0;
793   font-weight: bold;
794   color: #000;
795 }
796 .reduce .ticket {
797   border: 1px solid #d6d4d4;
798   border-radius: 6px;
799   display: flex;
800   margin-bottom: 10px;
801   // padding: 15px 30px;
802   box-shadow: 3px 3px 3px #d6d4d4;
803 }
804 .reduce .ticket .money {
805   font-weight: bold;
806   font-size: 18px;
807   border-right: 1px solid #c3c3c3;
808   padding: 10px 10px;
809 }
810 .reduce .ticket .text {
811   background-color: #f59a23;
812   color: #fff;
813   font-weight: bold;
814   padding: 10px 25px;
815   border-top-right-radius: 6px;
816   border-bottom-right-radius: 6px;
817 }
818 .link-number,
819 .link-ramark,
820 .man,
821 .phone {
822   display: flex;
823   align-items: center;
824 }
825 .link-number .man span {
826   width: 58px;
827 }
828 .link-number {
829   padding: 10px 0px;
830 }
831 .link-number .phone span {
832   margin-left: 10px;
833   width: 80px;
834 }
835 .link-number {
836   /deep/.el-input {
837     width: auto;
838   }
839 }
840 .link-ramark span {
841   width: 60px;
842 }
843 .linkman-title {
844   padding-bottom: 10px;
845   border-bottom: 1px solid #c3c3c3;
846 }
847 .linkman-title i {
848   margin-right: 10px;
849   font-size: 20px;
850 }
851 .linkman-title span {
852   font-size: 16px;
853 }
854 .linkman .shunfeng {
855   margin-top: 10px;
856   display: flex;
857   justify-content: space-between;
858 }
859 .linkman .shunfeng .remind {
860   font-size: 12px;
861   color: #f6a438;
862   margin-left: 20px;
863 }
864 .linkman .shunfeng .money {
865   color: #d9001b;
866 }
867 .link-number .shunfeng-time span {
868   width: 100px;
869 }
870 .shun-remark span {
871   width: 103px;
872   padding-right: 10px;
873   text-align: right;
874 }
875 </style>