代码提交

src/assets/css/base.less

@@ -18,7 +18,7 @@ html,body{height:100%;width:100%;}
 html{font-size:62.5%;}
 
 body{-webkit-text-size-adjust:none;
-    // -webkit-user-select:none;
+	//-webkit-user-select:none;
 }
 
 body{background-attachment:fixed;font-size: 1.4rem;font-family:"Helvetica";}
@@ -62,14 +62,14 @@ select{-webkit-appearance:none;border: none;font-size: 1.4rem;}
 
 /*字体*/
 .f(@value:1.5rem){
-	font-size:@value;	
+	font-size:@value;
 }
 .fw(@value:100){
-	font-weight:@value;	
+	font-weight:@value;
 }
 
 .ff(@value:icon){
-	font-family:@value;	
+	font-family:@value;
 }
 
 .ls(@value:1px){
@@ -77,7 +77,7 @@ select{-webkit-appearance:none;border: none;font-size: 1.4rem;}
 }
 
 .lh(@value:2rem;){
-	line-height:@value;	
+	line-height:@value;
 }
 
 /*布局位置*/
@@ -144,7 +144,7 @@ select{-webkit-appearance:none;border: none;font-size: 1.4rem;}
 .p(@value:1rem){
 	padding:@value;
 }
-.mc{margin: 0 auto;} 
+.mc{margin: 0 auto;}
 
 .rnd(@value:0.5rem){
 	border-radius: @value;
@@ -152,7 +152,7 @@ select{-webkit-appearance:none;border: none;font-size: 1.4rem;}
 
 .box{display: box; display: -webkit-box;}
 .flex(@value:1){
-	-webkit-box-flex: @value; 
+	-webkit-box-flex: @value;
 	box-flex: @value;
 }
 

src/components/fullPay.vue

@@ -0,0 +1,1223 @@
+<template>
+    <div id="table">
+        <el-row>
+            <el-col :span="24">
+                <el-input v-model="queryData.orderNumber" placeholder="订单号" style="width: 150px"></el-input>
+                <el-input v-model="queryData.name" placeholder="购车人" style="width: 150px"></el-input>
+                <el-input v-model="queryData.mobile" placeholder="购车人手机号" style="width: 150px"></el-input>
+                <el-select v-model="queryData.status" filterable placeholder="请选择订单状态">
+                    <el-option
+                            v-for="item in orderStatus"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value">
+                    </el-option>
+                </el-select>
+                <el-select v-model="queryData.offlinePayType" filterable placeholder="请选择尾款支付状态">
+                    <el-option
+                            v-for="item in payStatusData"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value">
+                    </el-option>
+                </el-select>
+                <el-button type="primary" @click="getRows">搜索</el-button>
+                <el-button type="warning" @click="refreshTable">清空</el-button>
+            </el-col>
+        </el-row>
+        <el-table :data="tableData" ref="table" :height="autoHeight" border stripe v-loading="loading"
+                  style="margin-top: 10px">
+            <el-table-column type="index" label="排序" width="80"></el-table-column>
+            <el-table-column prop="code" label="订单号" width="180"></el-table-column>
+            <el-table-column label="订单状态" width="100">
+                <template slot-scope="scope">
+                    {{scope.row.status == 1?'待支付订金'
+                    :scope.row.status==2?'已支付订金'
+                    :scope.row.status==3?'已完成'
+                    :scope.row.status==4?'取消订单':'退订金完成'}}
+                </template>
+            </el-table-column>
+            <el-table-column label="支付方式">
+                <template slot-scope="scope">{{scope.row.payType==1?'全款':'贷款'}}</template>
+            </el-table-column>
+            <el-table-column label="车型信息" width="100">
+                <template slot-scope="scope">
+                    <el-button type="warning" plain @click="queryCarInfo(scope.row.carJson,scope.$index)">查看</el-button>
+                </template>
+            </el-table-column>
+            <el-table-column label="选配信息" width="100">
+                <template slot-scope="scope">
+                    <el-button type="warning" plain
+                               @click="queryMatchingInfo(scope.row.pickedCarInformation,scope.$index)">查看
+                    </el-button>
+                </template>
+            </el-table-column>
+            <el-table-column prop="carSupplier" label="提车供应商" width="280"></el-table-column>
+            <el-table-column prop="carSupplierNo" label="ERP" width="160"></el-table-column>
+            <el-table-column prop="totalPrice" label="总价"></el-table-column>
+            <el-table-column prop="depositPrice" label="订金"></el-table-column>
+            <el-table-column label="支付订金时间" width="160">
+                <template slot-scope="scope">
+                    <span v-if="scope.row.payDepositTime">{{scope.row.payDepositTime}}</span>
+                </template>
+            </el-table-column>
+
+            <!--            <el-table-column prop="downPaymentPrice" label="首付款"></el-table-column>-->
+            <!--            <el-table-column prop="downPaymentRate" label="首付比例"></el-table-column>-->
+            <!--            <el-table-column prop="realDownPaymentPrice" label="实际首付款"></el-table-column>-->
+            <!--            <el-table-column prop="realDownPaymentRate" label="实际首付比例"></el-table-column>-->
+            <el-table-column prop="finalPaymentPrice" label="尾款"></el-table-column>
+            <!--            <el-table-column prop="loanPrice" label="贷款总额"></el-table-column>-->
+            <!--            <el-table-column prop="loanRate" label="贷款利率"></el-table-column>-->
+            <!--            <el-table-column prop="monthlyInstallmentPaymentPrice" label="月供金额"></el-table-column>-->
+            <!--            <el-table-column prop="loanInstalmentCount" label="分期次数"></el-table-column>-->
+
+            <!--            <el-table-column label="贷款状态" width="120">-->
+            <!--                <template slot-scope="scope">{{loanState(scope.row)}}</template>-->
+            <!--            </el-table-column>-->
+
+            <!--            <el-table-column label="首付状态" width="120">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{(scope.row.offlinePayments?scope.row.offlinePayments.downPaymentStatus:"0" == 0)?'未支付':'已支付'}}-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+            <el-table-column label="尾款状态" width="120">
+                <template slot-scope="scope">
+                    {{OfflinePay(scope.row)}}
+                </template>
+            </el-table-column>
+
+            <el-table-column
+                    label="发票信息"
+                    align="center">
+                <template slot-scope="scope">
+                    <button
+                            v-show="scope.row.offlinePayments && scope.row.offlinePayments.invoicePath !='' "
+                            @click="open(scope.row.offlinePayments?scope.row.offlinePayments.invoicePath:'0')"
+                    >查看图片
+                    </button>
+                </template>
+            </el-table-column>
+
+            <el-table-column
+                    label="交车凭证"
+                    align="center">
+                <template slot-scope="scope">
+                    <button
+                            v-show="scope.row.offlinePayments && scope.row.offlinePayments.deliveryPath !='' "
+                     @click="open(scope.row.offlinePayments?scope.row.offlinePayments.deliveryPath:'0')">
+                        查看图片
+                    </button>
+                </template>
+            </el-table-column>
+
+<!--            <el-table-column label="线下审核时间" width="160">-->
+<!--                <template slot-scope="scope">-->
+<!--                    <span v-if="scope.row.offlineAuditTime">{{scope.row.offlineAuditTime}}</span>-->
+<!--                </template>-->
+<!--            </el-table-column>-->
+<!--            <el-table-column label="线上审核时间" width="160">-->
+<!--                <template slot-scope="scope">-->
+<!--                    <span v-if="scope.row.onlineAuditTime">{{scope.row.onlineAuditTime}}</span>-->
+<!--                </template>-->
+<!--            </el-table-column>-->
+<!--            <el-table-column label="订单取消时间" width="160">-->
+<!--                <template slot-scope="scope">-->
+<!--                    <span v-if="scope.row.orderCancelTime">{{scope.row.orderCancelTime}}</span>-->
+<!--                </template>-->
+<!--            </el-table-column>-->
+            <el-table-column label="订单完成时间" width="160">
+                <template slot-scope="scope">
+                    <span v-if="scope.row.orderFinishTime">{{scope.row.orderFinishTime}}</span>
+                </template>
+            </el-table-column>
+            <el-table-column prop="pickCity" label="取车城市" width="120"></el-table-column>
+            <el-table-column prop="name" label="购车人姓名" width="100"></el-table-column>
+            <el-table-column prop="mobile" label="购车人联系方式" width="120"></el-table-column>
+            <el-table-column prop="idCard" label="购车人身份证号" width="170"></el-table-column>
+            <!--            <el-table-column label="订单是否发送给金融公司">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{scope.row.isSend == 0?'否' :'是'}}-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+            <!--            <el-table-column label="是否被工厂使用过">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{scope.row.isUse == 0?'否' :'是'}}-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+
+            <!--            <el-table-column label="金融公司链接地址" width="300">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    <a v-if="scope.row.url" :href="scope.row.url" target="_blank" class="link">{{scope.row.url}}</a>-->
+            <!--                    <span v-else>无</span>-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+
+            <!--            <el-table-column label="取消原因" width="140">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{scope.row.cancelReason == 1?'不需要了'-->
+            <!--                    :scope.row.cancelReason==2?'车辆选配内容错误'-->
+            <!--                    :scope.row.cancelReason==3?'地址信息填写错误':'其他'}}-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+
+
+            <el-table-column prop="isRefund" label="是否退款" width="120">
+                <template slot-scope="scope">
+                    <el-button round @click="Detailsofrefund(scope.row.id,scope.row.isRefund)"
+                               v-show="scope.row.isRefund == 1">退款详情
+                    </el-button>
+                    <span v-show="scope.row.isRefund == 0">否</span>
+
+                </template>
+            </el-table-column>
+
+
+            <el-table-column label="操作 " width="160px" fixed="right" align="center">
+                <template slot-scope="scope">
+                    <el-button v-show="scope.row.loanStatus == 4 && scope.row.status==2 " type="primary" size="small"
+                               @click="examine(scope.row,scope.$index)"
+                               style="margin-bottom: 5px"
+                    >
+                        审核
+                    </el-button>
+
+                    <el-button
+                            v-show="scope.row.loanStatus == 5 && !scope.row.offlinePayments  && scope.row.isRefund != 1 ||  (scope.row.status==2 &&scope.row.payType==1 &&!scope.row.offlinePayments) "
+                            type="warning"
+                            size="small"
+                            @click="payForBtn(scope.row,scope.$index)"
+                            style="margin-bottom: 5px">
+                        上传尾款发票
+                    </el-button>
+                    <el-button v-show="scope.row.offlinePayments && scope.row.status == 3 &&  (scope.row.offlinePayments.deliveryPath == null || scope.row.offlinePayments.deliveryPath == '')"
+                               type="warning"
+                               size="small"
+                               @click="deliveryVehicles(scope.row,scope.$index)">上传交车图片
+                    </el-button>
+                    <el-button v-show="scope.row.status != '3' && scope.row.isRefund == 0"
+                               size="small"
+                               @click="refundBtn(scope.row,scope.$index)">退款
+                    </el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+        <el-pagination
+                @size-change="handleSizeChange"
+                @current-change="handleCurrentChange"
+                :current-page="currentPage"
+                :page-sizes="[15, 20, 25, 30]"
+                :page-size="pageSize"
+                layout="total, sizes, prev, pager, next, jumper"
+                :total="totalNumber">
+        </el-pagination>
+        <template>
+            <el-dialog id="examineDialog" title="审核" :visible.sync="examineDialog" width="30%"
+                       :before-close="clearForm('examineForm')">
+                <el-form :inline="true" label-width="150px" :model="examineForm" ref="examineForm" status-icon>
+                    <!--:rules="examineFormRules"-->
+                    <el-form-item label="线下审核状态"><!--prop="loanStatus"-->
+                        <el-select v-model="examineForm.loanStatus">
+                            <el-option v-for="(item,index) in status" :key="index" :label="item.label"
+                                       :value="item.value"></el-option>
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item label="首付比例" v-show="examineForm.loanStatus === 5"><!--prop="downPaymentRate"-->
+                        <input class="inline-input" maxlength="4" v-model="examineForm.downPaymentRate" type="number"
+                               min="0" max="1">
+                    </el-form-item>
+                    <el-form-item style="width: 98%;text-align: right">
+                        <el-button @click="closeExamineDialog">取消</el-button>
+                        <el-button type="primary" @click="confirmationAudit">确定</el-button>
+                        <!--confirmationAudit('examineForm')-->
+                    </el-form-item>
+                </el-form>
+            </el-dialog>
+            <el-dialog id="payForDialog" title="上传尾款发票" :visible.sync="payForDialog" width="30%">
+                <div>
+                    <el-upload
+                            class="upload-demo"
+                            :action="uploadUrl"
+                            :multiple="false"
+                            :show-file-list="false"
+                            :before-upload="beforeAvatarUpload"
+                            :on-success="uploadSuccess"
+                            :on-error="uploadFailed">
+                        <el-button size="small" type="primary" style="display: block">点击上传</el-button>
+                        <div slot="tip" class="el-upload__tip">上传一张格式为jpg/png图片，且不超过2M</div>
+                        <!--缓存图片查看-->
+                        <img v-if="imgUrl" :src="imgUrl" alt="" style="width: 50%">
+                    </el-upload>
+                    <div style="width: 100%;text-align: right;padding: 5px 10px;margin-top: 10px">
+                        <el-button size="mini" @click="closePayForDialog">取消</el-button>
+                        <el-button v-if="imgUrl" size="mini" type="warning" @click="payForAddImg(imgUrl)">确认支付
+                        </el-button>
+                    </div>
+                </div>
+            </el-dialog>
+            <el-dialog id="vehicleDeliveryDialog" title="上传交车照片" :visible.sync="vehicleDeliveryDialog" width="30%">
+                <div>
+                    <el-upload
+                            class="upload-demo"
+                            :action="uploadUrl"
+                            list-type="picture"
+                            :file-list="fileList"
+                            :before-upload="beforeAvatarUpload"
+                            :on-success="uploadSuccessOther"
+                            :on-remove="handleRemove"
+                            :on-error="uploadFailed">
+                        <el-button size="small" type="primary" style="display: block">点击上传</el-button>
+                        <div slot="tip" class="el-upload__tip">上传一张格式为jpg/png图片，且不超过2M</div>
+                    </el-upload>
+                    <!--缓存图片查看-->
+                    <div>
+
+                    </div>
+                    <div style="width: 100%;text-align: right;padding: 5px 10px;margin-top: 10px">
+                        <el-button size="mini" @click="closeVehicleDeliveryDialog">取消</el-button>
+                        <el-button size="mini" type="warning" @click="confirmVehicleDelivery">确认交车</el-button>
+                    </div>
+                </div>
+            </el-dialog>
+            <el-dialog id="carInfoDialog" title="车型信息" :visible.sync="carInfoDialog" width="30%">
+                <ul>
+                    <li><span>车型名称:</span>{{carInfo.name}}</li>
+                    <li><span>车型描述:</span>{{carInfo.carDesc}}</li>
+                    <li><span>价格:</span>{{carInfo.price}}</li>
+                    <li><span>座椅描述:</span>{{carInfo.seatDesc}}</li>
+                    <li><span>订金:</span>{{carInfo.deposit}}</li>
+                    <li><span>首付比例:</span>{{carInfo.downPaymentRate}}</li>
+                    <li><span>订金是否小于首付:</span>{{carInfo.depositLessthanDownPayment == true? '小于':'大于'}}</li>
+                    <li><span>删除:</span>{{carInfo.delFlag==0?'未删除':'已删除'}}</li>
+                    <li><span>车型图片:</span><img :src="carInfo.url" alt="车型图片" style="width: 20%;display: inline-block">
+                    </li>
+                    <!--<li><span>移动版车型图片</span><img :src="carInfo.mobileUrl" alt="车型图片" style="width: 20%;display: inline-block"></li>-->
+                </ul>
+            </el-dialog>
+            <el-dialog id="matchingDialog" title="选配信息" :visible.sync="matchingDialog" width='80%'>
+                <ul>
+                    <li v-if="matchingInfo.carCaliper">
+                        <h4>卡钳</h4>
+                        <p>
+                            <span>名称: </span><i>{{matchingInfo.carCaliper.name}}</i>
+                            <span>价格: </span><i>{{matchingInfo.carCaliper.price}}</i>
+                            <span>类型: </span><i>{{matchingInfo.carCaliper.type}}</i>
+                            <span>选值: </span><i>{{matchingInfo.carCaliper.value}}</i>
+                        </p>
+                    </li>
+                    <li v-if="matchingInfo.carColor">
+                        <h4>车身颜色</h4>
+                        <p>
+                            <span>名称: </span><i>{{matchingInfo.carColor.name}}</i>
+                            <span>价格: </span><i>{{matchingInfo.carColor.price}}</i>
+                            <span>类型: </span><i>{{matchingInfo.carColor.type}}</i>
+                            <span>选值: </span><i>{{matchingInfo.carColor.value}}</i>
+                        </p>
+                    </li>
+                    <li v-if="matchingInfo.carSeat">
+                        <h4>座椅</h4>
+                        <p>
+                            <span>名称: </span><i>{{matchingInfo.carSeat.name}}</i>
+                            <span>价格: </span><i>{{matchingInfo.carSeat.price}}</i>
+                            <span>类型: </span><i>{{matchingInfo.carSeat.type}}</i>
+                            <span>选值: </span><i>{{matchingInfo.carSeat.value}}</i>
+                        </p>
+                    </li>
+                    <li v-if="matchingInfo.carWheelHub">
+                        <h4>轮廓</h4>
+                        <p>
+                            <span>名称: </span><i>{{matchingInfo.carWheelHub.name}}</i>
+                            <span>价格: </span><i>{{matchingInfo.carWheelHub.price}}</i>
+                            <span>类型: </span><i>{{matchingInfo.carWheelHub.type}}</i>
+                            <span>选值: </span><i>{{matchingInfo.carWheelHub.value}}</i>
+                        </p>
+                    </li>
+                    <li v-if="matchingInfo.catUpholstery">
+                        <h4>内饰</h4>
+                        <p>
+                            <span>名称: </span><i>{{matchingInfo.catUpholstery.name}}</i>
+                            <span>价格: </span><i>{{matchingInfo.catUpholstery.price}}</i>
+                            <span>类型: </span><i>{{matchingInfo.catUpholstery.type}}</i>
+                            <span>选值: </span><i>{{matchingInfo.catUpholstery.value}}</i>
+                        </p>
+                    </li>
+                </ul>
+            </el-dialog>
+            <el-dialog id="refundDialog" title="退款" :visible.sync="refundDialog" width="600px"
+                       :before-close="clearForm('refundForm')">
+                <el-form label-width="100px"  :model="refundForm" ref="refundForm" status-icon>
+                    <el-row>
+                        <el-col :span="12" width="210px" >
+                            <el-form-item label="购车人姓名"  prop="name">
+                                {{refundForm.name}}
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="购车人手机号" prop="mobile">
+                                {{refundForm.mobile}}
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="订单号" prop="orderCode">
+                                {{refundForm.orderCode}}
+                            </el-form-item>
+                        </el-col>
+
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退订原因">
+                                <el-select v-model="refundForm.reason">
+                                    <el-option v-for="(item,index) in reasons"
+                                               :key="index"
+                                               :label="item.label"
+                                               :value="item.value">
+                                    </el-option>
+                                </el-select>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="24" style="text-align: right">
+                            <el-button @click="refundDialog = false">取消</el-button>
+                            <el-button type="primary" @click="saveRefundInfo('refundForm')">确认</el-button>
+                        </el-col>
+                    </el-row>
+                </el-form>
+            </el-dialog>
+
+
+            <el-dialog id="refundDeaDialog" title="退款详情" :visible.sync="refundDeaDialog"  width="600px">
+                <el-form label-width="100px" :model="refundDealtis" ref="refundForm" status-icon
+                >
+                    <el-row>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="会员号">
+                                {{refundDealtis.customerId}}
+                                <!--<el-input v-model="refundDealtis.customerId" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退单号" prop="backCode">
+                                {{refundDealtis.backCode}}
+                                <!--<el-input v-model="refundDealtis.backCode" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退订金额" prop="backPrice">
+                                {{refundDealtis.backPrice}}
+
+                                <!--<el-input v-model="refundDealtis.backPrice" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="收款人户名" prop="name">
+                                {{refundDealtis.name}}
+
+                                <!--<el-input v-model="refundDealtis.name" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="银行账号" prop="account">
+                                {{refundDealtis.account}}
+
+                                <!--<el-input v-model="refundDealtis.account" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="银行名称" prop="bank">
+                                {{refundDealtis.bank}}
+
+                                <!--<el-input v-model="refundDealtis.bank" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="审核时间" prop="bank">
+                                {{refundDealtis.auditTime}}
+
+                                <!--<el-input v-model="refundDealtis.auditTime" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="审核人" prop="bank">
+                                {{refundDealtis.auditor}}
+
+                                <!--<el-input v-model="refundDealtis.auditor" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退订时间" prop="bank">
+                                {{refundDealtis.finishTime}}
+
+                                <!--<el-input v-model="refundDealtis.finishTime" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退款原因" prop="bank">
+                                <!--<span></span><i>{{refundDealtis.dealerReason}}</i>-->
+                                <el-select v-model="refundDealtis.dealerReason" disabled>
+                                    <el-option v-for="(item,index) in dealerReason"
+                                               :key="index"
+                                               :label="item.label"
+                                               :value="item.value">
+                                    </el-option>
+                                </el-select>
+                            </el-form-item>
+                        </el-col>
+
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退订原因">
+                                <el-select v-model="refundDealtis.reason" disabled>
+                                    <el-option v-for="(item,index) in reasons"
+                                               :key="index"
+                                               :label="item.label"
+                                               :value="item.value">
+                                    </el-option>
+                                </el-select>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退单状态">
+                                <el-select v-model="refundDealtis.status" disabled>
+                                    <el-option v-for="(item,index) in refundStatus"
+                                               :key="index"
+                                               :label="item.label"
+                                               :value="item.value">
+                                    </el-option>
+                                </el-select>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="24" style="text-align: right">
+                            <el-button @click="refundDeaDialog = false">关闭</el-button>
+                        </el-col>
+                    </el-row>
+                </el-form>
+            </el-dialog>
+
+            <el-dialog :visible.sync="dialogVisibleList">
+					<span v-for="(item,index) in images" :key='index'>
+						<img width="50%" :src="images[index]" alt="">
+					</span>
+            </el-dialog>
+
+        </template>
+    </div>
+</template>
+
+<script>
+    import {utils} from "../utils/config";
+    import * as Api from "../utils/server"
+    import {Message} from "element-ui"
+
+    export default {
+        name: "",
+        data() {
+            return {
+                dialogVisibleList: false,
+                refundDeaDialog: false, //退款详情
+                examineDialog: false,  // 审核对话框
+                carInfoDialog: false,  // 车型信息对话框
+                payForDialog: false,  // 支付对话框
+                vehicleDeliveryDialog: false,  // 交车对话框
+                matchingDialog: false,  // 车辆选配对话框
+                refundDialog: false, // 退款对话框
+                carInfo: {}, // 车辆信息
+                matchingInfo: {}, // 选配信息
+                tableData: [],
+                queryData: {
+                    orderNumber: '', //搜索条件 订单号
+                    mobile: '',//搜索条件 手机号
+                    name: '',//搜索条件 购车人姓名
+                    name: '',//搜索条件 购车人姓名
+                    status: '',//搜索条件 订单状态
+                    offlinePayType: '',//搜索条件 首付/尾款支付状态
+                },
+                loading: true,
+                totalNumber: null,
+                totalPage: null,
+                currentPage: 1,
+                pageSize: 15,
+                images: '',
+                examineForm: {
+                    loanStatus: '',  // 状态
+                    downPaymentRate: ''  // 比例
+                },
+                examineFormRules: {
+                    loanStatus: [
+                        {required: true, message: '请选择审核状态', trigger: 'change'}
+                    ],
+                    downPaymentRate: [
+                        {validator: this.$validator.downPaymentRate, trigger: 'blur'}
+                    ]
+                },
+                status: [
+                    {
+                        label: '线下审核通过',
+                        value: 5
+                    },
+                    {
+                        label: '线下审核不通过',
+                        value: 6
+                    }
+                ],
+                payStatusData: [
+                    {
+                        label: '未支付',
+                        value: 3
+                    },
+                    {
+                        label: '线下已支付',
+                        value: 1
+                    },
+                    {
+                        label: '线上已支付',
+                        value: 2
+                    }
+                ],
+                orderStatus: [
+                    {
+                        label: '待支付定金',
+                        value: 1
+                    },
+                    {
+                        label: '已支付定金',
+                        value: 2
+                    },
+                    {
+                        label: '已完成',
+                        value: 3
+                    },
+                    {
+                        label: '取消订单',
+                        value: 4
+                    },
+                    {
+                        label: '退定金完成',
+                        value: 5
+                    }
+                ],
+                index: null, // 当前列表Id
+                uploadUrl: Api.imgUrl,
+                imgUrl: '',
+                fileList: [],
+                imgUrls: [],
+                refundForm: {
+                    customerId: '',       // 会员id
+                    backCode: '',         // 退单号
+                    backPrice: '',        // 退订金额
+                    name: '',             // 收款人姓名
+                    account: '',          // 收款人银行账号
+                    bank: '',             // 银行名称
+                    reason: '',           // 退订原因
+                    status: '',         // 退单状态
+                    orderId: '',         //订单主键
+                    orderCode: '',          //订单code
+                    backPrice: '',           //价格
+                    name: '',     //  退货人姓名
+                    mobile: '',  //   退货人手机号
+                },
+                refundDealtis: {},
+                // refundFormRules: {
+                //     backCode: [
+                //         {required: true, message: '请输入退单号', trigger: 'blur'}
+                //     ],
+                //     backPrice: [
+                //         {validator: this.$validator.backPrice, trigger: 'blur'}
+                //     ],
+                //     name: [
+                //         {validator: this.$validator.name, trigger: 'blur'}
+                //     ],
+                //     account: [
+                //         {validator: this.$validator.account, trigger: 'blur'}
+                //     ],
+                //     bank: [
+                //         {required: true, message: '请输入银行名称', trigger: 'blur'}
+                //     ],
+                // },
+                dealerReason: [
+                    {
+                        label: '72小时内',
+                        value: "1"
+                    },
+                    {
+                        label: '线上审核失败',
+                        value: "2"
+                    },
+                    {
+                        label: '线下审核失败',
+                        value: "3"
+                    },
+                    {
+                        label: '72小时后-线下审核前',
+                        value: "4"
+                    },
+                    {
+                        label: '线下审核后',
+                        value: "5"
+                    },
+                    {
+                        label: '72小时后',
+                        value: "46"
+                    }
+
+                ],
+                reasons: [
+                    {
+                        label: '贷款审核不通过',
+                        value: "1"
+                    },
+                    {
+                        label: '车辆选配内容错误',
+                        value: "2"
+                    },
+                    {
+                        label: '地址信息填写错误',
+                        value: "3"
+                    },
+                    {
+                        label: '其他',
+                        value: "4"
+                    }
+                ],
+                refundStatus: [
+                    {
+                        label: '待审核',
+                        value: "1"
+                    },
+                    {
+                        label: '审核通过',
+                        value: "2"
+                    },
+                    {
+                        label: '审核不通过',
+                        value: "3"
+                    },
+                    {
+                        label: '已退款',
+                        value: "4"
+                    }
+                ],
+                refundState: '',
+            };
+        },
+        computed: {
+            autoHeight() {
+                return window.innerHeight - 277
+            }
+        },
+
+        mounted() {
+            this.getRows();
+        },
+        destroyed() {
+            sessionStorage.removeItem('imgUrl');
+            sessionStorage.removeItem('imgUrls');
+        },
+        methods: {
+            // 审核按钮
+            examine(row, index) {
+                this.examineDialog = true;
+                this.index = row.id;
+            },
+            // 支付按钮
+            payForBtn(row, index) {
+                let src = sessionStorage.getItem('imgUrl');
+                if (src) {
+                    this.imgUrl = src
+                } else {
+                    this.imgUrl = '';
+                }
+                this.payForDialog = true;
+                this.index = row.id;
+            },
+            // 交车按钮
+            deliveryVehicles(row, index) {
+                let urls = sessionStorage.getItem('imgUrls');
+                if (urls) {
+                    urls.forEach((item, index) => {
+                        this.imgUrls.push(item.response.data[0]);
+                    });
+                    this.fileList = urls;
+                } else {
+                    this.fileList = [];
+                    this.imgUrls = [];
+                }
+                this.vehicleDeliveryDialog = true;
+                this.index = row.id;
+            },
+            // 退款按钮
+            refundBtn(row, index) {
+                this.refundForm.customerId = row.customerId;
+                this.refundForm.orderId = row.id;
+                this.refundForm.orderCode = row.code;
+                this.refundForm.backPrice = row.depositPrice;
+                this.refundForm.name = row.name;
+                this.refundForm.mobile = row.mobile;
+
+                let params = {
+                    customerId: row.customerId,
+                    orderId: row.id
+                };
+                // 查询是否满足退款条件
+                this.$post("/business/CarOrder/returnorder", params)
+                    .then(res => {
+                        if (res.status === 200) {
+                            if (res.data.success) {
+                                this.refundState = res.data.data;
+                                // Message.success(res.data.data);
+                                this.refundDialog = true;
+                            } else {
+                                Message.error(res.data.error);
+                            }
+                        }
+                    })
+                    .catch(err => {
+                        console.log(err)
+                    })
+            },
+            refreshTable() {
+                this.queryData = {}
+                this.getRows();
+            },
+            // 获取订单列表信息
+            getRows() {
+                let data = {
+                    payType: 1,
+                    code: this.queryData.orderNumber,
+                    name: this.queryData.name,
+                    mobile: this.queryData.mobile,
+                    status: this.queryData.status,
+                    offlinePayType: this.queryData.offlinePayType,
+                    currentPage: this.currentPage,
+                    pageNumber: this.pageSize
+                };
+                let params = utils.paramData(data);
+                this.$get("business/CarOrder/page", data).then(
+                    response => {
+                        if (response.status == 200) {
+                            this.loading = false;
+                            this.tableData = response.data.data.pp;
+                            this.totalNumber = response.data.data.page.totalNumber;
+                            this.$message.success("数据加载成功");
+                        } else {
+                            this.$message.success("服务器连接异常");
+                        }
+                    },
+                    response => {
+                        this.$message.success("服务器连接异常");
+                    }
+                );
+            },
+            // 查看车型信息
+            queryCarInfo(info, index) {
+                this.carInfoDialog = true;
+                this.carInfo = Object.assign({}, JSON.parse(info));
+            },
+
+            // 查看选配信息
+            queryMatchingInfo(info, index) {
+                this.matchingDialog = true;
+                let jsInfo = JSON.parse(info);
+                this.matchingInfo = jsInfo;
+            },
+            //首付款线下支付状态
+            OfflinePay(data) {
+                //判断有没有线下支付信息 如果没有有就根据订单状态判断
+                if (data.offlinePayments == undefined) {
+                    if (data.status == 3) {
+                        return '线上已支付';
+                    }
+                } else {
+                    return data.offlinePayments.downPaymentStatus == 0 ? '未支付' : '线下已支付';
+                }
+                return "未支付";
+            },
+            // 单款状态
+            loanState(data) {
+                var data = data;
+                var val = data.loanStatus;
+                if (data.payType == 1) {
+                    val = 0;
+                }
+                let str = "";
+                switch (+val) {
+                    case 0:
+                        str = "暂无";
+                        break;
+                    case 1:
+                        str = "线上待审核";
+                        break;
+                    case 2:
+                        str = "线上审核通过";
+                        break;
+                    case 3:
+                        str = "线上审核不通过";
+                        break;
+                    case 4:
+                        str = "线下待审核";
+                        break;
+                    case 5:
+                        str = "线下审核通过";
+                        break;
+                    case 6:
+                        str = "线下审核不通过";
+                        break;
+                    default:
+                        str = "暂无";
+                }
+                return str;
+            },
+            // 改变当前页面条数
+            handleSizeChange(val) {
+                console.log(`每页 ${val} 条`);
+                this.currentPage = 1;
+                this.pageSize = val;
+                this.loading = true;
+                this.getRows();
+            },
+            // 改变当前页
+            handleCurrentChange(val) {
+                console.log(`当前页: ${val}`);
+                this.currentPage = val;
+                this.loading = true;
+                this.getRows();
+            },
+            // 关闭审核对话框
+            closeExamineDialog() {
+                this.examineDialog = false;
+            },
+            // 对话框关闭 清空对话框form表单
+            clearForm(formName) {
+                this.resetForm(formName);
+            },
+            // 确认审核结果
+            confirmationAudit(formName) {
+                // this.$refs[formName].validate((valid) => {
+                //   if (valid) {
+                let params = {
+                    id: this.index,
+                    loanStatus: this.examineForm.loanStatus,
+                    downPaymentRate: this.examineForm.downPaymentRate
+                };
+                this.$put("/business/CarOrder/offlineReview", params)
+                    .then(res => {
+                        if (res.status === 200) {
+                            console.lodialogg(res.data)
+                            if (res.data.success) {
+                                Message.success(res.data.data);
+                            } else {
+                                Message.error(res.data.error);
+                            }
+                        } else {
+                            Message.error(res.data.error)
+                        }
+                        this.examineDialog = false;
+                        this.loading = true;
+                        this.getRows();
+                    });
+                //   }
+                // })
+            },
+            // 上传前的回调函数
+            beforeAvatarUpload(file) {
+                const isJPG = file.type === 'image/jpeg' || file.type === 'image/png';
+                const isLt2M = file.size / 1024 / 1024 < 2;
+
+                if (!isJPG) {
+                    this.$message.error('请上传JPG / PNG 格式图片!');
+                }
+                if (!isLt2M) {
+                    this.$message.error('上传头像图片大小不能超过 2MB!');
+                }
+                return isJPG && isLt2M;
+            },
+            // 图片上传成功
+            uploadSuccess(response, file, fileList) {
+                if (response.success) {
+                    this.imgUrl = response.data[0];
+                    // 图片上传成功缓存下当前图片url
+                    sessionStorage.setItem('imgUrl', this.imgUrl);
+                } else {
+                    console.log(response.data);
+                }
+            },
+            // 上传多图
+            uploadSuccessOther(response, file, fileList) {
+                if (fileList.length > 0) {
+                    fileList.forEach((item, index) => {
+                        this.imgUrls.push(item.response.data[0]);
+                    });
+                    sessionStorage.setItem('imgUrls', fileList);
+                }
+            },
+            // 图片列表删除
+            handleRemove(file, fileList) {
+                console.log('图片列表删除');
+                console.log(file, fileList);
+            },
+            // 上传失败
+            uploadFailed(err, file, fileList) {
+                console.log('上传失败');
+                console.log(err);
+            },
+            // 最终支付(id imgUrl)添加图片
+            payForAddImg(url) {
+                let params = {
+                    id: this.index,
+                    invoicePath: url
+                };
+                this.$put("/business/CarOrder/pay", params)
+                    .then(res => {
+                        if (res.status === 200) {
+                            if (res.data.success) {
+                                Message.success(res.data.data);
+                            } else {
+                                Message.warning(res.data.error);
+                            }
+                            sessionStorage.removeItem('imgUrl');
+                            this.payForDialog = false;
+                            this.examineDialog = false;
+                            this.loading = true;
+                            setTimeout(() => {
+                                this.getRows();
+                            }, 1000)
+                        }
+                    })
+            },
+            // 关闭支付对话框
+            closePayForDialog() {
+                this.payForDialog = false;
+            },
+            // 确认交车
+            confirmVehicleDelivery() {
+                let params = {
+                    id: this.index,
+                    invoicePath: this.imgUrls
+                };
+                this.$put("/business/CarOrder/delivery", params)
+                    .then(res => {
+                        if (res.status === 200) {
+                            if (res.data.success) {
+                                Message.success(res.data.data);
+                            } else {
+                                Message.warning(res.data.error);
+                            }
+                            sessionStorage.removeItem('imgUrls');
+                            this.vehicleDeliveryDialog = false;
+                            this.loading = true;
+                            setTimeout(() => {
+                                this.getRows();
+                            }, 1000)
+                        }
+                    })
+            },
+            // 关闭交车对话框
+            closeVehicleDeliveryDialog() {
+                this.vehicleDeliveryDialog = false;
+            },
+            // 保存退单信息
+            saveRefundInfo(formName) {
+                if (this.refundForm.reason == "") {
+                    Message.success("请选择退订原因")
+                    return;
+                }
+                this.$refs[formName].validate((valid) => {
+                    if (valid) {
+                        let params = {
+                            customerId: this.refundForm.customerId,
+                            backCode: this.refundForm.backCode,
+                            backPrice: this.refundForm.backPrice,
+                            name: this.refundForm.name,
+                            account: this.refundForm.account,
+                            bank: this.refundForm.bank,
+                            reason: this.refundForm.reason,
+                            status: this.refundForm.status,
+                            dealerReason: this.refundState,
+                            orderId: this.refundForm.orderId,
+                            orderCode: this.refundForm.orderCode,
+                            backPrice: this.refundForm.backPrice
+
+                        };
+                        this.$post("/business/CarBackOrder/save", params)
+                            .then(res => {
+                                if (res.status === 200) {
+                                    if (res.data.success) {
+                                        Message.success("提交成功");
+                                    } else {
+                                        Message.warning("提交失败");
+                                    }
+                                    this.resetForm('refundForm');
+                                    setTimeout(() => {
+                                        this.refundDialog = false;
+                                        this.loading = true;
+                                        this.getRows();
+                                    }, 1000)
+                                }
+                            })
+                            .catch(err => {
+                            })
+                    }
+                })
+            },
+            // 表单重置
+            resetForm(formName) {
+                if (this.$refs[formName] !== undefined) {
+                    this.$refs[formName].resetFields();
+                }
+            },
+            Detailsofrefund(id, refundStatus) {
+                if (refundStatus == 0) {
+                    return;
+                }
+                let params = {
+                    orderId: id,
+                };
+                this.$get("/business/CarBackOrder/getOne", params)
+                    .then(res => {
+                        if (res.status === 200) {
+                            if (res.data.success) {
+                                this.refundDealtis = res.data.data;
+
+                                this.refundDeaDialog = true;
+                                // Message.success(res.data.data);
+                            } else {
+                                Message.warning(res.data.error);
+                            }
+
+                        }
+                    })
+
+            },
+            open: function (file) {
+                if (file == 0){
+                    Message.warning("没有图片上传"
+                    );
+                    return;
+                }
+                this.dialogImageUrl = file;
+                this.images = this.dialogImageUrl.split(",");
+                this.dialogVisibleList = true;
+            },
+
+
+        },
+    };
+</script>
+
+<style scoped lang="less">
+    input[type=number] {
+        -moz-appearance: textfield;
+    }
+
+    input[type=number]::-webkit-inner-spin-button,
+    input[type=number]::-webkit-outer-spin-button {
+        -webkit-appearance: none;
+        margin: 0;
+    }
+
+    #carInfoDialog {
+        ul {
+            padding: 5px;
+
+            li {
+                display: flex;
+                align-items: center;
+                overflow: hidden;
+                padding: 5px;
+
+                span {
+                    display: inline-block;
+                    width: 150px;
+                    font-size: 15px;
+                    font-weight: bold;
+                }
+            }
+        }
+    }
+
+    #matchingDialog {
+        ul {
+            padding: 5px;
+
+            li {
+                margin-top: 10px;
+                padding: 10px;
+                box-shadow: 0 0 10px #ccc;
+
+                h4 {
+                    font-size: 16px;
+                }
+
+                p {
+                    margin-top: 10px;
+
+                    span {
+                        display: inline-block;
+                        font-size: 15px;
+                        text-align: right;
+
+                        &:first-child {
+                            margin-left: 20px;
+                        }
+                    }
+
+                    i {
+                        margin-left: 10px;
+                        font-style: normal;
+                        font-size: 14px;
+                        display: inline-block;
+                        min-width: 120px;
+                    }
+                }
+            }
+        }
+    }
+
+    #examineDialog {
+        .el-form--inline .el-form-item {
+            width: 100%;
+            margin-right: 0;
+
+            .inline-input {
+                -webkit-appearance: none;
+                background-color: #fff;
+                background-image: none;
+                border-radius: 4px;
+                border: 1px solid #dcdfe6;
+                -webkit-box-sizing: border-box;
+                box-sizing: border-box;
+                color: #606266;
+                display: inline-block;
+                font-size: inherit;
+                height: 40px;
+                line-height: 40px;
+                outline: none;
+                padding: 0 15px;
+                -webkit-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+                -o-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+                transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+                width: 217px;
+            }
+
+            .inline-span {
+                display: inline-block;
+                margin-left: 10px;
+                font-size: 16px;
+                color: #f15353;
+            }
+        }
+
+    }
+
+    .link {
+        text-decoration: none;
+
+        &:link {
+            border: none;
+            color: #5eb3e6;
+        }
+
+        &:focus {
+            outline-style: none;
+            outline-width: 0;
+        }
+    }
+
+</style>

