订单管理UI调整

src/router/router.js

@@ -65,7 +65,7 @@ const shopList = r => require.ensure([], () => r(require('../views/shop/shop-lis
 const createShop = r => require.ensure([], () => r(require('../views/shop/create-shop.vue')), 'create-shop')
 const goodsManage = r => require.ensure([], () => r(require('../views/goods/goods-manage.vue')), 'goods-manage')
 const createGood = r => require.ensure([], () => r(require('../views/goods/create-good.vue')), 'create-good')
-const orderManage = r => require.ensure([], () => r(require('../views/shop/order-manage.vue')), 'order-manage')
+const orderManage = r => require.ensure([], () => r(require('../views/goods/order-manage.vue')), 'order-manage')
 
 
 export default [{

src/views/shop/order-manage.vue → src/views/goods/order-manage.vue

@@ -6,25 +6,23 @@
       <el-form ref="searchForm" :model="searchForm" label-width="80px" label-suffix=":" :inline="true">
         <el-row :gutter="30" type="flex" style="margin-top: 10px">
           <el-col :span="18">
-            <el-form-item label="店铺名称">
-              <el-input v-model="searchForm.name" size="small" placeholder="请输入店铺名称"></el-input>
+            <el-form-item label="商品名称">
+              <el-input v-model="searchForm.name" size="small" placeholder="请输入商品名称"></el-input>
             </el-form-item>
-            <el-form-item label="店铺ID">
-              <el-input v-model="searchForm.id" size="small" placeholder="请输入店铺ID"></el-input>
+            <el-form-item label="订单号">
+              <el-input v-model="searchForm.id" size="small" placeholder="请输入订单号"></el-input>
             </el-form-item>
-            <el-form-item label="店铺类型">
-              <el-select
-                  v-model="searchForm.type"
-                  placeholder="请选择店铺类型"
+            <el-form-item label="买家名称">
+              <el-input v-model="searchForm.name" size="small" placeholder="请输入买家名称"></el-input>
+            </el-form-item>
+            <el-form-item label="下单时间">
+              <el-date-picker
+                  v-model="searchForm.orderTime"
+                  type="datetime"
                   size="small"
-                  clearable>
-                <el-option
-                    v-for="(item,index) in typeList"
-                    :key="index"
-                    :label="item.label"
-                    :value="item.value"
-                ></el-option>
-              </el-select>
+                  value-format="yyyy-MM-dd HH:mm:ss"
+                  placeholder="请选择下单时间">
+              </el-date-picker>
             </el-form-item>
           </el-col>
           <el-col :span="6" style="text-align: right">
@@ -32,36 +30,38 @@
             <el-button type="default" size="small" @click="resetForm" style="margin-left:0;">重置</el-button>
           </el-col>
         </el-row>
-        <el-row>
-          <el-col :span="24" style="text-align: right">
-            <el-button type="primary" size="small" @click="createShop">新建店铺</el-button>
-          </el-col>
-        </el-row>
       </el-form>
-      <el-table :data="tableData" class="item-table" style="width: 100%;margin-top: 10px;">
-        <el-table-column prop="id" label="店铺ID" min-width="100" align="center"></el-table-column>
-        <el-table-column prop="name" label="店铺名称" min-width="100" align="center"></el-table-column>
-        <el-table-column prop="type" label="店铺类型" min-width="100" align="center">
-          <template slot-scope="scope">
-            <span>{{ scope.row.type | dynamicFlagStatus }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column prop="status" label="店铺状态" min-width="100" align="center">
+      <el-tabs v-model="activeName" @tab-click="handleClick">
+        <el-tab-pane label="全部" name="all"></el-tab-pane>
+        <el-tab-pane label="等待买家付款" name="first"></el-tab-pane>
+        <el-tab-pane label="等待发货" name="second"></el-tab-pane>
+        <el-tab-pane label="已发货" name="third"></el-tab-pane>
+        <el-tab-pane label="交易成功" name="fourth"></el-tab-pane>
+        <el-tab-pane label="关闭交易" name="five"></el-tab-pane>
+      </el-tabs>
+      <el-table :data="tableData" border  max-height="1000" class="item-table" style="width: 100%;margin-top: 10px;">
+        <el-table-column prop="id" label="订单号" min-width="100" align="center"></el-table-column>
+        <el-table-column prop="name" label="商品名称" min-width="100" align="center"></el-table-column>
+        <el-table-column prop="status" label="交易状态" min-width="100" align="center">
           <template slot-scope="scope">
             <span>{{ scope.row.status | rangeStatus }}</span>
           </template>
         </el-table-column>
-        <el-table-column prop="num" label="已上架商品数" min-width="120" align="center"></el-table-column>
-        <el-table-column prop="createdTime" label="创建时间" min-width="100" align="center">
+        <el-table-column prop="name" label="实收款" min-width="100" align="center"></el-table-column>
+        <el-table-column prop="name" label="买家" min-width="100" align="center"></el-table-column>
+        <el-table-column prop="name" label="数量" min-width="100" align="center"></el-table-column>
+        <el-table-column prop="name" label="规格" min-width="100" align="center"></el-table-column>
+        <el-table-column prop="name" label="单价" min-width="100" align="center"></el-table-column>
+        <el-table-column prop="createdTime" label="下单时间" min-width="100" align="center">
           <template slot-scope="scope">
             <span>{{ scope.row.createdTime | liveDateFilter }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="操作" min-width="370" align="center">
+        <el-table-column prop="name" label="备注" min-width="100" align="center"></el-table-column>
+        <el-table-column label="操作" min-width="370" align="center" fixed="right">
           <template slot-scope="scope">
             <div>
-              <el-button @click="editShop(scope.row)" type="text" size="small">编辑</el-button>
-              <el-button @click="shopManage(scope.row)" type="text" size="small">店铺管理</el-button>
+              <el-button @click="shopManage(scope.row)" type="text" size="small">查看详情</el-button>
             </div>
           </template>
         </el-table-column>
@@ -91,12 +91,13 @@
     data(){
       return{
         curmbFirst: '订单管理',
+        activeName: 'all',
         showAllFlag: false,
         showNewFlag: false,
         searchForm: {
           name: '',
           id: '',
-          type: '',
+          orderTime: '',
           pageNo: 1,
           pageSize: 10,
         },
@@ -134,7 +135,7 @@
         this.searchForm = {
           name: '',
           id: '',
-          type: ''
+          orderTime: ''
         };
         this.searchList();
       },
@@ -186,6 +187,7 @@
         this.searchForm.pageNo = val;
         this.searchList();
       },
+      handleClick(tab, event) {},
     },
   }
 </script>
@@ -223,4 +225,13 @@
       }
     }
   }
+  .el-tabs__item.is-active{
+    color: #449284;
+  }
+  .el-tabs__active-bar{
+    background-color: #449284;
+  }
+  .el-tabs__item:hover{
+    color: #449284;
+  }
 </style>

src/views/layout/slidebar.vue

@@ -431,6 +431,12 @@
           index: 'goods-manage'
         };
         vm.items.push(shop1);
+        const shop2 = {
+          title: '订单管理',
+          icon: 'el-icon-first-aid-kit',
+          index: 'order-manage'
+        };
+        vm.items.push(shop2);
       },
 
       goToMessageSendPage(checkAuth) {