卖家发货选择优惠券 review by jun.qiu

@@ -39,6 +39,29 @@
         <span class="iconfont iconwarn"></span>
         <p>{{ stateCenterAddress.deliverDesc }}</p>
       </div>
+
+      <!-- 新增价格信息 -->
+      <div class="coupon-wrapper" v-if="orderFeeInfo.couponInfo" @click="onCouponClick">
+        <div class="title">优惠券<span class="desc">{{orderFeeInfo.couponInfo.desc  || ''}}</span></div>
+        <div><span class="price">{{orderFeeInfo.couponInfo.coupon_amount_str || '￥0'}}</span><i class="iconfont iconright icon-right"></i></div>
+      </div>
+
+      <div class="price-info item-wrapper" v-if="orderFeeInfo.platformFee">
+        <p class="platform-fee">
+          <span class="label"
+            >平台费用:</span>
+          <span>{{orderFeeInfo.platformFee.amount || '￥0'}}</span>
+        </p>
+        <p class="delivery-fee">
+          <span class="label">银行转账费（1%）:</span>
+          <span>{{orderFeeInfo.bankTransferFee || '￥0'}}</span>
+        </p>
+        <p>
+          <span class="label">实收入:</span>
+          <span class="pay-price">{{orderFeeInfo.income || '￥0'}}</span>
+        </p>
+      </div>
+
       <div class="submit-warp">
         <div class="contract-check">
           <i
@@ -69,36 +92,42 @@
 </template>
 
 <script>
-import { get } from "lodash";
-import { Button, Input } from "cube-ui";
-import { createNamespacedHelpers } from "vuex";
+import { get } from 'lodash';
+import { Button, Input } from 'cube-ui';
+import { createNamespacedHelpers } from 'vuex';
 