src/components/home.vue

@@ -1,160 +1,217 @@
 <template>
-  <div class="hp100">
-    <el-container class="hp100">
-      <el-aside width="200px" class="aside">
-        <div class="logo">
-          <!-- <img src="https://ask-image.zhaopin.cn/other_files/kh_1530093270375.jpg"> -->
-
-          <img src="http://shopimg.jetour.com.cn/20190729/1564402058621.jpg" />
-          <!--<h6>经销商管理系统</h6>-->
-        </div>
-        <el-menu default-active="1" class="el-menu-vertical-demo">
-          <el-menu-item index="1" @click="showMenu()">
-            <i class="el-icon-menu"></i>
-            <span slot="title">{{currentMenu}}</span>
-          </el-menu-item>
-        </el-menu>
-      </el-aside>
-      <el-container>
-        <el-header class="header" height="66px">
-          <img class="portrait" src="http://shopimg.jetour.com.cn/20190729/1564402058621.jpg" />
-          <span>{{personInfo.username}}</span>
-          <i class="iconfont icon-guanbi" @click="logout()"></i>
-        </el-header>
-        <el-main class="main">
-          <p class="tiptxt">{{currentMenu}}</p>
-          <div class="maincontent">
-            <tableView></tableView>
-          </div>
-        </el-main>
-      </el-container>
-    </el-container>
-  </div>
+    <div class="hp100">
+        <el-container class="hp100">
+            <el-aside width="200px" class="aside">
+
+                <div class="logo">
+                    <!--          <img src="http://shopimg.jetour.com.cn/20190729/1564402058621.jpg" />-->
+                </div>
+                <el-menu :default-active="getMenuIndex()" class="el-menu-vertical-demo">
+                    <el-menu-item :index="'4'" @click="showMenu('普通订单','order',4)">
+                        <i class="el-icon-menu"></i>
+                        <span slot="title">普通订单</span>
+                    </el-menu-item>
+                    <el-menu-item :index="'1'" @click="showMenu('Coupe全款订单','fullPay',1)">
+                        <i class="el-icon-menu"></i>
+                        <span slot="title">Coupe全款订单</span>
+                    </el-menu-item>
+
+                    <el-menu-item :index="'2'" @click="showMenu('Coupe贷款订单','loanPay',2)">
+                        <i class="el-icon-menu"></i>
+                        <span slot="title">Coupe贷款订单</span>
+                    </el-menu-item>
+                    <el-menu-item :index="'3'" @click="showMenu('Coupe退订订单','unsubscribe',3)">
+                        <i class="el-icon-menu"></i>
+                        <span slot="title">Coupe退订订单</span>
+                    </el-menu-item>
+
+                </el-menu>
+
+            </el-aside>
+            <el-container>
+                <el-header class="header" height="66px">
+                    <el-button round type="warning">{{username}}</el-button>
+                    <!--                    <span></span>-->
+                    <!--                    <img class="portrait" src="http://shopimg.jetour.com.cn/20190729/1564402058621.jpg"/>-->
+                    <span>{{personInfo.username}}</span>
+                    <i class="iconfont icon-guanbi" @click="logout()"></i>
+                </el-header>
+                <el-main class="main">
+                    <p class="tiptxt">{{currentMenu}}</p>
+                    <div class="maincontent">
+                        <router-view></router-view>
+                    </div>
+                </el-main>
+            </el-container>
+        </el-container>
+    </div>
 </template>
 
 <script>
