Merge branch 'feature/premise'

api/modules/lottery.js

 /* eslint-disable no-confusing-arrow */
 import { post, get } from '@/api/request'
 import CONFIG from '@/config'
-const { activityDomain } = CONFIG
+const { activityDomain, privateDomain } = CONFIG
 const flag = process.env.X_CA_STAGE
 
 // 获取抽奖(场次)列表
@@ -43,3 +43,23 @@ export const getUserRecord = data =>
   flag
     ? get('/activity/DrawResult/getUserRecord', { data })
     : get('/activity/DrawResult/getUserRecord', { data, baseURL: activityDomain })
+
+// 前置条件检测
+export const checkPremise = data =>
+  flag ? post('/activity/Draw/checkPremise', data) : post('/activity/Draw/checkPremise', data, { baseURL: activityDomain })
+
+// 保存前置条件
+export const savePremise = data =>
+flag
+  ? post('/activity/Draw/savePremise', data)
+  : post('/activity/Draw/savePremise', data, { baseURL: activityDomain })
+
+// 发送手机验证码
+export const setSendSmsCode = (data) =>
+  flag ? post('/Program/Person/sendSms', data) : post('/Program/Person/sendSms', data, { baseURL: privateDomain })
+
+// 验证手机验证码
+export const setValidSmsCode = (data) =>
+  flag
+    ? post('/Program/Person/checkSmsCode', data)
+    : post('/Program/Person/checkSmsCode', data, { baseURL: privateDomain })

api/request.js

@@ -11,7 +11,7 @@ const axiosService = axios.create();
 // 默认content-type
 axiosService.defaults.headers["Content-Type"] = "application/x-www-form-urlencoded";
 // 默认baseURL
-axiosService.defaults.baseURL = `//${process.env.CUSTOMER_API_DOMAIN}/v1`;
+axiosService.defaults.baseURL = `https://${process.env.CUSTOMER_API_DOMAIN}/v1`;
 // 默认请求超时时间
 axiosService.defaults.timeout = 3 * 1000;
 

components/Common/BindPhoneDialog.vue

@@ -9,6 +9,7 @@
 </template>
 
 <script>
