小药房支持普通快递和云鹊快递

src/components/shop/send-set-dialog.vue

@@ -18,7 +18,14 @@
             <p>{{setReceiveInfo.receiver}} {{setReceiveInfo.receiverMobile}}</p>
           </div>
         </div>
-        <div v-if="dialogTitle == '发货设置'">
+        <div class="dt-wrap" v-if="dtType == 2">
+          <span class="dt-title">配送方式:</span>
+          <el-radio-group v-model="dtMode"  @change="radioChange">
+            <el-radio :label="1">物流配送</el-radio>
+            <el-radio :label="2">线下配送</el-radio>
+          </el-radio-group>
+        </div>
+        <div v-if="dtType == 1 || dtMode == 1">
           <p class="form-title">填写物流信息</p>
           <el-form ref="sendSetForm" :model="sendSetForm" :rules="rules" label-width="75px" label-suffix=":">
             <el-form-item label="快递公司" prop="expressName">
@@ -37,7 +44,7 @@
             </el-form-item>
           </el-form>
         </div>
-        <div v-if="dialogTitle == '配送设置'">
+        <div v-if="dtType == 2 && dtMode == 2 ">
           <p class="form-title">填写配送员信息</p>
           <el-form ref="sendSetForm" :model="sendSetForm" :rules="rules" label-width="75px" label-suffix=":">
             <el-form-item label="姓名" prop="sender">
@@ -79,15 +86,15 @@
         type: Boolean,
         default: false,
       },
-      dialogTitle: {
-        type: String,
-        default: ''
-      },
       sendSetFormData: {
         type: Object,
         required: true,
         default: () => {}
       },