-  import tableView from './table'
-export default {
-  name: "HelloWorld",
-  data() {
-    return {
-      menuList: [],
-      currentMenu: "订单管理",
-      sysUser: ""
+    export default {
+        name: "dealer",
+        data() {
+            return {
+                menuList: [],
+                currentMenu: localStorage.getItem("menuName") == "" ? '普通订单' : localStorage.getItem("menuName"),
+                sysUser: "",
+                menuIndex: localStorage.getItem("menuIndex") == "" ? "'4'" : localStorage.getItem("menuIndex"),
+                username: localStorage.getItem('zptoken'),
+            };
+        },
+
+        methods: {
+            getMenuIndex() {
+                var index = localStorage.getItem("menuIndex") == null ? "4" : localStorage.getItem("menuIndex");
+                return index;
+            },
+            showMenu(name, path, menuindex) {
+                localStorage.setItem("menuName", name);
+                localStorage.setItem("menuIndex", menuindex);
+                this.currentMenu = name;
+                this.$router.push({path: path});
+            },
+            logout() {
+                this.$confirm("确定要注销吗?", "提示", {
+                    confirmButtonText: "确定",
+                    cancelButtonText: "取消",
+                    type: "warning"
+                })
+                    .then(() => {
+                        this.$post("/logout")
+                            .then(
+                                response => {
+                                    if (response.status == 200) {
+                                        if (response.data.success == true) {
+                                            localStorage.removeItem("token");
+                                            localStorage.removeItem("userId");
+                                            localStorage.removeItem("personInfo");
+                                            localStorage.removeItem("menuName");
+                                            localStorage.removeItem("menuIndex");
+                                            localStorage.removeItem('zptoken'),
+
+                                                this.$router.push({path: "/"});
+                                        } else if (response.data.success == false) {
+                                            this.$message.error(response.data.error);
+                                        } else {
+                                            this.$message.error("登录失败");
+                                        }
+                                    }
+                                },
+                                response => {
+                                }
+                            );
+
+
+                    })
+                    .catch(() => {
+                        this.$message({
+                            type: "info",
+                            message: "已取消"
+                        });
+                    });
+            },
+        },
+        computed: {
+            httpImgUrl() {
+                return this.$store.state.httpImgUrl;
+            },
+            personInfo() {
+                if (JSON.parse(localStorage.getItem("personInfo")) == null) {
+                    this.$router.push({path: "/"});
+                } else {
+                    return JSON.parse(localStorage.getItem("personInfo"));
+                }
+            }
+        }
     };
-  },
-  components:{
-    tableView
-  },
-  methods: {
-    showMenu() {
-      this.$router.push({ path: "/home/carOrder"});
-    },
-    logout() {
-      this.$confirm("确定要注销吗?", "提示", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning"
-      })
-        .then(() => {
-          localStorage.removeItem("token");
-          localStorage.removeItem("userId");
-          localStorage.removeItem("personInfo");
-          this.$router.push({ path: "/" });
-        })
-        .catch(() => {
-          this.$message({
-            type: "info",
-            message: "已取消"
-          });
-        });
-    },
-  },
-  computed: {
-    httpImgUrl() {
-      return this.$store.state.httpImgUrl;
-    },
-    personInfo() {
-      if (JSON.parse(localStorage.getItem("personInfo")) == null) {
-        this.$router.push({ path: "/" });
-      } else {
-        return JSON.parse(localStorage.getItem("personInfo"));
-      }
-    }
-  }
-};
 </script>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style lang="less" scoped>
-@import "./../assets/css/base.less";
-.header {
-  //.h(66px);
-  background: #ebebeb;
-  box-shadow: 0px 3px 15px 0px rgba(0, 0, 0, 0.2);
-  padding-right: 44px;
-  display: flex;
-  justify-content: flex-end;
-  padding: 10px 44px 10px 0;
-}
-.icon-guanbi {
-  line-height: 46px;
-  margin-left: 20px;
-  color: #bbbbbb;
-  cursor: pointer;
-}
-.logo {
-  height: 66px;
-  background-color: #b79267;
-  padding: 10px 0;
-  box-sizing: border-box;
-  position: relative;
-  margin-bottom: 20px;
-}
-.logo img {
-  display: block;
-  margin: 0 auto;
-  width: 130px;
-  height: 46px;
-}
-.portrait {
-  width: 46px;
-  height: 46px;
-  border-radius: 23px;
-  margin-right: 10px;
-}
-.header span {
-  line-height: 46px;
-}
-.logo:after {
-  content: "";
-  height: 20px;
-  background: #2e2223;
-  display: block;
-  position: absolute;
-  bottom: -20px;
-  width: 100%;
-}
-.aside {
-  height: 100%;
-  background: #32312f;
-}
-.el-menu {
-  background: #32312f;
-}
-.main {
-  padding: 20px;
-  background-color: #f7f7f7;
-  display: flex;
-  display: -webkit-flex;
-  flex-direction: column;
-}
-.maincontent {
-  background: rgba(255, 255, 255, 1);
-  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.09);
-  flex: 1;
-  padding: 20px;
-  overflow: hidden;
-  margin-top: 10px;
-}
+    @import "./../assets/css/base.less";
+
+    .el-menu-item {
+        color: #f0f0f0;
+    }
+
+    .header {
+        //.h(66px);
+        background: #ebebeb;
+        box-shadow: 0px 3px 15px 0px rgba(0, 0, 0, 0.2);
+        padding-right: 44px;
+        display: flex;
+        justify-content: flex-end;
+        padding: 10px 44px 10px 0;
+    }
+
+    .icon-guanbi {
+        line-height: 46px;
+        margin-left: 20px;
+        color: #bbbbbb;
+        cursor: pointer;
+    }
+
+    .logo {
+        height: 66px;
+        background-color: #b79267;
+        padding: 10px 0;
+        box-sizing: border-box;
+        position: relative;
+        margin-bottom: 20px;
+    }
+
+    .logo img {
+        display: block;
+        margin: 0 auto;
+        width: 130px;
+        height: 46px;
+    }
+
+    .portrait {
+        width: 46px;
+        height: 46px;
+        border-radius: 23px;
+        margin-right: 10px;
+    }
+
+    .header span {
+        line-height: 46px;
+    }
+
+    .logo:after {
+        content: "";
+        height: 20px;
+        background: #2e2223;
+        display: block;
+        position: absolute;
+        bottom: -20px;
+        width: 100%;
+    }
+
+    .aside {
+        height: 100%;
+        background: #32312f;
+    }
+
+    .el-menu {
+        background: #32312f;
+    }
+
+    .main {
+        padding: 20px;
+        background-color: #f7f7f7;
+        display: flex;
+        display: -webkit-flex;
+        flex-direction: column;
+    }
+
+    .maincontent {
+        background: rgba(255, 255, 255, 1);
+        box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.09);
+        flex: 1;
+        padding: 20px;
+        overflow: hidden;
+        margin-top: 10px;
+    }
 </style>

src/components/table.vue → src/components/loanPay.vue

@@ -2,7 +2,26 @@
     <div id="table">
         <el-row>
             <el-col :span="24">
-                <el-input v-model="orderNumber" placeholder="请输入订单号" style="width: 200px"></el-input>
+                <el-input v-model="queryData.orderNumber" placeholder="订单号" style="width: 150px"></el-input>
+                <el-input v-model="queryData.name" placeholder="购车人" style="width: 150px"></el-input>
+                <el-input v-model="queryData.mobile" placeholder="购车人手机号" style="width: 150px"></el-input>
+                <el-select v-model="queryData.status" filterable placeholder="请选择订单状态">
+                    <el-option
+                            v-for="item in orderStatus"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value">
+                    </el-option>
+                </el-select>
+                <el-select v-model="queryData.offlinePayType" filterable placeholder="请选择首付支付状态">
+                    <el-option
+                            v-for="item in payStatusData"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value">
+                    </el-option>
+                </el-select>
+
                 <el-button type="primary" @click="getRows">搜索</el-button>
                 <el-button type="warning" @click="refreshTable">清空</el-button>
             </el-col>
@@ -13,12 +32,15 @@
             <el-table-column prop="code" label="订单号" width="180"></el-table-column>
             <el-table-column label="订单状态" width="100">
                 <template slot-scope="scope">
-                    {{scope.row.status == 1?'待支付定金'
-                    :scope.row.status==2?'已支付定金'
+                    {{scope.row.status == 1?'待支付订金'
+                    :scope.row.status==2?'已支付订金'
                     :scope.row.status==3?'已完成'
-                    :scope.row.status==4?'取消订单':'退定金完成'}}
+                    :scope.row.status==4?'取消订单':'退订金完成'}}
                 </template>
             </el-table-column>
+            <el-table-column label="支付方式">
+                <template slot-scope="scope">{{scope.row.payType==1?'全款':'贷款'}}</template>
+            </el-table-column>
             <el-table-column label="车型信息" width="100">
                 <template slot-scope="scope">
                     <el-button type="warning" plain @click="queryCarInfo(scope.row.carJson,scope.$index)">查看</el-button>
@@ -31,54 +53,64 @@
                     </el-button>
                 </template>
             </el-table-column>
-            <el-table-column prop="carSupplier" label="4S供应商" width="280"></el-table-column>
+            <el-table-column prop="carSupplier" label="提车供应商" width="280"></el-table-column>
             <el-table-column prop="carSupplierNo" label="ERP" width="160"></el-table-column>
             <el-table-column prop="totalPrice" label="总价"></el-table-column>
-            <el-table-column prop="depositPrice" label="定金"></el-table-column>
-            <el-table-column label="支付定金时间" width="160">
+            <el-table-column prop="depositPrice" label="订金"></el-table-column>
+            <el-table-column label="支付订金时间" width="160">
                 <template slot-scope="scope">
                     <span v-if="scope.row.payDepositTime">{{scope.row.payDepositTime}}</span>
                 </template>
             </el-table-column>
-            <el-table-column label="支付方式">
-                <template slot-scope="scope">{{scope.row.payType==1?'全款':'贷款'}}</template>
-            </el-table-column>
+
             <el-table-column prop="downPaymentPrice" label="首付款"></el-table-column>
             <el-table-column prop="downPaymentRate" label="首付比例"></el-table-column>
             <el-table-column prop="realDownPaymentPrice" label="实际首付款"></el-table-column>
             <el-table-column prop="realDownPaymentRate" label="实际首付比例"></el-table-column>
-            <el-table-column prop="finalPaymentPrice" label="尾款"></el-table-column>
+            <!--            <el-table-column prop="finalPaymentPrice" label="尾款"></el-table-column>-->
             <el-table-column prop="loanPrice" label="贷款总额"></el-table-column>
-            <el-table-column prop="loanRate" label="贷款利率"></el-table-column>
-            <el-table-column prop="monthlyInstallmentPaymentPrice" label="月供金额"></el-table-column>
-            <el-table-column prop="loanInstalmentCount" label="分期次数"></el-table-column>
+            <!--            <el-table-column prop="loanRate" label="贷款利率"></el-table-column>-->
+            <!--            <el-table-column prop="monthlyInstallmentPaymentPrice" label="月供金额"></el-table-column>-->
+            <!--            <el-table-column prop="loanInstalmentCount" label="分期次数"></el-table-column>-->
 
             <el-table-column label="贷款状态" width="120">
                 <template slot-scope="scope">{{loanState(scope.row)}}</template>
             </el-table-column>
 
             <el-table-column label="首付状态" width="120">
-                <template slot-scope="scope">{{(scope.row.offlinePayments?scope.row.offlinePayments.downPaymentStatus:"0" == 0)?'未支付':'已支付'}}</template>
+                <template slot-scope="scope">
+                    {{OfflinePay(scope.row)}}
+                    <!--                    {{(scope.row.offlinePayments?scope.row.offlinePayments.downPaymentStatus:"0" == 0)?'未支付':'线下已支付'}}-->
+                </template>
             </el-table-column>
 
-            <el-table-column label="尾款状态" width="120">
-                <template slot-scope="scope">{{(scope.row.offlinePayments?scope.row.offlinePayments.tailStatus:"0")== 0?'未支付':'已支付'}}</template>
-            </el-table-column>
+            <!--            <el-table-column label="尾款状态" width="120">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{OfflinePay(scope.row,2)}}-->
+            <!--                    &lt;!&ndash;                    {{(scope.row.offlinePayments?scope.row.offlinePayments.tailStatus:"0")== 0?'未支付':'线下已支付'}}&ndash;&gt;-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
 
 
             <el-table-column
                     label="发票信息"
                     align="center">
-                <template  slot-scope="scope">
-                    <button @click="open(scope.row.offlinePayments?scope.row.offlinePayments.invoicePath:'0')">查看图片</button>
+                <template slot-scope="scope">
+                    <button
+                            v-show="scope.row.offlinePayments && scope.row.offlinePayments.invoicePath !='' "
+                            @click="open(scope.row.offlinePayments?scope.row.offlinePayments.invoicePath:'0')">查看图片
+                    </button>
                 </template>
             </el-table-column>
 
             <el-table-column
                     label="交车凭证"
                     align="center">
-                <template  slot-scope="scope">
-                    <button @click="open(scope.row.offlinePayments?scope.row.offlinePayments.deliveryPath:'0')">查看图片</button>
+                <template slot-scope="scope">
+                    <button
+                            v-show="scope.row.offlinePayments && scope.row.offlinePayments.deliveryPath !='' "
+                            @click="open(scope.row.offlinePayments?scope.row.offlinePayments.deliveryPath:'0')">查看图片
+                    </button>
                 </template>
             </el-table-column>
 
@@ -92,50 +124,52 @@
                     <span v-if="scope.row.onlineAuditTime">{{scope.row.onlineAuditTime}}</span>
                 </template>
             </el-table-column>
-            <el-table-column label="订单取消时间" width="160">
-                <template slot-scope="scope">
-                    <span v-if="scope.row.orderCancelTime">{{scope.row.orderCancelTime}}</span>
-                </template>
-            </el-table-column>
+<!--            <el-table-column label="订单取消时间" width="160">-->
+<!--                <template slot-scope="scope">-->
+<!--                    <span v-if="scope.row.orderCancelTime">{{scope.row.orderCancelTime}}</span>-->
+<!--                </template>-->
+<!--            </el-table-column>-->
             <el-table-column label="订单完成时间" width="160">
                 <template slot-scope="scope">
                     <span v-if="scope.row.orderFinishTime">{{scope.row.orderFinishTime}}</span>
                 </template>
             </el-table-column>
             <el-table-column prop="pickCity" label="取车城市" width="120"></el-table-column>
-            <el-table-column prop="name" label="收货人姓名" width="100"></el-table-column>
-            <el-table-column prop="mobile" label="收货人联系方式" width="120"></el-table-column>
-            <el-table-column prop="idCard" label="收货人身份证号" width="170"></el-table-column>
-            <el-table-column label="订单是否发送给金融公司">
-                <template slot-scope="scope">
-                    {{scope.row.isSend == 0?'否' :'是'}}
-                </template>
-            </el-table-column>
-            <el-table-column label="是否被工厂使用过">
-                <template slot-scope="scope">
-                    {{scope.row.isUse == 0?'否' :'是'}}
-                </template>
-            </el-table-column>
+            <el-table-column prop="name" label="购车人姓名" width="100"></el-table-column>
+            <el-table-column prop="mobile" label="购车人联系方式" width="120"></el-table-column>
+            <el-table-column prop="idCard" label="购车人身份证号" width="170"></el-table-column>
+            <!--            <el-table-column label="订单是否发送给金融公司">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{scope.row.isSend == 0?'否' :'是'}}-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+            <!--            <el-table-column label="是否被工厂使用过">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{scope.row.isUse == 0?'否' :'是'}}-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
 
