返回上一页功能

src/views/order/detail.vue

@@ -1,10 +1,14 @@
 <template>
   <div class="app-container">
 
-    <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
+    <!--<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
       <el-menu-item index="1" @click="backToList">订单列表</el-menu-item>
       <el-menu-item index="2">订单详情</el-menu-item>
-    </el-menu>
+    </el-menu>-->
+    <div class="app-header-top" style="width: 100%;float: right;margin-bottom: 10px;">
+      <div class="app-title">订单详情</div>
+      <el-button type="primary" icon="el-icon-back" style="float: right;" @click="backToList">返回</el-button>
+    </div>
 
     <el-card v-if="order" class="box-card">
       <div class="refund-item">
@@ -215,6 +219,13 @@ export default {
 </script>
 
 <style scoped>
+  .app-title{
+    float: left;
+    line-height: 36px;
+    font-size: 18px;
+    font-weight: bold;
+    color: #999999;
+  }
   .box-card{
     margin-top: 20px;
     font-size: 14px;

src/views/order/refund-detail.vue

@@ -1,10 +1,14 @@
 <template>
   <div class="app-container">
 
-    <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
+    <!--<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
       <el-menu-item index="1" @click="backToList">用户退款列表</el-menu-item>
       <el-menu-item index="2">用户退款详情</el-menu-item>
-    </el-menu>
+    </el-menu>-->
+    <div class="app-header-top" style="width: 100%;float: right;margin-bottom: 10px;">
+      <div class="app-title">用户退款详情</div>
+      <el-button type="primary" icon="el-icon-back" style="float: right;" @click="backToList">返回</el-button>
+    </div>
 
     <h1>退款单</h1>
     <el-card v-for="refund in refundList" :key="refund.orderID" class="box-card">
@@ -267,6 +271,13 @@ export default {
 </script>
 
 <style scoped>
+  .app-title{
+    float: left;
+    line-height: 36px;
+    font-size: 18px;
+    font-weight: bold;
+    color: #999999;
+  }
   h1{
     color: #409EFF;
     font-size: 24px;

src/views/order/refund-record.vue

@@ -1,10 +1,14 @@
 <template>
   <div class="app-container">
 
-    <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
+    <!--<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
       <el-menu-item index="1" @click="backToList">订单列表</el-menu-item>
       <el-menu-item index="2">收退款记录</el-menu-item>
-    </el-menu>
+    </el-menu>-->
+    <div class="app-header-top" style="width: 100%;float: right;margin-bottom: 10px;">
+      <div class="app-title">收退款记录</div>
+      <el-button type="primary" icon="el-icon-back" style="float: right;" @click="backToList">返回</el-button>
+    </div>
 
     <el-card v-if="order" class="box-card">
       <el-row :gutter="24" class="box-row">
@@ -188,10 +192,18 @@ export default {
       })
     },
     backToList() {
+      let parentPath = '/order/list'
+      const parentView = this.$store.getters.visitedViews.slice(-2)[0]
+      if (parentView) {
+        const oid = parentView.fullPath.split('/').reverse()[0] * 1
+        if (this.orderID === oid) {
+          parentPath = parentView.fullPath
+        }
+      }
       this.$store.dispatch('tagsView/delView', this.$route).then(() => {
         this.$nextTick(() => {
           this.$router.replace({
-            path: '/order/list'
+            path: parentPath
           })
         })
       })
@@ -201,6 +213,13 @@ export default {
 </script>
 
 <style scoped>
+  .app-title{
+    float: left;
+    line-height: 36px;
+    font-size: 18px;
+    font-weight: bold;
+    color: #999999;
+  }
   h1{
     color: #409EFF;
     font-size: 24px;

src/views/order/refund-return.vue

@@ -1,10 +1,14 @@
 <template>
   <div class="app-container">
 
-    <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
+    <!--<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
       <el-menu-item index="1" @click="backToList">订单列表</el-menu-item>
       <el-menu-item index="2">退款退货详情</el-menu-item>
-    </el-menu>
+    </el-menu>-->
+    <div class="app-header-top" style="width: 100%;float: right;margin-bottom: 10px;">
+      <div class="app-title">退款退货详情</div>
+      <el-button type="primary" icon="el-icon-back" style="float: right;" @click="backToList">返回</el-button>
+    </div>
 
     <el-card v-if="refundList.length === 0" class="box-card" style="text-align:center;">暂无退款退货详情记录.....</el-card>
 
@@ -245,10 +249,18 @@ export default {
       })
     },
     backToList() {
+      let parentPath = '/order/list'
+      const parentView = this.$store.getters.visitedViews.slice(-2)[0]
+      if (parentView) {
+        const oid = parentView.fullPath.split('/').reverse()[0] * 1
+        if (this.orderID === oid) {
+          parentPath = parentView.fullPath
+        }
+      }
       this.$store.dispatch('tagsView/delView', this.$route).then(() => {
         this.$nextTick(() => {
           this.$router.replace({
-            path: '/order/list'
+            path: parentPath
           })
         })
       })
@@ -258,6 +270,13 @@ export default {
 </script>
 
 <style scoped>
+  .app-title{
+    float: left;
+    line-height: 36px;
+    font-size: 18px;
+    font-weight: bold;
+    color: #999999;
+  }
   h1{
     color: #409EFF;
     font-size: 24px;