+      dtType: { // 弹框的类型 1 为发货  2为配送
+        type: Number,
+        default: 1
+      },
     },
     data(){
       return{
@@ -116,6 +123,7 @@
         setReceiveInfo: {},
         showContent: 0,
         showChangeInfo: false,
+        dtMode: 1, //1.物流配送 2.线下配送
         rules: {
           expressName: [
             { required: true, message: '请输入快递公司', trigger: "blur"},
@@ -134,10 +142,8 @@
       }
     },
     created() {
-
     },
     mounted() {
-
     },
     watch: {
       sendGoodsDialog(val) {
@@ -148,6 +154,11 @@
         }
       },
     },
+    computed: {
+      dialogTitle(){
+        return this.dtType == 1 ? '发货设置' : '配送设置';
+      }
+    },
     methods: {
       cancelSendSet() {
         this.$refs.sendSetForm.resetFields();
@@ -158,15 +169,15 @@
         this.$refs.sendSetForm.validate((valid) => {
             if (valid) {
               let para = {...this.setReceiveInfo,...this.sendSetForm};
-
-              if (this.dialogTitle == '发货设置') {//发货设置的type是1，配送设置的type是2，配送完成的type是3
+              if (this.dtType == 1) {//发货设置的type是1，配送设置的type是2，配送完成的type是3
                 para.type = 1;
-              }else if (this.dialogTitle == '配送设置') {
+              }else if (this.dtType == 2) {
                 para.type = 2;
               }
               if (para.orderNo) {
                 para.id = para.orderNo;
               }
+              para.expressType = this.dtMode;
               openLoading(this);
               updateExpress(para).then(res => {
                 closeLoading(this);
@@ -188,13 +199,10 @@
               return false;
             }
         })
-
       },
-
       close(){
         this.$emit('closeSendSet',{type: 2})
       },
-
       //修改买家收货信息
       changeInfo() {
         this.showChangeInfo = true;
@@ -216,10 +224,14 @@
         }
         this.showChangeInfo = false;
       },
+      radioChange() {
+        this.$refs.sendSetForm.resetFields();
+        this.sendSetForm.remark = '';
+      }
     },
   }
 </script>
-<style lang="scss">
+<style lang="scss" >
   .send-set-body{
     .address-content{
       width: 100%;
@@ -242,6 +254,12 @@
         }
       }
     }
+    .dt-wrap {
+      margin-top: 20px;
+      .dt-title {
+        margin-right: 16px;
+      }
+    }
     .form-title{
       margin-top: 15px;
       margin-bottom: 15px;

src/views/goods/order-detail.vue

@@ -22,18 +22,18 @@
                 <p class="trade-status1">
                   <i class="el-icon-truck" style="font-size: 18px"></i>
                   <span class="send-status" v-if="storeType == 1">已发货</span>
-                  <span class="send-status" v-if="storeType == 2">云鹊配送中</span>
+                  <span class="send-status" v-if="storeType == 2">{{expressType == 1 ? '已发货':'云鹊配送中'}}</span>
                   <span class="send-status" v-if="storeType == 3">已收货</span>
                 </p>
                 <p v-if="storeType == 1 || storeType == 2">收货地址：{{orderDetailData.receiverAddr}}，{{orderDetailData.receiver}}，{{orderDetailData.receiverMobile}}</p>
-                <div v-if="storeType == 1">
+                <div v-if="storeType == 1 || (storeType == 2 && expressType == 1)">
                   <p>物流公司：{{orderDetailData.expressName}}</p>
                   <p>快递单号：{{orderDetailData.expressNo}}</p>
                   <el-button type="text" @click="copyTxt">复制</el-button>
                   <el-button type="text" @click="updateOrderNo">修改物流单号</el-button>
                   <input type="text" id="copyInput" class="hidden-input" />
                 </div>
-                <div v-if="storeType == 2">
+                <div v-if="storeType == 2 && expressType == 2">
                   <p>配送员姓名：{{orderDetailData.sender}}</p>
                   <p>手机号：{{orderDetailData.senderMobile}}</p>
                 </div>
@@ -43,6 +43,20 @@
                 </div>
                 <p v-if="storeType == 1 || storeType == 2">备注：{{orderDetailData.remark}}</p>
               </div>
+              <div class="steps-logistics" v-if="storeType == 1 || storeType == 3 || expressType == 1">
+                <el-steps direction="vertical" :active="0">
+                  <el-step
+                    v-for="item in expressData"
+                    :title="item.time"
+                    :description="item.context"
+                    :key="item.time"
+                  >
+                    <div slot="icon">
+                      <div class="dot"></div>
+                    </div>
+                  </el-step>
+                </el-steps>
+              </div>
             </div>
             <div v-if="(showStatus == 3) && (storeType == 1 || storeType == 2)">
               <div class="trade-status1">
@@ -115,7 +129,7 @@
       </div>
       <send-set-dialog
           :sendGoodsDialog="sendGoodsDialog"
-          :dialogTitle="dialogTitle"
+          :dtType="dtType"
           :sendSetFormData="sendSetForm"
           @closeSendSet="closeSendSet">
       </send-set-dialog>
@@ -147,7 +161,7 @@
 <script>
   // import { openLoading, closeLoading } from "../../utils/utils";
   import BreadCrumb from "@/components/breadcrumb.vue";
-  import { queryOrderDetail, updateExpressNo } from '@/utils/shop';
+  import { queryOrderDetail, updateExpressNo, expressInfo } from '@/utils/shop';
   import SendSetDialog from "@/components/shop/send-set-dialog";
   export default {
     components: {
@@ -187,6 +201,12 @@
           // showStatus: null,//订单展示状态,1已完成,2已发货,3待发货,4待支付,5交易关闭
           saleTypeStr:'',// 订单类型
         },
+        expressData:[
+          {
+            time: "",
+            context: "待揽收",
+          }
+        ],
         rulesExpress: {
           expressName: [
             { required: true, message: '请输入快递公司', trigger: "blur"},
@@ -197,9 +217,10 @@
         },
         tableData: [],
         sendGoodsDialog: false,
-        dialogTitle: '',
+        dtType: 1,
         sendSetForm: {},
         showOrderNoFlag: false,
+        expressType: 1
       }
     },
     created() {
@@ -217,7 +238,9 @@
             const { goodsInfoDtoList } = res.data;
             this.orderDetailData = {...res.data};
             this.showStatus = res.data.showStatus;
+            this.expressType = res.data.expressType; // 小店 1.普通快递，2云鹊快递
             this.tableData = goodsInfoDtoList;
+            this.viewLogistics()
           }
         })
       },