-            <el-table-column label="金融公司链接地址" width="300">
-                <template slot-scope="scope">
-                    <a v-if="scope.row.url" :href="scope.row.url" target="_blank" class="link">{{scope.row.url}}</a>
-                    <span v-else>无</span>
-                </template>
-            </el-table-column>
+            <!--            <el-table-column label="金融公司链接地址" width="300">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    <a v-if="scope.row.url" :href="scope.row.url" target="_blank" class="link">{{scope.row.url}}</a>-->
+            <!--                    <span v-else>无</span>-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
 
-            <el-table-column label="取消原因" width="140">
-                <template slot-scope="scope">
-                    {{scope.row.cancelReason == 1?'不需要了'
-                    :scope.row.cancelReason==2?'车辆选配内容错误'
-                    :scope.row.cancelReason==3?'地址信息填写错误':'其他'}}
-                </template>
-            </el-table-column>
+            <!--            <el-table-column label="取消原因" width="140">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{scope.row.cancelReason == 1?'不需要了'-->
+            <!--                    :scope.row.cancelReason==2?'车辆选配内容错误'-->
+            <!--                    :scope.row.cancelReason==3?'地址信息填写错误':'其他'}}-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
 
 
             <el-table-column prop="isRefund" label="是否退款" width="120">
                 <template slot-scope="scope">
-                    <el-button round @click="Detailsofrefund(scope.row.id,scope.row.isRefund)" v-show="scope.row.isRefund == 1">退款详情</el-button>
+                    <el-button round @click="Detailsofrefund(scope.row.id,scope.row.isRefund)"
+                               v-show="scope.row.isRefund == 1">退款详情
+                    </el-button>
                     <span v-show="scope.row.isRefund == 0">否</span>
 
                 </template>
@@ -147,15 +181,23 @@
                     <el-button v-show="scope.row.loanStatus == 4 && scope.row.status==2 " type="primary" size="small"
                                @click="examine(scope.row,scope.$index)">审核
                     </el-button>
-                    <el-button v-show="scope.row.loanStatus == 5 && !scope.row.offlinePayments ||  (scope.row.status==2 &&scope.row.payType==1 &&!scope.row.offlinePayments) " type="warning"
-                               size="small"
-                               @click="payForBtn(scope.row,scope.$index)">上传尾款发票
+
+                    <el-button
+                            v-show="scope.row.loanStatus == 5 && !scope.row.offlinePayments   && scope.row.isRefund != 1 ||  (scope.row.status==1 &&scope.row.payType==2 &&!scope.row.offlinePayments) "
+                            type="warning"
+                            size="small"
+                            @click="payForBtn(scope.row,scope.$index)"
+                            style="margin-bottom: 5px"
+                    >上传尾款发票
                     </el-button>
-                    <el-button v-show="scope.row.offlinePayments && scope.row.offlinePayments && scope.row.status != 3"
-                               type="warning"
+                    <el-button v-show="scope.row.offlinePayments && scope.row.status == 3 &&  (scope.row.offlinePayments.deliveryPath == null || scope.row.offlinePayments.deliveryPath == '')"
                                size="small"
                                @click="deliveryVehicles(scope.row,scope.$index)">上传交车图片
                     </el-button>
+                    <el-button v-show="scope.row.status != '3' && scope.row.isRefund == 0"
+                               size="small"
+                               @click="refundBtn(scope.row,scope.$index)">退款
+                    </el-button>
                 </template>
             </el-table-column>
         </el-table>
@@ -242,16 +284,16 @@
                     <li><span>车型描述:</span>{{carInfo.carDesc}}</li>
                     <li><span>价格:</span>{{carInfo.price}}</li>
                     <li><span>座椅描述:</span>{{carInfo.seatDesc}}</li>
-                    <li><span>定金:</span>{{carInfo.deposit}}</li>
+                    <li><span>订金:</span>{{carInfo.deposit}}</li>
                     <li><span>首付比例:</span>{{carInfo.downPaymentRate}}</li>
-                    <li><span>定金是否小于首付:</span>{{carInfo.depositLessthanDownPayment == true? '小于':'大于'}}</li>
+                    <li><span>订金是否小于首付:</span>{{carInfo.depositLessthanDownPayment == true? '小于':'大于'}}</li>
                     <li><span>删除:</span>{{carInfo.delFlag==0?'未删除':'已删除'}}</li>
                     <li><span>车型图片:</span><img :src="carInfo.url" alt="车型图片" style="width: 20%;display: inline-block">
                     </li>
                     <!--<li><span>移动版车型图片</span><img :src="carInfo.mobileUrl" alt="车型图片" style="width: 20%;display: inline-block"></li>-->
                 </ul>
             </el-dialog>
-            <el-dialog id="matchingDialog" title="选配信息" :visible.sync="matchingDialog" width='80%' >
+            <el-dialog id="matchingDialog" title="选配信息" :visible.sync="matchingDialog" width='80%'>
                 <ul>
                     <li v-if="matchingInfo.carCaliper">
                         <h4>卡钳</h4>
@@ -300,73 +342,49 @@
                     </li>
                 </ul>
             </el-dialog>
-            <!--<el-dialog id="refundDialog" title="退款" :visible.sync="refundDialog" width="30%"-->
-                       <!--:before-close="clearForm('refundForm')">-->
-                <!--<el-form label-width="100px" :model="refundForm" ref="refundForm" status-icon :rules="refundFormRules">-->
-                    <!--<el-row>-->
-                        <!--<el-col span="12">-->
-                            <!--<el-form-item label="会员号">-->
-                                <!--<el-input v-model="refundForm.customerId" disabled></el-input>-->
-                            <!--</el-form-item>-->
-                        <!--</el-col>-->
-                        <!--<el-col span="12">-->
-                            <!--<el-form-item label="退单号" prop="backCode">-->
-                                <!--<el-input v-model="refundForm.backCode"></el-input>-->
-                            <!--</el-form-item>-->
-                        <!--</el-col>-->
-                        <!--<el-col span="12">-->
-                            <!--<el-form-item label="退定金额" prop="backPrice">-->
-                                <!--<el-input v-model="refundForm.backPrice"></el-input>-->
-                            <!--</el-form-item>-->
-                        <!--</el-col>-->
-                        <!--<el-col span="12">-->
-                            <!--<el-form-item label="收款人户名" prop="name">-->
-                                <!--<el-input v-model="refundForm.name"></el-input>-->
-                            <!--</el-form-item>-->
-                        <!--</el-col>-->
-                        <!--<el-col span="12">-->
-                            <!--<el-form-item label="银行账号" prop="account">-->
-                                <!--<el-input v-model="refundForm.account"></el-input>-->
-                            <!--</el-form-item>-->
-                        <!--</el-col>-->
-                        <!--<el-col span="12">-->
-                            <!--<el-form-item label="银行名称" prop="bank">-->
-                                <!--<el-input v-model="refundForm.bank"></el-input>-->
-                            <!--</el-form-item>-->
-                        <!--</el-col>-->
-                        <!--<el-col span="12">-->
-                            <!--<el-form-item label="退定原因">-->
-                                <!--<el-select v-model="refundForm.reason">-->
-                                    <!--<el-option v-for="(item,index) in reasons"-->
-                                               <!--:key="index"-->
-                                               <!--:label="item.label"-->
-                                               <!--:value="item.value">-->
-                                    <!--</el-option>-->
-                                <!--</el-select>-->
-                            <!--</el-form-item>-->
-                        <!--</el-col>-->
-                        <!--<el-col span="12">-->
-                            <!--<el-form-item label="退单状态">-->
-                                <!--<el-select v-model="refundForm.status">-->
-                                    <!--<el-option v-for="(item,index) in refundStatus"-->
-                                               <!--:key="index"-->
-                                               <!--:label="item.label"-->
-                                               <!--:value="item.value">-->
-                                    <!--</el-option>-->
-                                <!--</el-select>-->
-                            <!--</el-form-item>-->
-                        <!--</el-col>-->
-                        <!--<el-col span="24" style="text-align: right">-->
-                            <!--<el-button @click="refundDialog = false">取消</el-button>-->
-                            <!--<el-button type="primary" @click="saveRefundInfo('refundForm')">确认</el-button>-->
-                        <!--</el-col>-->
-                    <!--</el-row>-->
-                <!--</el-form>-->
-            <!--</el-dialog>-->
-
-
-            <el-dialog id="refundDeaDialog" title="退款详情" :visible.sync="refundDeaDialog" min-width="600px">
-                <el-form label-width="100px" :model="refundDealtis" ref="refundForm" status-icon :rules="refundFormRules">
+            <el-dialog id="refundDialog" title="退款" :visible.sync="refundDialog" width="600px"
+                       :before-close="clearForm('refundForm')">
+                <el-form label-width="100px"  :model="refundForm" ref="refundForm" status-icon>
+                    <el-row>
+                        <el-col :span="12" width="210px" >
+                            <el-form-item label="购车人姓名"  prop="name">
+                                {{refundForm.name}}
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="购车人手机号" prop="mobile">
+                                {{refundForm.mobile}}
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="订单号" prop="orderCode">
+                                {{refundForm.orderCode}}
+                            </el-form-item>
+                        </el-col>
+
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退订原因">
+                                <el-select v-model="refundForm.reason">
+                                    <el-option v-for="(item,index) in reasons"
+                                               :key="index"
+                                               :label="item.label"
+                                               :value="item.value">
+                                    </el-option>
+                                </el-select>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="24" style="text-align: right">
+                            <el-button @click="refundDialog = false">取消</el-button>
+                            <el-button type="primary" @click="saveRefundInfo('refundForm')">确认</el-button>
+                        </el-col>
+                    </el-row>
+                </el-form>
+            </el-dialog>
+
+
+            <el-dialog id="refundDeaDialog" title="退款详情" :visible.sync="refundDeaDialog"  width="600px">
+                <el-form label-width="100px" :model="refundDealtis" ref="refundForm" status-icon
+                >
                     <el-row>
                         <el-col :span="12" width="210px">
                             <el-form-item label="会员号">
@@ -376,14 +394,14 @@
                         </el-col>
                         <el-col :span="12" width="210px">
                             <el-form-item label="退单号" prop="backCode">
-                              {{refundDealtis.backCode}}
+                                {{refundDealtis.backCode}}
 
                                 <!--<el-input v-model="refundDealtis.backCode" disabled></el-input>-->
                             </el-form-item>
                         </el-col>
                         <el-col :span="12" width="210px">
-                            <el-form-item label="退定金额" prop="backPrice">
-                             {{refundDealtis.backPrice}}
+                            <el-form-item label="退订金额" prop="backPrice">
+                                {{refundDealtis.backPrice}}
 
                                 <!--<el-input v-model="refundDealtis.backPrice" disabled></el-input>-->
                             </el-form-item>
@@ -404,7 +422,7 @@
                         </el-col>
                         <el-col :span="12" width="210px">
                             <el-form-item label="银行名称" prop="bank">
-                               {{refundDealtis.bank}}
+                                {{refundDealtis.bank}}
 
                                 <!--<el-input v-model="refundDealtis.bank" disabled></el-input>-->
                             </el-form-item>
@@ -419,14 +437,14 @@
                         </el-col>
                         <el-col :span="12" width="210px">
                             <el-form-item label="审核人" prop="bank">
-                               {{refundDealtis.auditor}}
+                                {{refundDealtis.auditor}}
 
                                 <!--<el-input v-model="refundDealtis.auditor" disabled></el-input>-->
                             </el-form-item>
                         </el-col>
                         <el-col :span="12" width="210px">
                             <el-form-item label="退定时间" prop="bank">
-                               {{refundDealtis.finishTime}}
+                                {{refundDealtis.finishTime}}
 
                                 <!--<el-input v-model="refundDealtis.finishTime" disabled></el-input>-->
                             </el-form-item>
@@ -475,7 +493,7 @@
 
             <el-dialog :visible.sync="dialogVisibleList">
 					<span v-for="(item,index) in images" :key='index'>
-						<img  width="50%" :src="images[index]" alt="">
+						<img width="50%" :src="images[index]" alt="">
 					</span>
             </el-dialog>
 
