零售 增加优惠券列表 增加采购列表选择优惠券的功能(开发中)

hdApp/src/admin/billing/affirmGhs.vue

@@ -153,6 +153,12 @@
 			width: 200px;
 		}
 	}
+  .coupon_box{
+    flex: 1;
+    text-align: right;
+    padding-right: 45upx;
+    color: #ff2945;
+  }
 }
 </style>
 
@@ -235,9 +241,14 @@
 						<view class="tui-title ">运费</view>
 						<input type="number" placeholder="留空表示免运费" @input="countAllPrices" v-model="form.sendCost" placeholder-class="tui-placeholder">
 					</tui-list-cell>
+          <tui-list-cell class="line-cell" :hover="false" :arrow="true" @click="pageTo({url: '/admin/coupon/selectCouponList'})">
+						<view class="tui-title ">红包/抵用券</view>
+						<view class="coupon_box">{{couponText}}</view>
+					</tui-list-cell>
 					<tui-list-cell class="line-cell" :hover="false" :arrow="false">
 						<textarea style="height: 100rpx" v-model="remark" placeholder="备注..."/>
 					</tui-list-cell>
+          
 <!--					<tui-list-cell class="line-cell" :hover="false" :arrow="false">-->
 <!--						<view class="tui-title ">结算方式</view>-->
 <!--						<button @tap="form.debt=1" class="admin-button-com mini-btn" :class="form.debt==1?'blue':'default'">欠款</button>-->
@@ -254,7 +265,7 @@
 				<text class="price-title">总金额</text>
 				<text class="price-number">
 					¥
-					<text class="large" v-if="form.sendType==1">{{ allPrice+Number(form.sendCost)  }}</text>
+					<text class="large" v-if="form.sendType==1">{{ this.numberAdd(allPrice, Number(form.sendCost))  }}</text>
 					<text class="large" v-else>{{ allPrice}}</text>
 				</text>
 			</view>
@@ -282,6 +293,7 @@ const formUtil = require("@/utils/formValidation.js");
 import { getGhsDataApi } from "@/api/ghs/index";
 import { freight,createOrder } from "@/api/purchase/index";
 import { mapActions, mapGetters } from "vuex";
+import { shopHouponHas } from '@/api/coupon'
 
 export default {
 	name: "BillingAffirm", // 开单确认
@@ -322,10 +334,11 @@ export default {
 				customId: "",
 				product: ""
 			},
-
 			// 详细地址
 			// showRegion: false,
-			showCustomer: false
+			showCustomer: false,
+      couponSumText: uni.getStorageSync('selectCouponInfo').couponSum ? uni.getStorageSync('selectCouponInfo').couponSum : '',
+      couponText: ''
 		};
 	},
 	onLoad(e) {
@@ -340,11 +353,20 @@ export default {
 				title: this.getMerchantInfo.name
 			});
 		}
+    if(uni.getStorageSync('selectCouponInfo').couponSum) {
+      this.couponText = '-￥' + uni.getStorageSync('selectCouponInfo').couponSum
+      this.allPrice = this.allPrice - Number(uni.getStorageSync('selectCouponInfo').couponSum)
+    } else {
+       this.hasCoupon()
+    }
 		this.getGhsData(e.id);
 	},
 	computed: {
 		...mapGetters(["getMerchantInfo", "getLoginInfo"])
 	},
+  onUnload() {
+    uni.removeStorageSync('selectCouponInfo')
+  },
 	methods: {
 		...mapActions(["initMerchantInfo"]),
 		init() {
@@ -358,6 +380,15 @@ export default {
 				phoneNumber: phone
 			});
 		},
+    // 是否有可用优惠券
+    hasCoupon() {
+      let amount = this.form.sendType == 1 ? this.allPrice+Number(this.form.sendCost) : this.allPrice
+      shopHouponHas(amount).then(res => {
+        console.log(377, res)
+        this.couponText = res.data.has ? '有可用优惠券' : ''
+        console.log(this.couponText)
+      }).catch(err => {})
+    },
 		getGhsData(id) {
 			getGhsDataApi({id:id}).then(res => {
 				this.ghsMsg = res.data;
@@ -441,6 +472,22 @@ export default {
 				}
 			});
 		},