@@ -225,9 +248,9 @@
         this.sendGoodsDialog = true;
         this.sendSetForm = this.orderDetailData;
         if (this.storeType == 1) {
-          this.dialogTitle = '发货设置'
+          this.dtType = 1;
         }else {
-          this.dialogTitle = '配送设置'
+          this.dtType = 2;
         }
       },
       closeSendSet(val) {
@@ -305,6 +328,23 @@
         }
         this.$message.success('复制成功');
       },
+      //查看物流
+      viewLogistics() {
+        if (this.orderDetailData.expressNo && this.orderDetailData.receiverMobile)
+        expressInfo({
+          expressNo: this.orderDetailData.expressNo,
+          receiverMobile: this.orderDetailData.receiverMobile,
+        }).then((res) => {
+          if (res.code == "000000") {
+            if (res.data.data && res.data.data.length) {
+              this.expressData = res.data.data;
+            } else {
+              this.expressData[0].time = res.data.updateTime || '';
+              this.expressData = this.expressData;
+            }
+          }
+        });
+      },
     },
     filters: {
       toFixed2: function (value) {
@@ -328,6 +368,9 @@
 </script>
 <style lang="scss">
   .order-detail-wrapper{
+    .hidden-input {
+      height: 0;
+    }
     .order-detail-content{
       background: #fff;
       padding: 10px;
@@ -380,6 +423,13 @@
                 display: inline-block;
               }
             }
+            .steps-logistics {
+              border-top: 2px solid #ddd;
+              padding-top: 20px;
+              margin-top: 20px;
+              height: 200px;
+              overflow-y: scroll;
+            }
           }
           .right-card{
             width: 28%;
@@ -446,5 +496,24 @@
         }
       }
     }
+    .el-step__icon {
+      border: none;
+      background: transparent;
+    }
+    .el-step__title {
+      font-size: 14px;
+    }
+
+    .el-step:last-of-type .el-step__line {
+      display: block !important;
+      height: 30%;
+    }
+    .dot {
+      border-radius: 50%;
+      height: 8px;
+      width: 8px;
+      border: 1px solid #999999;
+      background-color: #b8b8b8;
+    }
   }
 </style>

src/views/goods/order-manage.vue

@@ -337,7 +337,7 @@
               >
               <el-button
                 v-if="
-                  scope.row.storeType == 1 &&
+                  (scope.row.storeType == 1 || scope.row.storeType == 2) &&
                   (scope.row.showStatus == 1 || scope.row.showStatus == 2)
                 "
                 @click="viewLogistics(scope.row)"
@@ -346,7 +346,7 @@
                 >查看物流</el-button
               >
               <el-button
-                v-if="scope.row.storeType == 2 && scope.row.showStatus == 2"
+                v-if="scope.row.storeType == 2 && scope.row.showStatus == 2 && scope.row.expressType == 2"
                 @click="distributeComplete(scope.row)"
                 type="text"
                 size="small"
@@ -383,6 +383,8 @@
           :total="totalRows"
         ></el-pagination>
       </div>
+
+      <!-- 关闭交易 -->
       <el-dialog
         title="确定关闭交易吗？"
         :visible="closeTradeDialog"
@@ -432,6 +434,8 @@
           >
         </span>
       </el-dialog>
+
+      <!-- 修改价格 -->
       <el-dialog
         title="修改价格"
         :visible="changePriceDialog"
@@ -463,13 +467,18 @@
           >
         </span>
       </el-dialog>
+
+      <!-- 配送信息 -->
       <send-set-dialog
         :sendGoodsDialog="sendGoodsDialog"
-        :dialogTitle="dialogTitle"
         :sendSetFormData="sendSetForm"
+        :dtType="dtType"
         @closeSendSet="closeSendSet"
       >
       </send-set-dialog>
+
+
+      <!-- 查看快递物流 -->
       <el-dialog
         title="查看物流"
         :visible="viewLogisticsDialog"