@@ -492,8 +510,8 @@
         name: "",
         data() {
             return {
-                dialogVisibleList:false,
-                refundDeaDialog:false, //退款详情
+                dialogVisibleList: false,
+                refundDeaDialog: false, //退款详情
                 examineDialog: false,  // 审核对话框
                 carInfoDialog: false,  // 车型信息对话框
                 payForDialog: false,  // 支付对话框
@@ -509,11 +527,19 @@
                 totalPage: null,
                 currentPage: 1,
                 pageSize: 15,
-                images:'',
+                images: '',
                 examineForm: {
                     loanStatus: '',  // 状态
                     downPaymentRate: ''  // 比例
                 },
+                queryData: {
+                    orderNumber: '', //搜索条件 订单号
+                    mobile: '',//搜索条件 手机号
+                    name: '',//搜索条件 购车人姓名
+                    name: '',//搜索条件 购车人姓名
+                    status: '',//搜索条件 订单状态
+                    offlinePayType: '',//搜索条件 首付/尾款支付状态
+                },
                 examineFormRules: {
                     loanStatus: [
                         {required: true, message: '请选择审核状态', trigger: 'change'}
@@ -532,6 +558,43 @@
                         value: 6
                     }
                 ],
+                payStatusData: [
+                    {
+                        label: '未支付',
+                        value: 3
+                    },
+                    {
+                        label: '线下已支付',
+                        value: 1
+                    },
+                    {
+                        label: '线上已支付',
+                        value: 2
+                    }
+                ],
+                orderStatus: [
+                    {
+                        label: '待支付定金',
+                        value: 1
+                    },
+                    {
+                        label: '已支付定金',
+                        value: 2
+                    },
+                    {
+                        label: '已完成',
+                        value: 3
+                    },
+                    {
+                        label: '取消订单',
+                        value: 4
+                    },
+                    {
+                        label: '退定金完成',
+                        value: 5
+                    }
+                ],
+                payStatus: [],
                 index: null, // 当前列表Id
                 uploadUrl: Api.imgUrl,
                 imgUrl: '',
@@ -540,34 +603,37 @@
                 refundForm: {
                     customerId: '',       // 会员id
                     backCode: '',         // 退单号
-                    backPrice: '',        // 退定金额
+                    backPrice: '',        // 退订金额
                     name: '',             // 收款人姓名
                     account: '',          // 收款人银行账号
                     bank: '',             // 银行名称
-                    reason: '',           // 退定原因
-                    status: ''            // 退单状态
+                    reason: '',           // 退订原因
+                    status: '',         // 退单状态
+                    orderId: '',         //订单主键
+                    orderCode: '',          //订单code
+                    backPrice: '',           //价格
+                    name: '',     //  退货人姓名
+                    mobile: '',  //   退货人手机号
                 },
-                refundDealtis:{
-
-            },
-                refundFormRules: {
-                    backCode: [
-                        {required: true, message: '请输入退单号', trigger: 'blur'}
-                    ],
-                    backPrice: [
-                        {validator: this.$validator.backPrice, trigger: 'blur'}
-                    ],
-                    name: [
-                        {validator: this.$validator.name, trigger: 'blur'}
-                    ],
-                    account: [
-                        {validator: this.$validator.account, trigger: 'blur'}
-                    ],
-                    bank: [
-                        {required: true, message: '请输入银行名称', trigger: 'blur'}
-                    ],
-                },
-                dealerReason:[
+                refundDealtis: {},
+                // refundFormRules: {
+                //     backCode: [
+                //         {required: true, message: '请输入退单号', trigger: 'blur'}
+                //     ],
+                //     backPrice: [
+                //         {validator: this.$validator.backPrice, trigger: 'blur'}
+                //     ],
+                //     name: [
+                //         {validator: this.$validator.name, trigger: 'blur'}
+                //     ],
+                //     account: [
+                //         {validator: this.$validator.account, trigger: 'blur'}
+                //     ],
+                //     bank: [
+                //         {required: true, message: '请输入银行名称', trigger: 'blur'}
+                //     ],
+                // },
+                dealerReason: [
                     {
                         label: '72小时内',
                         value: "1"
@@ -680,6 +746,11 @@
             // 退款按钮
             refundBtn(row, index) {
                 this.refundForm.customerId = row.customerId;
+                this.refundForm.orderId = row.id;
+                this.refundForm.orderCode = row.code;
+                this.refundForm.backPrice = row.depositPrice;
+                this.refundForm.name = row.name;
+                this.refundForm.mobile = row.mobile;
                 let params = {
                     customerId: row.customerId,
                     orderId: row.id
@@ -690,7 +761,7 @@
                         if (res.status === 200) {
                             if (res.data.success) {
                                 this.refundState = res.data.data;
-                                Message.success(res.data.data);
+                                // Message.success(res.data.data);
                                 this.refundDialog = true;
                             } else {
                                 Message.error(res.data.error);
@@ -702,13 +773,18 @@
                     })
             },
             refreshTable() {
-                this.orderNumber = '';
+                this.queryData = {};
                 this.getRows();
             },
             // 获取订单列表信息
             getRows() {
                 let data = {
-                    code: this.orderNumber,
+                    payType: 2,
+                    code: this.queryData.orderNumber,
+                    name: this.queryData.name,
+                    mobile: this.queryData.mobile,
+                    status: this.queryData.status,
+                    offlinePayType: this.queryData.offlinePayType,
                     currentPage: this.currentPage,
                     pageNumber: this.pageSize
                 };
@@ -740,11 +816,24 @@
                 let jsInfo = JSON.parse(info);
                 this.matchingInfo = jsInfo;
             },
+            //首付款线下支付状态
+            OfflinePay(data) {
+                //判断有没有线下支付信息 如果没有有就根据订单状态判断
+                if (data.offlinePayments == undefined) {
+                    if (data.status == 3) {
+                        return '线上已支付';
+                    }
+                } else {
+
+                    return data.offlinePayments.downPaymentStatus == 0 ? '未支付' : '线下已支付';
+                }
+                return "未支付";
+            },
             // 单款状态
             loanState(data) {
                 var data = data;
                 var val = data.loanStatus;
-                if (data.payType==1){
+                if (data.payType == 1) {
                     val = 0;
                 }
                 let str = "";
@@ -814,7 +903,7 @@
                             if (res.data.success) {
                                 Message.success(res.data.data);
                             } else {
-                                Message.error( res.data.error);
+                                Message.error(res.data.error);
                             }
                         } else {
                             Message.error(res.data.error)
@@ -925,6 +1014,10 @@
             },
             // 保存退单信息
             saveRefundInfo(formName) {
+                if (this.refundForm.reason == "") {
+                    Message.success("请选择退订原因")
+                    return;
+                }
                 this.$refs[formName].validate((valid) => {
                     if (valid) {
                         let params = {
@@ -936,15 +1029,19 @@
                             bank: this.refundForm.bank,
                             reason: this.refundForm.reason,
                             status: this.refundForm.status,
-                            dealerReason: this.refundState
+                            dealerReason: this.refundState,
+                            orderId: this.refundForm.orderId,
+                            orderCode: this.refundForm.orderCode,
+                            backPrice: this.refundForm.backPrice
+
                         };
                         this.$post("/business/CarBackOrder/save", params)
                             .then(res => {
                                 if (res.status === 200) {
                                     if (res.data.success) {
-                                        Message.success(res.data.data);
+                                        Message.success("提交成功");
                                     } else {
-                                        Message.warning(res.data.error);
+                                        Message.warning("提交失败");
                                     }
                                     this.resetForm('refundForm');
                                     setTimeout(() => {
@@ -965,8 +1062,8 @@
                     this.$refs[formName].resetFields();
                 }
             },
-            Detailsofrefund(id,refundStatus){
-                if (refundStatus == 0){
+            Detailsofrefund(id, refundStatus) {
+                if (refundStatus == 0) {
                     return;
                 }
                 let params = {
@@ -978,7 +1075,7 @@
                             if (res.data.success) {
                                 this.refundDealtis = res.data.data;
 
-                                this.refundDeaDialog=true;
+                                this.refundDeaDialog = true;
                                 // Message.success(res.data.data);
                             } else {
                                 Message.warning(res.data.error);
@@ -988,8 +1085,13 @@
                     })
 
             },
-            open :function (file) {
-                console.log(file)
+            open: function (file) {
+
+
+                if (file == 0 || file == undefined) {
+                    Message.warning("没有图片上传");
+                    return;
+                }
                 this.dialogImageUrl = file;
                 this.images = this.dialogImageUrl.split(",");
                 console.log(this.images);
@@ -1005,7 +1107,6 @@
     input[type=number] {
         -moz-appearance: textfield;
     }
-
     input[type=number]::-webkit-inner-spin-button,
     input[type=number]::-webkit-outer-spin-button {
         -webkit-appearance: none;

src/components/login.vue

@@ -1,126 +1,194 @@
 <template>
-  <div class="hp100">
-    <el-container class="hp100">
-      <el-main class="main">
-        <img src="../assets/logo.png" />
-        <el-form :inline="true" :model="formInline" class="demo-form-inline">
-          <el-form-item label>
-            <el-input
-              v-model="formInline.userCode"
-              auto-complete="off"
-              class="logininp"
-              placeholder="用户名"
-            >
-              <i slot="prefix" class="el-input__icon el-icon-date"></i>
-            </el-input>
-          </el-form-item>
-          <el-form-item label>
-            <el-input
-              v-model="formInline.password"
-              auto-complete="off"
-              class="logininp"
-              type="password"
-              placeholder="密码"
-            >
-              <i slot="prefix" class="el-input__icon el-icon-date"></i>
-            </el-input>
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" class="logininp" @click="login">登录</el-button>
-          </el-form-item>
-        </el-form>
-      </el-main>
-      <el-footer height="80px" class="footer"></el-footer>
-    </el-container>
-  </div>
-</template>
+    <div class="hp100">
+
+
+        <el-container class="hp100" v-loading=loading>
+            <el-main class="main" v-show="loginShow">
+                <img src="../assets/logo.png"/>
+                <el-form :inline="true" :model="formInline" class="demo-form-inline">
+                    <el-form-item label>
+                        <el-input
+                                v-model="formInline.userCode"
+                                auto-complete="off"
+                                class="logininp"
+                                placeholder="用户名">
+                            <i slot="prefix" class="el-input__icon el-icon-date"></i>
+                        </el-input>
+                    </el-form-item>
+                    <el-form-item label>
+                        <el-input
+                                v-model="formInline.password"
+                                auto-complete="off"
+                                class="logininp"
+                                type="password"
+                                placeholder="密码">
+                            <i slot="prefix" class="el-input__icon el-icon-date"></i>
+                        </el-input>
+                    </el-form-item>
+                    <el-form-item>
+                        <el-button type="primary" class="logininp" @click="login">登录</el-button>
+                    </el-form-item>
+                </el-form>
+            </el-main>
+            <el-footer height="80px" class="footer"></el-footer>
+        </el-container>
 
-<script>
-export default {
-  name: "login",
-  data() {
-    return {
-      formInline: {
-        userCode: "xxs2",
-        password: "123456"
-      }
-    };
-  },
-  methods: {
-    login() {
-      this.$post("/login", this.formInline)
-        .then(
-          response => {
-            console.log('登录成功',response);
-            if (response.status == 200) {
-              if (response.data.success == true) {
-                window.localStorage.setItem(
-                  "userId",
-                  response.data.data.dealerID
-                );
-                window.localStorage.setItem(
-                  "zptoken",
-                  response.data.data.userName
-                );
 
-                window.localStorage.setItem(
-                  "personInfo",
-                  JSON.stringify(response.data.data)
-                );
-                this.$router.push({
-                  path: "/home",
-                  query: { sysUser: response.data.data }
-                });
+    </div>
+</template>
 
-                //路由存储菜单
+<script>
+    import {utils} from "../utils/config";
 
-                this.menuList = response.data.data.menus;
+    export default {
+        name: "login",
+        data() {
+            return {
+                fullscreenLoading: false,
+                formInline: {
+                    userCode: "",
+                    password: ""
+                },
+                casualBacking:'',
+                loginShow:false,
+                loading:false,
+            };
+        },
+        created(){
+            var token = window.location.search.substr(1).split('=')[1];
+            if (token){
+                this.loading = true;
+                console.log(token)
+                this.casualBacking = token
+                this.secretLogin()
+            }else {
+                this.loading = false;
 
-                this.currentMenu = this.menuList[0].name;
+                this.loginShow = true;
+            }
+        },
+        methods: {
+            getQueryString: function (name) {
+                var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
+                var r = window.location.search.substr(1).match(reg);//search,查询？后面的参数，并匹配正则
+                if(r!=null)return  unescape(r[2]); return null;
+            },
+            getFirstQueryString: function (name) {
+                var reg = new RegExp("(^|&)=([^&]*)(&|$)");
+                var r = window.location.search.substr(1).match(reg);//search,查询？后面的参数，并匹配正则
+                if(r!=null)return  unescape(r[2]); return null;
+            },
+            secretLogin(){
+                let data = {
+                    casualBacking : this.casualBacking
+                 };
+                this.$post("/secretLogin",data)
+                    .then(
+                        response => {
+                            if (response.status == 200) {
+                                if (response.data.success == true) {
+                                    window.localStorage.removeItem("menuName");
+                                    window.localStorage.removeItem("menuIndex");
+                                    window.localStorage.setItem(
+                                        "userId",
+                                        response.data.data.dealerID
+                                    );
+                                    window.localStorage.setItem(
+                                        "zptoken",
+                                        response.data.data.name
+                                    );
+                                    window.localStorage.setItem(
+                                        "personInfo",
+                                        JSON.stringify(response.data.data)
+                                    );
+                                        this.$router.replace({ path: "/home/order"})
 
-                this.$router.push({ path: "/home/" + this.menuList[0].url });
-              } else if (response.data.success == false) {
-                this.$message.error(response.data.error);
-              } else {
-                this.$message.error("登录失败");
-              }
-            } else {
-              this.$message.error("服务器连接异常");
+                                    // });
+                                } else  {
+                                    this.loginShow = true;
+                                    this.loading=false;
+                                    this.$message.error( "跳转失败，请手动登录");
+                                }
+                            } else {
+                                this.loginShow = true;
+                                this.loading=false;
+                                this.$message.error("跳转失败，请手动登录");                        }
+                        },
+                        response => {
+                            this.loginShow = true;
+                            this.loading=false;
+                            this.$message.error( "跳转失败，请手动登录");
+                        }
+                    );
+            },
+            login() {
+                this.$post("/login", this.formInline)
+                    .then(
+                        response => {
+                            if (response.status == 200) {
+                                if (response.data.success == true) {
+                                    window.localStorage.removeItem("menuName");
+                                    window.localStorage.removeItem("menuIndex");
+                                    window.localStorage.setItem(
+                                        "userId",
+                                        response.data.data.dealerID
+                                    );
+                                    window.localStorage.setItem(
+                                        "zptoken",
+                                        response.data.data.name
+                                    );
+                                    window.localStorage.setItem(
+                                        "personInfo",
+                                        JSON.stringify(response.data.data)
+                                    );
+                                    this.$router.push({
+                                        path: "/home/order"
+                                    });
+                                } else if (response.data.success == false) {
+                                    this.$message.error(response.data.error);
+                                } else {
+                                    this.$message.error("登录失败");
+                                }
+                            } else {
+                                this.$message.error("服务器连接异常");
+                            }
+                        },
+                        response => {
+                        }
+                    );
             }
-          },
-          response => {
-            console.log("请求失败", response);
-          }
-        );
-    }
-  }
-};
+        }
+    };
 </script>
 <style>
-.logininp input {
-  border: none;
-  background: #f1f1f1;
-}
+    .logininp input {
+        border: none;
+        background: #f1f1f1;
+    }
 </style>
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style lang="less" scoped>
-.main {
-  padding-top: 264px;
-}
-.main img {
-  width: 251px;
-  display: block;
-  margin: 0 auto 37px;
-}
-.footer {
-  background: #b79267;
-  box-sizing: border-box;
-}
-.logininp {
-  width: 230px;
-}
-.demo-form-inline {
-  width: 741px;
-  margin: 0 auto;
-}
+    .main {
+        padding-top: 264px;
+    }
+
+    .main img {
+        width: 251px;
+        display: block;
+        margin: 0 auto 37px;
+    }
+
+    .footer {
+        background: #b79267;
+        box-sizing: border-box;
+    }
+
+    .logininp {
+        width: 230px;
+    }
+
+    .demo-form-inline {
+        width: 741px;
+        margin: 0 auto;
+    }
 </style>

src/components/order.vue

@@ -0,0 +1,465 @@
+<template>
+    <div id="table">
+        <el-row>
+            <el-col :span="24">
+                <el-input v-model="queryData.orderCode" placeholder="订单号" style="width: 150px"></el-input>
+                <el-input v-model="queryData.customerName" placeholder="注册账户（手机号）" style="width: 150px"></el-input>
+                <el-input v-model="queryData.receiptMobile" placeholder="收货人手机号" style="width: 150px"></el-input>
+                <el-input v-model="queryData.receiptName" placeholder="收货人姓名" style="width: 150px"></el-input>
+                <el-select v-model="queryData.status" filterable placeholder="请选择订单状态">
+                    <el-option
+                            v-for="item in orderStatusSelect"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value">
+                    </el-option>
+                </el-select>
+                <el-button type="primary" @click="getRows">搜索</el-button>
+                <el-button type="warning" @click="refreshTable">清空</el-button>
+            </el-col>
+        </el-row>
+        <el-table :data="tableData" ref="table" :height="autoHeight" border stripe v-loading="loading"
+                  style="margin-top: 10px">
+            <el-table-column type="index" label="排序" width="80"></el-table-column>
+            <el-table-column
+                    prop="orderCode"
+                    label="订单号"
+                    width="200px"
+                    align="center">
+            </el-table-column>
+            <el-table-column
+                    prop="status"
+                    label="订单状态"
+                    align="center">
+                <template slot-scope="scope">
+                    {{orderStatusOptions[scope.row.status-1].label}}
+                </template>
+            </el-table-column>
+            <el-table-column
+                    prop="customerName"
+                    label="注册账户"
+                    align="center"
+                    width="200px"
+            >
+            </el-table-column>
+            <el-table-column
+                    prop="receiptName"
+                    label="收货人姓名"
+                    width="150px"
+                    align="center">
+            </el-table-column>
+            <el-table-column
+                    prop="receiptMobile"
+                    label="收货人手机号"
+                    width="200px"
+                    align="center">
+            </el-table-column>
+            <el-table-column
+                    prop="address"
+                    label="收货人地址"
+                    align="center"
+                    width="200"
+                    show-overflow-tooltip
+            >
+            </el-table-column>
+            <el-table-column
+                    prop="createTime"
+                    label="下单时间"
+                    width="200px"
+                    align="center">
+            </el-table-column>
+            <el-table-column
+                    prop="orderType"
+                    label="订单类型"
+                    align="center">
+                <template slot-scope="scope">
+                    {{orderTypeOptions[scope.row.orderType].label}}
+                </template>
+            </el-table-column>
+            <el-table-column
+                    prop="originalPrice"
+                    label="订单总额"
+                    align="center">
+            </el-table-column>
+
+            <el-table-column
+                    prop="payType"
+                    label="支付方式	"
+                    align="center">
+                <template slot-scope="scope">
+                    {{payTypeOptions[scope.row.payType].label}}
+                </template>
+            </el-table-column>
+            <el-table-column
+                    prop="source"
+                    label="来源	"
+                    align="center">
+                <template slot-scope="scope">
+                    {{sourceOptions[scope.row.source-1].label}}
+                </template>
+            </el-table-column>
+            <el-table-column label="操作 " width="160px" fixed="right" align="center">
+                <template slot-scope="scope">
+                    <el-button @click="orderDetails(scope.row.id)" type="success" round>查看</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+
+        <el-pagination
+                @size-change="handleSizeChange"
+                @current-change="handleCurrentChange"
+                :current-page="currentPage"
+                :page-sizes="[15, 20, 25, 30]"
+                :page-size="pageSize"
+                layout="total, sizes, prev, pager, next, jumper"
+                :total="totalNumber">
+        </el-pagination>
+
+    </div>
+</template>
+
+<script>
+    import {utils} from "../utils/config";
+    import * as Api from "../utils/server"
+    import {Message} from "element-ui"
+
+    export default {
+        name: "",
+        data() {
+            return {
+                tableData: [],
+                loading: true,
+                totalNumber: null,
+                totalPage: null,
+                currentPage: 1,
+                pageSize: 15,
+                images: '',
+                examineForm: {
+                    loanStatus: '',  // 状态
+                    downPaymentRate: ''  // 比例
+                },
+                queryData: {
+                    status:'',//订单状态
+                    orderCode: '', //订单号
+                    customerMobile: '', //注册手机号
+                    receiptMobile: '', //收货人手机号
+                    receiptName: '',//收货人姓名
+                },
+                sourceOptions: [
+                    {
+                        value: '1',
+                        label: "pc"
+                    }, {
+                        value: '2',
+                        label: "h5"
+                    }, {
+                        value: '3',
+                        label: "app"
+                    }
+                ],
+                payTypeOptions: [
+                    {
+                        value: '0',
+                        label: "在线支付"
+                    }, {
+                        value: '1',
+                        label: "货到付款"
+                    }
+                ],
+                orderStatusOptions: [
+                    {
+                        value: '1',
+                        label: "待付款"
+                    },
+                    {
+                        value: '2',
+                        label: "待发货"
+                    }, {
+                        value: '3',
+                        label: "待收货"
+                    }, {
+                        value: '4',
+                        label: "已完成"
+                    },
+                    {
+                        value: '5',
+                        label: "取消订单"
+                    },
+
+                    {
+                        value: '6',
+                        label: "退款通过"
+                    }, {
+                        value: '7',
+                        label: "退货通过"
+                    },
+                ],
+                orderStatusSelect: [
+                    // {
+                    //     value: '1',
+                    //     label: "待付款"
+                    // },
+                    {
+                        value: '2',
+                        label: "待发货"
+                    }, {
+                        value: '3',
+                        label: "待收货"
+                    }, {
+                        value: '4',
+                        label: "已完成"
+                    },
+                    // {
+                    //     value: '5',
+                    //     label: "取消订单"
+                    // },
+
+                    {
+                        value: '6',
+                        label: "退款通过"
+                    }, {
+                        value: '7',
+                        label: "退货通过"
+                    },
+                ],
+                orderTypeOptions: [
+                    {
+                        value: '0',
+                        label: "普通订单"
+                    }, {
+                        value: '1',
+                        label: "定金预售订单"
+                    }, {
+                        value: '2',
+                        label: "2全款预售订单"
+                    }, {
+                        value: '3',
+                        label: "拼团订单"
+                    }, {
+                        value: '4',
+                        label: "众筹全款"
+                    }, {
+                        value: '5',
+                        label: "众筹1元"
+                    }, {
+                        value: '6',
+                        label: "众筹无回报"
+                    }, {
+                        value: '7',
+                        label: "虚拟商品订单"
+                    }, {
+                        value: '8',
+                        label: "社区团购订单"
+                    }
+                ]
+
+            };
+        },
+        computed: {
+            autoHeight() {
+                return window.innerHeight - 277
+            }
+        },
+        mounted() {
+            this.getRows();
+        },
+        destroyed() {
+            sessionStorage.removeItem('imgUrl');
+            sessionStorage.removeItem('imgUrls');
+        },
+        methods: {
+            getRows() {
+                let data = {
+
+                    orderCode: this.queryData.orderCode,
+                    customerName: this.queryData.customerName,
+                    receiptMobile: this.queryData.receiptMobile,
+                    receiptName: this.queryData.receiptName,
+                    status: this.queryData.status,
+                    currentPage: this.currentPage,
+                    pageNumber: this.pageSize
+                };
+                this.$get("business/Order/page", data).then(
+                    response => {
+                        if (response.status == 200) {
+                            this.loading = false;
+                            this.tableData = response.data.data.pp;
+                            this.totalNumber = response.data.data.page.totalNumber;
+                            this.$message.success("数据加载成功");
+                        } else {
+                            this.$message.success("服务器连接异常");
+                        }
+                    },
+                    response => {
+                        this.$message.success("服务器连接异常");
+                    }
+                );
+            },
+            orderDetails(id) {
+                this.$router.push({path: '/home/orderDetails', query: {id: id}})
+            },
+            refreshTable() {
+                this.queryData = {};
+                this.getRows();
+            },
+            pageChange: function (page) {
+                this.currentPage = page;
+                this.getRows();
+            },
+            sizeChange: function (size) {
+                this.pageSize = size;
+                this.getRows();
+            },
+            // 改变当前页面条数
+            handleSizeChange(val) {
+                console.log(`每页 ${val} 条`);
+                this.currentPage = 1;
+                this.pageSize = val;
+                this.loading = true;
+                this.getRows();
+            },
+            // 改变当前页
+            handleCurrentChange(val) {
+                console.log(`当前页: ${val}`);
+                this.currentPage = val;
+                this.loading = true;
+                this.getRows();
+            },
+            // 关闭审核对话框
+            closeExamineDialog() {
+                this.examineDialog = false;
+            },
+            // 对话框关闭 清空对话框form表单
+            clearForm(formName) {
+                this.resetForm(formName);
+            },
+            // 表单重置
+            resetForm(formName) {
+                if (this.$refs[formName] !== undefined) {
+                    this.$refs[formName].resetFields();
+                }
+            },
+
+        },
+    };
+</script>
+
+<style scoped lang="less">
+    input[type=number] {
+        -moz-appearance: textfield;
+    }
+
+    input[type=number]::-webkit-inner-spin-button,
+    input[type=number]::-webkit-outer-spin-button {
+        -webkit-appearance: none;
+        margin: 0;
+    }
+
+    #carInfoDialog {
+        ul {
+            padding: 5px;
+
+            li {
+                display: flex;
+                align-items: center;
+                overflow: hidden;
+                padding: 5px;
+
+                span {
+                    display: inline-block;
+                    width: 150px;
+                    font-size: 15px;
+                    font-weight: bold;
+                }
+            }
+        }
+    }
+
+    #matchingDialog {
+        ul {
+            padding: 5px;
+
+            li {
+                margin-top: 10px;
+                padding: 10px;
+                box-shadow: 0 0 10px #ccc;
+
+                h4 {
+                    font-size: 16px;
+                }
+
+                p {
+                    margin-top: 10px;
+
+                    span {
+                        display: inline-block;
+                        font-size: 15px;
+                        text-align: right;
+
+                        &:first-child {
+                            margin-left: 20px;
+                        }
+                    }
+
+                    i {
+                        margin-left: 10px;
+                        font-style: normal;
+                        font-size: 14px;
+                        display: inline-block;
+                        min-width: 120px;
+                    }
+                }
+            }
+        }
+    }
+
+    #examineDialog {
+        .el-form--inline .el-form-item {
+            width: 100%;
+            margin-right: 0;
+
+            .inline-input {
+                -webkit-appearance: none;
+                background-color: #fff;
+                background-image: none;
+                border-radius: 4px;
+                border: 1px solid #dcdfe6;
+                -webkit-box-sizing: border-box;
+                box-sizing: border-box;
+                color: #606266;
+                display: inline-block;
+                font-size: inherit;
+                height: 40px;
+                line-height: 40px;
+                outline: none;
+                padding: 0 15px;
+                -webkit-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+                -o-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+                transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+                width: 217px;
+            }
+
+            .inline-span {
+                display: inline-block;
+                margin-left: 10px;
+                font-size: 16px;
+                color: #f15353;
+            }
+        }
+
+    }
+
+    .link {
+        text-decoration: none;
+
+        &:link {
+            border: none;
+            color: #5eb3e6;
+        }
+
+        &:focus {
+            outline-style: none;
+            outline-width: 0;
+        }
+    }
+</style>

src/components/orderDetails.vue

@@ -0,0 +1,333 @@
+<!--suppress ALL -->
+<template height="800px">
+    <div class="icard">
+        <el-steps :active=this.active align-center>
+            <el-step title="已下单">
+                <template slot="description">
+                    {{this.orderData.createTime}}
+                </template>
+            </el-step>
+            <el-step title="已付款">
+                <template slot="description">
+                    {{this.orderData.payTime}}
+                </template>
+            </el-step>
+            <el-step title="已发货">
+                <template slot="description">
+                    {{this.orderData.deliveryTime}}
+                </template>
+            </el-step>
+            <el-step title="已完成">
+                <template slot="description">
+                    {{this.orderData.receivingTime}}
+                </template>
+            </el-step>
+        </el-steps>
+        <div >
+            <el-card class="box-card">
+                <div slot="header" class="clearfix">
+                    订单概况
+                </div>
+                <div class="text item">
+                    <el-form ref="form" :model="orderData" label-width="160px">
+                        <el-row>
+                            <el-col :span="8">
+                                <el-form-item label="订单编号：">
+                                    {{orderData.orderCode}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="下单时间：">
+                                    {{orderData.createTime}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="订单状态：">
+                                    {{getStatus(orderData.status)}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="是否使用预存款支付：">
+                                    {{orderData.predepositPay==0?'否':'是'}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="满优惠金额：">
+                                    {{getfullPrice()}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="优惠卷金额：">
+                                    {{orderData.couponPrice.toFixed(2)}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="红包金额：">
+                                    {{orderData.redEnvelopePrice.toFixed(2)}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="订单原始金额：">
+                                    {{orderData.originalPrice.toFixed(2)}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="订单总优惠金额：">
+                                    {{orderData.concessionalRate.toFixed(2)}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="订单修改金额：">
+                                    {{orderData.modifyPrice.toFixed(2)}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="订单实际交易金额：">
+                                    {{orderData.price.toFixed(2)}}
+                                </el-form-item>
+                            </el-col>
+                        </el-row>
+                    </el-form>
+                </div>
+            </el-card>
+
+            <el-card class="wuliu-card" v-show=isNotvirtualOrder>
+                <div slot="header" class="clearfix">
+                    物流信息
+                </div>
+                <div class="text item">
+                    <el-form ref="form" :model="orderData" label-width="160px">
+                        <el-row>
+                            <el-col :span="8">
+                                <el-form-item label="物流公司：">
+                                   {{ getLogisticsCompany(orderData)}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="物流单号：">
+                                    {{orderData.waybillCode}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="配送方式：">
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="运费：">
+                                    {{orderData.freightPrice.toFixed(2)}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="收货地址：">
+                                    {{orderData.orderAttr.receiptAddress}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="详细地址：">
+                                    {{orderData.orderAttr.receiptDetailAddress}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="收货人：">
+                                    {{orderData.orderAttr.receiptName}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="手机：">
+                                    {{orderData.orderAttr.receiptMobile}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="邮编：">
+                                    {{orderData.orderAttr.receiptZipCode}}
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="客户留言：">
+                                    {{orderData.orderAttr.remark}}
+                                </el-form-item>
+                            </el-col>
+                        </el-row>
+                    </el-form>
+                </div>
+            </el-card>
+            <el-table :data="orderData.orderSkus" ref="table" :height="autoHeight" border stripe v-loading="loading"
+                      style="margin-top: 10px">
+                <el-table-column type="index" label="排序" width="80"></el-table-column>
+                <el-table-column
+                        prop="skuImage"
+                        label="商品图片"
+                        align="center">
+                    <template slot-scope="scope">
+                        <img :src="scope.row.skuImage"style="width: 60px;height:60px;display: inline-block">
+                    </template>
+                </el-table-column>
+                <el-table-column
+                        prop="skuName"
+                        label="商品名称"
+                        align="center">
+                </el-table-column>
+                <el-table-column
+                        prop="skuPrice"
+                        label="销售价"
+                        align="center">
+                    <template slot-scope="scope">
+                        {{scope.row.skuPrice.toFixed(2)}}
+                    </template>
+                </el-table-column>
+                <el-table-column
+                        prop="num"
+                        label="数量"
+                        align="center">
+                </el-table-column>
+                <el-table-column
+                        prop="skuSpecs"
+                        label="商品规格"
+                        align="center">
+                </el-table-column>
+                <el-table-column
+                        prop="price"
+                        label="商品总价"
+                        align="center">
+                    <template slot-scope="scope">
+                        {{scope.row.price.toFixed(2)}}
+                    </template>
+                </el-table-column>
+            </el-table>
+        </div>
+    </div>
+
+</template>
+
+<script>
+    export default {
+        created() {
+            this.id = this.$route.query.id;
+            if (this.id) {
+                this.getOrder(this.id);
+            } else {
+                this.$router.push({path: '/home/order'})
+            }
+
+        },
+        data() {
+            return {
+                active: 0,
+                orderData: {},
+                id: '',
+                isNotvirtualOrder: true,
+                status: [
+                    {
+                        value: '1',
+                        label: '未付款'
+                    }, {
+                        value: '2',
+                        label: '已付款未发货'
+                    }, {
+                        value: '3',
+                        label: '已发货'
+                    }, {
+                        value: '4',
+                        label: '已完成'
+                    }, {
+                        value: '5',
+                        label: '关闭交易'
+                    }, {
+                        value: '6',
+                        label: '关闭交易'
+                    }, {
+                        value: '7',
+                        label: '关闭交易'
+                    },
+                ]
+            };
+        },
+        methods: {
+            getLogisticsCompany(orderData){
+               if ( orderData.logisticsTemplate){
+                   return orderData.logisticsTemplate.logisticsCompany.name;
+               }
+                return "";
+
+            },
+            getOrder(orderId) {
+                this.$get("/business/Order/get/" + orderId).then(
+                    response => {
+                        if (response.status == 200) {
+                            if (response.data.success){
+                                this.loading = false;
+                                this.orderData = response.data.data;
+
+                                if (this.orderData.orderType == '7') {
+                                    this.isNotvirtualOrder = true;
+                                }
+                                // 优惠价格没有 则设置为0
+                                if (this.orderData.concessionalRate == null) {
+                                    this.orderData.concessionalRate = 0;
+                                }
+                                // 红包价格没有则设置为0
+                                if (this.orderData.redEnvelopePrice == null) {
+                                    this.orderData.redEnvelopePrice = 0;
+                                }
+                                this.active = parseInt(this.orderData.status);
+
+                            }else {
+                                console.log()
+                                this.$message.error(response.data.error);
+                                this.$router.push({path: '/home/order'})
+                            }
+
+                        } else {
+                            this.$message.success("服务器连接异常");
+
+                        }
+                    },
+                    response => {
+                        this.$message.success("服务器连接异常");
+                    }
+                );
+            },
+            getQueryString: function (name) {
+                var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|丨)", "i");
+                var r = window.location.search.substr(1).match(reg);
+                if (r != null) return unescape(r[2]);
+                return null;
+            },
+            getStatus(val) {
+                return this.status.find(i => i.value === val).label;
+            },
+            getfullPrice() {
+
+                return (this.orderData.concessionalRate - this.orderData.pointPrice - this.orderData.couponPrice - this.orderData.redEnvelopePrice).toFixed(2)
+            },
+            back: function () {
+                this.丨router.push({path: "/home/carorder"});
+            }
+        }
+    };
+
+</script>
+<style>
+    .text {
+        font-size: 14px;
+    }
+
+    .item {
+        margin-bottom: 18px;
+    }
+
+    .clearfix:before,
+    .clearfix:after {
+        display: table;
+        content: "";
+    }
+
+    .clearfix:after {
+        clear: both
+    }
+
+    .icard {
+        overflow-y: auto;
+        height: 100%;
+    }
+</style>

src/components/role.vue

@@ -1,291 +0,0 @@
-<template>
-  <div class="">
-        <el-form :inline="true" :model="formInline" class="demo-form-inline">
-            <el-form-item label="">
-                <el-button   @click="pulish" class="w150" type="success">添加角色</el-button>
-            </el-form-item>
-        </el-form>
-        <el-table :data="tableData" border style="width: 100%" header-row-class-name="bgd8">
-                    
-                    <el-table-column  label="序号" type="index" > </el-table-column>
-                    <el-table-column prop="name" label="角色名称" :show-overflow-tooltip="true"> </el-table-column>
-                    <el-table-column prop="createTime" label="创建日期"> 
-                        <template slot-scope="scope">
-                               <span>{{scope.row.createTime|formatDate}}</span>
-                        </template>
-                    </el-table-column>
-                    <el-table-column label="操作 " width="250px">
-                        <template slot-scope="scope">
-                            <el-button type="success" size="small"  @click="edit2(scope.row)">分配权限</el-button>
-                            <el-button type="info" size="small"  @click="edit(scope.row)">编辑</el-button>
-                            <el-button type="danger" size="small"  @click="del(scope.row)">删除</el-button>
-                        </template>
-                    </el-table-column>
-        </el-table>
-         <el-pagination background  layout="prev, pager, next" :total="totalCount" @current-change="currentChange" @prev-click="prevClick" @next-click="nextClick"> </el-pagination>
-        <el-dialog title="添加角色" class="w750" :visible.sync="dialogTableVisible">
-          <el-form ref="ruleForm" :inline="true" :model="formData" class="msgform newstypeform" label-width="100px">
-            <el-form-item label="角色名称" prop="name" class="formblock is-required">
-              <el-input class="w300" v-model="formData.name"></el-input>
-            </el-form-item>
-            <el-button type="primary" class="w140" size="small" @click="onSubmit">确认</el-button>
-          </el-form>
-        </el-dialog>
-
-        <el-dialog title="分配权限" width="450px" :visible.sync="dialogTableVisible2">
-          <el-checkbox-group class="panel"  v-model="checkedPermissions">
-            <el-checkbox class="block" v-for="item in permissions" :label="item.id" :value="item.id" :key="item.id">{{item.name}}</el-checkbox>
-          </el-checkbox-group>
-          <span slot="footer" class="dialog-footer">
-              <el-button type="primary" @click="submitPer">确 定</el-button>
-          </span>
-        </el-dialog>
-  </div>
-</template>
-
-<script>
-// import ueditor from './ue.vue' //调用编辑器
-export default {
-  name: 'HelloWorld',
-  data () {
-    return {
-      tableData: [{}],
-      selected:'',
-      curPage:1,
-      totalCount:0,
-      selectData:[],
-      formInline:{},
-      permissions:[],
-      dialogTableVisible:false,
-      dialogTableVisible2:false,
-      formData:{
-          name:''
-        },
-     mainImg:'',
-     checkedPermissions:[],
-     roleId:''
-    }
-  },
-  filters:{
-    formatDate(date){
-      date=new Date(date);
-      var year=date.getFullYear();
-      var month=date.getMonth()+1;
-      var day=date.getDate();
-      if(month<10){
-        month='0'+month;
-      }
-      return year+'-'+month+'-'+day;
-    }
-  },
-  methods:{
-      submitPer(){
-        this.$http.get(this.$store.state.httpApi + 'sysRolePermission/saveSysRolePermission?roleId='+this.roleId+'&perIds='+this.checkedPermissions).then(response =>{
-          if(response.status == 200){
-               this.$message.success("分配成功");
-               this.dialogTableVisible2=false;
-          }else{
-            console.log('接口返回失败!',response);
-          }
-          },response => {
-            console.log('请求失败',response)
-          })
-      },
-      edit(data){
-         if(this.$refs.ruleForm){
-            this.$refs.ruleForm.resetFields();
-          }
-          this.dialogTableVisible=true;
-          this.formData.name = data.name;
-          this.formData.id=data.id;
-      },
-      edit2(data){
-          this.roleId=data.id;
-          this.$http.get(this.$store.state.httpApi + 'sysRolePermission/allPermission?sysRoleId='+data.id).then(response =>{
-          if(response.status == 200){
-              if(response.data.data){
-                this.checkedPermissions=response.data.data;
-              }else{
-                this.checkedPermissions=[];
-              }
-              
-          }else{
-            console.log('接口返回失败!',response);
-          }
-          },response => {
-            console.log('请求失败',response)
-          })
-          this.dialogTableVisible2=true;
-          this.formData.id=data.id;
-      },
-      uploadSuccess(file){
-          if(this.model=='mainImg'){
-              this[this.model]=file.data[0];
-          }else{
-              this[this.model].push(file.data[0])
-          }
-      },
-      onSubmit(){
-            var flag=true;
-            for (var j in this.formData){    
-              if(this.formData[j]==''){
-              flag=false;
-            }
-           } 
-           if(flag){
-            this.$http.post(this.$store.state.httpApi + (this.formData.id ?'sysRole/update':'sysRole/save'),this.formData).then(response =>{
-              if(response.status == 200){
-                  if(response.data.success == false){
-                   this.$message.error("该类别已存在");
-                  }else{
-                   this.$message.success(this.formData.id ? '修改成功' : '创建成功');
-                   this.dialogTableVisible=false;
-                   this.getRows();
-                  }
-              }else{
-                console.log('接口返回失败!',response);
-              }
-              },response => {
-                console.log('请求失败',response)
-              }) 
-           }else{
-             this.$message.error('您还有必填项还没有填！');
-           }        
-      },
-      pulish(){
-          this.formData.name = "";
-          this.dialogTableVisible=true;
-          
-      },
-      del(data){
-        this.$confirm('确定要删除吗?', '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          type: 'warning'
-        }).then(() => {
-          var id =data.id;
-          var httpApi=this.$store.state.httpApi;
-          this.$http.post(this.$store.state.httpApi + 'sysRole/del?id='+id).then(response =>{
-            if(response.status == 200){
-              this.$message.success('删除成功');
-					    this.getRows();
-            }else{
-              console.log('接口返回失败!',response);
-            }
-          },response => {
-            
-            console.log('请求失败',response)
-          })
-        }).catch(() => {
-          this.$message({
-            type: 'info',
-            message: '已取消删除'
-          });          
-        });
-      },
-       currentChange(page){
-          this.curPage = page;
-          this.getRows();
-      },
-      //上一页
-      prevClick(page){
-          this.curPage = page;
-          this.getRows();
-      },
-    //  下一页
-      nextClick(page){
-          this.curPage = page;
-          this.getRows();
-      },
-       getRows(){
-          this.$http.get(this.$store.state.httpApi + 'sysRole/page?currentPage='+this.curPage+'&pageNumber='+10).then(response =>{
-          if(response.status == 200){
-          this.tableData=response.data.data.pp;
-          this.totalCount = response.data.data.page.totalPage*10;
-          }else{
-            console.log('接口返回失败!',response);
-          }
-          },response => {
-            console.log('请求失败',response)
-          })
-       },
-       getPermissions(){
-            this.$http.get(this.$store.state.httpApi + 'sysPermission/allData').then(response =>{
-          if(response.status == 200){
-          this.permissions=response.data.data;
-          }else{
-            console.log('接口返回失败!',response);
-          }
-          },response => {
-            console.log('请求失败',response)
-          })
-       }
-  },
-   created(){
-    this.getRows();
-    this.getPermissions();
-  },
-  computed: {
-    httpApi(){
-        return this.$store.state.httpApi
-    },
-    httpImgUrl(){
-        return this.$store.state.httpImgUrl
-    },
-  },
-  components: {
-//使用编辑器
-  }
-}
-</script>
-
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style lang="less" scoped>
-    .panel{
-      display:inline-block;
-      position: relative;
-      left: 50%;
-      transform: translateX(-50%);
-    }
-    .block{
-      display:block;
-      margin-left:0;
-      margin-bottom: 10px;
-    }
-    .img{
-        height:513px;
-        width:917px;
-        display:block;
-        margin-bottom:20px;
-    }
-    .imglist{
-        font-size:0;
-    }
-     .imglist li{
-        width:100px;
-        height:100px;
-        display:inline-block;
-        vertical-align: top;
-        margin-right:10px;
-        position:relative;
-    }
-    .imglist li img{
-        width:100%;
-        height:100%;
-    }
-     .upload{
-        width:100%;
-        height: 100%;
-        box-sizing: border-box;
-        border:1px solid #D9D9D9;
-        font-size: 54px;
-        text-align: center;
-        // line-height: 200px;
-        color: #D2D2D2;
-        line-height:100px;
-    }
-    .upload img{
-        width:100%;
-        height: 100%;
-    }
-</style>

src/components/unsubscribe.vue

@@ -0,0 +1,1216 @@
+<template>
+    <div id="table">
+        <el-row>
+            <el-col :span="24">
+                <el-input v-model="queryData.orderNumber" placeholder="订单号" style="width: 150px"></el-input>
+                <el-input v-model="queryData.name" placeholder="购车人" style="width: 150px"></el-input>
+                <el-input v-model="queryData.mobile" placeholder="购车人手机号" style="width: 150px"></el-input>
+                <el-select v-model="queryData.backStatusType" filterable placeholder="请选择退款状态">
+                    <el-option
+                            v-for="item in backStatus"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value">
+                    </el-option>
+                </el-select>
+
+
+                <el-button type="primary" @click="getRows">搜索</el-button>
+                <el-button type="warning" @click="refreshTable">清空</el-button>
+            </el-col>
+        </el-row>
+        <el-table :data="tableData" ref="table" :height="autoHeight" border stripe v-loading="loading"
+                  style="margin-top: 10px">
+            <el-table-column type="index" label="排序" width="80"></el-table-column>
+            <el-table-column prop="code" label="订单号" width="180"></el-table-column>
+            <!--            <el-table-column label="订单状态" width="100">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{scope.row.status == 1?'待支付订金'-->
+            <!--                    :scope.row.status==2?'已支付订金'-->
+            <!--                    :scope.row.status==3?'已完成'-->
+            <!--                    :scope.row.status==4?'取消订单':'退订金完成'}}-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+
+            <el-table-column label="退款状态" width="100">
+                <template slot-scope="scope">
+                    {{backStatus[scope.row.backStatus-1].label}}
+                </template>
+            </el-table-column>
+
+            <el-table-column label="支付方式">
+                <template slot-scope="scope">{{scope.row.payType==1?'全款':'贷款'}}</template>
+            </el-table-column>
+            <el-table-column label="车型信息" width="100">
+                <template slot-scope="scope">
+                    <el-button type="warning" plain @click="queryCarInfo(scope.row.carJson,scope.$index)">查看</el-button>
+                </template>
+            </el-table-column>
+            <el-table-column label="选配信息" width="100">
+                <template slot-scope="scope">
+                    <el-button type="warning" plain
+                               @click="queryMatchingInfo(scope.row.pickedCarInformation,scope.$index)">查看
+                    </el-button>
+                </template>
+            </el-table-column>
+            <el-table-column prop="carSupplier" label="提车供应商" width="280"></el-table-column>
+            <el-table-column prop="carSupplierNo" label="ERP" width="160"></el-table-column>
+            <el-table-column prop="totalPrice" label="总价"></el-table-column>
+            <el-table-column prop="depositPrice" label="订金"></el-table-column>
+            <el-table-column label="支付订金时间" width="160">
+                <template slot-scope="scope">
+                    <span v-if="scope.row.payDepositTime">{{scope.row.payDepositTime}}</span>
+                </template>
+            </el-table-column>
+
+            <!--            <el-table-column prop="downPaymentPrice" label="首付款"></el-table-column>-->
+            <!--            <el-table-column prop="downPaymentRate" label="首付比例"></el-table-column>-->
+            <!--            <el-table-column prop="realDownPaymentPrice" label="实际首付款"></el-table-column>-->
+            <!--            <el-table-column prop="realDownPaymentRate" label="实际首付比例"></el-table-column>-->
+            <!--            <el-table-column prop="finalPaymentPrice" label="尾款"></el-table-column>-->
+            <!--            <el-table-column prop="loanPrice" label="贷款总额"></el-table-column>-->
+            <!--            <el-table-column prop="loanRate" label="贷款利率"></el-table-column>-->
+            <!--            <el-table-column prop="monthlyInstallmentPaymentPrice" label="月供金额"></el-table-column>-->
+            <!--            <el-table-column prop="loanInstalmentCount" label="分期次数"></el-table-column>-->
+
+            <!--            <el-table-column label="贷款状态" width="120">-->
+            <!--                <template slot-scope="scope">{{loanState(scope.row)}}</template>-->
+            <!--            </el-table-column>-->
+
+            <!--            <el-table-column label="首付状态" width="120">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{(scope.row.offlinePayments?scope.row.offlinePayments.downPaymentStatus:"0" == 0)?'未支付':'已支付'}}-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+            <!--            <el-table-column label="尾款状态" width="120">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{OfflinePay(scope.row)}}-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+
+            <!--            <el-table-column-->
+            <!--                    label="发票信息"-->
+            <!--                    align="center">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    <button-->
+            <!--                            v-show="scope.row.offlinePayments && scope.row.offlinePayments.invoicePath !='' "-->
+            <!--                            @click="open(scope.row.offlinePayments?scope.row.offlinePayments.invoicePath:'0')">查看图片-->
+            <!--                    </button>-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+
+            <!--            <el-table-column-->
+            <!--                    label="交车凭证"-->
+            <!--                    align="center">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    <button-->
+            <!--                            v-show="scope.row.offlinePayments && scope.row.offlinePayments.deliveryPath !='' "-->
+            <!--                            @click="open(scope.row.offlinePayments?scope.row.offlinePayments.deliveryPath:'0')">查看图片-->
+            <!--                    </button>-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+
+            <!--            <el-table-column label="线下审核时间" width="160">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    <span v-if="scope.row.offlineAuditTime">{{scope.row.offlineAuditTime}}</span>-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+            <!--            <el-table-column label="线上审核时间" width="160">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    <span v-if="scope.row.onlineAuditTime">{{scope.row.onlineAuditTime}}</span>-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+            <!--            <el-table-column label="订单取消时间" width="160">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    <span v-if="scope.row.orderCancelTime">{{scope.row.orderCancelTime}}</span>-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+            <!--            <el-table-column label="订单完成时间" width="160">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    <span v-if="scope.row.orderFinishTime">{{scope.row.orderFinishTime}}</span>-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+            <el-table-column prop="pickCity" label="取车城市" width="120"></el-table-column>
+            <el-table-column prop="name" label="购车人姓名" width="100"></el-table-column>
+            <el-table-column prop="mobile" label="购车人联系方式" width="120"></el-table-column>
+            <el-table-column prop="idCard" label="购车人身份证号" width="170"></el-table-column>
+            <!--            <el-table-column label="订单是否发送给金融公司">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{scope.row.isSend == 0?'否' :'是'}}-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+            <!--            <el-table-column label="是否被工厂使用过">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{scope.row.isUse == 0?'否' :'是'}}-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+
+            <!--            <el-table-column label="金融公司链接地址" width="300">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    <a v-if="scope.row.url" :href="scope.row.url" target="_blank" class="link">{{scope.row.url}}</a>-->
+            <!--                    <span v-else>无</span>-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+
+            <!--            <el-table-column label="取消原因" width="140">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    {{scope.row.cancelReason == 1?'不需要了'-->
+            <!--                    :scope.row.cancelReason==2?'车辆选配内容错误'-->
+            <!--                    :scope.row.cancelReason==3?'地址信息填写错误':'其他'}}-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+
+
+            <el-table-column prop="isRefund" label="是否退款" width="120" fixed="right">
+                <template slot-scope="scope">
+                    <el-button round @click="Detailsofrefund(scope.row.id,scope.row.isRefund)"
+                               v-show="scope.row.isRefund == 1">退款详情
+                    </el-button>
+                    <span v-show="scope.row.isRefund == 0">否</span>
+
+                </template>
+            </el-table-column>
+
+
+            <!--            <el-table-column label="操作 " width="160px" fixed="right" align="center">-->
+            <!--                <template slot-scope="scope">-->
+            <!--                    <el-button v-show="scope.row.loanStatus == 4 && scope.row.status==2 " type="primary" size="small"-->
+            <!--                               @click="examine(scope.row,scope.$index)">审核-->
+            <!--                    </el-button>-->
+            <!--                    <el-button-->
+            <!--                            v-show="scope.row.loanStatus == 5 && !scope.row.offlinePayments  && scope.row.isRefund != 1 ||  (scope.row.status==2 &&scope.row.payType==1 &&!scope.row.offlinePayments) "-->
+            <!--                            type="warning"-->
+            <!--                            size="small"-->
+            <!--                            @click="payForBtn(scope.row,scope.$index)"-->
+            <!--                            style="margin-bottom: 5px"-->
+            <!--                        >上传尾款发票-->
+            <!--                    </el-button>-->
+            <!--                    <el-button v-show="scope.row.offlinePayments && scope.row.status == 3 &&  (scope.row.offlinePayments.deliveryPath == null || scope.row.offlinePayments.deliveryPath == '')"-->
+            <!--                               type="warning"-->
+            <!--                               size="small"-->
+            <!--                               @click="deliveryVehicles(scope.row,scope.$index)">上传交车图片-->
+            <!--                    </el-button>-->
+            <!--                    <el-button v-show="scope.row.status != '3' && scope.row.isRefund == 0"-->
+            <!--                               size="small"-->
+            <!--                               @click="refundBtn(scope.row,scope.$index)">退款-->
+            <!--                    </el-button>-->
+            <!--                </template>-->
+            <!--            </el-table-column>-->
+        </el-table>
+        <el-pagination
+                @size-change="handleSizeChange"
+                @current-change="handleCurrentChange"
+                :current-page="currentPage"
+                :page-sizes="[15, 20, 25, 30]"
+                :page-size="pageSize"
+                layout="total, sizes, prev, pager, next, jumper"
+                :total="totalNumber">
+        </el-pagination>
+        <template>
+            <el-dialog id="examineDialog" title="审核" :visible.sync="examineDialog" width="30%"
+                       :before-close="clearForm('examineForm')">
+                <el-form :inline="true" label-width="150px" :model="examineForm" ref="examineForm" status-icon>
+                    <!--:rules="examineFormRules"-->
+                    <el-form-item label="线下审核状态"><!--prop="loanStatus"-->
+                        <el-select v-model="examineForm.loanStatus">
+                            <el-option v-for="(item,index) in status" :key="index" :label="item.label"
+                                       :value="item.value"></el-option>
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item label="首付比例" v-show="examineForm.loanStatus === 5"><!--prop="downPaymentRate"-->
+                        <input class="inline-input" maxlength="4" v-model="examineForm.downPaymentRate" type="number"
+                               min="0" max="1">
+                    </el-form-item>
+                    <el-form-item style="width: 98%;text-align: right">
+                        <el-button @click="closeExamineDialog">取消</el-button>
+                        <el-button type="primary" @click="confirmationAudit">确定</el-button>
+                        <!--confirmationAudit('examineForm')-->
+                    </el-form-item>
+                </el-form>
+            </el-dialog>
+            <el-dialog id="payForDialog" title="上传尾款发票" :visible.sync="payForDialog" width="30%">
+                <div>
+                    <el-upload
+                            class="upload-demo"
+                            :action="uploadUrl"
+                            :multiple="false"
+                            :show-file-list="false"
+                            :before-upload="beforeAvatarUpload"
+                            :on-success="uploadSuccess"
+                            :on-error="uploadFailed">
+                        <el-button size="small" type="primary" style="display: block">点击上传</el-button>
+                        <div slot="tip" class="el-upload__tip">上传一张格式为jpg/png图片，且不超过2M</div>
+                        <!--缓存图片查看-->
+                        <img v-if="imgUrl" :src="imgUrl" alt="" style="width: 50%">
+                    </el-upload>
+                    <div style="width: 100%;text-align: right;padding: 5px 10px;margin-top: 10px">
+                        <el-button size="mini" @click="closePayForDialog">取消</el-button>
+                        <el-button v-if="imgUrl" size="mini" type="warning" @click="payForAddImg(imgUrl)">确认支付
+                        </el-button>
+                    </div>
+                </div>
+            </el-dialog>
+            <el-dialog id="vehicleDeliveryDialog" title="上传交车照片" :visible.sync="vehicleDeliveryDialog" width="30%">
+                <div>
+                    <el-upload
+                            class="upload-demo"
+                            :action="uploadUrl"
+                            list-type="picture"
+                            :file-list="fileList"
+                            :before-upload="beforeAvatarUpload"
+                            :on-success="uploadSuccessOther"
+                            :on-remove="handleRemove"
+                            :on-error="uploadFailed">
+                        <el-button size="small" type="primary" style="display: block">点击上传</el-button>
+                        <div slot="tip" class="el-upload__tip">上传一张格式为jpg/png图片，且不超过2M</div>
+                    </el-upload>
+                    <!--缓存图片查看-->
+                    <div>
+
+                    </div>
+                    <div style="width: 100%;text-align: right;padding: 5px 10px;margin-top: 10px">
+                        <el-button size="mini" @click="closeVehicleDeliveryDialog">取消</el-button>
+                        <el-button size="mini" type="warning" @click="confirmVehicleDelivery">确认交车</el-button>
+                    </div>
+                </div>
+            </el-dialog>
+            <el-dialog id="carInfoDialog" title="车型信息" :visible.sync="carInfoDialog" width="30%">
+                <ul>
+                    <li><span>车型名称:</span>{{carInfo.name}}</li>
+                    <li><span>车型描述:</span>{{carInfo.carDesc}}</li>
+                    <li><span>价格:</span>{{carInfo.price}}</li>
+                    <li><span>座椅描述:</span>{{carInfo.seatDesc}}</li>
+                    <li><span>订金:</span>{{carInfo.deposit}}</li>
+                    <li><span>首付比例:</span>{{carInfo.downPaymentRate}}</li>
+                    <li><span>订金是否小于首付:</span>{{carInfo.depositLessthanDownPayment == true? '小于':'大于'}}</li>
+                    <li><span>删除:</span>{{carInfo.delFlag==0?'未删除':'已删除'}}</li>
+                    <li><span>车型图片:</span><img :src="carInfo.url" alt="车型图片" style="width: 20%;display: inline-block">
+                    </li>
+                    <!--<li><span>移动版车型图片</span><img :src="carInfo.mobileUrl" alt="车型图片" style="width: 20%;display: inline-block"></li>-->
+                </ul>
+            </el-dialog>
+            <el-dialog id="matchingDialog" title="选配信息" :visible.sync="matchingDialog" width='80%'>
+                <ul>
+                    <li v-if="matchingInfo.carCaliper">
+                        <h4>卡钳</h4>
+                        <p>
+                            <span>名称: </span><i>{{matchingInfo.carCaliper.name}}</i>
+                            <span>价格: </span><i>{{matchingInfo.carCaliper.price}}</i>
+                            <span>类型: </span><i>{{matchingInfo.carCaliper.type}}</i>
+                            <span>选值: </span><i>{{matchingInfo.carCaliper.value}}</i>
+                        </p>
+                    </li>
+                    <li v-if="matchingInfo.carColor">
+                        <h4>车身颜色</h4>
+                        <p>
+                            <span>名称: </span><i>{{matchingInfo.carColor.name}}</i>
+                            <span>价格: </span><i>{{matchingInfo.carColor.price}}</i>
+                            <span>类型: </span><i>{{matchingInfo.carColor.type}}</i>
+                            <span>选值: </span><i>{{matchingInfo.carColor.value}}</i>
+                        </p>
+                    </li>
+                    <li v-if="matchingInfo.carSeat">
+                        <h4>座椅</h4>
+                        <p>
+                            <span>名称: </span><i>{{matchingInfo.carSeat.name}}</i>
+                            <span>价格: </span><i>{{matchingInfo.carSeat.price}}</i>
+                            <span>类型: </span><i>{{matchingInfo.carSeat.type}}</i>
+                            <span>选值: </span><i>{{matchingInfo.carSeat.value}}</i>
+                        </p>
+                    </li>
+                    <li v-if="matchingInfo.carWheelHub">
+                        <h4>轮廓</h4>
+                        <p>
+                            <span>名称: </span><i>{{matchingInfo.carWheelHub.name}}</i>
+                            <span>价格: </span><i>{{matchingInfo.carWheelHub.price}}</i>
+                            <span>类型: </span><i>{{matchingInfo.carWheelHub.type}}</i>
+                            <span>选值: </span><i>{{matchingInfo.carWheelHub.value}}</i>
+                        </p>
+                    </li>
+                    <li v-if="matchingInfo.catUpholstery">
+                        <h4>内饰</h4>
+                        <p>
+                            <span>名称: </span><i>{{matchingInfo.catUpholstery.name}}</i>
+                            <span>价格: </span><i>{{matchingInfo.catUpholstery.price}}</i>
+                            <span>类型: </span><i>{{matchingInfo.catUpholstery.type}}</i>
+                            <span>选值: </span><i>{{matchingInfo.catUpholstery.value}}</i>
+                        </p>
+                    </li>
+                </ul>
+            </el-dialog>
+            <el-dialog id="refundDialog" title="退款" :visible.sync="refundDialog" width="600px"
+                       :before-close="clearForm('refundForm')">
+                <el-form label-width="100px" :model="refundForm" ref="refundForm" status-icon>
+                    <el-row>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="购车人姓名">
+                                <el-input v-model="refundForm.name" disabled></el-input>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="购车人手机号" prop="orderCode">
+                                <el-input v-model="refundForm.mobile" disabled></el-input>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="订单号" prop="orderCode">
+                                <el-input v-model="refundForm.orderCode" disabled></el-input>
+                            </el-form-item>
+                        </el-col>
+
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退订原因">
+                                <el-select v-model="refundForm.reason">
+                                    <el-option v-for="(item,index) in reasons"
+                                               :key="index"
+                                               :label="item.label"
+                                               :value="item.value">
+                                    </el-option>
+                                </el-select>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="14" style="text-align: right">
+                            <el-button @click="refundDialog = false">取消</el-button>
+                            <el-button type="primary" @click="saveRefundInfo('refundForm')">确认</el-button>
+                        </el-col>
+                    </el-row>
+                </el-form>
+            </el-dialog>
+
+
+            <el-dialog id="refundDeaDialog" title="退款详情" :visible.sync="refundDeaDialog" width="600px">
+                <el-form label-width="100px" :model="refundDealtis" ref="refundForm" status-icon
+                >
+                    <el-row>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="会员号">
+                                {{refundDealtis.customerId}}
+                                <!--<el-input v-model="refundDealtis.customerId" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退单号" prop="backCode">
+                                {{refundDealtis.backCode}}
+
+                                <!--<el-input v-model="refundDealtis.backCode" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退订金额" prop="backPrice">
+                                {{refundDealtis.backPrice}}
+
+                                <!--<el-input v-model="refundDealtis.backPrice" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="收款人户名" prop="name">
+                                {{refundDealtis.name}}
+
+                                <!--<el-input v-model="refundDealtis.name" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="银行账号" prop="account">
+                                {{refundDealtis.account}}
+
+                                <!--<el-input v-model="refundDealtis.account" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="银行名称" prop="bank">
+                                {{refundDealtis.bank}}
+
+                                <!--<el-input v-model="refundDealtis.bank" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="审核时间" prop="bank">
+                                {{refundDealtis.auditTime}}
+
+                                <!--<el-input v-model="refundDealtis.auditTime" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="审核人" prop="bank">
+                                {{refundDealtis.auditor}}
+
+                                <!--<el-input v-model="refundDealtis.auditor" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退订时间" prop="bank">
+                                {{refundDealtis.finishTime}}
+
+                                <!--<el-input v-model="refundDealtis.finishTime" disabled></el-input>-->
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退款原因" prop="bank">
+                                <!--<span></span><i>{{refundDealtis.dealerReason}}</i>-->
+                                <el-select v-model="refundDealtis.dealerReason" disabled>
+                                    <el-option v-for="(item,index) in dealerReason"
+                                               :key="index"
+                                               :label="item.label"
+                                               :value="item.value">
+                                    </el-option>
+                                </el-select>
+                            </el-form-item>
+                        </el-col>
+
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退订原因">
+                                <el-select v-model="refundDealtis.reason" disabled>
+                                    <el-option v-for="(item,index) in reasons"
+                                               :key="index"
+                                               :label="item.label"
+                                               :value="item.value">
+                                    </el-option>
+                                </el-select>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="12" width="210px">
+                            <el-form-item label="退单状态">
+                                <el-select v-model="refundDealtis.status" disabled>
+                                    <el-option v-for="(item,index) in refundStatus"
+                                               :key="index"
+                                               :label="item.label"
+                                               :value="item.value">
+                                    </el-option>
+                                </el-select>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="24" style="text-align: right">
+                            <el-button @click="refundDeaDialog = false">关闭</el-button>
+                        </el-col>
+                    </el-row>
+                </el-form>
+            </el-dialog>
+
+            <el-dialog :visible.sync="dialogVisibleList">
+					<span v-for="(item,index) in images" :key='index'>
+						<img width="50%" :src="images[index]" alt="">
+					</span>
+            </el-dialog>
+
+        </template>
+    </div>
+</template>
+
+<script>
+    import {utils} from "../utils/config";
+    import * as Api from "../utils/server"
+    import {Message} from "element-ui"
+
+    export default {
+        name: "",
+        data() {
+            return {
+                dialogVisibleList: false,
+                refundDeaDialog: false, //退款详情
+                examineDialog: false,  // 审核对话框
+                carInfoDialog: false,  // 车型信息对话框
+                payForDialog: false,  // 支付对话框
+                vehicleDeliveryDialog: false,  // 交车对话框
+                matchingDialog: false,  // 车辆选配对话框
+                refundDialog: false, // 退款对话框
+                carInfo: {}, // 车辆信息
+                matchingInfo: {}, // 选配信息
+                tableData: [],
+                queryData: {
+                    orderNumber: '', //搜索条件 订单号
+                    mobile: '',//搜索条件 手机号
+                    name: '',//搜索条件 购车人姓名
+                    name: '',//搜索条件 购车人姓名
+                    status: '',//搜索条件 订单状态
+                    offlinePayType: '',//搜索条件 首付/尾款支付状态
+                    backStatusType: '',//搜索条件 退款状态
+
+                },
+                loading: true,
+                totalNumber: null,
+                totalPage: null,
+                currentPage: 1,
+                pageSize: 15,
+                images: '',
+                examineForm: {
+                    loanStatus: '',  // 状态
+                    downPaymentRate: ''  // 比例
+                },
+                examineFormRules: {
+                    loanStatus: [
+                        {required: true, message: '请选择审核状态', trigger: 'change'}
+                    ],
+                    downPaymentRate: [
+                        {validator: this.$validator.downPaymentRate, trigger: 'blur'}
+                    ]
+                },
+                status: [
+                    {
+                        label: '线下审核通过',
+                        value: 5
+                    },
+                    {
+                        label: '线下审核不通过',
+                        value: 6
+                    }
+                ],
+                payStatusData: [
+                    {
+                        label: '未支付',
+                        value: 3
+                    },
+                    {
+                        label: '线下已支付',
+                        value: 1
+                    },
+                    {
+                        label: '线上已支付',
+                        value: 2
+                    }
+                ],
+                orderStatus: [
+                    {
+                        label: '退定金完成',
+                        value: 5
+                    }
+                ],
+                index: null, // 当前列表Id
+                uploadUrl: Api.imgUrl,
+                imgUrl: '',
+                fileList: [],
+                imgUrls: [],
+                refundForm: {
+                    customerId: '',       // 会员id
+                    backCode: '',         // 退单号
+                    backPrice: '',        // 退订金额
+                    name: '',             // 收款人姓名
+                    account: '',          // 收款人银行账号
+                    bank: '',             // 银行名称
+                    reason: '',           // 退订原因
+                    status: '',         // 退单状态
+                    orderId: '',         //订单主键
+                    orderCode: '',          //订单code
+                    backPrice: '',           //价格
+                    name: '',     //  退货人姓名
+                    mobile: '',  //   退货人手机号
+                },
+                refundDealtis: {},
+                // refundFormRules: {
+                //     backCode: [
+                //         {required: true, message: '请输入退单号', trigger: 'blur'}
+                //     ],
+                //     backPrice: [
+                //         {validator: this.$validator.backPrice, trigger: 'blur'}
+                //     ],
+                //     name: [
+                //         {validator: this.$validator.name, trigger: 'blur'}
+                //     ],
+                //     account: [
+                //         {validator: this.$validator.account, trigger: 'blur'}
+                //     ],
+                //     bank: [
+                //         {required: true, message: '请输入银行名称', trigger: 'blur'}
+                //     ],
+                // },
+                backStatus: [{
+                    label: '待审核',
+                    value: "1"
+                       },
+                    {
+                        label: '审核通过',
+                        value: "2"
+                    },
+                    {
+                        label: '审核不通过',
+                        value: "3"
+                    },
+                    {
+                        label: '已退款',
+                        value: "4"
+                    }],
+                dealerReason: [
+                    {
+                        label: '72小时内',
+                        value: "1"
+                    },
+                    {
+                        label: '线上审核失败',
+                        value: "2"
+                    },
+                    {
+                        label: '线下审核失败',
+                        value: "3"
+                    },
+                    {
+                        label: '72小时后-线下审核前',
+                        value: "4"
+                    },
+                    {
+                        label: '线下审核后',
+                        value: "5"
+                    },
+                    {
+                        label: '72小时后',
+                        value: "46"
+                    }
+
+                ],
+                reasons: [
+                    {
+                        label: '贷款审核不通过',
+                        value: "1"
+                    },
+                    {
+                        label: '车辆选配内容错误',
+                        value: "2"
+                    },
+                    {
+                        label: '地址信息填写错误',
+                        value: "3"
+                    },
+                    {
+                        label: '其他',
+                        value: "4"
+                    }
+                ],
+                refundStatus: [
+                    {
+                        label: '待审核',
+                        value: "1"
+                    },
+                    {
+                        label: '审核通过',
+                        value: "2"
+                    },
+                    {
+                        label: '审核不通过',
+                        value: "3"
+                    },
+                    {
+                        label: '已退款',
+                        value: "4"
+                    }
+                ],
+                refundState: '',
+            };
+        },
+        computed: {
+            autoHeight() {
+                return window.innerHeight - 277
+            }
+        },
+        mounted() {
+            this.getRows();
+        },
+        destroyed() {
+            sessionStorage.removeItem('imgUrl');
+            sessionStorage.removeItem('imgUrls');
+        },
+        methods: {
+            // 审核按钮
+            examine(row, index) {
+                this.examineDialog = true;
+                this.index = row.id;
+            },
+            // 支付按钮
+            payForBtn(row, index) {
+                let src = sessionStorage.getItem('imgUrl');
+                if (src) {
+                    this.imgUrl = src
+                } else {
+                    this.imgUrl = '';
+                }
+                this.payForDialog = true;
+                this.index = row.id;
+            },
+            // 交车按钮
+            deliveryVehicles(row, index) {
+                let urls = sessionStorage.getItem('imgUrls');
+                if (urls) {
+                    urls.forEach((item, index) => {
+                        this.imgUrls.push(item.response.data[0]);
+                    });
+                    this.fileList = urls;
+                } else {
+                    this.fileList = [];
+                    this.imgUrls = [];
+                }
+                this.vehicleDeliveryDialog = true;
+                this.index = row.id;
+            },
+            // 退款按钮
+            refundBtn(row, index) {
+                this.refundForm.customerId = row.customerId;
+                this.refundForm.orderId = row.id;
+                this.refundForm.orderCode = row.code;
+                this.refundForm.backPrice = row.depositPrice;
+                this.refundForm.name = row.name;
+                this.refundForm.mobile = row.mobile;
+
+                let params = {
+                    customerId: row.customerId,
+                    orderId: row.id
+                };
+                // 查询是否满足退款条件
+                this.$post("/business/CarOrder/returnorder", params)
+                    .then(res => {
+                        if (res.status === 200) {
+                            if (res.data.success) {
+                                this.refundState = res.data.data;
+                                // Message.success(res.data.data);
+                                this.refundDialog = true;
+                            } else {
+                                Message.error(res.data.error);
+                            }
+                        }
+                    })
+                    .catch(err => {
+                        console.log(err)
+                    })
+            },
+            refreshTable() {
+                this.queryData = {}
+                this.getRows();
+            },
+            // 获取订单列表信息
+            getRows() {
+                let data = {
+                    code: this.queryData.orderNumber,
+                    name: this.queryData.name,
+                    mobile: this.queryData.mobile,
+                    status: this.queryData.status,
+                    backStatus: this.queryData.backStatusType,
+
+                    currentPage: this.currentPage,
+                    pageNumber: this.pageSize
+                };
+                let params = utils.paramData(data);
+                this.$get("business/CarOrder/backPage", data).then(
+                    response => {
+                        if (response.status == 200) {
+                            this.loading = false;
+                            this.tableData = response.data.data.pp;
+                            this.totalNumber = response.data.data.page.totalNumber;
+                            this.$message.success("数据加载成功");
+                        } else {
+                            this.$message.success("服务器连接异常");
+                        }
+                    },
+                    response => {
+                        this.$message.success("服务器连接异常");
+                    }
+                );
+            },
+            // 查看车型信息
+            queryCarInfo(info, index) {
+                this.carInfoDialog = true;
+                this.carInfo = Object.assign({}, JSON.parse(info));
+            },
+
+            // 查看选配信息
+            queryMatchingInfo(info, index) {
+                this.matchingDialog = true;
+                let jsInfo = JSON.parse(info);
+                this.matchingInfo = jsInfo;
+            },
+            //首付款线下支付状态
+            OfflinePay(data) {
+                //判断有没有线下支付信息 如果没有有就根据订单状态判断
+                if (data.offlinePayments == undefined) {
+                    if (data.status == 3) {
+                        return '线上已支付';
+                    }
+                } else {
+                    return data.offlinePayments.downPaymentStatus == 0 ? '未支付' : '线下已支付';
+                }
+                return "未支付";
+            },
+            // 单款状态
+            loanState(data) {
+                var data = data;
+                var val = data.loanStatus;
+                if (data.payType == 1) {
+                    val = 0;
+                }
+                let str = "";
+                switch (+val) {
+                    case 0:
+                        str = "暂无";
+                        break;
+                    case 1:
+                        str = "线上待审核";
+                        break;
+                    case 2:
+                        str = "线上审核通过";
+                        break;
+                    case 3:
+                        str = "线上审核不通过";
+                        break;
+                    case 4:
+                        str = "线下待审核";
+                        break;
+                    case 5:
+                        str = "线下审核通过";
+                        break;
+                    case 6:
+                        str = "线下审核不通过";
+                        break;
+                    default:
+                        str = "暂无";
+                }
+                return str;
+            },
+            // 改变当前页面条数
+            handleSizeChange(val) {
+                console.log(`每页 ${val} 条`);
+                this.currentPage = 1;
+                this.pageSize = val;
+                this.loading = true;
+                this.getRows();
+            },
+            // 改变当前页
+            handleCurrentChange(val) {
+                console.log(`当前页: ${val}`);
+                this.currentPage = val;
+                this.loading = true;
+                this.getRows();
+            },
+            // 关闭审核对话框
+            closeExamineDialog() {
+                this.examineDialog = false;
+            },
+            // 对话框关闭 清空对话框form表单
+            clearForm(formName) {
+                this.resetForm(formName);
+            },
+            // 确认审核结果
+            confirmationAudit(formName) {
+                // this.$refs[formName].validate((valid) => {
+                //   if (valid) {
+                let params = {
+                    id: this.index,
+                    loanStatus: this.examineForm.loanStatus,
+                    downPaymentRate: this.examineForm.downPaymentRate
+                };
+                this.$put("/business/CarOrder/offlineReview", params)
+                    .then(res => {
+                        if (res.status === 200) {
+                            console.log(res.data)
+                            if (res.data.success) {
+                                Message.success(res.data.data);
+                            } else {
+                                Message.error(res.data.error);
+                            }
+                        } else {
+                            Message.error(res.data.error)
+                        }
+                        this.examineDialog = false;
+                        this.loading = true;
+                        this.getRows();
+                    });
+                //   }
+                // })
+            },
+            // 上传前的回调函数
+            beforeAvatarUpload(file) {
+                const isJPG = file.type === 'image/jpeg' || file.type === 'image/png';
+                const isLt2M = file.size / 1024 / 1024 < 2;
+
+                if (!isJPG) {
+                    this.$message.error('请上传JPG / PNG 格式图片!');
+                }
+                if (!isLt2M) {
+                    this.$message.error('上传头像图片大小不能超过 2MB!');
+                }
+                return isJPG && isLt2M;
+            },
+            // 图片上传成功
+            uploadSuccess(response, file, fileList) {
+                if (response.success) {
+                    this.imgUrl = response.data[0];
+                    // 图片上传成功缓存下当前图片url
+                    sessionStorage.setItem('imgUrl', this.imgUrl);
+                } else {
+                    console.log(response.data);
+                }
+            },
+            // 上传多图
+            uploadSuccessOther(response, file, fileList) {
+                if (fileList.length > 0) {
+                    fileList.forEach((item, index) => {
+                        this.imgUrls.push(item.response.data[0]);
+                    });
+                    sessionStorage.setItem('imgUrls', fileList);
+                }
+            },
+            // 图片列表删除
+            handleRemove(file, fileList) {
+                console.log('图片列表删除');
+                console.log(file, fileList);
+            },
+            // 上传失败
+            uploadFailed(err, file, fileList) {
+                console.log('上传失败');
+                console.log(err);
+            },
+            // 最终支付(id imgUrl)添加图片
+            payForAddImg(url) {
+                let params = {
+                    id: this.index,
+                    invoicePath: url
+                };
+                this.$put("/business/CarOrder/pay", params)
+                    .then(res => {
+                        if (res.status === 200) {
+                            if (res.data.success) {
+                                Message.success(res.data.data);
+                            } else {
+                                Message.warning(res.data.error);
+                            }
+                            sessionStorage.removeItem('imgUrl');
+                            this.payForDialog = false;
+                            this.examineDialog = false;
+                            this.loading = true;
+                            setTimeout(() => {
+                                this.getRows();
+                            }, 1000)
+                        }
+                    })
+            },
+            // 关闭支付对话框
+            closePayForDialog() {
+                this.payForDialog = false;
+            },
+            // 确认交车
+            confirmVehicleDelivery() {
+                let params = {
+                    id: this.index,
+                    invoicePath: this.imgUrls
+                };
+                this.$put("/business/CarOrder/delivery", params)
+                    .then(res => {
+                        if (res.status === 200) {
+                            if (res.data.success) {
+                                Message.success(res.data.data);
+                            } else {
+                                Message.warning(res.data.error);
+                            }
+                            sessionStorage.removeItem('imgUrls');
+                            this.vehicleDeliveryDialog = false;
+                            this.loading = true;
+                            setTimeout(() => {
+                                this.getRows();
+                            }, 1000)
+                        }
+                    })
+            },
+            // 关闭交车对话框
+            closeVehicleDeliveryDialog() {
+                this.vehicleDeliveryDialog = false;
+            },
+            // 保存退单信息
+            saveRefundInfo(formName) {
+                if (this.refundForm.reason == "") {
+                    Message.success("请选择退订原因")
+                    return;
+                }
+                this.$refs[formName].validate((valid) => {
+                    if (valid) {
+                        let params = {
+                            customerId: this.refundForm.customerId,
+                            backCode: this.refundForm.backCode,
+                            backPrice: this.refundForm.backPrice,
+                            name: this.refundForm.name,
+                            account: this.refundForm.account,
+                            bank: this.refundForm.bank,
+                            reason: this.refundForm.reason,
+                            status: this.refundForm.status,
+                            dealerReason: this.refundState,
+                            orderId: this.refundForm.orderId,
+                            orderCode: this.refundForm.orderCode,
+                            backPrice: this.refundForm.backPrice
+
+                        };
+                        this.$post("/business/CarBackOrder/save", params)
+                            .then(res => {
+                                if (res.status === 200) {
+                                    if (res.data.success) {
+                                        Message.success("提交成功");
+                                    } else {
+                                        Message.warning("提交失败");
+                                    }
+                                    this.resetForm('refundForm');
+                                    setTimeout(() => {
+                                        this.refundDialog = false;
+                                        this.loading = true;
+                                        this.getRows();
+                                    }, 1000)
+                                }
+                            })
+                            .catch(err => {
+                            })
+                    }
+                })
+            },
+            // 表单重置
+            resetForm(formName) {
+                if (this.$refs[formName] !== undefined) {
+                    this.$refs[formName].resetFields();
+                }
+            },
+            Detailsofrefund(id, refundStatus) {
+                if (refundStatus == 0) {
+                    return;
+                }
+                let params = {
+                    orderId: id,
+                };
+                this.$get("/business/CarBackOrder/getOne", params)
+                    .then(res => {
+                        if (res.status === 200) {
+                            if (res.data.success) {
+                                this.refundDealtis = res.data.data;
+
+                                this.refundDeaDialog = true;
+                                // Message.success(res.data.data);
+                            } else {
+                                Message.warning(res.data.error);
+                            }
+
+                        }
+                    })
+
+            },
+            open: function (file) {
+                console.log(file)
+                this.dialogImageUrl = file;
+                this.images = this.dialogImageUrl.split(",");
+                console.log(this.images);
+                this.dialogVisibleList = true;
+            },
+
+
+        },
+    };
+</script>
+
+<style scoped lang="less">
+    input[type=number] {
+        -moz-appearance: textfield;
+    }
+
+    input[type=number]::-webkit-inner-spin-button,
+    input[type=number]::-webkit-outer-spin-button {
+        -webkit-appearance: none;
+        margin: 0;
+    }
+
+    #carInfoDialog {
+        ul {
+            padding: 5px;
+
+            li {
+                display: flex;
+                align-items: center;
+                overflow: hidden;
+                padding: 5px;
+
+                span {
+                    display: inline-block;
+                    width: 150px;
+                    font-size: 15px;
+                    font-weight: bold;
+                }
+            }
+        }
+    }
+
+    #matchingDialog {
+        ul {
+            padding: 5px;
+
+            li {
+                margin-top: 10px;
+                padding: 10px;
+                box-shadow: 0 0 10px #ccc;
+
+                h4 {
+                    font-size: 16px;
+                }
+
+                p {
+                    margin-top: 10px;
+
+                    span {
+                        display: inline-block;
+                        font-size: 15px;
+                        text-align: right;
+
+                        &:first-child {
+                            margin-left: 20px;
+                        }
+                    }
+
+                    i {
+                        margin-left: 10px;
+                        font-style: normal;
+                        font-size: 14px;
+                        display: inline-block;
+                        min-width: 120px;
+                    }
+                }
+            }
+        }
+    }
+
+    #examineDialog {
+        .el-form--inline .el-form-item {
+            width: 100%;
+            margin-right: 0;
+
+            .inline-input {
+                -webkit-appearance: none;
+                background-color: #fff;
+                background-image: none;
+                border-radius: 4px;
+                border: 1px solid #dcdfe6;
+                -webkit-box-sizing: border-box;
+                box-sizing: border-box;
+                color: #606266;
+                display: inline-block;
+                font-size: inherit;
+                height: 40px;
+                line-height: 40px;
+                outline: none;
+                padding: 0 15px;
+                -webkit-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+                -o-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+                transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+                width: 217px;
+            }
+
+            .inline-span {
+                display: inline-block;
+                margin-left: 10px;
+                font-size: 16px;
+                color: #f15353;
+            }
+        }
+
+    }
+
+    .link {
+        text-decoration: none;
+
+        &:link {
+            border: none;
+            color: #5eb3e6;
+        }
+
+        &:focus {
+            outline-style: none;
+            outline-width: 0;
+        }
+    }
+</style>

src/router/index.js

@@ -8,34 +8,68 @@ import home from '@/components/home'
 import * as Api from '../utils/server'
 
 axios.defaults.withCredentials = true
-//账号管理
-import accountInfo from '@/components/accountInfo'
-// 权限管理
-import role from '@/components/role'
 //登录
 import login from '@/components/login'
-
-//选配车订单
-import carOrder from '@/components/table'
-
+//全款订单
+import fullPay from '@/components/fullPay'
+//贷款订单
+import loanPay from '@/components/loanPay'
+//退订订单
+import unsubscribe from '@/components/unsubscribe'
+//普通订单
+import order from '@/components/order'
+import orderDetails from '@/components/orderDetails'
 
 Vue.use(Router)
 Vue.use(ElementUI)
 Vue.use(quillEditor)
 
 const router = new Router({
+    mode: 'history',
     routes: [{
         path: '/home',
         name: 'home',
         component: home,
         children: [
             {
-                path: 'carOrder',
-                name: 'carOrder',
+                path: 'fullPay',
+                name: 'fullPay',
+                meta: {
+                    requireAuth: true, // 添加该字段，表示进入这个路由是需要登录的
+                },
+                component: fullPay
+            },
+            {
+                path: 'loanPay',
+                name: 'loanPay',
                 meta: {
                     requireAuth: true, // 添加该字段，表示进入这个路由是需要登录的
                 },
-                component: carOrder
+                component: loanPay
+            },
+            {
+                path: 'unsubscribe',
+                name: 'unsubscribe',
+                meta: {
+                    requireAuth: true, // 添加该字段，表示进入这个路由是需要登录的
+                },
+                component: unsubscribe
+            },
+            {
+                path: 'order',
+                name: 'order',
+                meta: {
+                    requireAuth: true, // 添加该字段，表示进入这个路由是需要登录的
+                },
+                component: order
+            },
+            {
+                path: 'orderDetails',
+                name: 'orderDetails',
+                meta: {
+                    requireAuth: true, // 添加该字段，表示进入这个路由是需要登录的
+                },
+                component: orderDetails
             }
         ]
     },
@@ -44,38 +78,13 @@ const router = new Router({
             name: 'login',
             component: login
         }
-
     ]
 })
 // 判断是否需要登录权限 以及是否登录
-router.beforeEach((to, from, next) => {
-    let token = localStorage.getItem('zptoken');
-    let userId = localStorage.getItem('userId');
-    let params = {
-        'token': token,
-        'userId': userId
-    }
-    if (to.meta.requireAuth) { // 判断该路由是否需要登录权限
-        axios.post('system/token/check', params).then(response => {
-            if (!response.data.success) {
-                localStorage.removeItem('zptoken');
-                localStorage.removeItem('userId');
-                router.push({path: '/'});
-            }
-        }, response => {
-            router.push({path: '/'});
-            console.log('请求失败', response)
-        })
-    }
-    // router.push({path: 'login'})
-    //已登录的情况再去登录页，跳转至首页
-    // if (to.name === 'login') {
-    //     if (auth.IsLogin) {
-    //         vueRouter.push({name: 'home'});
-    //     }
-    // }
-    next()
-})
+// router.beforeEach((to, from, next) => {
+//
+//     next()
+// })
 export default router
 axios.interceptors.request.use(
     config => {

src/utils/http.js

@@ -55,6 +55,8 @@ export function get(url, params = {}) {
  * post 请求
  * */
 export function post(url, data = {}, config = {}) {
+  console.log(data)
+
   return new Promise(((resolve, reject) => {
     axios.post(url, data, config)
       .then(response => {
@@ -94,4 +96,4 @@ export function patch(url, data = {}) {
         reject(err)
       })
   }))
-}
+}

src/vuex/mutations.js

@@ -2,7 +2,6 @@ export default {
 
     setData(state, data) {
         state.datas = data
-        console.log('datas', state.datas)
     },
     setPersonInfo(state, data) {
         state.personInfo = data;