no message

src/views/secondHandMall/activistOrder/details.vue

@@ -0,0 +1,344 @@
+<template>
+  <zj-page-container>
+    <zj-page-fill>
+      <div style="box-sizing: border-box; padding:10px;">
+        <div>
+          <div class="order-main">
+            <el-row style="padding: 15px 15px 10px">
+              <el-col :span="24">
+                <div class="order-main-title">
+                  <span>订单编号：{{ orderDetail.orderId }}</span>
+                  <span>下单时间：{{ orderDetail.createTime }}</span>
+                </div>
+              </el-col>
+            </el-row>
+            <div style="width: 100%; padding: 10px 15px 15px 15px">
+              <el-row>
+                <el-col :span="10">
+                  <div>
+                    <el-form ref="form" :model="form" label-width="80px" size="mini">
+                      <el-form-item label="处理结果">
+                        <el-radio-group v-model="form.resource">
+                          <el-radio label="仅退货"></el-radio>
+                          <el-radio label="仅退款"></el-radio>
+                          <el-radio label="退货退款"></el-radio>
+                        </el-radio-group>
+                      </el-form-item>
+                      <el-form-item label="退货数量">
+                        <el-input v-model="form.name"></el-input>
+                      </el-form-item>
+                      <el-form-item label="退款金额">
+                        <el-input v-model="form.name"></el-input>
+                      </el-form-item>
+                      <el-form-item label="备注">
+                        <el-input type="textarea" v-model="form.desc"></el-input>
+                      </el-form-item>
+                    </el-form>
+                  </div>
+                </el-col>
+                <el-col :span="14" style="padding-top: 10px;">
+                  <el-steps :active="-1" align-center>
+                    <el-step title="买家下单" :description="orderDetail.createTime"></el-step>
+                    <el-step title="买家付款" :description="orderDetail.payTime ? orderDetail.payTime : ''"></el-step>
+                    <el-step title="商家发货"
+                      :description="orderDetail.deliverTime ? orderDetail.deliverTime : ''"></el-step>
+                    <el-step title="交易成功" :description="orderDetail.overTime ? orderDetail.overTime : ''"></el-step>
+                  </el-steps>
+                </el-col>
+              </el-row>
+            </div>
+          </div>
+
+          <div class="order-receive-info">
+            <el-row :gutter="10">
+              <el-col :xs="24" :sm="24" :md="8" :lg="8" :xl="8">
+                <div class='info'>
+                  <div class='info_title'>卖家信息</div>
+                  <div class='info_bottom'>
+                    <div class='info_bottom_lt'>
+                      <el-image style='width: 40px; height: 40px' src=""></el-image>
+                    </div>
+                    <div class='info_bottom_rt'>
+                      <div>微信昵称：{formData.userName}</div>
+                      <div>微信手机号：{formData.phone}</div>
+                      <div>发布时间：{formData.goodsCreateTime}</div>
+                    </div>
+                  </div>
+                </div>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="8" :lg="8" :xl="8">
+                <div class='info'>
+                  <div class='info_title'>买家信息</div>
+                  <div class='info_bottom'>
+                    <div class='info_bottom_lt'>
+                      <el-image style='width: 40px; height: 40px' src="">
+                      </el-image>
+                    </div>
+                    <div class='info_bottom_rt'>
+                      <div>微信昵称：{formData.buyerUserName}</div>
+                      <div>微信手机号：{formData.buyerUserPhone}</div>
+                      <div>收货人信息：{formData.consigneeName}</div>
+                      <div>收货人地址：{formData.address}</div>
+                      <div>支付方式：{formData.payType === 'WECHAT'}</div>
+                    </div>
+                  </div>
+                </div>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="8" :lg="8" :xl="8">
+                <div class='info'>
+                  <div class='info_title'>物流信息</div>
+                  <div class='info_bottom'>
+                    <div class='info_bottom_rt'>
+                      <div>
+                        <el-radio-group value={formData.logisticsType}>
+                          <el-radio label='SELF'>自提</el-radio>
+                          <el-radio label='DELIVERY'>物流</el-radio>
+                        </el-radio-group>
+                      </div>
+                      <div>快递单号：{formData.logisticsNum}</div>
+                      <div>快递公司：{formData.logisticsName}</div>
+                      <el-button type='primary' size='small'>查看物流
+                      </el-button>
+                    </div>
+                  </div>
+                </div>
+              </el-col>
+            </el-row>
+          </div>
+
+          <h3>商品信息</h3>
+          <div class="order-detail">
+            <el-table :data="orderDetail.orderDetails" style="width: 100%" border>
+              <el-table-column label="商品信息" min-width="200">
+                <template slot-scope="scope">
+                  <el-row>
+                    <el-col :span="6">
+                      <el-image style="width: 40px; height: 40px" :src="scope.row.imgUrl">
+                        <div slot="error" class="image-slot">
+                          <i class="el-icon-picture-outline"></i>
+                        </div>
+                      </el-image>
+                    </el-col>
+                    <el-col :span="18">
+                      <div><el-tag type="danger" effect="plain" size="mini" style="margin-right: 4px"
+                          v-if="scope.row.promotionFullPieceId">满件打折</el-tag>{{ scope.row.goodsName }}</div>
+                    </el-col>
+                  </el-row>
+                </template>
+              </el-table-column>
+              <el-table-column prop="price" label="单价" align="center"></el-table-column>
+              <el-table-column prop="num" label="数量" align="center"></el-table-column>
+              <el-table-column prop="payAmount" label="商品总金额" align="center" min-width="100"></el-table-column>
+              <el-table-column prop="refundAmount" label="退款金额" align="center"></el-table-column>
+              <el-table-column label="操作" align="center" width="160">
+                <template slot-scope="scope">
+                  <el-button size="mini" type="primary">退款</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
+        </div>
+      </div>
+    </zj-page-fill>
+  </zj-page-container>
+</template>
+
+<script>
+export default {
+  name: "detail",
+  data() {
+    return {
+      form: {
+
+      },
+      orderDetail: {
+        orderDetails: []
+      },
+      orderForm: {
+
+      },
+      orderFormRules: {
+
+      },
+    }
+  },
+  created() {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.info {
+  .info_title {
+    font-size: 16px;
+    font-weight: 700;
+  }
+
+  .info_bottom {
+    display: flex;
+    margin: 10px 0;
+
+    .info_bottom_lt {
+      width: 40px;
+      height: 40px;
+    }
+
+    .info_bottom_rt {
+      padding: 0 0 0 10px;
+      line-height: 30px;
+
+      .photoPZ {
+        display: inline-block;
+        vertical-align: text-top;
+      }
+    }
+  }
+}
+
+.order-main {
+  margin-top: 15px;
+  border: 1px solid #e5e5e5;
+
+  .order-main-title {
+    font-size: 14px;
+  }
+
+  .order-main-title span {
+    margin-right: 15px;
+  }
+
+  .order-main-status {
+    padding: 15px 0;
+    font-size: 24px;
+    color: #409EFF;
+  }
+
+  .order-main-opt-btn {
+    padding: 15px 0;
+  }
+}
+
+.order-receive-info {
+  margin: 15px 0 30px;
+  padding: 15px;
+  background: #f5f7fa;
+
+  :first-child div span {
+    padding-right: 15px;
+  }
+}
+
+.order-detail {
+  background: #f5f7fa;
+
+  .order-amount-info {
+    padding: 15px 0;
+    font-size: 12px;
+    font-weight: bold;
+  }
+
+  ::v-deep .el-table tr,
+  ::v-deep .el-table th {
+    background-color: #f5f7fa;
+  }
+}
+
+.main-detail {
+  .title {
+    font-size: 16px;
+    font-weight: 700;
+    margin-bottom: 20px;
+  }
+
+  .item {
+    display: flex;
+    font-size: 14px;
+    color: #666;
+    padding-bottom: 12px;
+
+    .label {
+      white-space: nowrap;
+    }
+  }
+}
+
+.order-evaluate-info {
+  margin: 15px 0;
+  padding: 30px 15px;
+  background: #f5f7fa;
+
+  .title {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    .left {
+      font-size: 16px;
+      font-weight: 700;
+
+      span {
+        font-weight: normal;
+        margin-left: 20px;
+        font-size: 14px;
+        color: #666;
+      }
+    }
+
+    .right {
+      display: flex;
+      align-items: center;
+      font-size: 14px;
+
+      span {
+        margin-right: 10px;
+      }
+    }
+  }
+
+  .main {
+    margin-top: 20px;
+    display: flex;
+
+    .rate-list {
+      font-size: 14px;
+      flex-shrink: 0;
+    }
+
+    .tag-list {
+      margin-left: 30px;
+
+      ::v-deep .el-tag {
+        margin-right: 10px;
+        margin-bottom: 10px;
+      }
+    }
+  }
+
+  .content {
+    width: 400px;
+    line-height: 20px;
+    font-size: 14px;
+    color: #333;
+    margin-top: 10px;
+  }
+
+  .img-list {
+    display: flex;
+    flex-wrap: wrap;
+    margin-top: 10px;
+    width: 400px;
+
+    ::v-deep .el-image {
+      width: 100px;
+      height: 100px;
+      margin-right: 10px;
+      margin-bottom: 10px;
+      border: 1px solid #eaeaea;
+    }
+  }
+}
+</style>

src/views/secondHandMall/activistOrder/index.vue

@@ -15,18 +15,18 @@
                         </el-form-item>
                       </el-col>
                       <el-col :xs="24" :sm="12" :lg="6">
-                        <el-form-item label="商品名称" prop="goodsName">
-                          <el-input v-model="screenForm.goodsName" placeholder="请输入商品名称"></el-input>
+                        <el-form-item label="商品名称" prop="esGoodsName">
+                          <el-input v-model="screenForm.esGoodsName" placeholder="请输入商品名称"></el-input>
                         </el-form-item>
                       </el-col>
                       <el-col :xs="24" :sm="12" :lg="6">
-                        <el-form-item label="会员昵称" prop="memberName">
-                          <el-input v-model="screenForm.memberName" placeholder="请输入会员昵称"></el-input>
+                        <el-form-item label="会员昵称" prop="userName">
+                          <el-input v-model="screenForm.userName" placeholder="请输入会员昵称"></el-input>
                         </el-form-item>
                       </el-col>
                       <el-col :xs="24" :sm="12" :lg="6">
-                        <el-form-item label="手机号" prop="phone">
-                          <el-input v-model="screenForm.phone" placeholder="请输入手机号"></el-input>
+                        <el-form-item label="手机号" prop="userMobile">
+                          <el-input v-model="screenForm.userMobile" placeholder="请输入手机号"></el-input>
                         </el-form-item>
                       </el-col>
                       <el-col :xs="24" :sm="12" :lg="6">
@@ -68,15 +68,9 @@
                   <div class="fl">
                     <el-tabs v-model="tabCurrent" type="card" @tab-click="changeTabs" class="fl" size="small" style="margin-right: 10px">
                       <el-tab-pane label="全部" name="ALL"></el-tab-pane>
-                      <el-tab-pane label="待付款" name="NOPAY"></el-tab-pane>
-                      <el-tab-pane label="待确认" name="DQR"></el-tab-pane>
-                      <el-tab-pane label="待发货" name="DFH"></el-tab-pane>
-                      <el-tab-pane label="已发货" name="YFH"></el-tab-pane>
-                      <el-tab-pane label="已完成" name="OVER"></el-tab-pane>
-                      <el-tab-pane label="退款/取消" name="CLOSE"></el-tab-pane>
-                      <el-tab-pane label="已超时" name="TIMEOUT"></el-tab-pane>
+                      <el-tab-pane label="待商家处理" name="NOPAY"></el-tab-pane>
+                      <el-tab-pane label="已完成" name="DQR"></el-tab-pane>
                     </el-tabs>
-                    <el-button class="fl" type="primary" size="small">新增</el-button>
                   </div>
                   <div class="fr">
                     <el-button size="small" type="primary">导出</el-button>
@@ -117,7 +111,7 @@
                                   </div>
                                   <div class="main">
                                     <span><el-tag type="danger" effect="plain" size="mini" style="margin-right: 4px"
-                                        v-if="orderItem.promotionFullPieceId">满件打折</el-tag>{{ orderItem.goodsName }}</span>
+                                        v-if="orderItem.promotionFullPieceId">满件打折</el-tag>{{ orderItem.esGoodsName }}</span>
                                     <span class="spec"
                                       v-if="orderItem.goodsSpecName === '默认' && orderItem.goodsSpecValue === '默认'">默认</span>
                                     <span class="spec" v-else>{{ orderItem.goodsSpecName }}-{{ orderItem.goodsSpecValue
@@ -134,7 +128,7 @@
                           <el-col :span="4" style="height: 100%;">
                             <div class="col-item">
                               <div>{{ order.userName }}</div>
-                              <div>{{ order.phone }}</div>
+                              <div>{{ order.userMobile }}</div>
                             </div>
                           </el-col>
                           <el-col :span="4" style="height: 100%;">
@@ -155,18 +149,18 @@
                             <div class="col-item">
                               <div style="display: flex; align-items: center;">
                                 <img src="@/assets/order/CLOSE.png" style="width: 16px; flex-shrink: 0;"
-                                  v-if="order.orderStatus == 'CLOSE'">
+                                  v-if="order.status == 'CLOSE'">
                                 <img src="@/assets/order/DFH.png" style="width: 16px; flex-shrink: 0;"
-                                  v-if="order.orderStatus == 'DFH'">
+                                  v-if="order.status == 'DFH'">
                                 <img src="@/assets/order/NOPAY.png" style="width: 16px; flex-shrink: 0;"
-                                  v-if="order.orderStatus == 'NOPAY'">
+                                  v-if="order.status == 'NOPAY'">
                                 <img src="@/assets/order/OVER.png" style="width: 16px; flex-shrink: 0;"
-                                  v-if="order.orderStatus == 'OVER'">
+                                  v-if="order.status == 'OVER'">
                                 <img src="@/assets/order/TIMEOUT.png" style="width: 16px; flex-shrink: 0;"
-                                  v-if="order.orderStatus == 'TIMEOUT'">
+                                  v-if="order.status == 'TIMEOUT'">
                                 <img src="@/assets/order/YFH.png" style="width: 16px; flex-shrink: 0;"
-                                  v-if="order.orderStatus == 'YFH'">
-                                <span style="margin-left: 4px">{{ order.orderStatus | ORDER_CURRENT_STATUS_FILTER }}</span>
+                                  v-if="order.status == 'YFH'">
+                                <span style="margin-left: 4px">{{ order.status | ORDER_CURRENT_STATUS_FILTER }}</span>
                               </div>
                               <div>({{ order.toWorkOrder ? '已派单' : '未派单' }})</div>
                             </div>
@@ -174,9 +168,7 @@
                           <el-col :span="3" style="height: 100%;">
                             <div class="col-item">
                               <div class="operate">
-                                <el-popconfirm title="确定确认订单吗？" @confirm="">
-                                  <el-button slot="reference" type="text" size="small">确认订单</el-button>
-                                </el-popconfirm>
+                                <el-button @click="viewDetails" type="text" size="small">查看详情</el-button>
                               </div>
                             </div>
                           </el-col>
@@ -197,75 +189,9 @@
               </zj-page-container>
             </div>
           </div>
-          <!-- 新增 -->
-          <div v-if="activeKey == 'remark'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
-          </div>
-          <!-- 确认订单 -->
-          <div v-if="activeKey == 'remark'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
-          </div>
-          <!-- 确认收款 -->
-          <div v-if="activeKey == 'materialDetail'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
-          </div>
-          <!-- 取消订单 -->
-          <div v-if="activeKey == 'deliverGoods'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
-          </div>
-          <!-- 查看物流 -->
-          <div v-if="activeKey == 'editAddress1'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
-          </div>
           <!-- 查看详情 -->
-          <div v-if="activeKey == 'editAddress2'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
-          </div>
-          <!-- 退货 -->
-          <div v-if="activeKey == 'editAddress3'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
+          <div v-if="activeKey == 'details'" style="width:100%;height:100%;">
+            <detailsV/>
           </div>
         </template>
       </zj-tab-page>
@@ -275,20 +201,20 @@
 </template>
 
 <script>
-import { getList } from "@/api/order";
+import { esOrderList } from "@/api/orderManagement";
+import detailsV from "./details.vue"
 import '@/styles/order-list.scss'
 export default {
-  components: {},
-
+  components: {detailsV},
   data() {
     return {
       screenForm: { // 筛选表单数据
         orderId: '', // 订单号
-        goodsName: '', // 商品名称
-        memberName: '', // 会员昵称
-        phone: '', // 手机号
+        esGoodsName: '', // 商品名称
+        userName: '', // 会员昵称
+        userMobile: '', // 手机号
         websitId: '', // 网点名称
-        orderStatus: '', // 状态
+        status: '', // 状态
         createDate: '', // 创建时间
         payDate: '', // 支付时间
         exchangeCode: '', // 兑换码
@@ -317,8 +243,26 @@ export default {
     this.getList();
   },
   methods: {
+    viewDetails(){
+      this.$refs.tabPage.addTab({
+        // 对应显示的模块
+        activeKey: "details",
+        // 唯一标识
+        key: "details",
+        // 页签名称
+        label: "订单详情",
+        // 打开时事件
+        triggerEvent: () => {
+        
+        },
+        // 关闭时事件
+        closeEvent: () => {
+          
+        }
+      })
+    },
     changeTabs(tab, event) {
-      this.screenForm.orderStatus = this.tabCurrent === 'ALL' ? '' : tab.$options.propsData.name
+      this.screenForm.status = this.tabCurrent === 'ALL' ? '' : tab.$options.propsData.name
       this.currentPage = 1;
       this.getList();
     },
@@ -326,23 +270,18 @@ export default {
     getList() {
       let params = {
         orderId: this.screenForm.orderId, // 订单号
-        productName: this.screenForm.goodsName, // 商品名称
-        userName: this.screenForm.memberName, // 会员昵称
-        phone: this.screenForm.phone, // 手机号
-        websitId: this.screenForm.websitId,
-        exchangeCode: this.screenForm.exchangeCode,
-        orderStatus: this.screenForm.orderStatus, // 状态
+        esGoodsName: this.screenForm.esGoodsName, // 商品名称
+        userName: this.screenForm.userName, // 会员昵称
+        userMobile: this.screenForm.userMobile, // 手机号
+        status: this.screenForm.status, // 状态
         startCreateTime: this.screenForm.createDate[0] ? this.screenForm.createDate[0] : null, // 创建时间
         endCreateTime: this.screenForm.createDate[1] ? this.screenForm.createDate[1] : null, // 创建时间
         startPayTime: this.screenForm.payDate[0] ? this.screenForm.payDate[0] : null, // 支付时间
         endPayTime: this.screenForm.payDate[1] ? this.screenForm.payDate[1] : null, // 支付时间
-        isNegative: this.screenForm.evaluateStatus, // 评价状态
-        abnormalDispatch: this.screenForm.sendStatus, // 派单异常
-        workerOrderNo: this.screenForm.workerOrderNo, // 信息编号
         pageNum: this.currentPage,
         pageSize: this.pageSize
       };
-      getList(params).then(res => {
+      esOrderList(params).then(res => {
         res.data.records.forEach(item => {
           item.selected = false;
         });

src/views/secondHandMall/orderManagement/add.vue

@@ -1,8 +1,14 @@
 <template>
-  <zj-form-container ref="formRef" :form-data="formData" :form-attributes="{ size: 'mini' }">
-    <zj-form-module title="客户信息" label-width="100px" :form-data="formData" :form-items="formItems" />
-    <zj-form-module title="商品信息" label-width="100px" :form-data="formData" :form-items="formItems2" />
-  </zj-form-container>
+  <zj-page-container>
+    <zj-page-fill>
+      <div style="box-sizing: border-box; padding:10px;">
+        <zj-form-container ref="formRef" :form-data="formData" :form-attributes="{ size: 'mini' }">
+          <zj-form-module title="客户信息" label-width="80px" :form-data="formData" :form-items="formItems" />
+          <zj-form-module title="商品信息" label-width="80px" :form-data="formData" :form-items="formItems2" />
+        </zj-form-container>
+      </div>
+    </zj-page-fill>
+  </zj-page-container>
 </template>
 
 <script>

src/views/secondHandMall/orderManagement/deliverGoods.vue

@@ -0,0 +1,72 @@
+<template>
+  <zj-page-container>
+    <zj-page-fill>
+      <div style="box-sizing: border-box; padding:10px;">
+        <zj-form-container ref="formRef" :form-data="formData" :form-attributes="{ size: 'mini' }">
+          <zj-form-module title="客户信息" label-width="80px" :form-data="formData" :form-items="formItems" />
+          <zj-form-module title="商品信息" label-width="80px" :form-data="formData" :form-items="formItems2" />
+        </zj-form-container>
+      </div>
+    </zj-page-fill>
+  </zj-page-container>
+</template>
+
+<script>
+export default {
+  components: {ImageUpload},
+  data(){
+    return {
+      formData: {
+        imgSrc: [],
+        promotionQuestionnaireQrcodes: []
+      }
+    }
+  },
+  computed: {
+    formItems(){
+      return [{
+        name: 'el-radio',
+        options: [
+          { label: '一级能效', value: "一级能效" },
+          { label: '二级能效', value: "二级能效" },
+        ],
+        md: 24,
+        attributes: { disabled: this.disabled },
+        formItemAttributes: { label: '发货方式', prop: 'mark' }
+      },{
+        name: 'el-input',
+        md: 12,
+        attributes: { disabled: false },
+        formItemAttributes: { label: '物流公司', prop: 'categoryName' }
+      },{
+        name: 'el-input',
+        md: 12,
+        attributes: { disabled: false },
+        formItemAttributes: { label: '快递单号', prop: 'categoryName' }
+      }]
+    },
+    formItems2(){
+      return [{
+          name: 'slot-component',
+          md: 24,
+          formItemAttributes: {
+            label: '',
+            'label-width': '0px',
+            prop: 'promotionQuestionnaireQrcodes',
+            rules: []
+          },
+          render: (h, { props, onInput }) => {
+            var { value } = props
+            return null
+          }
+        }]
+    }
+  },
+  methods: {
+    
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>

src/views/secondHandMall/orderManagement/details.vue

@@ -0,0 +1,384 @@
+<template>
+  <zj-page-container>
+    <zj-page-fill>
+      <div style="box-sizing: border-box; padding:10px;">
+        <div>
+          <div class="order-main">
+            <el-row style="padding: 15px 15px 10px">
+              <el-col :span="24">
+                <div class="order-main-title">
+                  <span>订单编号：{{ orderDetail.orderId }}</span>
+                  <span>下单时间：{{ orderDetail.createTime }}</span>
+                </div>
+              </el-col>
+            </el-row>
+            <div style="width: 100%; padding: 10px 15px 15px 15px">
+              <el-row>
+                <el-col :span="10">
+                  <div style="display: flex;">
+                    <div>
+                      <div class="order-main-status">
+                        <span>状态</span>
+                      </div>
+                      <div class="order-main-opt-btn">
+                        <template>
+                          <el-popconfirm title="确定收款吗？">
+                            <el-button slot="reference" size="small">确认收款</el-button>
+                          </el-popconfirm>
+                          <el-button size="small" style="margin-left: 10px;">修改价格</el-button>
+                          <el-popconfirm title="确定取消订单吗？" style="margin-left: 10px;">
+                            <el-button slot="reference" size="small" type="danger">取消订单</el-button>
+                          </el-popconfirm>
+                        </template>
+                      </div>
+                    </div>
+                  </div>
+                  <div>
+                    <el-form ref="form" :model="form" label-width="80px" size="mini">
+                      <el-form-item label="处理结果">
+                        <el-radio-group v-model="form.resource">
+                          <el-radio label="仅退货"></el-radio>
+                          <el-radio label="仅退款"></el-radio>
+                          <el-radio label="退货退款"></el-radio>
+                        </el-radio-group>
+                      </el-form-item>
+                      <el-form-item label="退货数量">
+                        <el-input v-model="form.name"></el-input>
+                      </el-form-item>
+                      <el-form-item label="退款金额">
+                        <el-input v-model="form.name"></el-input>
+                      </el-form-item>
+                      <el-form-item label="备注">
+                        <el-input type="textarea" v-model="form.desc"></el-input>
+                      </el-form-item>
+                    </el-form>
+                  </div>
+                </el-col>
+                <el-col :span="14" style="padding-top: 10px;">
+                  <el-steps :active="-1" align-center>
+                    <el-step title="买家下单" :description="orderDetail.createTime"></el-step>
+                    <el-step title="买家付款" :description="orderDetail.payTime ? orderDetail.payTime : ''"></el-step>
+                    <el-step title="商家发货"
+                      :description="orderDetail.deliverTime ? orderDetail.deliverTime : ''"></el-step>
+                    <el-step title="交易成功" :description="orderDetail.overTime ? orderDetail.overTime : ''"></el-step>
+                  </el-steps>
+                </el-col>
+              </el-row>
+            </div>
+          </div>
+
+          <div class="order-receive-info">
+            <el-row :gutter="10">
+              <el-col :xs="24" :sm="24" :md="8" :lg="8" :xl="8">
+                <div class='info'>
+                  <div class='info_title'>卖家信息</div>
+                  <div class='info_bottom'>
+                    <div class='info_bottom_lt'>
+                      <el-image style='width: 40px; height: 40px' src=""></el-image>
+                    </div>
+                    <div class='info_bottom_rt'>
+                      <div>微信昵称：{formData.userName}</div>
+                      <div>微信手机号：{formData.phone}</div>
+                      <div>发布时间：{formData.goodsCreateTime}</div>
+                    </div>
+                  </div>
+                </div>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="8" :lg="8" :xl="8">
+                <div class='info'>
+                  <div class='info_title'>买家信息</div>
+                  <div class='info_bottom'>
+                    <div class='info_bottom_lt'>
+                      <el-image style='width: 40px; height: 40px' src="">
+                      </el-image>
+                    </div>
+                    <div class='info_bottom_rt'>
+                      <div>微信昵称：{formData.buyerUserName}</div>
+                      <div>微信手机号：{formData.buyerUserPhone}</div>
+                      <div>收货人信息：{formData.consigneeName}</div>
+                      <div>收货人地址：{formData.address}</div>
+                      <div>支付方式：{formData.payType === 'WECHAT'}</div>
+                    </div>
+                  </div>
+                </div>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="8" :lg="8" :xl="8">
+                <div class='info'>
+                  <div class='info_title'>物流信息</div>
+                  <div class='info_bottom'>
+                    <div class='info_bottom_rt'>
+                      <div>
+                        <el-radio-group value={formData.logisticsType}>
+                          <el-radio label='SELF'>自提</el-radio>
+                          <el-radio label='DELIVERY'>物流</el-radio>
+                        </el-radio-group>
+                      </div>
+                      <div>快递单号：{formData.logisticsNum}</div>
+                      <div>快递公司：{formData.logisticsName}</div>
+                      <el-button type='primary' size='small'>查看物流
+                      </el-button>
+                    </div>
+                  </div>
+                </div>
+              </el-col>
+            </el-row>
+          </div>
+
+          <h3>商品信息</h3>
+          <div class="order-detail">
+            <!-- 订单表格 -->
+            <el-table :data="orderDetail.orderDetails" style="width: 100%" border>
+              <el-table-column label="商品信息" min-width="200">
+                <template slot-scope="scope">
+                  <el-row>
+                    <el-col :span="6">
+                      <el-image style="width: 40px; height: 40px" :src="scope.row.imgUrl">
+                        <div slot="error" class="image-slot">
+                          <i class="el-icon-picture-outline"></i>
+                        </div>
+                      </el-image>
+                    </el-col>
+                    <el-col :span="18">
+                      <div><el-tag type="danger" effect="plain" size="mini" style="margin-right: 4px"
+                          v-if="scope.row.promotionFullPieceId">满件打折</el-tag>{{ scope.row.goodsName }}</div>
+                    </el-col>
+                  </el-row>
+                </template>
+              </el-table-column>
+              <el-table-column prop="price" label="单价" align="center"></el-table-column>
+              <el-table-column prop="num" label="数量" align="center"></el-table-column>
+              <el-table-column prop="payAmount" label="商品总金额" align="center" min-width="100"></el-table-column>
+              <el-table-column prop="refundAmount" label="退款金额" align="center"></el-table-column>
+              <el-table-column label="操作" align="center" width="160">
+                <template slot-scope="scope">
+                  <el-button size="mini" type="primary">退款</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
+
+          <h3>收款信息</h3>
+          <div class="order-main">
+            <div style="width: 100%; padding: 10px 15px 15px 15px">
+              <el-row>
+                <el-col :span="10">
+                  <div>
+                    <el-form ref="form" :model="form" label-width="80px" size="mini">
+                      <el-form-item label="收款金额">
+                        <el-input v-model="form.name"></el-input>
+                      </el-form-item>
+                      <el-form-item label="备注">
+                        <el-input type="textarea" v-model="form.desc"></el-input>
+                      </el-form-item>
+                    </el-form>
+                  </div>
+                </el-col>
+              </el-row>
+            </div>
+          </div>
+
+        </div>
+      </div>
+    </zj-page-fill>
+  </zj-page-container>
+</template>
+
+<script>
+export default {
+  name: "detail",
+  data() {
+    return {
+      form: {
+
+      },
+      orderDetail: {
+        orderDetails: []
+      },
+      orderForm: {
+
+      },
+      orderFormRules: {
+
+      },
+    }
+  },
+  created() {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.info {
+  .info_title {
+    font-size: 16px;
+    font-weight: 700;
+  }
+
+  .info_bottom {
+    display: flex;
+    margin: 10px 0;
+
+    .info_bottom_lt {
+      width: 40px;
+      height: 40px;
+    }
+
+    .info_bottom_rt {
+      padding: 0 0 0 10px;
+      line-height: 30px;
+
+      .photoPZ {
+        display: inline-block;
+        vertical-align: text-top;
+      }
+    }
+  }
+}
+
+.order-main {
+  margin-top: 15px;
+  border: 1px solid #e5e5e5;
+
+  .order-main-title {
+    font-size: 14px;
+  }
+
+  .order-main-title span {
+    margin-right: 15px;
+  }
+
+  .order-main-status {
+    padding: 15px 0;
+    font-size: 24px;
+    color: #409EFF;
+  }
+
+  .order-main-opt-btn {
+    padding: 15px 0;
+  }
+}
+
+.order-receive-info {
+  margin: 15px 0 30px;
+  padding: 15px;
+  background: #f5f7fa;
+
+  :first-child div span {
+    padding-right: 15px;
+  }
+}
+
+.order-detail {
+  background: #f5f7fa;
+
+  .order-amount-info {
+    padding: 15px 0;
+    font-size: 12px;
+    font-weight: bold;
+  }
+
+  ::v-deep .el-table tr,
+  ::v-deep .el-table th {
+    background-color: #f5f7fa;
+  }
+}
+
+.main-detail {
+  .title {
+    font-size: 16px;
+    font-weight: 700;
+    margin-bottom: 20px;
+  }
+
+  .item {
+    display: flex;
+    font-size: 14px;
+    color: #666;
+    padding-bottom: 12px;
+
+    .label {
+      white-space: nowrap;
+    }
+  }
+}
+
+.order-evaluate-info {
+  margin: 15px 0;
+  padding: 30px 15px;
+  background: #f5f7fa;
+
+  .title {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    .left {
+      font-size: 16px;
+      font-weight: 700;
+
+      span {
+        font-weight: normal;
+        margin-left: 20px;
+        font-size: 14px;
+        color: #666;
+      }
+    }
+
+    .right {
+      display: flex;
+      align-items: center;
+      font-size: 14px;
+
+      span {
+        margin-right: 10px;
+      }
+    }
+  }
+
+  .main {
+    margin-top: 20px;
+    display: flex;
+
+    .rate-list {
+      font-size: 14px;
+      flex-shrink: 0;
+    }
+
+    .tag-list {
+      margin-left: 30px;
+
+      ::v-deep .el-tag {
+        margin-right: 10px;
+        margin-bottom: 10px;
+      }
+    }
+  }
+
+  .content {
+    width: 400px;
+    line-height: 20px;
+    font-size: 14px;
+    color: #333;
+    margin-top: 10px;
+  }
+
+  .img-list {
+    display: flex;
+    flex-wrap: wrap;
+    margin-top: 10px;
+    width: 400px;
+
+    ::v-deep .el-image {
+      width: 100px;
+      height: 100px;
+      margin-right: 10px;
+      margin-bottom: 10px;
+      border: 1px solid #eaeaea;
+    }
+  }
+}
+</style>

src/views/secondHandMall/orderManagement/getLbsAmapRegion.js

@@ -85,7 +85,7 @@ export default {
         },
         {
           name: 'el-select',
-          md: 6,
+          md: 5,
           formItemAttributes: {
             'label-width': '0px',
             label: '', //街道

src/views/secondHandMall/orderManagement/index.vue

@@ -177,6 +177,8 @@
                                 <el-popconfirm title="确定确认订单吗？" @confirm="">
                                   <el-button slot="reference" type="text" size="small">确认订单</el-button>
                                 </el-popconfirm>
+                                <el-button @click="viewDetails" type="text" size="small">查看详情</el-button>
+                                <el-button @click="viewMaterialFlow" type="text" size="small">查看物流</el-button>
                               </div>
                             </div>
                           </el-col>
@@ -199,73 +201,31 @@
           </div>
           <!-- 新增 -->
           <div v-if="activeKey == 'add'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                  <add/>
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
+            <add/>
+          </div>
+          <!-- 查看详情 -->
+          <div v-if="activeKey == 'details'" style="width:100%;height:100%;">
+            <detailsV/>
           </div>
           <!-- 确认订单 -->
           <div v-if="activeKey == 'remark'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
+            
           </div>
           <!-- 确认收款 -->
           <div v-if="activeKey == 'materialDetail'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
+            
           </div>
           <!-- 取消订单 -->
           <div v-if="activeKey == 'deliverGoods'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
+            
           </div>
           <!-- 查看物流 -->
-          <div v-if="activeKey == 'editAddress1'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
-          </div>
-          <!-- 查看详情 -->
-          <div v-if="activeKey == 'editAddress2'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
+          <div v-if="activeKey == 'materialFlow'" style="width:100%;height:100%;">
+            <materialFlow/>
           </div>
           <!-- 退货 -->
           <div v-if="activeKey == 'editAddress3'" style="width:100%;height:100%;">
-            <zj-page-container>
-              <zj-page-fill>
-                <div style="box-sizing: border-box; padding:10px;">
-                
-                </div>
-              </zj-page-fill>
-            </zj-page-container>
+            
           </div>
         </template>
       </zj-tab-page>
@@ -277,9 +237,11 @@
 <script>
 import { esOrderList } from "@/api/orderManagement";
 import add from "./add.vue"
+import detailsV from "./details.vue"
+import materialFlow from "./materialFlow.vue"
 import '@/styles/order-list.scss'
 export default {
-  components: {add},
+  components: {add, detailsV, materialFlow},
 
   data() {
     return {
@@ -336,6 +298,42 @@ export default {
         }
       })
     },
+    viewDetails(){
+      this.$refs.tabPage.addTab({
+        // 对应显示的模块
+        activeKey: "details",
+        // 唯一标识
+        key: "details",
+        // 页签名称
+        label: "订单详情",
+        // 打开时事件
+        triggerEvent: () => {
+        
+        },
+        // 关闭时事件
+        closeEvent: () => {
+          
+        }
+      })
+    },
+    viewMaterialFlow(){
+      this.$refs.tabPage.addTab({
+        // 对应显示的模块
+        activeKey: "materialFlow",
+        // 唯一标识
+        key: "materialFlow",
+        // 页签名称
+        label: "查看物流",
+        // 打开时事件
+        triggerEvent: () => {
+        
+        },
+        // 关闭时事件
+        closeEvent: () => {
+          
+        }
+      })
+    },
     changeTabs(tab, event) {
       this.screenForm.status = this.tabCurrent === 'ALL' ? '' : tab.$options.propsData.name
       this.currentPage = 1;

src/views/secondHandMall/orderManagement/materialFlow.vue

@@ -0,0 +1,307 @@
+<template>
+  <zj-page-container>
+    <zj-page-fill>
+      <div style="box-sizing: border-box; padding:10px;">
+        <div>
+          <div class="order-main">
+            <el-row style="padding: 15px 15px 10px">
+              <el-col :span="24">
+                <div class="order-main-title">
+                  <span>订单编号：{{ orderDetail.orderId }}</span>
+                  <span>下单时间：{{ orderDetail.createTime }}</span>
+                </div>
+              </el-col>
+            </el-row>
+            <div style="width: 100%; padding: 10px 15px 15px 15px">
+              <el-row :gutter="10">
+                <el-col :xs="24" :sm="24" :md="8" :lg="8" :xl="8">
+                  <div class='info'>
+                    <div class='info_title'>卖家信息</div>
+                    <div class='info_bottom'>
+                      <div class='info_bottom_lt'>
+                        <el-image style='width: 40px; height: 40px' src=""></el-image>
+                      </div>
+                      <div class='info_bottom_rt'>
+                        <div>微信昵称：{formData.userName}</div>
+                        <div>微信手机号：{formData.phone}</div>
+                        <div>发布时间：{formData.goodsCreateTime}</div>
+                      </div>
+                    </div>
+                  </div>
+                </el-col>
+                <el-col :xs="24" :sm="24" :md="8" :lg="8" :xl="8">
+                  <div class='info'>
+                    <div class='info_title'>买家信息</div>
+                    <div class='info_bottom'>
+                      <div class='info_bottom_lt'>
+                        <el-image style='width: 40px; height: 40px' src="">
+                        </el-image>
+                      </div>
+                      <div class='info_bottom_rt'>
+                        <div>微信昵称：{formData.buyerUserName}</div>
+                        <div>微信手机号：{formData.buyerUserPhone}</div>
+                        <div>收货人信息：{formData.consigneeName}</div>
+                        <div>收货人地址：{formData.address}</div>
+                        <div>支付方式：{formData.payType === 'WECHAT'}</div>
+                      </div>
+                    </div>
+                  </div>
+                </el-col>
+                <el-col :xs="24" :sm="24" :md="8" :lg="8" :xl="8">
+                  <div class='info'>
+                    <div class='info_title'>物流信息</div>
+                    <div class='info_bottom'>
+                      <div class='info_bottom_rt'>
+                        <div>
+                          <el-radio-group value={formData.logisticsType}>
+                            <el-radio label='SELF'>自提</el-radio>
+                            <el-radio label='DELIVERY'>物流</el-radio>
+                          </el-radio-group>
+                        </div>
+                        <div>快递单号：{formData.logisticsNum}</div>
+                        <div>快递公司：{formData.logisticsName}</div>
+                      </div>
+                    </div>
+                  </div>
+                </el-col>
+              </el-row>
+            </div>
+          </div>
+          
+          <h3>物流信息</h3>
+          <div class="order-detail">
+            <el-table :data="orderDetail.orderDetails" style="width: 100%" border>
+              <el-table-column label="商品信息" min-width="200">
+                <template slot-scope="scope">
+                  <el-row>
+                    <el-col :span="6">
+                      <el-image style="width: 40px; height: 40px" :src="scope.row.imgUrl">
+                        <div slot="error" class="image-slot">
+                          <i class="el-icon-picture-outline"></i>
+                        </div>
+                      </el-image>
+                    </el-col>
+                    <el-col :span="18">
+                      <div><el-tag type="danger" effect="plain" size="mini" style="margin-right: 4px"
+                          v-if="scope.row.promotionFullPieceId">满件打折</el-tag>{{ scope.row.goodsName }}</div>
+                    </el-col>
+                  </el-row>
+                </template>
+              </el-table-column>
+              <el-table-column prop="price" label="单价" align="center"></el-table-column>
+              <el-table-column prop="num" label="数量" align="center"></el-table-column>
+              <el-table-column prop="payAmount" label="商品总金额" align="center" min-width="100"></el-table-column>
+              <el-table-column prop="refundAmount" label="退款金额" align="center"></el-table-column>
+              <el-table-column label="操作" align="center" width="160">
+                <template slot-scope="scope">
+                  <el-button size="mini" type="primary">退款</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
+
+        </div>
+      </div>
+    </zj-page-fill>
+  </zj-page-container>
+</template>
+
+<script>
+export default {
+  name: "detail",
+  data() {
+    return {
+      form: {
+
+      },
+      orderDetail: {
+        orderDetails: []
+      },
+      orderForm: {
+
+      },
+      orderFormRules: {
+
+      },
+    }
+  },
+  created() {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.info {
+  .info_title {
+    font-size: 16px;
+    font-weight: 700;
+  }
+
+  .info_bottom {
+    display: flex;
+    margin: 10px 0;
+
+    .info_bottom_lt {
+      width: 40px;
+      height: 40px;
+    }
+
+    .info_bottom_rt {
+      padding: 0 0 0 10px;
+      line-height: 30px;
+
+      .photoPZ {
+        display: inline-block;
+        vertical-align: text-top;
+      }
+    }
+  }
+}
+
+.order-main {
+  margin-top: 15px;
+  border: 1px solid #e5e5e5;
+
+  .order-main-title {
+    font-size: 14px;
+  }
+
+  .order-main-title span {
+    margin-right: 15px;
+  }
+
+  .order-main-status {
+    padding: 15px 0;
+    font-size: 24px;
+    color: #409EFF;
+  }
+
+  .order-main-opt-btn {
+    padding: 15px 0;
+  }
+}
+
+.order-receive-info {
+  margin: 15px 0 30px;
+  padding: 15px;
+  background: #f5f7fa;
+
+  :first-child div span {
+    padding-right: 15px;
+  }
+}
+
+.order-detail {
+  background: #f5f7fa;
+
+  .order-amount-info {
+    padding: 15px 0;
+    font-size: 12px;
+    font-weight: bold;
+  }
+
+  ::v-deep .el-table tr,
+  ::v-deep .el-table th {
+    background-color: #f5f7fa;
+  }
+}
+
+.main-detail {
+  .title {
+    font-size: 16px;
+    font-weight: 700;
+    margin-bottom: 20px;
+  }
+
+  .item {
+    display: flex;
+    font-size: 14px;
+    color: #666;
+    padding-bottom: 12px;
+
+    .label {
+      white-space: nowrap;
+    }
+  }
+}
+
+.order-evaluate-info {
+  margin: 15px 0;
+  padding: 30px 15px;
+  background: #f5f7fa;
+
+  .title {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    .left {
+      font-size: 16px;
+      font-weight: 700;
+
+      span {
+        font-weight: normal;
+        margin-left: 20px;
+        font-size: 14px;
+        color: #666;
+      }
+    }
+
+    .right {
+      display: flex;
+      align-items: center;
+      font-size: 14px;
+
+      span {
+        margin-right: 10px;
+      }
+    }
+  }
+
+  .main {
+    margin-top: 20px;
+    display: flex;
+
+    .rate-list {
+      font-size: 14px;
+      flex-shrink: 0;
+    }
+
+    .tag-list {
+      margin-left: 30px;
+
+      ::v-deep .el-tag {
+        margin-right: 10px;
+        margin-bottom: 10px;
+      }
+    }
+  }
+
+  .content {
+    width: 400px;
+    line-height: 20px;
+    font-size: 14px;
+    color: #333;
+    margin-top: 10px;
+  }
+
+  .img-list {
+    display: flex;
+    flex-wrap: wrap;
+    margin-top: 10px;
+    width: 400px;
+
+    ::v-deep .el-image {
+      width: 100px;
+      height: 100px;
+      margin-right: 10px;
+      margin-bottom: 10px;
+      border: 1px solid #eaeaea;
+    }
+  }
+}
+</style>