fe / xianyu-ufo-app-web · Commits

Go to a project

Authored by 张文文
Commit 1855b3875dcff068b76b841c56172aa6dce49826 1 parent af76b86d

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

Inline Side-by-side
Showing 4 changed files with 245 additions and 42 deletions
@@ -39,6 +39,29 @@ @@ -39,6 +39,29 @@
39 <span class="iconfont iconwarn"></span> 39 <span class="iconfont iconwarn"></span>
40 <p>{{ stateCenterAddress.deliverDesc }}</p> 40 <p>{{ stateCenterAddress.deliverDesc }}</p>
41 </div> 41 </div>
  42 +
  43 + <!-- 新增价格信息 -->
  44 + <div class="coupon-wrapper" v-if="orderFeeInfo.couponInfo" @click="onCouponClick">
  45 + <div class="title">优惠券<span class="desc">{{orderFeeInfo.couponInfo.desc || ''}}</span></div>
  46 + <div><span class="price">{{orderFeeInfo.couponInfo.coupon_amount_str || '￥0'}}</span><i class="iconfont iconright icon-right"></i></div>
  47 + </div>
  48 +
  49 + <div class="price-info item-wrapper" v-if="orderFeeInfo.platformFee">
  50 + <p class="platform-fee">
  51 + <span class="label"
  52 + >平台费用:</span>
  53 + <span>{{orderFeeInfo.platformFee.amount || '￥0'}}</span>
  54 + </p>
  55 + <p class="delivery-fee">
  56 + <span class="label">银行转账费（1%）:</span>
  57 + <span>{{orderFeeInfo.bankTransferFee || '￥0'}}</span>
  58 + </p>
  59 + <p>
  60 + <span class="label">实收入:</span>
  61 + <span class="pay-price">{{orderFeeInfo.income || '￥0'}}</span>
  62 + </p>
  63 + </div>
  64 +
42 <div class="submit-warp"> 65 <div class="submit-warp">
43 <div class="contract-check"> 66 <div class="contract-check">
44 <i 67 <i
@@ -69,36 +92,42 @@ @@ -69,36 +92,42 @@
69 </template> 92 </template>
70 93
71 <script> 94 <script>
72 -import { get } from "lodash";  
73 -import { Button, Input } from "cube-ui";  
74 -import { createNamespacedHelpers } from "vuex"; 95 +import { get } from 'lodash';
  96 +import { Button, Input } from 'cube-ui';
  97 +import { createNamespacedHelpers } from 'vuex';
