订单详情

src/containers/center/myOrder/index.vue

@@ -1,20 +1,11 @@
 <template>
   <div class="m-right-block fr mh576" style="position: relative;">
     <div class="right-block-bd">
-      <div class="mb10 tc mt20">
-        <span class="p-ico2 worm-ico-o"></span>
-        注：未付款的订单设置3小时时限,3小时过后未付的订单就不再显示。
-      </div>
 
       <div  class="ng-scope">
-
         <el-table v-loading="listLoading" :data="list" border fit highlight-current-row>
 
-          <el-table-column label="交易订单" align="center" >
-            <template slot-scope="{row, $index}">
-              <span>{{row.payNo}}</span>
-            </template>
-          </el-table-column>
+          <el-table-column label="交易订单" prop="outTradeNo" align="center" />
           <el-table-column label="岗位名称" align="center" >
             <template slot-scope="{row, $index}">
               <span>{{row.courseName}}</span>
@@ -29,23 +20,29 @@
 
           <el-table-column label="金额(元)" align="center" >
             <template slot-scope="{row}">
-              <span>{{ row.fee|money }} </span>
+              <span>{{ row.payFee|money }} </span>
             </template>
           </el-table-column>
 
-          <el-table-column label="提交结果" align="center" >
+          <el-table-column label="提交时间" align="center" >
             <template slot-scope="{row, $index}">
-              <span>{{row.errMarks||'成功'}}</span>
+              <span>{{row.createAt}}</span>
             </template>
           </el-table-column>
 
-          <el-table-column label="提交时间" align="center" >
-            <template slot-scope="{row, $index}">
-              <span>{{row.createAt}}</span>
+          <el-table-column label="操作" fixed="right" align="center" min-width="80">
+            <template  slot-scope="{row}">
+              <el-button v-if="row.refundStatus==0" @click="payRefund(row)" type="primary"  size="small" >退款</el-button>
+              <el-button v-else-if="row.refundStatus==1" @click="getPayInfo(row )"  type="text" size="small">退款中</el-button>
+              <el-button v-else-if="row.refundStatus==2" @click="getPayInfo(row )" type="text" size="small">退款通过</el-button>
+              <el-button v-else-if="row.refundStatus==3" @click="getPayInfo(row )" type="text" size="small">到账</el-button>
+              <el-button v-else type="text" size="small" @click="getPayInfo(row )" style="color: red;">拒绝</el-button>
             </template>
           </el-table-column>
+
         </el-table>
 
+
         <el-pagination
             @current-change="handleCurrentChange"
             :current-page="page"
@@ -59,6 +56,45 @@
           <IBuyCourse :courseId="courseId" @finish="reload"></IBuyCourse>
         </el-dialog>
 
+        <el-dialog title="退款申请"  :visible.sync="payRefundDialog" :append-to-body="true"  width="500px" top="20px" >
+          <el-form :model="form" :rules="rules" label-width="120px" ref="elAdd">
+          		<el-form-item label="订单信息" prop="type">
+                <span> {{form.title}} </span>
+          		</el-form-item>
+              <el-form-item label="退款金额" prop="type">
+                <span> ￥{{form.payFee/10}} 元 </span>
+              </el-form-item>
+          		<el-form-item label="退款原因" prop="footer">
+          			<el-input v-model="form.reason" type="textarea" style="width: 300px;" />
+          		</el-form-item>
+          	</el-form>
+          	<div class="dialog-footer" slot="footer" >
+          		<el-button @click="closeDialog('payRefundDialog')">取 消</el-button>
+          		<el-button @click="doPayRefund()" type="primary">确 定</el-button>
+          	</div>
+          </el-dialog>
+        </el-dialog>
+
+
+        <el-dialog  :visible.sync="refundInfoDialog" :append-to-body="true"
+        width="800px" top="20px" align="center">
+            <h2 style="text-align: center;">
+                <span style="margin: 0 20px;">编号：{{refundInfo.outTradeNo}}</span>
+                <span style="margin: 0 20px;">费用：{{refundInfo.payFee|money}}</span>
+                <span style="margin: 0 20px;">状态：
+                <strong style="color: red;">
+                {{refundInfo.refundStatus|status}}
+                </strong>
+                </span>
+            </h2>
+            <el-table :data="refundList" border fit highlight-current-row style="margin-top: 10px;">
+              <el-table-column label="编号" prop="id"  />
+              <el-table-column label="动作" prop="action" />
+              <el-table-column label="内容" prop="context" />
+              <el-table-column label="时间" prop="createAt"/>
+            </el-table>
+        </el-dialog>
+
       </div>
     </div>
   </div>
@@ -81,7 +117,12 @@
         total: 1,
         courseId:0,
         list: [],
+        form: {id:0, title:'', reason:'', payFee:0},
+        refundInfo:{},
+        refundList:[],
         buyCourseDialog: false,
+        refundInfoDialog: false,
+        payRefundDialog:false,
         listLoading: false
       };
     },
@@ -92,6 +133,15 @@
       money(val){
         return '￥'+ (val/100);
       },
+      status(val){
+        let map ={
+          1: '申请中',
+          2: '审核通过',
+          3: '退款成功',
+          4: '拒绝退款'
+        }
+        return map[val];
+      },
       payStatus(item){
         if(item.status == 2){
           return '支付完成';
@@ -112,9 +162,35 @@
         this.buyCourseDialog = false;
         this.getData();
       },
+      payRefund(row){
+        this.form.logId = row.id;
+        this.form.payFee = row.payFee;
+        this.form.reason = ''
+        this.form.title = `${row.type} - ${row.courseName} - ${row.nd}`
+        this.payRefundDialog = true;
+      },
+      doPayRefund(){
+        httpServer('Weixin.PayRefund', this.form).then(res => {
+          if(res.code != 200) return;
+          this.$message.successMsg("申请成功", 2);
+          this.getData()
+          this.payRefundDialog = false;
+        })
+      },
+      getPayInfo(row){
+        httpServer('Weixin.GetPayLogInfo', {logId:row.id}).then(res=>{
+          if(res.code != 200) return;
+          this.refundInfo = res.data.info||{};
+          this.refundList = res.data.list||[];
+          this.refundInfoDialog = true;
+        })
+      },
+      closeDialog(modal){
+        this[model] = false;
+      },
       getData() {
         let param = {from: (this.page - 1) * this.size,size:this.size}
-        httpServer('course.GetSmPayCourseList', param).then(({
+        httpServer('course.GetPayLogList', param).then(({
           data,
           code
         }) => {