@@ -482,7 +491,7 @@
           <div>
             <i class="el-icon-truck" style="font-size: 18px"></i
             ><span class="send-status">已发货</span>
-            <span class="view-number">{{ logisticeInfo }}</span>
+            <span class="view-number">{{ logisticeInfo.expressName }}  {{logisticeInfo.expressNo}}</span>
           </div>
           <div>
             <el-button type="text" @click="copyTxt">复制单号</el-button>
@@ -494,10 +503,10 @@
         <div class="steps-logistics">
           <el-steps direction="vertical" :active="0">
             <el-step
-              v-for="(item, index) in expressData"
+              v-for="item in expressData"
               :title="item.time"
               :description="item.context"
-              :key="index"
+              :key="item.time"
             >
               <div slot="icon">
                 <div class="dot"></div>
@@ -512,6 +521,32 @@
           >
         </span>
       </el-dialog>
+
+
+      <!-- 查看线下配送(云鹊配送)物流 -->
+      <el-dialog
+        title="查看物流"
+        :visible="offlineDialog"
+        :show-close="false"
+        width="600px"
+        center
+      >
+        <div class="offline-content">
+          <p class="offline-title">云鹊配送中</p>
+          <div class="offline-main">
+            <p class="offline-msg">配送员： {{offlinedata.sender || '--'}} </p>
+            <p class="offline-msg">手机号： {{offlinedata.senderMobile || '--'}}</p>
+            <p class="offline-msg ">备 注： {{offlinedata.remark || '--'}}</p>
+          </div>
+        </div>
+        <span slot="footer" class="dialog-footer">
+          <el-button size="small" type="primary" @click="()=>offlineDialog = false"
+            >我知道了</el-button
+          >
+        </span>
+      </el-dialog>
+
+      <!-- 配送完成 -->
       <el-dialog
         title=""
         :visible="disCompleteDialog"
@@ -532,6 +567,8 @@
         </span>
       </el-dialog>
     </div>
+
+    <!-- 退款退货 -->
     <el-dialog
       class="tui-dialog"
       title="退款退货"
@@ -592,6 +629,8 @@
         >
       </span>
     </el-dialog>
+
+    <!-- 修改物流单号 -->
     <el-dialog
       class="tui-dialog"
       title="修改物流单号"
@@ -621,6 +660,7 @@
         >
       </span>
     </el-dialog>
+
     <!-- 导入物流单号 dialog-->
     <el-dialog
       class="exportlogistics-dialog"
@@ -671,6 +711,7 @@
         >
       </div>
     </el-dialog>
+
     <!-- 导出进度loading -->
     <el-dialog
       class="exportlogistics-dialog"
@@ -864,11 +905,20 @@ export default {
         updatePrice: "",
       },
       sendGoodsDialog: false,
-      dialogTitle: "",
+      dtType: 1,
       sendSetForm: {},
       viewLogisticsDialog: false,
-      logisticeInfo: "", //复制物流信息
+      logisticeInfo: {
+        expressName: '',
+        expressNo: ''
+      }, //复制物流信息
       disCompleteDialog: false,
+      offlineDialog: false, // 线下配送
+      offlinedata:{ //线下配送的物流信息
+        sender: '',
+        senderMobile: '',
+        remark: ''
+      },
       disCompleteData: {},
       rules: {
         name: [{ required: true, message: "请输入快递公司", trigger: "blur" }],
@@ -881,7 +931,7 @@ export default {
       },
       expressData: [
         {
-          time: "2021-06-23 12:21:21",
+          time: "",
           context: "待揽收",
         },
       ],
@@ -976,7 +1026,7 @@ export default {
         errorFileUrl: "", // 失败 原因文件
         errorList: [], // 失败列表
       },
-      isLoading: false,
+      isLoading: false
       // errorFileUrl:"",
     };
   },
@@ -1047,7 +1097,6 @@ export default {
           closeLoading(this);
         });
     },