75 98
76 -const { mapState, mapActions } = createNamespacedHelpers("order/orderDeliver"); 99 +const { mapState, mapActions } = createNamespacedHelpers('order/orderDeliver');
77 100
78 export default { 101 export default {
79 - name: "OrderDeliver", 102 + name: 'OrderDeliver',
80 data() { 103 data() {
81 return { 104 return {
82 canCopy: false, 105 canCopy: false,
83 canScan: false, 106 canScan: false,
84 centerAddress: {}, 107 centerAddress: {},
85 - expressCode: "",  
86 - readContract: false 108 + expressCode: '',
  109 + readContract: false,
87 }; 110 };
88 }, 111 },
89 created() { 112 created() {
90 let { skup, code } = this.$route.params || {}; 113 let { skup, code } = this.$route.params || {};
91 114
92 this.orderCode = code; 115 this.orderCode = code;
93 - if (process.env.VUE_ENV !== "server") { 116 + if (process.env.VUE_ENV !== 'server') {
94 this.fetchAppraiseAddress({ 117 this.fetchAppraiseAddress({
95 skup, 118 skup,
96 orderCode: code 119 orderCode: code
97 }); 120 });
98 } 121 }
  122 +
  123 + // 第一次进入发货页面，获取费用
  124 + this.computeWithCoupon({
  125 + orderCode: code,
  126 + couponCode: ''
  127 + });
99 }, 128 },
100 computed: { 129 computed: {
101 - ...mapState(["appraiseAddress"]), 130 + ...mapState(['appraiseAddress', 'orderFeeInfo', 'selectCouponCode']),
102 stateCenterAddress() { 131 stateCenterAddress() {
103 if (!this.centerAddress.address) { 132 if (!this.centerAddress.address) {
104 this.centerAddress = get(this.appraiseAddress, this.orderCode) || {}; 133 this.centerAddress = get(this.appraiseAddress, this.orderCode) || {};
@@ -120,24 +149,24 @@ export default { @@ -120,24 +149,24 @@ export default {
120 149
121 this.fetchAppraiseAddressChangeNotice({ orderCode: this.orderCode }).then( 150 this.fetchAppraiseAddressChangeNotice({ orderCode: this.orderCode }).then(
122 res => { 151 res => {
123 - let isChanged = get(res, "data.isChanged");  
124 - let isForceShow = get(res, "data.isForceShow"); 152 + let isChanged = get(res, 'data.isChanged');
  153 + let isForceShow = get(res, 'data.isForceShow');
125 154
126 if (!isChanged && !isForceShow) { 155 if (!isChanged && !isForceShow) {
127 return; 156 return;
128 } 157 }
129 158
130 let { 159 let {
131 - title = "", 160 + title = '',
132 tips, 161 tips,
133 alert_address_name, 162 alert_address_name,
134 alert_address, 163 alert_address,
135 alert_mobile 164 alert_mobile
136 } = res.data || {}; 165 } = res.data || {};
137 let info = [ 166 let info = [
138 - alert_address_name || "",  
139 - alert_address || "",  
140 - alert_mobile || "" 167 + alert_address_name || '',
  168 + alert_address || '',
  169 + alert_mobile || ''
141 ]; 170 ];
142 171
143 if (isChanged && tips) { 172 if (isChanged && tips) {
@@ -146,41 +175,40 @@ export default { @@ -146,41 +175,40 @@ export default {
146 175
147 this.$createDialog( 176 this.$createDialog(
148 { 177 {
149 - type: "alert", 178 + type: 'alert',
150 confirmBtn: { 179 confirmBtn: {
151 - text: "我知道了" 180 + text: '我知道了'
152 }, 181 },
153 onConfirm() { 182 onConfirm() {
154 - // Todo report()  
155 - console.log("Todo Report", res.data); 183 + console.log('Todo Report', res.data);
156 } 184 }
157 }, 185 },
158 createElement => { 186 createElement => {
159 return [ 187 return [
160 createElement( 188 createElement(
161 - "div", 189 + 'div',
162 { 190 {
163 class: { 191 class: {
164 - "dg-notice-content": true 192 + 'dg-notice-content': true
165 }, 193 },
166 - slot: "content" 194 + slot: 'content'
167 }, 195 },
168 [ 196 [
169 createElement( 197 createElement(
170 - "div", 198 + 'div',
171 { 199 {
172 class: { 200 class: {
173 - "dg-notice-content-title": true 201 + 'dg-notice-content-title': true
174 } 202 }
175 }, 203 },
176 - isChanged ? "仓库调整公告" : title 204 + isChanged ? '仓库调整公告' : title
177 ), 205 ),
178 ...info.map(val => { 206 ...info.map(val => {
179 return createElement( 207 return createElement(
180 - "p", 208 + 'p',
181 { 209 {
182 class: { 210 class: {
183 - "dg-notice-content-info": true 211 + 'dg-notice-content-info': true
184 } 212 }
185 }, 213 },
186 val 214 val
@@ -196,15 +224,53 @@ export default { @@ -196,15 +224,53 @@ export default {
196 }, 224 },
197 methods: { 225 methods: {
198 ...mapActions([ 226 ...mapActions([
199 - "fetchAppraiseAddress",  
200 - "fetchAppraiseAddressChangeNotice",  
201 - "deliverOrderToDepot" 227 + 'fetchAppraiseAddress',
  228 + 'fetchAppraiseAddressChangeNotice',
  229 + 'deliverOrderToDepot',
  230 + 'computeWithCoupon',
  231 + 'changeSelectCouponList'
202 ]), 232 ]),
  233 + onCouponClick() {
  234 + let vm = this;
  235 +
  236 + this.couponListActionSheet = this.$createOrderCouponList({
  237 + $props: {
  238 + data: this.orderFeeInfo.couponList,
  239 + },
  240 + onItemClickAction(item) {
  241 + vm.onCouponItemClick(item);
  242 + },
  243 + onConfirmAction() {
  244 + vm.couponListActionSheet.hide();
  245 + vm.compute();
  246 + },
  247 + onCloseAction() {
  248 + vm.compute();
  249 + }
  250 + }).show();
  251 + },
  252 + onCouponItemClick(item) {
  253 + this.changeSelectCouponList(item);
  254 + },
  255 + compute() {
  256 + return this.computeWithCoupon({
  257 + orderCode: this.orderCode,
  258 + couponCode: this.selectCouponCode
  259 + }).then(result => {
  260 + if (result.code !== 200) {
  261 + this.$createToast({
  262 + time: 1500,
  263 + txt: result.message,
  264 + type: 'txt'
  265 + }).show();
  266 + }
  267 + });
  268 + },
203 toast(msg, time = 1500) { 269 toast(msg, time = 1500) {
204 this.$createToast && 270 this.$createToast &&
205 this.$createToast({ 271 this.$createToast({
206 txt: msg, 272 txt: msg,
207 - type: "txt", 273 + type: 'txt',
208 time 274 time
209 }).show(); 275 }).show();
210 }, 276 },
@@ -221,7 +287,7 @@ export default { @@ -221,7 +287,7 @@ export default {
221 }, 287 },
222 scanCode() { 288 scanCode() {
223 if (window && window.WindVane) { 289 if (window && window.WindVane) {
224 - window.WindVane.call("Scancode", "scan", {}, e => { 290 + window.WindVane.call('Scancode', 'scan', {}, e => {
225 if (e && e.code) { 291 if (e && e.code) {
226 this.expressCode = e.code; 292 this.expressCode = e.code;
227 } 293 }
@@ -246,17 +312,17 @@ export default { @@ -246,17 +312,17 @@ export default {
246 this.deliverOrderToDepot({ 312 this.deliverOrderToDepot({
247 orderCode: this.orderCode, 313 orderCode: this.orderCode,
248 wayBillCode: this.expressCode, 314 wayBillCode: this.expressCode,
249 - depotNum: this.stateCenterAddress.id 315 + depotNum: this.stateCenterAddress.id,
  316 + couponCode: this.selectCouponCode,
250 }).then(res => { 317 }).then(res => {
251 if (res.code === 200) { 318 if (res.code === 200) {
252 this.$router.go(-1); 319 this.$router.go(-1);
253 - // Todo report()  
254 } else { 320 } else {
255 - this.toast(res.message || "网络异常，请稍后重试"); 321 + this.toast(res.message || '网络异常，请稍后重试');
256 } 322 }
257 }); 323 });
258 } else { 324 } else {
259 - this.toast("请输入正确的快递单号"); 325 + this.toast('请输入正确的快递单号');
260 } 326 }
261 } 327 }
262 }, 328 },
@@ -412,6 +478,7 @@ export default { @@ -412,6 +478,7 @@ export default {
412 display: flex; 478 display: flex;
413 align-items: flex-start; 479 align-items: flex-start;
414 padding-top: 16px; 480 padding-top: 16px;
  481 + padding-bottom: 40px;
415 482
416 .iconfont { 483 .iconfont {
417 font-size: 32px; 484 font-size: 32px;
@@ -429,6 +496,70 @@ export default { @@ -429,6 +496,70 @@ export default {
429 } 496 }
430 } 497 }
431 498
  499 + .coupon-wrapper {
  500 + display: flex;
  501 + padding: 40px 0;
  502 + justify-content: space-between;
  503 + align-items: center;
  504 + border-top: 1px solid #eee;
  505 +
  506 + .title {
  507 + font-size: 32px;
  508 + display: flex;
  509 + align-items: center;
  510 + }
  511 +
  512 + .desc {
  513 + font-size: 24px;
  514 + color: #9B9B9B;
  515 + margin-left: 12px;
  516 + }
  517 +
  518 + .price {
  519 + color: #B0B0B0;
  520 + font-size: 32px;
  521 + margin-right: 10px;
  522 + }
  523 +
  524 + .icon-right {
  525 + font-size: 24px;
  526 + color: #999;
  527 + }
  528 + }
  529 +
  530 + .item-wrapper {
  531 + border-top: 1px solid #eee;
  532 + padding: 40px 0;
  533 + }
  534 +
  535 + .price-info {
  536 + font-size: 28px;
  537 +
  538 + & > p {
  539 + display: flex;
  540 + justify-content: space-between;
  541 + }
  542 +
  543 + .platform-fee {
  544 + line-height: 1;
  545 + display: flex;
  546 + align-items: center;
  547 + }
  548 +
  549 + .delivery-fee {
  550 + margin: 20px 0;
  551 + }
  552 +
  553 + .pay-price {
  554 + color: #d0021b;
  555 + }
  556 +
  557 + .label {
  558 + font-size: 28px;
  559 + margin-right: 12px;
  560 + }
  561 + }
  562 +
432 .submit-warp { 563 .submit-warp {
433 width: 100%; 564 width: 100%;
434 position: absolute; 565 position: absolute;
@@ -12,7 +12,7 @@ @@ -12,7 +12,7 @@
12 <span class="wordText">{{price}}</span> 12 <span class="wordText">{{price}}</span>
13 </div> 13 </div>
14 <OrderMargin class="order-item order-margin" :data="computeTip" :url="url" :superSell="isEntry" ></OrderMargin> 14 <OrderMargin class="order-item order-margin" :data="computeTip" :url="url" :superSell="isEntry" ></OrderMargin>
15 - <OrderFee class="order-item" :data="computeTip"></OrderFee> 15 + <OrderFee class="order-item" :data="computeTip"></OrderFee>
16 <AddressInfo :data="addressInfo" class="order-item"></AddressInfo> 16 <AddressInfo :data="addressInfo" class="order-item"></AddressInfo>
17 17
18 </div> 18 </div>
1 -export default function () { 1 +import { get, find, filter } from 'lodash';
  2 +
  3 +export default function() {
2 return { 4 return {
3 namespaced: true, 5 namespaced: true,
4 state: { 6 state: {
5 appraiseAddress: {}, 7 appraiseAddress: {},
6 - appraiseAddressCodes: [] 8 + appraiseAddressCodes: [],
  9 + orderFeeInfo: {},
  10 + selectCouponCode: ''
7 }, 11 },
8 mutations: { 12 mutations: {
9 SET_APPRAISE_ADDRESS(state, { orderCode, data }) { 13 SET_APPRAISE_ADDRESS(state, { orderCode, data }) {
@@ -14,7 +18,7 @@ export default function () { @@ -14,7 +18,7 @@ export default function () {
14 state.appraiseAddressCodes.push(orderCode); 18 state.appraiseAddressCodes.push(orderCode);
15 19
16 if (state.appraiseAddressCodes.length > 5) { 20 if (state.appraiseAddressCodes.length > 5) {
17 - state.appraiseAddressCodes.shift() 21 + state.appraiseAddressCodes.shift();
18 } 22 }
19 23
20 state.appraiseAddressCodes.forEach(code => { 24 state.appraiseAddressCodes.forEach(code => {
@@ -24,6 +28,30 @@ export default function () { @@ -24,6 +28,30 @@ export default function () {
24 }); 28 });
25 29
26 state.appraiseAddress = addr; 30 state.appraiseAddress = addr;
  31 + },
  32 + SET_ORDER_FEE(state, { data }) {
  33 + state.orderFeeInfo = data;
  34 + },
  35 + UPDATE_SELECT_COUPON_LIST(state, { couponCode }) {
  36 + const item = find(get(state.orderFeeInfo, 'couponList', []), { coupon_code: couponCode });
  37 +
  38 + if (!item) {
  39 + return;
  40 + }
  41 +
  42 + let lastSelectCouponCode = state.selectCouponCode;
  43 +
  44 + if (item.selected === 'Y') {
  45 + item.selected = 'N';
  46 + state.selectCouponCode = '';
  47 + } else {
  48 + filter(get(state.orderFeeInfo, 'couponList', []), { coupon_code: lastSelectCouponCode }).forEach(i => {
  49 + i.selected = 'N';
  50 + });
  51 +
  52 + item.selected = 'Y';
  53 + state.selectCouponCode = couponCode;
  54 + }
27 } 55 }
28 }, 56 },
29 actions: { 57 actions: {
@@ -48,6 +76,7 @@ export default function () { @@ -48,6 +76,7 @@ export default function () {
48 76
49 return res; 77 return res;
50 }, 78 },
  79 +
51 /** 80 /**
52 * @param { 81 * @param {
53 * orderCode 订单编码 82 * orderCode 订单编码
@@ -58,6 +87,7 @@ export default function () { @@ -58,6 +87,7 @@ export default function () {
58 orderCode: orderCode + '', 87 orderCode: orderCode + '',
59 }); 88 });
60 }, 89 },
  90 +
61 /** 91 /**
62 * @param { 92 * @param {
63 * orderCode 订单编码 93 * orderCode 订单编码
@@ -65,13 +95,42 @@ export default function () { @@ -65,13 +95,42 @@ export default function () {
65 * depotNum 鉴定中心id 95 * depotNum 鉴定中心id
66 * } 96 * }
67 */ 97 */
68 - async deliverOrderToDepot({ commit }, { orderCode, wayBillCode, depotNum } = {}) { 98 + async deliverOrderToDepot({ commit }, { orderCode, wayBillCode, depotNum, couponCode } = {}) {
69 return await this.$api.post('/api/order/deliverToDepot', { 99 return await this.$api.post('/api/order/deliverToDepot', {
70 expressCompanyId: 23, 100 expressCompanyId: 23,
71 orderCode: orderCode + '', 101 orderCode: orderCode + '',
72 wayBillCode, 102 wayBillCode,
73 - depotNum 103 + depotNum,
  104 + couponCode
74 }); 105 });
  106 + },
  107 +
  108 + /**
  109 + * @param {
  110 + * orderCode 订单编码
  111 + * couponCode 非必填（如刚进入发货页面时）
  112 + * autoRecommended 是否自动推荐券 Y ：推荐，N ：不推荐 ，默认N 不做推荐
  113 + * }
  114 + */
  115 + async computeWithCoupon({ commit }, { orderCode, couponCode } = {}) {
  116 + const res = await this.$api.get('/api/seller/order/computeWithCoupon', {
  117 + orderCode: orderCode + '',
  118 + couponCode,
  119 + autoRecommended: 'N'
  120 + });
  121 +
  122 + if (res.code === 200) {
  123 + commit('SET_ORDER_FEE', {
  124 + data: res.data
  125 + });
  126 + }
  127 +
  128 + return res;
  129 + },
  130 +
  131 + // 修改选中优惠券
  132 + async changeSelectCouponList({ commit }, { couponCode, couponType }) {
  133 + commit('UPDATE_SELECT_COUPON_LIST', {couponCode});
75 } 134 }
76 }, 135 },
77 }; 136 };
@@ -377,6 +377,19 @@ module.exports = { @@ -377,6 +377,19 @@ module.exports = {
377 // wayBillCode: { type: String, require: true }, // 物流快递号 377 // wayBillCode: { type: String, require: true }, // 物流快递号
378 // orderCode: { type: String, require: true }, // 订单编号 378 // orderCode: { type: String, require: true }, // 订单编号
379 // depotNum: { type: Number, require: true }, // 鉴定中心id 379 // depotNum: { type: Number, require: true }, // 鉴定中心id
  380 + // couponCode: { type: String, require: false }, // 优惠券单号
  381 + },
  382 + },
  383 +
  384 + // 卖家发货
  385 + '/api/seller/order/computeWithCoupon': {
  386 + ufo: true,
  387 + auth: true,
  388 + api: 'ufo.sellerOrder.computeWithCoupon',
  389 + params: {
  390 + orderCode: { type: String, require: true }, // 快递公司id
  391 + couponCode: { type: String, require: false }, // 物流快递号
  392 + autoRecommended: { type: String, require: false }
380 }, 393 },
381 }, 394 },
382 395