-const { mapState, mapActions } = createNamespacedHelpers("order/orderDeliver");
+const { mapState, mapActions } = createNamespacedHelpers('order/orderDeliver');
 
 export default {
-  name: "OrderDeliver",
+  name: 'OrderDeliver',
   data() {
     return {
       canCopy: false,
       canScan: false,
       centerAddress: {},
-      expressCode: "",
-      readContract: false
+      expressCode: '',
+      readContract: false,
     };
   },
   created() {
     let { skup, code } = this.$route.params || {};
 
     this.orderCode = code;
-    if (process.env.VUE_ENV !== "server") {
+    if (process.env.VUE_ENV !== 'server') {
       this.fetchAppraiseAddress({
         skup,
         orderCode: code
       });
     }
+
+    // 第一次进入发货页面，获取费用
+    this.computeWithCoupon({
+      orderCode: code,
+      couponCode: ''
+    });
   },
   computed: {
-    ...mapState(["appraiseAddress"]),
+    ...mapState(['appraiseAddress', 'orderFeeInfo', 'selectCouponCode']),
     stateCenterAddress() {
       if (!this.centerAddress.address) {
         this.centerAddress = get(this.appraiseAddress, this.orderCode) || {};
@@ -120,24 +149,24 @@ export default {
 
     this.fetchAppraiseAddressChangeNotice({ orderCode: this.orderCode }).then(
       res => {
-        let isChanged = get(res, "data.isChanged");
-        let isForceShow = get(res, "data.isForceShow");
+        let isChanged = get(res, 'data.isChanged');
+        let isForceShow = get(res, 'data.isForceShow');
 
         if (!isChanged && !isForceShow) {
           return;
         }
 
         let {
-          title = "",
+          title = '',
           tips,
           alert_address_name,
           alert_address,
           alert_mobile
         } = res.data || {};
         let info = [
-          alert_address_name || "",
-          alert_address || "",
-          alert_mobile || ""
+          alert_address_name || '',
+          alert_address || '',
+          alert_mobile || ''
         ];
 
         if (isChanged && tips) {
@@ -146,41 +175,40 @@ export default {
 
         this.$createDialog(
           {
-            type: "alert",
+            type: 'alert',
             confirmBtn: {
-              text: "我知道了"
+              text: '我知道了'
             },
             onConfirm() {
-              // Todo report()
-              console.log("Todo Report", res.data);
+              console.log('Todo Report', res.data);
             }
           },
           createElement => {
             return [
               createElement(
-                "div",
+                'div',
                 {
                   class: {
-                    "dg-notice-content": true
+                    'dg-notice-content': true
                   },
-                  slot: "content"
+                  slot: 'content'
                 },
                 [
                   createElement(
-                    "div",
+                    'div',
                     {
                       class: {
-                        "dg-notice-content-title": true
+                        'dg-notice-content-title': true
                       }
                     },
-                    isChanged ? "仓库调整公告" : title
+                    isChanged ? '仓库调整公告' : title
                   ),
                   ...info.map(val => {
                     return createElement(
-                      "p",
+                      'p',
                       {
                         class: {
-                          "dg-notice-content-info": true
+                          'dg-notice-content-info': true
                         }
                       },
                       val
@@ -196,15 +224,53 @@ export default {
   },
   methods: {
     ...mapActions([
-      "fetchAppraiseAddress",
-      "fetchAppraiseAddressChangeNotice",
-      "deliverOrderToDepot"
+      'fetchAppraiseAddress',
+      'fetchAppraiseAddressChangeNotice',
+      'deliverOrderToDepot',
+      'computeWithCoupon',
+      'changeSelectCouponList'
     ]),
+    onCouponClick() {
+      let vm = this;
+
+      this.couponListActionSheet = this.$createOrderCouponList({
+        $props: {
+          data: this.orderFeeInfo.couponList,
+        },
+        onItemClickAction(item) {
+          vm.onCouponItemClick(item);
+        },
+        onConfirmAction() {
+          vm.couponListActionSheet.hide();
+          vm.compute();
+        },
+        onCloseAction() {
+          vm.compute();
+        }
+      }).show();
+    },
+    onCouponItemClick(item) {
+      this.changeSelectCouponList(item);
+    },
+    compute() {
+      return this.computeWithCoupon({
+        orderCode: this.orderCode,
+        couponCode: this.selectCouponCode
+      }).then(result => {
+        if (result.code !== 200) {
+          this.$createToast({
+            time: 1500,
+            txt: result.message,
+            type: 'txt'
+          }).show();
+        }
+      });
+    },
     toast(msg, time = 1500) {
       this.$createToast &&
         this.$createToast({
           txt: msg,
-          type: "txt",
+          type: 'txt',
           time
         }).show();
     },
@@ -221,7 +287,7 @@ export default {
     },
     scanCode() {
       if (window && window.WindVane) {
-        window.WindVane.call("Scancode", "scan", {}, e => {
+        window.WindVane.call('Scancode', 'scan', {}, e => {
           if (e && e.code) {
             this.expressCode = e.code;
           }
@@ -246,17 +312,17 @@ export default {
         this.deliverOrderToDepot({
           orderCode: this.orderCode,
           wayBillCode: this.expressCode,
-          depotNum: this.stateCenterAddress.id
+          depotNum: this.stateCenterAddress.id,
+          couponCode: this.selectCouponCode,
         }).then(res => {
           if (res.code === 200) {
             this.$router.go(-1);
-            // Todo report()
           } else {
-            this.toast(res.message || "网络异常，请稍后重试");
+            this.toast(res.message || '网络异常，请稍后重试');
           }
         });
       } else {
-        this.toast("请输入正确的快递单号");
+        this.toast('请输入正确的快递单号');
       }
     }
   },
@@ -412,6 +478,7 @@ export default {
     display: flex;
     align-items: flex-start;
     padding-top: 16px;
+    padding-bottom: 40px;
 
     .iconfont {
       font-size: 32px;
@@ -429,6 +496,70 @@ export default {
     }
   }
 
+  .coupon-wrapper {
+    display: flex;
+    padding: 40px 0;
+    justify-content: space-between;
+    align-items: center;
+    border-top: 1px solid #eee;
+
+    .title {
+      font-size: 32px;
+      display: flex;
+      align-items: center;
+    }
+
+    .desc {
+      font-size: 24px;
+      color: #9B9B9B;
+      margin-left: 12px;
+    }
+
+    .price {
+      color: #B0B0B0;
+      font-size: 32px;
+      margin-right: 10px;
+    }
+
+    .icon-right {
+      font-size: 24px;
+      color: #999;
+    }
+  }
+
+  .item-wrapper {
+    border-top: 1px solid #eee;
+    padding: 40px 0;
+  }
+
+  .price-info {
+    font-size: 28px;
+
+    & > p {
+      display: flex;
+      justify-content: space-between;
+    }
+
+    .platform-fee {
+      line-height: 1;
+      display: flex;
+      align-items: center;
+    }
+
+    .delivery-fee {
+      margin: 20px 0;
+    }
+
+    .pay-price {
+      color: #d0021b;
+    }
+
+    .label {
+      font-size: 28px;
+      margin-right: 12px;
+    }
+  }
+
   .submit-warp {
     width: 100%;
     position: absolute;

@@ -12,7 +12,7 @@
         <span class="wordText">{{price}}</span>
       </div>
       <OrderMargin class="order-item order-margin" :data="computeTip" :url="url" :superSell="isEntry" ></OrderMargin>
-      <OrderFee  class="order-item" :data="computeTip"></OrderFee>
+      <OrderFee class="order-item" :data="computeTip"></OrderFee>
       <AddressInfo :data="addressInfo" class="order-item"></AddressInfo>
 
     </div>

-export default function () {
+import { get, find, filter } from 'lodash';
+
+export default function() {
   return {
     namespaced: true,
     state: {
       appraiseAddress: {},
-      appraiseAddressCodes: []
+      appraiseAddressCodes: [],
+      orderFeeInfo: {},
+      selectCouponCode: ''
     },
     mutations: {
       SET_APPRAISE_ADDRESS(state, { orderCode, data }) {
@@ -14,7 +18,7 @@ export default function () {
         state.appraiseAddressCodes.push(orderCode);
 
         if (state.appraiseAddressCodes.length > 5) {
-          state.appraiseAddressCodes.shift()
+          state.appraiseAddressCodes.shift();
         }
 
         state.appraiseAddressCodes.forEach(code => {
@@ -24,6 +28,30 @@ export default function () {
         });
 
         state.appraiseAddress = addr;
+      },
+      SET_ORDER_FEE(state, { data }) {
+        state.orderFeeInfo = data;
+      },
+      UPDATE_SELECT_COUPON_LIST(state, { couponCode }) {
+        const item = find(get(state.orderFeeInfo, 'couponList', []), { coupon_code: couponCode });
+
+        if (!item) {
+          return;
+        }
+
+        let lastSelectCouponCode = state.selectCouponCode;
+
+        if (item.selected === 'Y') {
+          item.selected = 'N';
+          state.selectCouponCode = '';
+        } else {
+          filter(get(state.orderFeeInfo, 'couponList', []), { coupon_code: lastSelectCouponCode }).forEach(i => {
+            i.selected = 'N';
+          });
+
+          item.selected = 'Y';
+          state.selectCouponCode = couponCode;
+        }
       }
     },
     actions: {
@@ -48,6 +76,7 @@ export default function () {
 
         return res;
       },
+
       /**
        * @param {
        *  orderCode 订单编码
@@ -58,6 +87,7 @@ export default function () {
           orderCode: orderCode + '',
         });
       },
+
       /**
        * @param {
        *  orderCode 订单编码
@@ -65,13 +95,42 @@ export default function () {
        *  depotNum 鉴定中心id
        * }
        */
-      async deliverOrderToDepot({ commit }, { orderCode, wayBillCode, depotNum } = {}) {
+      async deliverOrderToDepot({ commit }, { orderCode, wayBillCode, depotNum, couponCode } = {}) {
         return await this.$api.post('/api/order/deliverToDepot', {
           expressCompanyId: 23,
           orderCode: orderCode + '',
           wayBillCode,
-          depotNum
+          depotNum,
+          couponCode
         });
+      },
+
+      /**
+       * @param {
+       *  orderCode 订单编码
+       *  couponCode 非必填（如刚进入发货页面时）
+       *  autoRecommended 是否自动推荐券 Y ：推荐，N ：不推荐 ，默认N 不做推荐
+       * }
+      */
+      async computeWithCoupon({ commit }, { orderCode, couponCode } = {}) {
+        const res = await this.$api.get('/api/seller/order/computeWithCoupon', {
+          orderCode: orderCode + '',
+          couponCode,
+          autoRecommended: 'N'
+        });
+
+        if (res.code === 200) {
+          commit('SET_ORDER_FEE', {
+            data: res.data
+          });
+        }
+
+        return res;
+      },
+
+      // 修改选中优惠券
+      async changeSelectCouponList({ commit }, { couponCode, couponType }) {
+        commit('UPDATE_SELECT_COUPON_LIST', {couponCode});
       }
     },
   };

@@ -377,6 +377,19 @@ module.exports = {
       // wayBillCode: { type: String, require: true }, // 物流快递号
       // orderCode: { type: String, require: true }, // 订单编号
       // depotNum: { type: Number, require: true }, // 鉴定中心id
+      // couponCode: { type: String, require: false }, // 优惠券单号
+    },
+  },
+
+  // 卖家发货
+  '/api/seller/order/computeWithCoupon': {
+    ufo: true,
+    auth: true,
+    api: 'ufo.sellerOrder.computeWithCoupon',
+    params: {
+      orderCode: { type: String, require: true }, // 快递公司id
+      couponCode: { type: String, require: false }, // 物流快递号
+      autoRecommended: { type: String, require: false }
     },
   },