-
     // 获取物流上传进度
     async getUploadExpressProgressInterval(id) {
       clearInterval(this.timer);
@@ -1083,7 +1132,6 @@ export default {
         }
       });
     },
-
     // 获取批量取消进度
     async getUploadRefundProgressInterval(id) {
       clearInterval(this.timer);
@@ -1094,7 +1142,6 @@ export default {
         }, 2000);
       }
     },
-
     getUploadRefundProgress(id) {
       return getUploadRefundProgress(id).then((res) => {
         if (res && res.code == "000000") {
@@ -1126,7 +1173,6 @@ export default {
       }),
         (this.exportDialog = false);
     },
-
     // 导入物流单号
     uploadfile(file) {
       let _this = this;
@@ -1149,7 +1195,6 @@ export default {
       this.statFlg = false;
       this.FailureReasonFlag = true;
     },
-
     searchList() {
       this.searchForm.orderBeginTime = this.createRangeTime[0];
       this.searchForm.orderEndTime = this.createRangeTime[1];
@@ -1244,8 +1289,8 @@ export default {
     },
     //发货
     sendGoods(row) {
+      this.dtType = 1;
       this.sendGoodsDialog = true;
-      this.dialogTitle = "发货设置";
       this.sendSetForm = row;
     },
     closeSendSet(val) {
@@ -1259,17 +1304,30 @@ export default {
     },
     //配送
     distribute(row) {
+      this.dtType = 2;
       this.sendGoodsDialog = true;
-      this.dialogTitle = "配送设置";
       this.sendSetForm = row;
     },
     //查看物流
     viewLogistics(row) {
       console.log("row-----", row);
+      // expressType 1为物流配送 2为线下
+      if (row.expressType == 2) {
+        this.showOffline(row);
+        return;
+      }
       expressInfo({ expressNo: row.expressNo,receiverMobile:row.receiverMobile }).then((res) => {
         if (res.code == "000000") {
-          this.expressData = [...res.data.data, ...this.expressData];
-          this.logisticeInfo = `${row.expressName} ${row.expressNo}`;
+          if (res.data.data && res.data.data.length) {
+            this.expressData = res.data.data;
+          } else {
+            this.expressData[0].time = res.data.updateTime || '';
+            this.expressData = this.expressData;
+          }
+          this.logisticeInfo = {
+            expressName: row.expressName,
+            expressNo: row.expressNo
+          };
           this.expressForm.order = row;
           this.expressForm.company = `${row.expressName}`;
           this.expressForm.no = `${row.expressNo}`;
@@ -1279,13 +1337,18 @@ export default {
         }
       });
     },
-
+    // 展示线下物流信息
+    showOffline(row) {
+      const {sender, senderMobile, remark} = row; 
+      this.offlinedata = {sender, senderMobile, remark};
+      this.offlineDialog = true
+    },
     cancelView() {
       this.viewLogisticsDialog = false;
     },
     copyTxt() {
       let txt = document.getElementById("copyInput");
-      txt.value = this.logisticeInfo;
+      txt.value = this.logisticeInfo.expressNo;
       // if (navigator.userAgent.match(/(iPhone|iPod|iPad|Mac);?/i)) {
       if (
         navigator.userAgent.indexOf("Safari") > -1 &&
@@ -1437,7 +1500,6 @@ export default {
         window.open(res.data);
       });
     },
-
     // 云鹊店铺-订单管理-药代列表
     brokerListAll() {
       brokerListAll({ ownerId: this.ownerId }).then((res) => {
@@ -1456,7 +1518,6 @@ export default {
         }
       });
     },
-
     changeOwner(data) {
       this.ownerId = data;
       this.brokerListAll();
@@ -1675,8 +1736,21 @@ export default {
     }
   }
 }
-
 .importUrl {
   color: #449284;
 }
+.offline-content {
+  .offline-title {
+    padding: 10px 0;
+    line-height: 24px;
+    font-size: 18px;
+    color: #303133;
+    border-bottom: 1px solid #ddd;
+  }
+  .offline-main {
+    .offline-msg {
+      line-height: 30px;
+    }
+  }
+}
 </style>