+import { mapActions } from 'vuex'
 import Bus from '@/utils/Bus'
 export default {
   name: 'BindPhoneDialog',
@@ -19,6 +20,7 @@ export default {
     }
   },
   computed: {
+    ...mapActions({ jumpToBinding: 'users/jumpToBinding' }),
     visible: {
       get () {
         return this.value
@@ -41,7 +43,7 @@ export default {
         message: '正在为您转跳，请完成绑定手机操作',
         duration: 1500,
         onClose: () => {
-          Bus.$emit('showLogin')
+          this.jumpToBinding()
         }
       })
     }

components/Common/ConfigPopup.vue

+<template>
+  <van-popup
+    v-model="visible"
+    position="bottom"
+    round
+    transfer
+  >
+  <div class="main">
+    <div class="top">
+      <div style="width: 28px;height: 14px;"></div>
+      <div class="top-title">请先填写信息</div>
+      <div class="top-btn" @click="submit">提交</div>
+    </div>
+    <div class="form" :class="{error: isError}">
+      <van-field v-if="lotteryInfo.premise && lotteryInfo.premise.includes('name')" v-model="form.name" label-width="60" label="联系人" placeholder="请输入联系人" @focus="isError = false"/>
+      <template v-if="lotteryInfo.premise && lotteryInfo.premise.includes('phone')">
+        <van-field v-model="form.phone" label-width="60" label="手机号" placeholder="请输入联系电话" @focus="isError = false"/>
+        <van-field v-model="form.code" label-width="60" label="验证码" placeholder="请输入验证码" @focus="isError = false">
+          <span slot="button" class="code" @click="sendCode">
+            <span v-if="!isSend">获取验证码</span>
+            <span v-else>{{ time }}s后重发</span>
+          </span>
+        </van-field>
+      </template>
+      <template v-if="lotteryInfo.premise && lotteryInfo.premise.includes('address')">
+        <van-field v-model="form.address" label-width="60" label="收货地址" readonly placeholder="请选择省市区" @focus="isError = false" @click="select" >
+          <van-icon slot="button" name="location" />
+        </van-field>
+        <van-field
+          v-model="form.detail"
+          type="textarea"
+          label="门牌号"
+          label-width="60"
+          placeholder="详细地址（精确到门牌号）"
+          rows="2"
+          autosize
+          maxlength="50"
+          show-word-limit
+          @focus="isError = false"
+        />
+      </template>
+    </div>
+    <van-popup
+      v-model="isShowAdd"
+      position="bottom"
+      round
+    >
+      <van-area title="区域选择" :area-list="areaList" @confirm="chooseAdd" @cancel="isShowAdd = false"/>
+    </van-popup>
+  </div>
+  </van-popup>
+</template>
+
+<script>
+import {
+  savePremise,
+  setSendSmsCode,
+  setValidSmsCode
+} from '@/api/modules/lottery'
+import { areaList } from '@vant/area-data';
+import { mapGetters, mapActions } from 'vuex'
+
+export default {
+  name: 'ConfigPopup',
+  props: {
+    value: {
+      type: Boolean,
+      default: true,
+    },
+  },
+  data() {
+    return {
+      form: {
+        name: '',
+        phone: '',
+        code: '',
+        address: '',
+        detail: ''
+      },
+      areaList,
+      isShowAdd: false,
+      isError: false,
+      isSend: false,
+      time: 60,
+    }
+  },
+  computed: {
+    ...mapGetters({
+      uin: 'users/uin',
+      lotteryInfo: 'lottery/lotteryInfo'
+    }),
+    visible: {
+      get() {
+        return this.value
+      },
+      set(val) {
+        this.$emit('input', val)
+      },
+    },
+  },
+  methods: {
+    ...mapActions({
+      getLotteryDetail: 'lottery/getLotteryDetail',
+      updateInfo: 'lottery/updateInfo',
+      postInfo: 'users/postInfo',
+      checkPremise: 'lottery/check_premise'
+    }),
+    select() {
+      this.isShowAdd = true
+    },
+    chooseAdd(val) {
+      const str = val[0].name + '-' + val[1].name + '-' + val[2].name
+      this.form.address = str
+      this.isShowAdd = false
+    },
+    sendCode() {
+      if (this.isSent) return
+      if (!this.form.phone) {
+        this.$toast('请先填写手机号')
+        return
+      }
+      if (!this.form.phone.match(/^s*$|(?:(?:\+|00)86)?1\d{10}$/)) {
+        this.$toast('手机号格式不正确')
+        return
+      }
+      const { uin } = this.$route.query
+      const phone = this.form.phone
+      setSendSmsCode({ uin, phone, module: 'draw' }).then((res) => {
+        const { code, errorCode, errorMessage, data } = res
+        if (code === 200 && errorCode === 0) {
+          if (data) {
+            this.$toast(data)
+          }
+          let time = 60
+          this.isSend = true
+          const timer = setInterval(() => {
+            time--
+            this.time = time
+            if (time <= 0) {
+              clearInterval(timer)
+              this.isSent = false
+            }
+          }, 1000)
+        } else {
+          this.$toast(errorMessage)
+        }
+      })
+    },
+    submit() {
+      const { uin } = this.$route.query
+      const { name, phone, code, address, detail } = this.form
+      if (this.lotteryInfo.premise.includes('name')) {
+        if (!name) {
+          this.isError = true
+          return 0
+        }
+      }
+      if (this.lotteryInfo.premise.includes('address')) {
+        if (!address || !detail) {
+          this.isError = true
+          return 0
+        }
+      }
+      if (this.lotteryInfo.premise.includes('phone')) {
+        if (!phone || !code) {
+          this.isError = true
+          return 0
+        }
+        setValidSmsCode({ uin, phone, code }).then((res) => {
+          const { code, errorCode, errorMessage } = res
+          if (code === 200 && errorCode === 0) {
+            this.$toast('验证成功')
+            this.save()
+          } else {
+            this.$toast(errorMessage)
+          }
+        })
+      }else {
+        this.save()
+      }
+
+    },
+    save() {
+      const { id, uin } = this.$route.query
+      const params = {
+        id,
+        uin,
+      }
+      if (this.lotteryInfo.premise.includes('name')) {
+        params.name = this.form.name
+      }
+      if (this.lotteryInfo.premise.includes('phone')) {
+        params.phone = this.form.phone
+      }
+      if (this.lotteryInfo.premise.includes('address')) {
+        params.address = this.form.address + this.form.detail
+      }
+      savePremise(params).then(res => {
+        const { code, errorCode, errorMessage } = res
+        if (code === 200 && errorCode === 0) {
+          this.$toast('信息保存成功')
+          this.visible = false
+          this.checkPremise({ id, uin })
+        } else {
+          this.$toast(errorMessage)
+        }
+      })
+    },
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.main {
+  height: 42vh;
+}
+.top {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12px;
+  font-size: 14px;
+  &-title {
+    font-size: 16px;
+    font-family: PingFangSC, PingFang SC;
+    font-weight: 500;
+    color: #333333;
+  }
+  &-btn {
+    font-size: 14px;
+    font-family: PingFangSC, PingFang SC;
+    font-weight: 400;
+    color: #357BF0;
+  }
+}
+.form {
+  .code {
+    font-size: 13px;
+    font-family: PingFangSC, PingFang SC;
+    font-weight: 400;
+    color: #357BF0;
+  }
+  /deep/ .van-cell {
+    padding: 9.5px 13px;
+  }
+  /deep/ .van-field__label{
+    height: 20px;
+    font-size: 14px;
+    font-family: PingFangSC, PingFang SC;
+    font-weight: 400;
+    color: #333333;
+    span {
+      white-space: nowrap;
+    }
+  }
+  /deep/ .van-field__word-limit{
+    color: #999;
+  }
+  /deep/ .van-cell::after {
+    border-bottom: none;
+  }
+}
+.error {
+  /deep/ .van-field__control::placeholder {
+    color: red;
+  }
+}
+</style>

components/Lottery/Instant/Main.vue

@@ -224,7 +224,8 @@ export default {
       isLogin: 'users/isLogin',
       userInfo: 'users/userInfo',
       lotteryInfo: 'lottery/lotteryInfo',
-      isBindPhone: 'users/isBindPhone'
+      isBindPhone: 'users/isBindPhone',
+      premise: 'lottery/premise'
     }),
     prizeList() {
       return this.lotteryInfo.prizeConfigs
@@ -285,7 +286,7 @@ export default {
     // 中奖后， 关闭窗口回调
     winCloseCallback() {
       this.isShowWin = false
-      if (this.winInfo.id !== 0 && !this.isBindPhone) {
+      if (this.winInfo.id !== 0 && !this.isBindPhone && !this.lotteryInfo.premise.length) {
         this.isShowBindPhone = true
       }
     },
@@ -324,6 +325,17 @@ export default {
         })
         return
       }
+      // 前置条件未达成
+      if (!this.premise) {
+        this.$toast({
+          message: '请先填写信息',
+          duration: 1500,
+          onClose: () => {
+            Bus.$emit('showConfig')
+          }
+        })
+        return
+      }
       // 次数不足
       if (this.lotteryInfo.userTimes <= 0) {
         this.$toast('抽奖次数已用完')

components/Lottery/Instant/MiniMain.vue

@@ -231,7 +231,8 @@ export default {
       uin: 'users/uin',
       isLogin: 'users/isLogin',
       lotteryInfo: 'lottery/lotteryInfo',
-      isBindPhone: 'users/isBindPhone'
+      isBindPhone: 'users/isBindPhone',
+      premise: 'lottery/premise'
     }),
     prizeList() {
       return this.lotteryInfo.prizeConfigs
@@ -330,6 +331,17 @@ export default {
         })
         return
       }
+      // 前置条件未达成
+      if (!this.premise) {
+        this.$toast({
+          message: '请先填写信息',
+          duration: 1500,
+          onClose: () => {
+            Bus.$emit('showConfig')
+          }
+        })
+        return
+      }
       // 次数不足
       if (this.lotteryInfo.userTimes <= 0) {
         this.$toast('抽奖次数已用完')

layouts/default.vue

 <template>
   <div class="container">
+    <ConfigPopup v-model="isShowConfig"></ConfigPopup>
     <Nuxt v-if="!$slots.default" />
     <slot />
   </div>
@@ -8,16 +9,24 @@
 import Bus from '@/utils/Bus'
 import { mapActions } from 'vuex'
 import loginAction from '@/plugins/UserAction/login'
+import ConfigPopup from '../components/Common/ConfigPopup'
 export default {
+  components: {
+    ConfigPopup,
+  },
   data() {
     return {
       loginInstance: null,
+      isShowConfig: false
     }
   },
   mounted() {
     document.addEventListener('visibilitychange', this.handleVisibilityChange, false)
     this.initLoginCenter()
     Bus.$on('showLogin', this.toggleLogin)
+    Bus.$on('showConfig', () => {
+      this.isShowConfig = true
+    })
   },
   destroyed() {
     Bus.$off('showLogin')

package.json

@@ -60,6 +60,7 @@
     "@nuxtjs/axios": "^5.13.6",
     "@nuxtjs/google-gtag": "^1.0.4",
     "@nuxtjs/sentry": "^5.1.7",
+    "@vant/area-data": "^1.5.1",
     "core-js": "^3.15.1",
     "dayjs": "^1.10.6",
     "js-cookie": "2.2.0",

pages/index/index.vue

@@ -48,7 +48,8 @@ export default {
     ...mapActions({
       getLotteryDetail: 'lottery/getLotteryDetail',
       updateInfo: 'lottery/updateInfo',
-      postInfo: 'users/postInfo'
+      postInfo: 'users/postInfo',
+      checkPremise: 'lottery/check_premise'
     }),
     // 页面进入初始化
     dataInit() {
@@ -77,6 +78,8 @@ export default {
         })
       // 初始化事件中心
       this.eventHubInit()
+      // 抽奖前置条件
+      this.checkPremise({ id, uin })
     },
     // 事件中心
     eventHubInit() {

plugins/vant.js

@@ -19,7 +19,9 @@ import {
   Icon,
   PullRefresh,
   Tab,
-  Tabs
+  Tabs,
+  Field,
+  Area
 } from 'vant'
 import errorImg from '@/assets/images/lazyLoad/error.png'
 import loadingImg from '@/assets/images/lazyLoad/loading.png'
@@ -81,3 +83,9 @@ Vue.use(PullRefresh)
 /* 标签页 */
 Vue.use(Tab);
 Vue.use(Tabs);
+
+/* 输入框 */
+Vue.use(Field)
+
+/* 地区选择 */
+Vue.use(Area)

store/lottery.js

 /* eslint-disable no-param-reassign */
-import { getLotteryInfos, getLotterySessionList } from '@/api/modules/lottery'
+import { getLotteryInfos, getLotterySessionList, checkPremise } from '@/api/modules/lottery'
 import { Toast } from 'vant'
 // import { cloneDeep } from 'lodash'
 
@@ -18,7 +18,8 @@ export const state = () => ({
     prizeConfigs: [], // 奖品
     showType: null // 定时抽奖条件 1 倒计时 2 参与人数
   }, // 抽奖信息
-  isShowBind: false // 是否显示绑定手机
+  isShowBind: false, // 是否显示绑定手机
+  premise: 0
 })
 
 export const mutations = {
@@ -31,6 +32,9 @@ export const mutations = {
   SET_ISSHOWBIND: (state, isShow) => {
     state.isShowBind = isShow
   },
+  SET_PREMISE: (state, premise) => {
+    state.premise = premise
+  }
 }
 
 export const actions = {
@@ -74,9 +78,23 @@ export const actions = {
     // const lotteryInfo = cloneDeep(state.lotteryInfo)
     commit('SET_LOTTERYINFO', { ...state.lotteryInfo, ...val })
   },
+  check_premise({ commit, state }, params = {}) {
+    checkPremise(params).then(res => {
+      const { code, errorCode, data, errorMessage } = res
+      if (code === 200 && errorCode === 0) {
+        commit('SET_PREMISE', data)
+      } else {
+        Toast.fail(errorMessage)
+        if (errorCode === 9) {
+          this.app.context.error({ statusCode: 404, message: 'This page could not be found' })
+        }
+      }
+    })
+  },
 }
 export const getters = {
   sessionList: state => state.sessionList, // 场次列表
   lotteryInfo: state => state.lotteryInfo, // lotteryInfo
-  isShowBind: state => state.isShowBind // 是否显示绑定手机
+  isShowBind: state => state.isShowBind, // 是否显示绑定手机
+  premise: state => state.premise // 抽奖前置条件检测
 }

yarn.lock

@@ -1674,6 +1674,11 @@
     "@typescript-eslint/types" "4.28.5"
     eslint-visitor-keys "^2.0.0"
 
+"@vant/area-data@^1.5.1":
+  version "1.5.1"
+  resolved "https://mirrors.cloud.tencent.com/npm/@vant/area-data/-/area-data-1.5.1.tgz#bdd943b9b569476cb04133a8323bd04aa35be2c2"
+  integrity sha512-gR5TPEzTbxN1cTK1aDhCoyikSCLX7DAacxyXoKyI4SAsYYTZrDl/nLgQFIm9vLsvWzlPIda8xV8/U3x7M9k6ww==
+
 "@vant/icons@^1.5.3":
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/@vant/icons/-/icons-1.7.0.tgz#02d427532a8142c35db159da9c364fe6890c3ac9"