{"version":3,"file":"detail.js","sources":["../../../../../../src/modules/mall/coupon/detail.vue","../../../../../../uniPage:/bW9kdWxlc1xtYWxsXGNvdXBvblxkZXRhaWwudnVl"],"sourcesContent":["<!-- 优惠券详情  -->\r\n<template>\r\n  <s-layout title=\"优惠券详情\">\r\n    <view class=\"bg-white\">\r\n      <!-- 详情卡片 -->\r\n      <view class=\"detail-wrap ss-p-20\">\r\n        <view class=\"detail-box\">\r\n          <view class=\"tag-box ss-flex ss-col-center ss-row-center\">\r\n            <image\r\n              class=\"tag-image\"\r\n              :src=\"sheep.$url.static('/static/img/shop/app/coupon_icon.png')\"\r\n              mode=\"aspectFit\"\r\n            />\r\n          </view>\r\n          <view class=\"top ss-flex-col ss-col-center\">\r\n            <view class=\"title ss-m-t-50 ss-m-b-20 ss-m-x-20\">{{ state.coupon.name }}</view>\r\n            <view class=\"subtitle ss-m-b-50\">\r\n              满 {{ fen2yuan(state.coupon.usePrice) }} 元，\r\n              {{\r\n                state.coupon.discountType === 1\r\n                  ? '减 ' + fen2yuan(state.coupon.discountPrice) + ' 元'\r\n                  : '打 ' + state.coupon.discountPercent / 10.0 + ' 折'\r\n              }}\r\n            </view>\r\n            <button\r\n              class=\"ss-reset-button ss-m-b-30\"\r\n              :class=\"\r\n                state.coupon.canTake || state.coupon.status === 1\r\n                  ? 'use-btn' // 优惠劵模版（可领取）、优惠劵（可使用）\r\n                  : 'disable-btn'\r\n              \"\r\n              :disabled=\"!state.coupon.canTake\"\r\n              @click=\"getCoupon\"\r\n            >\r\n              <text v-if=\"state.id > 0\">{{ state.coupon.canTake ? '立即领取' : '已领取' }}</text>\r\n              <text v-else>\r\n                {{\r\n                  state.coupon.status === 1\r\n                    ? '立即使用'\r\n                    : state.coupon.status === 2\r\n                      ? '已使用'\r\n                      : '已过期'\r\n                }}\r\n              </text>\r\n            </button>\r\n            <view class=\"time ss-m-y-30\" v-if=\"state.coupon.validityType === 2\">\r\n              有效期：领取后 {{ state.coupon.fixedEndTerm }} 天内可用\r\n            </view>\r\n            <view class=\"time ss-m-y-30\" v-else>\r\n              有效期: {{ sheep.$helper.timeFormat(state.coupon.validStartTime, 'yyyy-mm-dd') }} 至\r\n              {{ sheep.$helper.timeFormat(state.coupon.validEndTime, 'yyyy-mm-dd') }}\r\n            </view>\r\n            <view class=\"coupon-line ss-m-t-14\"></view>\r\n          </view>\r\n          <view class=\"bottom\">\r\n            <view class=\"type ss-flex ss-col-center ss-row-between ss-p-x-30\">\r\n              <view>优惠券类型</view>\r\n              <view>{{ state.coupon.discountType === 1 ? '满减券' : '折扣券' }}</view>\r\n            </view>\r\n            <!-- TODO 芋艿：可优化，增加优惠劵的描述 -->\r\n            <uni-collapse>\r\n              <uni-collapse-item title=\"优惠券说明\" v-if=\"state.coupon.description\">\r\n                <view class=\"content ss-p-b-20\">\r\n                  <text class=\"des ss-p-l-30\">{{ state.coupon.description }}</text>\r\n                </view>\r\n              </uni-collapse-item>\r\n            </uni-collapse>\r\n          </view>\r\n        </view>\r\n      </view>\r\n\r\n      <!-- 适用商品 -->\r\n      <view\r\n        class=\"all-user ss-flex ss-row-center ss-col-center\"\r\n        v-if=\"state.coupon.productScope === 1\"\r\n      >\r\n        全场通用\r\n      </view>\r\n\r\n      <su-sticky v-else bgColor=\"#fff\">\r\n        <view class=\"goods-title ss-p-20\">\r\n          {{ state.coupon.productScope === 2 ? '指定商品可用' : '指定分类可用' }}\r\n        </view>\r\n        <su-tabs\r\n          :scrollable=\"true\"\r\n          :list=\"state.tabMaps\"\r\n          @change=\"onTabsChange\"\r\n          :current=\"state.currentTab\"\r\n          v-if=\"state.coupon.productScope === 3\"\r\n        />\r\n      </su-sticky>\r\n      <!-- 指定商品 -->\r\n      <view v-if=\"state.coupon.productScope === 2\">\r\n        <view v-for=\"(item, index) in state.pagination.list\" :key=\"index\">\r\n          <s-goods-column\r\n            class=\"ss-m-20\"\r\n            size=\"lg\"\r\n            :data=\"item\"\r\n            @click=\"sheep.$router.go('/modules/mall/goods/index', { id: item.id })\"\r\n            :goodsFields=\"{\r\n              title: { show: true },\r\n              subtitle: { show: true },\r\n              price: { show: true },\r\n              original_price: { show: true },\r\n              sales: { show: true },\r\n              stock: { show: false },\r\n            }\"\r\n          />\r\n        </view>\r\n      </view>\r\n      <!-- 指定分类 -->\r\n      <view v-if=\"state.coupon.productScope === 3\">\r\n        <view v-for=\"(item, index) in state.pagination.list\" :key=\"index\">\r\n          <s-goods-column\r\n            class=\"ss-m-20\"\r\n            size=\"lg\"\r\n            :data=\"item\"\r\n            @click=\"sheep.$router.go('/modules/mall/goods/index', { id: item.id })\"\r\n            :goodsFields=\"{\r\n              title: { show: true },\r\n              subtitle: { show: true },\r\n              price: { show: true },\r\n              original_price: { show: true },\r\n              sales: { show: true },\r\n              stock: { show: false },\r\n            }\"\r\n          ></s-goods-column>\r\n        </view>\r\n      </view>\r\n      <uni-load-more\r\n        v-if=\"state.pagination.total > 0 && state.coupon.productScope === 3\"\r\n        :status=\"state.loadStatus\"\r\n        :content-text=\"{\r\n          contentdown: '上拉加载更多',\r\n        }\"\r\n        @tap=\"loadMore\"\r\n      />\r\n      <s-empty\r\n        v-if=\"state.coupon.productScope === 3 && state.pagination.total === 0\"\r\n        paddingTop=\"0\"\r\n        icon=\"/static/soldout-empty.png\"\r\n        text=\"暂无商品\"\r\n      />\r\n    </view>\r\n  </s-layout>\r\n</template>\r\n\r\n<script setup>\r\nimport sheep from '@/sheep'\r\nimport { onLoad, onReachBottom } from '@dcloudio/uni-app'\r\nimport { reactive } from 'vue'\r\nimport _ from 'lodash-es'\r\nimport CouponApi from '@/sheep/api/promotion/coupon'\r\nimport { fen2yuan } from '@/sheep/hooks/useGoods'\r\nimport SpuApi from '@/sheep/api/product/spu'\r\nimport CategoryApi from '@/sheep/api/product/category'\r\nimport { resetPagination } from '@/sheep/util'\r\n\r\nconst state = reactive({\r\n  id: 0, // 优惠劵模版编号 templateId\r\n  couponId: 0, // 用户优惠劵编号 couponId\r\n  coupon: {}, // 优惠劵信息\r\n\r\n  pagination: {\r\n    list: [],\r\n    total: 0,\r\n    pageNo: 1,\r\n    pageSize: 1,\r\n  },\r\n  categoryId: 0, // 选中的商品分类编号\r\n  tabMaps: [], // 指定分类时，每个分类构成一个 tab\r\n  currentTab: 0, // 选中的 tabMaps 下标\r\n  loadStatus: '',\r\n})\r\n\r\nfunction onTabsChange(e) {\r\n  resetPagination(state.pagination)\r\n  state.currentTab = e.index\r\n  state.categoryId = e.value\r\n  getGoodsListByCategory()\r\n}\r\n\r\nasync function getGoodsListByCategory() {\r\n  state.loadStatus = 'loading'\r\n  const { code, data } = await SpuApi.getSpuPage({\r\n    categoryId: state.categoryId,\r\n    pageNo: state.pagination.pageNo,\r\n    pageSize: state.pagination.pageSize,\r\n  })\r\n  if (code !== 0) {\r\n    return\r\n  }\r\n  state.pagination.list = _.concat(state.pagination.list, data.list)\r\n  state.pagination.total = data.total\r\n  state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore'\r\n}\r\n\r\n// 获得商品列表，指定商品范围\r\nasync function getGoodsListById() {\r\n  const { data, code } = await SpuApi.getSpuListByIds(state.coupon.productScopeValues.join(','))\r\n  if (code !== 0) {\r\n    return\r\n  }\r\n  state.pagination.list = data\r\n}\r\n\r\n// 获得分类列表\r\nasync function getCategoryList() {\r\n  const { data, code } = await CategoryApi.getCategoryListByIds(\r\n    state.coupon.productScopeValues.join(','),\r\n  )\r\n  if (code !== 0) {\r\n    return\r\n  }\r\n  state.tabMaps = data.map((category) => ({ name: category.name, value: category.id }))\r\n  // 加载第一个分类的商品列表\r\n  if (state.tabMaps.length > 0) {\r\n    state.categoryId = state.tabMaps[0].value\r\n    await getGoodsListByCategory()\r\n  }\r\n}\r\n\r\n// 领取优惠劵\r\nasync function getCoupon() {\r\n  const { code } = await CouponApi.takeCoupon(state.id)\r\n  if (code !== 0) {\r\n    return\r\n  }\r\n  uni.showToast({\r\n    title: '领取成功',\r\n  })\r\n  setTimeout(() => {\r\n    getCouponContent()\r\n  }, 1000)\r\n}\r\n\r\n// 加载优惠劵信息\r\nasync function getCouponContent() {\r\n  const { code, data } =\r\n    state.id > 0\r\n      ? await CouponApi.getCouponTemplate(state.id)\r\n      : await CouponApi.getCoupon(state.couponId)\r\n  if (code !== 0) {\r\n    return\r\n  }\r\n  state.coupon = data\r\n  // 不同指定范围，加载不同数据\r\n  if (state.coupon.productScope === 2) {\r\n    await getGoodsListById()\r\n  } else if (state.coupon.productScope === 3) {\r\n    await getCategoryList()\r\n  }\r\n}\r\n\r\n// 加载更多\r\nfunction loadMore() {\r\n  if (state.loadStatus === 'noMore') {\r\n    return\r\n  }\r\n  state.pagination.pageNo++\r\n  getGoodsListByCategory()\r\n}\r\n\r\nonLoad((options) => {\r\n  state.id = options.id\r\n  state.couponId = options.couponId\r\n  getCouponContent(state.id, state.couponId)\r\n})\r\n\r\n// 上拉加载更多\r\nonReachBottom(() => {\r\n  loadMore()\r\n})\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n \r\n.goods-title {\r\n  font-size: 34rpx;\r\n  font-weight: bold;\r\n  color: #333333;\r\n}\r\n\r\n.detail-wrap {\r\n  background: linear-gradient(\r\n    180deg,\r\n    var(--ui-BG-Main),\r\n    var(--ui-BG-Main-gradient),\r\n    var(--ui-BG-Main),\r\n    #fff\r\n  );\r\n}\r\n\r\n.detail-box {\r\n  position: relative;\r\n  margin-top: 100rpx;\r\n  // background-color: var(--ui-BG);\r\n  border-radius: 6rpx;\r\n  .tag-box {\r\n    position: absolute;\r\n    top: -70rpx;\r\n    left: 50%;\r\n    z-index: 6;\r\n    width: 140rpx;\r\n    height: 140rpx;\r\n    background: var(--ui-BG);\r\n    border-radius: 50%;\r\n    transform: translateX(-50%);\r\n\r\n    .tag-image {\r\n      width: 104rpx;\r\n      height: 104rpx;\r\n      border-radius: 50%;\r\n    }\r\n  }\r\n\r\n  .top {\r\n    position: relative;\r\n    z-index: 5;\r\n    padding: 110rpx 0 0 0;\r\n    background-color: #fff;\r\n    border-radius: 20rpx 20rpx 0 0;\r\n    -webkit-mask: radial-gradient(circle at 16rpx 100%, #0000 16rpx, red 0) -16rpx;\r\n\r\n    .title {\r\n      font-size: 40rpx;\r\n      font-weight: bold;\r\n      color: #333;\r\n    }\r\n\r\n    .subtitle {\r\n      font-size: 28rpx;\r\n      color: #333333;\r\n    }\r\n\r\n    .use-btn {\r\n      width: 386rpx;\r\n      height: 80rpx;\r\n      line-height: 80rpx;\r\n      color: $white;\r\n      background: linear-gradient(90deg, var(--ui-BG-Main), var(--ui-BG-Main-gradient));\r\n      border-radius: 40rpx;\r\n    }\r\n\r\n    .disable-btn {\r\n      width: 386rpx;\r\n      height: 80rpx;\r\n      line-height: 80rpx;\r\n      color: $white;\r\n      background: #e5e5e5;\r\n      border-radius: 40rpx;\r\n    }\r\n\r\n    .time {\r\n      font-size: 26rpx;\r\n      font-weight: 400;\r\n      color: #999999;\r\n    }\r\n\r\n    .coupon-line {\r\n      width: 95%;\r\n      border-bottom: 2rpx solid #eeeeee;\r\n    }\r\n  }\r\n\r\n  .bottom {\r\n    padding: 40rpx 30rpx;\r\n    background-color: #fff;\r\n    border-radius: 0 0 20rpx 20rpx;\r\n    -webkit-mask: radial-gradient(circle at 16rpx 0%, #0000 16rpx, red 0) -16rpx;\r\n\r\n    .type {\r\n      height: 96rpx;\r\n      border-bottom: 2rpx solid #eeeeee;\r\n    }\r\n  }\r\n\r\n  .des {\r\n    font-size: 24rpx;\r\n    font-weight: 400;\r\n    color: #666666;\r\n  }\r\n}\r\n\r\n.all-user {\r\n  width: 100%;\r\n  height: 300rpx;\r\n  font-size: 34rpx;\r\n  font-weight: bold;\r\n  color: #333333;\r\n}\r\n</style>\r\n","import MiniProgramPage from 'D:/App/Work/addr/acdr-ui/src/modules/mall/coupon/detail.vue'\nwx.createPage(MiniProgramPage)"],"names":["reactive","resetPagination","SpuApi","_","CategoryApi","CouponApi","uni","onLoad","onReachBottom"],"mappings":"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"}