更新

config/index.js

@@ -3,7 +3,7 @@
 // see http://vuejs-templates.github.io/webpack for documentation.
 
 const path = require('path')
-const proxyUrl = 'https://test.colexiu.com'
+const proxyUrl = 'https://dev.colexiu.com'
 module.exports = {
   dev: {
     host:'0.0.0.0',

src/views/oms/order/deliverOrderList.vue

@@ -42,6 +42,57 @@
           </template>
         </el-table-column>
       </el-table>
+
+
+      <div style="margin-top: 20px">
+        <svg-icon icon-class="marker" style="color: #606266"></svg-icon>
+        <span class="font-small">商品信息</span>
+      </div>
+       <el-table
+        ref="orderItemTable"
+        :data="order.orderItemList"
+        style="width: 100%; margin-top: 20px"
+        border
+      >
+        <el-table-column label="商品图片" width="120" align="center">
+          <template slot-scope="scope">
+            <img :src="scope.row.productPic" style="height: 80px" />
+          </template>
+        </el-table-column>
+        <el-table-column label="商品名称" align="center">
+          <template slot-scope="scope">
+            <p>{{ scope.row.productName }}</p>
+            <p>品牌：{{ scope.row.productBrand }}</p>
+          </template>
+        </el-table-column>
+        <el-table-column label="状态" align="center">
+          <template slot-scope="scope">
+            <p>{{ scope.row.productStatus | formatProductStatus }}</p>
+          </template>
+        </el-table-column>
+        <el-table-column label="价格/货号"  align="center">
+          <template slot-scope="scope">
+            <p>价格：￥{{ scope.row.productPrice }}</p>
+            <p>货号：{{ scope.row.productSn }}</p>
+          </template>
+        </el-table-column>
+        <el-table-column label="属性"  align="center">
+          <template slot-scope="scope">
+            {{ scope.row.productAttr | formatProductAttr }}
+          </template>
+        </el-table-column>
+        <el-table-column label="数量"  align="center">
+          <template slot-scope="scope">
+            {{ scope.row.productQuantity }}
+          </template>
+        </el-table-column>
+        <el-table-column label="小计"  align="center">
+          <template slot-scope="scope">
+            ￥{{ scope.row.productPrice * scope.row.productQuantity }}
+          </template>
+        </el-table-column>
+      </el-table>
+
       <div style="margin-top: 15px;text-align: center">
         <el-button @click="cancel">取消</el-button>
         <el-button @click="confirm" type="primary">确定</el-button>
@@ -50,13 +101,14 @@
   </div>
 </template>
 <script>
-  import {deliveryOrder} from '@/api/order'
+  import {deliveryOrder, getOrderDetail} from '@/api/order'
   const defaultLogisticsCompanies=["顺丰快递","圆通快递","中通快递","韵达快递"];
   export default {
     name: 'deliverOrderList',
     data() {
       return {
         list:[],
+        order: {},
         companyOptions:defaultLogisticsCompanies
       }
     },
@@ -66,6 +118,40 @@
       if(this.list instanceof Array===false){
         this.list=[];
       }
+
+      this.id = this.$route.query.id;
+      getOrderDetail(this.id).then((response) => {
+        // console.log(response, 'response')
+        this.order = response.data;
+      });
+    },
+    filters: {
+      formatProductStatus(value) {
+        if (value === 1) {
+          return "待发货";
+        } else if (value === 2) {
+          return "已发货";
+        } else if (value === 3) {
+          return "已退货";
+        }else {
+          return " ";
+        }
+      },
+      formatProductAttr(value) {
+        if (value == null) {
+          return "";
+        } else {
+          let attr = JSON.parse(value);
+          let result = "";
+          for (let i = 0; i < attr.length; i++) {
+            result += attr[i].key;
+            result += ":";
+            result += attr[i].value;
+            result += ";";
+          }
+          return result;
+        }
+      },
     },
     methods:{
       cancel(){

src/views/oms/order/index.vue

@@ -410,7 +410,7 @@ export default {
       let listItem = this.covertOrder(row);
       this.$router.push({
         path: "/oms/deliverOrderList",
-        query: { list: [listItem] },
+        query: { list: [listItem], id: row.id },
       });
     },
     handleViewLogistics(index, row) {

src/views/oms/order/orderDetail.vue

@@ -194,6 +194,11 @@
             <p>品牌：{{ scope.row.productBrand }}</p>
           </template>
         </el-table-column>
+        <el-table-column label="状态" align="center">
+          <template slot-scope="scope">
+            <p>{{ scope.row.productStatus | formatProductStatus }}</p>
+          </template>
+        </el-table-column>
         <el-table-column label="价格/货号" width="120" align="center">
           <template slot-scope="scope">
             <p>价格：￥{{ scope.row.productPrice }}</p>
@@ -636,6 +641,17 @@ export default {
         return "待付款";
       }
     },
+    formatProductStatus(value) {
+      if (value === 1) {
+        return "待发货";
+      } else if (value === 2) {
+        return "已发货";
+      } else if (value === 3) {
+        return "已退货";
+      }else {
+        return " ";
+      }
+    },
     formatPayStatus(value) {
       if (value === 0) {
         return "未支付";