+    numberAdd(arg1, arg2) {
+      var r1, r2, m, n;
+      try {
+          r1 = arg1.toString().split(".")[1].length
+      } catch (e) {
+          r1 = 0
+      }
+      try {
+          r2 = arg2.toString().split(".")[1].length
+      } catch (e) { 
+          r2 = 0 
+      } 
+      m = Math.pow(10, Math.max(r1, r2))
+      n = (r1 >= r2) ? r1 : r2;
+      return ((arg1 * m + arg2 * m) / m).toFixed(n);
+  },
 		// 表单验证
 		async formSubmit(e) {
 			try {

hdApp/src/admin/coupon/components/selectCouponItem.vue

@@ -0,0 +1,86 @@
+<template>
+  <div class="coupon-list">
+    <div class="list-img">
+      <template v-if="couponSelInx && couponSelInx == (index + 1)">
+        <img :src="`${constant.imgUrl}/retail/coupon/is-check.png`" alt mode="widthFix" />
+      </template>
+      <template v-else>
+        <img :src="`${constant.imgUrl}/retail/coupon/no-check.png`" alt mode="widthFix" />
+      </template>
+    </div>
+    <div class="list-det">
+      <div class="list-det-left">
+        <div class="price-wrap">
+          <span>￥</span>
+          <span class="price">{{ item.amount}}</span>
+        </div>
+        <div class="full-reduc app-size-28">满{{ item.miniCost}}可使用</div>
+      </div>
+      <div class="list-det-right">
+        <div class="coupon-message">
+          <div class="app-color-2">优惠券</div>
+          <div>适用：全品类</div>
+          <div>有效至：{{ item.endTime.substr(0, 10)}}</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "coupon-sel",
+  props: {
+    item: {
+      type: Object,
+      default: {}
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+// 优惠券
+.coupon-list {
+  position: relative;
+  margin-bottom: 6px;
+  .list-det {
+    width: 100%;
+    @include disFlex(center, space-between);
+    position: absolute;
+    top: 0;
+    left: 0;
+    .list-det-left {
+      padding: 20px 0 20px 36px;
+      width: 210px;
+      color: #efefef;
+      .price-wrap {
+        margin-bottom: 6px;
+        font-size: 26upx;
+        .price {
+          font-size: 60upx;
+          font-weight: bold;
+          line-height: 1;
+        }
+      }
+    }
+    .list-det-right {
+      width: calc(100% - 280px);
+      margin-left: 22px;
+      @include disFlex(center, space-between);
+      padding: 20px 26px 20px 0;
+      .coupon-message {
+        color: $fontColor3;
+        & > div {
+          margin: 6px 0;
+        }
+      }
+    }
+  }
+}
+// 修改uni-app组件
+/deep/.uni-radio-input-checked {
+  background-color: $mainColor !important;
+  border-color: $mainColor !important;
+}
+</style>

hdApp/src/admin/coupon/couponList.vue

@@ -0,0 +1,199 @@
+<template>
+	<div class="app-content coupon-list">
+		<!-- <div class="tabs-wrap"> -->
+		<app-tabs :tabs="tabs" :isFixed="true" :currentTab="tabIndex" @change="change" itemWidth="33.3333%" />
+		<!-- </div> -->
+		<div class="list-wrap" :class="{'expired' : tabIndex == 2}">
+			<block v-if="!$util.isEmpty(list.data)">
+				<div class="list" v-for="(item, index) in list.data" :key="index">
+					<div class="list-img">
+						<!-- 已过期 -->
+						<template v-if="tabIndex == 2">
+							<img :src="`${constant.imgUrl}/retail/coupon/expired.png`" alt mode="widthFix" />
+						</template>
+						<template v-else>
+							<img :src="`${constant.imgUrl}/retail/coupon/bg.png`" alt mode="widthFix" />
+						</template>
+					</div>
+					<!-- 列表 -->
+					<div class="list-det">
+						<div class="list-det-left">
+							<div class="price-wrap">
+								<span>￥</span>
+								<span class="price">{{ item.amount }}</span>
+							</div>
+							<div class="full-reduc app-size-28">满{{ item.miniCost }}可使用</div>
+						</div>
+						<div class="list-det-right">
+							<div class="coupon-message">
+								<div class="app-color-2">优惠券</div>
+								<div>适用：全品类</div>
+								<div>有效至：{{ item.endTime.substr(0, 10) }}</div>
+							</div>
+							<!-- 未使用 -->
+							<template v-if="tabIndex == 0">
+								<button class="button-com red" @click="goUserFn">去使用</button>
+							</template>
+							<!-- 已使用 -->
+							<template v-else-if="tabIndex == 1">
+								<div class="icon-wrap">
+									<i class="iconfont iconyishiyong"></i>
+								</div>
+							</template>
+							<!-- 已过期 -->
+							<template v-else>
+								<div class="icon-wrap">
+									<i class="iconfont iconyiguoqi"></i>
+								</div>
+							</template>
+						</div>
+					</div>
+				</div>
+			</block>
+			<block v-else>
+				<app-wrapper-empty title="暂无数据" :is-empty="$util.isEmpty(list.data)" />
+			</block>
+		</div>
+	</div>
+</template>
+
+<script>
+import AppTabs from '@/components/plugin/tabs'
+import AppWrapperEmpty from '@/components/app-wrapper-empty'
+import { list } from '@/mixins'
+import { shopCouponList } from '@/api/coupon'
+export default {
+	name: 'tabs',
+	components: {
+		AppTabs,
+		AppWrapperEmpty
+	},
+	mixins: [list],
+	data() {
+		return {
+			constant: this.$constant,
+			tabIndex: 0,
+			tabs: [
+				{
+					name: '未使用'
+				},
+				{
+					name: '使用记录'
+				},
+				{
+					name: '已过期'
+				}
+			]
+		}
+	},
+	onPullDownRefresh() {
+		this.resetList()
+		this._list().then(res => {
+			uni.stopPullDownRefresh()
+		})
+	},
+	onReachBottom() {
+		if (this.list.moreData == 1) {
+			this._list().then(res => {
+				uni.stopPullDownRefresh()
+			})
+		} else {
+			uni.stopPullDownRefresh()
+		}
+	},
+	onLoad: function() {
+		// this.init()
+	},
+	methods: {
+		async init() {
+			this._list()
+		},
+		_list() {
+			return shopCouponList({ status: this.tabIndex + 1 }).then(res => {
+				console.log(res)
+				this.completes(res)
+			})
+		},
+		change(e) {
+			if (this.tabIndex == e.index) {
+				return false
+			} else {
+				this.tabIndex = e.index
+				this.resetList()
+				this._list()
+			}
+		},
+		// 去使用
+		goUserFn() {
+			this.$util.pageTo('/pagesPurchase/order')
+		}
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+	.coupon-list {
+		position: relative;
+		.list-wrap {
+			padding: 100px 22px 0;
+			.list {
+				position: relative;
+				margin-bottom: 6px;
+				.list-det {
+					width: 100%;
+					@include disFlex(center, space-between);
+					position: absolute;
+					top: 0;
+					left: 0;
+					.list-det-left {
+						padding: 30px 0 30px 36px;
+						width: 210px;
+						color: #fff;
+						.price-wrap {
+							margin-bottom: 6px;
+							font-size: 26px;
+							.price {
+								font-size: 60px;
+								font-weight: bold;
+								line-height: 1;
+							}
+						}
+					}
+					.list-det-right {
+						width: calc(100% - 280px);
+						margin-left: 22px;
+						@include disFlex(center, space-between);
+						padding: 30px 26px 30px 0;
+						.coupon-message {
+							color: $fontColor3;
+							& > div {
+								margin: 4px 0;
+							}
+						}
+						.button-com {
+							padding-top: 15px;
+							padding-bottom: 15px;
+						}
+						.icon-wrap {
+							position: absolute;
+							top: 20px;
+							right: 20px;
+							.iconfont {
+								font-size: 128px;
+								color: #ffbbcd;
+							}
+						}
+					}
+				}
+			}
+			// 过期
+			&.expired {
+				.list-det-right {
+					.iconfont {
+						color: #e5e7ec !important;
+					}
+				}
+			}
+		}
+	}
+</style>

hdApp/src/admin/coupon/selectCouponList.vue

@@ -0,0 +1,187 @@
+<template>
+  <div class="coupon-sel">
+    <block>
+        <div class="coupon-wrap">
+          <div
+            class="coupon-list"
+            v-for="(item, index) in usableList"
+            :key="index"
+            @click="couponChange(item, index + 1)"
+          >
+            <div class="list-img">
+              <template v-if="couponSelInx && couponSelInx == (index + 1)">
+                <img :src="`${constant.imgUrl}/retail/coupon/is-check.png`" alt mode="widthFix" />
+              </template>
+              <template v-else>
+                <img :src="`${constant.imgUrl}/retail/coupon/no-check.png`" alt mode="widthFix" />
+              </template>
+            </div>
+            <div class="list-det">
+              <div class="list-det-left">
+                <div class="price-wrap">
+                  <span>￥</span>
+                  <span class="price">{{ item.amount }}</span>
+                </div>
+                <div class="full-reduc app-size-28">满{{ item.miniCost }}可使用</div>
+              </div>
+              <div class="list-det-right">
+                <div class="coupon-message">
+                  <div class="app-color-2">优惠券</div>
+                  <div>适用：全品类</div>
+                  <div>有效至：{{ item.endTime.substr(0, 10) }}</div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <selectCouponItem v-for="(item, index) in unusableList" :key="index" :item="item"></selectCouponItem>
+        </div>
+      <view class="footer_bar">
+        <text>已优惠￥{{couponSum}}</text>
+        <button class="admin-button-com middle blue" @click="ConfirmReachFn">确认</button>
+      </view>
+    </block>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from "vuex";
+import { userDiscount } from "@/api/member";
+import { getShopUser } from "@/utils/auth";
+import { shopCouponList } from '@/api/coupon'
+import selectCouponItem from './components/selectCouponItem'
+export default {
+  name: "coupon-sel",
+  props: {},
+  components: { selectCouponItem },
+  data() {
+    return {
+      couponSelInx: null,
+      couponId: 0,
+      data: {},
+      couponSum: '',
+      list: []
+    };
+  },
+  computed: {
+    ...mapGetters({ shopUser: "getShopUser" }),
+    usableList() {
+      return this.list.filter(item => {return Number(item.miniCost) <= 100})
+    },
+    unusableList() {
+      return this.list.filter(item => {return Number(item.miniCost) > 100})
+    }
+  },
+  mounted() {},
+  onPullDownRefresh() {
+			this._list().then(res => {
+				uni.stopPullDownRefresh()
+			})
+		},
+  methods: {
+    async init() {
+			this._list()
+		},
+		_list() {
+			return shopCouponList({ status: '1' }).then(res => {
+				console.log(res)
+        this.list = res.data.list
+			})
+		},
+    // 优惠券选择
+    couponChange(item, index) {
+      this.couponSelInx = this.couponSelInx == index ? null : index;
+      this.couponId = this.couponSelInx == index ? item.id : 0;
+      this.couponSum = this.couponSelInx == index ? item.amount : '';
+      console.log(this.couponId, this.couponSelInx)
+    },
+    ConfirmReachFn() {
+      console.log({couponSum: this.couponSum, couponId: this.couponId})
+      uni.setStorageSync('selectCouponInfo', {couponSum: this.couponSum, couponId: this.couponId})
+      uni.navigateBack({})
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.sel-list {
+  .sel-tit {
+    @include disFlex(center, flex-start);
+    margin-top: 30px;
+    .dis-pormpt {
+      font-size: 28px;
+      color: $fontColor2;
+      margin-left: 6px;
+    }
+  }
+  &:first-child .sel-tit {
+    margin-top: 0;
+  }
+}
+// 优惠券
+.coupon-wrap {
+  margin: 0 20upx;
+  padding-top: 20px;
+  .coupon-list {
+    position: relative;
+    margin-bottom: 6px;
+    .list-det {
+      width: 100%;
+      @include disFlex(center, space-between);
+      position: absolute;
+      top: 0;
+      left: 0;
+      .list-det-left {
+        padding: 20px 0 20px 36px;
+        width: 210px;
+        color: #ff2947;
+        .price-wrap {
+          margin-bottom: 6px;
+          font-size: 26px;
+          .price {
+            font-size: 60px;
+            font-weight: bold;
+            line-height: 1;
+          }
+        }
+      }
+      .list-det-right {
+        width: calc(100% - 280px);
+        margin-left: 22px;
+        @include disFlex(center, space-between);
+        padding: 20px 26px 20px 0;
+        .coupon-message {
+          color: $fontColor3;
+          & > div {
+            margin: 6px 0;
+          }
+        }
+      }
+    }
+  }
+}
+.footer_bar{
+    width: 100%;
+    max-width: 750rpx;
+    min-width: 320rpx;
+    padding: 0 30upx;
+    height: 100rpx;
+    position: fixed;
+    text-align: center;
+    bottom: 0;
+    background: white;
+    box-shadow: -4rpx -4rpx 6rpx #eee;
+    z-index: 100;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    &>.admin-button-com{
+      width: 120upx;
+    }
+}
+// 修改uni-app组件
+/deep/.uni-radio-input-checked {
+  background-color: $mainColor !important;
+  border-color: $mainColor !important;
+}
+</style>

hdApp/src/admin/home/me.vue

@@ -118,6 +118,14 @@
             >
               <div class="tui-title">快递设置</div>
             </tui-list-cell>
+            <tui-list-cell
+              @click="pageTo({ url: '/admin/coupon/couponList' })"
+              class="line-cell"
+              :hover="false"
+              :arrow="true"
+            >
+              <div class="tui-title">优惠券</div>
+            </tui-list-cell>
 
           </view>
         </view>

hdApp/src/api/coupon/index.js

@@ -21,6 +21,20 @@ export const getList = data => {
 	return https.get('/coupon/list', data)
 }
 
+/** *
+ * 优惠券列表 w 
+ */
+ export const shopCouponList = data => {
+	return https.get('/shop-coupon/list', data)
+}
+
+/** *
+ * 优惠券列表 w 
+ */
+ export const shopHouponHas = data => {
+	return https.get('/shop-coupon/has', data)
+}
+
 // =====================  B 端 ========================
 
 /** *

hdApp/src/pages.json

@@ -222,6 +222,18 @@
 					"style": {
 						"navigationBarTitleText": "优惠券"
 					}
+				},
+        {
+					"path": "couponList",
+					"style": {
+						"navigationBarTitleText": "优惠券"
+					}
+				},
+        {
+					"path": "selectCouponList",
+					"style": {
+						"navigationBarTitleText": "优惠券"
+					}
 				}
 			]
 		},