diff --git a/src/api/user.js b/src/api/user.js index 673c7d9..c3361ea 100755 --- a/src/api/user.js +++ b/src/api/user.js @@ -76,6 +76,10 @@ export function registrationSubmit (data) { return req.post('/registrationSubmit', data) } +export function verifyRegistrationRecord (data) { + return req.post('/verifyRegistrationRecord', data) +} + export function registrationRecordList (data) { return req.get('/registrationRecordList', data) } @@ -88,8 +92,12 @@ export function scancodeAddcart (data) { return req.post('/goods/scancodeAddcart', data) } +export function cancelRegistrationRecord (data) { + return req.post('/cancelRegistrationRecord', data) +} + export function newWxaMsgTmpl (params = {}) { - if(isAlipay){ + if (isAlipay) { return req.get('/alitemplatemessage', params) } return req.get('/newtemplate', params) diff --git a/src/app.config.js b/src/app.config.js index 961a8ce..bb0fcd4 100755 --- a/src/app.config.js +++ b/src/app.config.js @@ -17,7 +17,9 @@ const config = { 'pages/item/espier-detail', // 商品详情页面 'pages/article/index', // 文章页面 - 'pages/recommend/list', // 推荐软文列表 + 'pages/recommend/list', // 推荐软文列表 现在改为活动介绍 + 'pages/recommend/detail', // 活动介绍 + 'pages/recommend/status', // 活动状态 'pages/member/item-fav', // 收藏页面 'pages/custom/custom-page', // 自定义页面 @@ -78,7 +80,8 @@ const config = { 'point-detail', // 积分明细 'point-rule', // 积分规则 'member-level', // 会员等级 - 'user-info' // 个人信息 + 'user-info', // 个人信息 + 'scan', // 员工扫码核销 ] }, { diff --git a/src/assets/icon/map.png b/src/assets/icon/map.png new file mode 100755 index 0000000..80b8d4b Binary files /dev/null and b/src/assets/icon/map.png differ diff --git a/src/components/sp-page/index.js b/src/components/sp-page/index.js index 618ca6d..3775a0a 100755 --- a/src/components/sp-page/index.js +++ b/src/components/sp-page/index.js @@ -132,7 +132,7 @@ function SpPage (props, ref) { draft.pageTitle = pageTitle draft.isTabBarPage = isTabBarPage draft.showLeftContainer = !['/subpages/guide/index', '/pages/index'].includes(`/${page?.route}`) - draft.showCustomNavigation = ['/pages/cart/espier-index', '/pages/index', '/subpages/member/index', '/pages/category/index', '/pages/recommend/list'].includes(`/${page?.route}`) + draft.showCustomNavigation = ['/pages/cart/espier-index', '/pages/index', '/subpages/member/index', '/pages/category/index', '/pages/recommend/list', '/pages/recommend/list'].includes(`/${page?.route}`) // draft.showCustomNavigation = true draft.showNavCartIcon = ['/subpages/marketing/coupon-center', '/subpages/marketing/coupon', '/pages/item/list'].includes(`/${page?.route}`) }) diff --git a/src/components/sp-page/index.scss b/src/components/sp-page/index.scss index 1b3b6f7..11f75cd 100755 --- a/src/components/sp-page/index.scss +++ b/src/components/sp-page/index.scss @@ -97,8 +97,8 @@ } .left-container { width: auto; - // margin-left: 60px; - margin-left: 26px; + margin-left: 60px; + // margin-left: 26px; display: flex; align-items: center; .chazhao { diff --git a/src/pages/home/index.scss b/src/pages/home/index.scss index c9edf24..ffdab5a 100755 --- a/src/pages/home/index.scss +++ b/src/pages/home/index.scss @@ -4,7 +4,7 @@ page { .sp-page { .sp-loading { - margin-top: 100px; + margin-top: 70px; } // &.has-navbar { // padding-top: 0 !important; diff --git a/src/pages/recommend/detail.config.js b/src/pages/recommend/detail.config.js new file mode 100755 index 0000000..8a4eb1e --- /dev/null +++ b/src/pages/recommend/detail.config.js @@ -0,0 +1,3 @@ +export default { + navigationBarTitleText: '活动介绍' +} diff --git a/src/pages/recommend/detail.js b/src/pages/recommend/detail.js new file mode 100644 index 0000000..5f86664 --- /dev/null +++ b/src/pages/recommend/detail.js @@ -0,0 +1,220 @@ +import React, { useEffect } from 'react' +import { View, Text, Input, Image } from '@tarojs/components' +import Taro, { getCurrentInstance, useDidShow } from '@tarojs/taro' +import { SpPage, SpHtml, SpCheckbox } from '@/components' +import { useSelector } from 'react-redux' +import { getActiveDetail } from '@/api/community' +import { useImmer } from 'use-immer' +import api from '@/api' +import dayjs from 'dayjs' +import { AtIcon } from 'taro-ui' +import { classNames, navigateTo } from '@/utils' +import './detail.scss' + +const initState = { + activeInfo: {}, + isLoading: true, + visible: false, + checked: false, + formInfo: {}, + status: '' +} +export default function detail () { + const $instance = getCurrentInstance() + const [state, setState] = useImmer(initState) + const { appName } = useSelector((_state) => _state.sys) + const { userInfo = {} } = useSelector((_state) => _state.user) + + useDidShow(() => { + getActiveDetail() + }, []) + + useEffect(() => { + setState(draft => { + draft.formInfo = { + username: userInfo.username, + mobile: userInfo.mobile, + } + }) + }, [userInfo]) + + const getActiveDetail = async () => { + const { id: activity_id } = $instance.router.params + if (!activity_id) return + const { status, activity_info = {}, total_count, user_code } = await api.user.registrationActivity({ activity_id }) + const _start = dayjs(activity_info.start_time * 1000) + const _end = dayjs(activity_info.end_time * 1000) + setState(draft => { + draft.isLoading = false, + draft.activeInfo = { + ...activity_info, + user_code, + total_count, + start: `${_start.month() + 1}月${_start.date()}日`, + end: `${_end.month() + 1}月${_end.date()}日`, + status, + isLoading: false + } + }) + } + + const { isLoading, activeInfo = {}, visible, formInfo, checked, status } = state + + const renderFooter = () => { + if (isLoading || status === 'passed') { + return null + } + return + + setState((draft) => { draft.checked = !checked })} /> + + setState((draft) => { draft.checked = !checked })} >我已经阅读并同意 + Taro.navigateTo({ url: '/subpages/auth/reg-rule?type=member_logout' })} + style={`color: #000000;text-decoration: underline;`} + > + {`《${appName}活动细则》`} + + + + { + if (!checked) { + const res = await Taro.showModal({ + title: '提示', + content: `请先阅读并同意${appName}活动细则`, + showCancel: true, + cancel: '取消', + cancelText: '拒绝', + confirmText: '同意', + cancelColor: '#a5a5a5', + confirmColor: '#000' + }) + if (!res.confirm) return + setState((draft) => { + draft.checked = true + draft.visible = true + }) + } + setState((draft) => { + draft.visible = true + }) + }} className={"btn"}>{!status ? '确认报名' : status === 'pending' ? '报名中' : '已报名'} + + } + + const onIptChange = (e, name) => { + const { value } = e.detail + setState((draft) => { + draft.formInfo[name] = value + }) + } + + const handleSubmit = async () => { + if (!formInfo.username?.trim()) { + Taro.showToast({ + title: '请输入姓名', + icon: 'none' + }) + return + } + if (!formInfo.mobile?.trim()) { + Taro.showToast({ + title: '请输入手机号', + icon: 'none' + }) + return + } + const content = { + title: '', + sort: 1, + formdata: formItem.map((d) => { + return { + ...d, + answer: formInfo[d.field_name] + } + }) + } + const { status } = await api.user.registrationSubmit({ + formdata: { content: JSON.stringify([content]) }, + activity_id: activeInfo.activity_id + }) + if (status) { + // Taro.showToast({ + // title: '报名成功', + // icon: 'none' + // }) + setState((draft) => { + draft.visible = false + draft.status = status + }) + Taro.requestSubscribeMessage({ + tmplIds: ['tGJR7BS3HM9xLD4QUdBwtTAJkgzfl7cw_8-ngd74JM4'], + success: () => { + // onSubscribe() + console.log("🚀 ~ onSubscribe:", 'onSubscribe') + }, + fail: (err) => { + console.log("🚀 ~ err:", err) + // onSubscribe() + }, + complete: () => { + Taro.navigateTo({ url: '/pages/recommend/status?success=true&id=' + activeInfo.activity_id }) + } + }) + } + } + + const formItem = activeInfo.formdata?.key_index || [] + return ( + : renderFooter()} loading={isLoading} className='page-recommend-detail' isBlack> + {activeInfo.activity_name} + {activeInfo.start} - {activeInfo.end} + + + {activeInfo.address} + + + + setState((draft) => { + draft.visible = false + })} + catchtouchmove + > + + + {'报名信息'} + setState((draft) => { + draft.visible = false + })} value='close' size={14} color='#000' > + + + {formItem.map((item, index) => ( + + {item.field_title} + + {item.form_element === 'text' ? onIptChange(e, item.field_name)} + /> : null} + + + ))} + 确认报名信息 + + + + + + ) +} diff --git a/src/pages/recommend/detail.scss b/src/pages/recommend/detail.scss new file mode 100644 index 0000000..c81a579 --- /dev/null +++ b/src/pages/recommend/detail.scss @@ -0,0 +1,236 @@ +.page-recommend-detail { + .sp-page-body { + padding: 30px 58px; + } + .activity_name { + font-size: 40px; + font-weight: bold; + margin-bottom: 30px; + } + .activity_time { + font-size: 26px; + // color: #999; + margin-bottom: 60px; + } + .activity_addr { + font-size: 26px; + // color: #999; + margin-bottom: 40px; + display: flex; + align-items: center; + > image { + width: 18px; + height: 24px; + margin-right: 20px; + } + } + .sp-picker { + .mask { + position: fixed; + z-index: 302; + top: 0; + right: 0; + left: 0; + bottom: 0; + background: rgba(0, 0, 0, 0.6); + visibility: hidden; + opacity: 0; + transition: all 0.3s ease; + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + // color: #fff; + &.visible { + visibility: visible; + opacity: 1; + } + } + &-cnt { + position: fixed; + bottom: 0; + left: 0; + width: 100%; + transition: all 0.3s ease-in-out; + transform: translateY(100%); + z-index: 503; + background-color: #fff; + border-radius: 30rpx 30rpx 0 0; + &.visible { + transform: translateY(0); + } + } + &-hd { + padding: 30px 50px; + display: flex; + justify-content: space-between; + align-items: center; + border-bottom: none; + position: relative; + font-size: 26px; + .center { + margin: auto; + } + .at-icon-close { + padding: 20px 30px; + position: absolute; + right: 20px; + } + } + &-bd { + padding: 0 50px 50px; + &-item { + display: flex; + align-items: center; + border-bottom: none; + padding: 0 90px; + view { + color: #000; + font-size: 26px; + line-height: 1; + } + .tit { + padding: 28px 50px 28px 30px; + box-sizing: border-box; + } + .content { + display: flex; + flex: 1; + color: #000; + .icon-qianwang-01 { + font-size: 20px; + } + } + } + .btn { + margin-top: 130px; + display: flex; + height: 80px; + align-items: center; + justify-content: center; + font-size: 32px; + line-height: 1; + background: #000; + color: #fff; + border-radius: 6px; + &.notop { + margin-top: 10px; + } + &-disabled { + background: #666; + } + } + .user-form { + margin-top: 30px; + &-item { + margin-bottom: 50px; + &-title { + font-size: 24px; + color: #000; + margin-bottom: 10px; + } + &-input { + background: #e5e5e5; + border-radius: 6px; + padding: 20px 40px; + color: #000; + position: relative; + .icon-arrowRight { + font-size: 34px; + position: absolute; + right: 30px; + top: 30%; + // transform: translateY(-50%); + color: #000; + rotate: 90deg; + } + } + &-phone { + width: 100%; + } + .picker { + height: 40px; + width: 100%; + color: #a5a5a5; + &-value { + color: #000; + &.placeholder { + color: #a5a5a5 !important; + } + } + } + } + } + } + } + + .toast { + position: fixed; + z-index: 2; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + opacity: 0; + visibility: hidden; + transition: all 0.3s ease; + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + width: 400px; + height: 120px; + background: #666; + color: #fff; + border-radius: 10px; + view { + font-size: 30px; + } + &.visible { + visibility: visible; + opacity: 1; + } + } +} +.sp-page-footer { + min-height: 200px; + padding: 0 50px; + .check-box { + margin-top: 100px; + width: 100%; + display: flex; + align-items: center; + justify-content: center; + margin: 10px auto; + .icon-my { + font-size: 36px; + } + view { + font-size: 22px; + } + } + .bottom { + // position: fixed; + // bottom: 80px; + // left: 0; + // right: 0; + width: 100%; + margin-bottom: 50px; + .btn { + display: flex; + height: 80px; + align-items: center; + justify-content: center; + font-size: 32px; + line-height: 1; + background: #000; + color: #fff; + border-radius: 6px; + &.notop { + margin-top: 10px; + } + &-disabled { + background: #666; + } + } + } +} diff --git a/src/pages/recommend/list.js b/src/pages/recommend/list.js index 58631f2..ad9f502 100755 --- a/src/pages/recommend/list.js +++ b/src/pages/recommend/list.js @@ -1,6 +1,6 @@ import React, { Component } from 'react' import Taro, { getCurrentInstance } from '@tarojs/taro' -import { View, Text, ScrollView, Picker, Video } from '@tarojs/components' +import { View, Text, ScrollView, Picker, Video, SwiperItem, Swiper, Image } from '@tarojs/components' import { SpAddress } from '@/components' import { withPager, withBackToTop } from '@/hocs' import { connect } from 'react-redux' @@ -50,7 +50,24 @@ export default class RecommendList extends Component { windowWidth: 750, page: { isLoading: true - } + }, + currentIndex: 0, + // swiperList: [ + // { + // type: 'image', + // src: process.env.APP_IMAGE_CDN_NEW + '/index/22.jpg' + // }, + // { + // type: 'image', + // src: process.env.APP_IMAGE_CDN_NEW + '/index/33.jpg' + // }, + // // { + // // type: 'video', + // // src: 'https://espier-oss-cdn.oss-cn-shanghai.aliyuncs.com/default_project/wxAssets/index/video-1.mp4' + // // } + // ], + swiperList: [], + activeInfo: {} } } @@ -79,17 +96,17 @@ export default class RecommendList extends Component { // this.setState({ // list: [] // }) - setTimeout(() => { - // this.nextPage() - // Taro.hideLoading() - this.setState({ - page: { - isLoading: false - } - }) - }, 200) - + // setTimeout(() => { + // // this.nextPage() + // // Taro.hideLoading() + // this.setState({ + // page: { + // isLoading: false + // } + // }) + // }, 200) // this.praiseNum() + this.getActiveDetail() } onShareAppMessage () { @@ -114,6 +131,24 @@ export default class RecommendList extends Component { } } + getActiveDetail = async (id = 1) => { + const { status, activity_info = {}, total_count } = await api.user.registrationActivity({ activity_id: id }) + this.setState({ + page: { + isLoading: false, + }, + activeInfo: { + ...activity_info, + total_count, + status + }, + swiperList: activity_info.pics.map(item => ({ + type: 'image', + src: item + })) + }) + } + async fetch (params) { const { page_no: page, page_size: pageSize } = params const { columnList, areaList } = this.state @@ -563,6 +598,23 @@ export default class RecommendList extends Component { play }) } + onSwiperChange = (e) => { + const { current } = e.detail + this.setState({ + currentIndex: current + }) + } + + handleApply = () => { + const { activeInfo = {} } = this.state + let url = '/pages/recommend/detail?id=' + if (activeInfo.total_count) { + url = `/pages/recommend/status?id=` + } + Taro.navigateTo({ + url: url + activeInfo.activity_id + }) + } render () { const { @@ -580,6 +632,9 @@ export default class RecommendList extends Component { isShowSearch, isSpAddressOpened, play, + swiperList, + currentIndex, + activeInfo } = this.state const { colors } = this.props let address = info.province + info.city @@ -587,7 +642,7 @@ export default class RecommendList extends Component { const height = windowWidth * 9 / 17 return ( - } loading={page.isLoading} className='has-nav' title="" isBlack> + } loading={page.isLoading} className='has-nav' title="" isBlack isTop> {false && <> @@ -722,7 +777,7 @@ export default class RecommendList extends Component { )} } - {page.isLoading ? : + {/* {page.isLoading ? : + } */} + {page.isLoading ? : + + + {swiperList.map((item, index) => ( + + {item.type === "image" && ( + + )} + {item.type === "video" && ( + + ))} + + + {activeInfo.activity_name} + {activeInfo.end_time * 1000 >= Date.now() && + {activeInfo.total_count ? '已报名' : '活动申请'} + } + + + {swiperList.map((_, index) => ( + + ))} + + } diff --git a/src/pages/recommend/list.scss b/src/pages/recommend/list.scss index f178fc6..c8a7db3 100755 --- a/src/pages/recommend/list.scss +++ b/src/pages/recommend/list.scss @@ -1,7 +1,8 @@ @import '../../style/imports'; -.loading { - margin-top: 60px; +.sp-loading { + margin-top: 70px; } + .page-recommend-list { .recommend-content { width: 100%; @@ -38,6 +39,75 @@ margin-bottom: 50px; } } + .active-content { + position: relative; + .swiper { + width: 100%; + height: calc(100vh - #{$page-ipx-footer-height} - var(--status-bar-height)); + transition: height 0.3s ease-in-out; + position: relative; + } + .spot-pagination { + animation: fadeInAnimation 0.35s ease-in; + position: absolute; + left: 50%; + transform: translateX(-50%); + // bottom: 10%; + bottom: 100px; + display: flex; + justify-content: center; + width: 80%; + border-radius: 10%; + .spot-pagination-bullet { + height: 4px; + width: 30px; + background: #ddd; + transition: all 0.3s ease-in-out 0s; + } + // 当前指示点样式 + .spot-pagination-bullet-active { + background: #fff; + } + } + .item-btns { + display: flex; + flex-direction: column; + align-items: flex-start; + position: absolute; + left: 66px; + bottom: 170px; + z-index: 10; + // justify-content: flex-start; + .item-tit { + font-size: 42px; + font-weight: bold; + margin-bottom: 36px; + color: #fff; + } + .item-btn { + // width: 180px; + // height: 56px; + padding: 30px 70px 30px 90px; + color: #fff; + font-size: 28px; + border-radius: 10px; + background-color: #00000085; + border-width: 2px; + border-style: solid; + border-color: #fff; + display: flex; + justify-content: center; + align-items: center; + font-size: 22px; + line-height: 1; + .icon-my { + font-size: 28px; + font-weight: bold; + margin-left: 16px; + } + } + } + } /* #ifdef alipay */ .filter-bar { position: absolute; diff --git a/src/pages/recommend/status.config.js b/src/pages/recommend/status.config.js new file mode 100755 index 0000000..bce635d --- /dev/null +++ b/src/pages/recommend/status.config.js @@ -0,0 +1,3 @@ +export default { + navigationBarTitleText: '' +} diff --git a/src/pages/recommend/status.js b/src/pages/recommend/status.js new file mode 100644 index 0000000..ea8c020 --- /dev/null +++ b/src/pages/recommend/status.js @@ -0,0 +1,167 @@ +import React, { useEffect } from 'react' +import { View, Text, Input, Image } from '@tarojs/components' +import Taro, { getCurrentInstance, useDidShow } from '@tarojs/taro' +import { SpPage, SpHtml, SpCheckbox, SpImage } from '@/components' +import { useSelector } from 'react-redux' +import { getActiveDetail } from '@/api/community' +import { useImmer } from 'use-immer' +import api from '@/api' +import dayjs from 'dayjs' +import { AtIcon } from 'taro-ui' +import { classNames, navigateTo, isArray } from '@/utils' +import QRCode from 'qrcode' +import './status.scss' + + +const initState = { + cur_activity_info: [], + loading: true, + activeInfo: {}, + qrUrl: '' +} +export default function status () { + const $instance = getCurrentInstance() + const [state, setState] = useImmer(initState) + const { cur_activity_info, loading, activeInfo, qrUrl } = state + + useEffect(() => { + getActiveDetail() + }, []) + + const getActiveDetail = async () => { + const { id, success } = $instance.router.params + const { activity_info = {}, total_count, user_code, recordList = {} } = await api.user.registrationActivity({ activity_id: id }) + const _start = dayjs(activity_info.start_time * 1000) + const _end = dayjs(activity_info.end_time * 1000) + let url = '' + const qrData = JSON.stringify({ + activity_id: id, + user_code: user_code || '' + }) + await QRCode.toDataURL(qrData).then((_url) => { + url = _url + }) + const _item = recordList.list?.[0] || {} + const list = _item.content?.[0]?.formdata || [] + const record = {} + list.map((item) => { + record[item.field_name] = item.answer || '' + }) + setState(draft => { + draft.activeInfo = { + ...activity_info, + total_count, + start: `${_start.month() + 1}月${_start.date()}日`, + end: `${_end.month() + 1}月${_end.date()}日`, + status: _item.is_write_off === '1' ? 'done' : _item.status, + ...record + } + draft.loading = false + draft.qrUrl = url + }) + } + + const subscribe = async () => { + // await api.user.subscribeGoods(info.itemId, { distributor_id: dtid }) + // const { template_id } = await api.user.newWxaMsgTmpl({ + // temp_name: 'yykweishop', + // source_type: 'goods' + // }) + Taro.requestSubscribeMessage({ + tmplIds: ['tGJR7BS3HM9xLD4QUdBwtTAJkgzfl7cw_8-ngd74JM4'], + success: () => { + // onSubscribe() + console.log("🚀 ~ onSubscribe:", 'onSubscribe') + }, + fail: (err) => { + console.log("🚀 ~ err:", err) + // onSubscribe() + } + }) + } + + const fetchDetail = async () => { + const { content } = await api.user.registrationRecordInfo({ + record_id: $instance.router.params.record_id + }) + + let answer_data = [] + content.map((item) => { + if (item.formdata && item.formdata.length > 0) { + item.formdata.map((sec_item) => { + if (isArray(sec_item.answer)) { + if (sec_item.form_element === 'checkbox') { + sec_item.answer = sec_item.answer.join(',') + } + if (sec_item.form_element === 'area') { + sec_item.answer = sec_item.answer.join('') + } + } + answer_data.push({ + field_title: sec_item.field_title, + answer: sec_item.answer + }) + }) + } + }) + setState({ + cur_activity_info: answer_data + }) + } + + const handleCancel = async () => { + const res = await Taro.showModal({ + title: '提示', + content: `确定要取消预约吗?`, + showCancel: true, + cancel: '取消', + cancelText: '取消', + confirmText: '确认', + cancelColor: '#a5a5a5', + confirmColor: '#000' + }) + if (!res.confirm) return + const { id } = $instance.router.params + await api.user.cancelRegistrationRecord({ + activity_id: id + }) + navigateTo('/pages/recommend/list') + } + return ( + + + + + {activeInfo?.activity_name || ''} + + + 姓名 + {activeInfo?.username} + + + 手机号 + {activeInfo?.mobile} + + + + 活动时间 + {activeInfo?.start} - {activeInfo?.end} + + + 活动地点 + + + {activeInfo?.address} + + Taro.navigateTo({ url: '/pages/recommend/detail?id=' + activeInfo?.activity_id })}>活动介绍 + {activeInfo.status === 'passed' && activeInfo.status !== 'done' ? + + + + + 入场请出示预约凭证 + : } + {activeInfo.status !== 'done' && 取消预约} + + ) +} diff --git a/src/pages/recommend/status.scss b/src/pages/recommend/status.scss new file mode 100644 index 0000000..396da88 --- /dev/null +++ b/src/pages/recommend/status.scss @@ -0,0 +1,99 @@ +.page-recommend-status { + padding: 10px 58px; + .sp-checkbox-new { + padding: 30px 0; + .icon-checkbox-xuanzhong { + font-size: 30px; + } + .sp-checkbox-new__label { + font-size: 40px; + } + } + .activity_name { + font-size: 40px; + font-weight: bold; + margin-bottom: 36px; + } + .activity_info { + display: flex; + align-items: center; + margin-bottom: 30px; + &-item { + flex: 1; + margin-right: 30px; + &:last-child { + margin-right: 0; + } + } + } + .flex-col { + display: flex; + flex-direction: column; + .title { + font-size: 24px; + margin-bottom: 2px; + color: #000; + } + .value { + color: #999; + font-size: 24px; + display: flex; + align-items: center; + > image { + width: 18px; + height: 24px; + margin-right: 20px; + } + } + } + .activity_time { + font-size: 24px; + color: #999; + margin-bottom: 50px; + } + .activity_addr { + font-size: 24px; + color: #999; + } + .activity_intro { + font-size: 30px; + text-decoration: underline; + margin: 90px 0 50px; + } + .img-box { + width: 300px; + height: 300px; + overflow: hidden; + display: flex; + align-items: center; + justify-content: center; + border-radius: 10px; + background-color: #fff; + border: 1px solid #00000070; + margin: 34px 0 26px; + .member-code-box-qr { + width: 100%; + height: 100%; + scale: 1.2; + } + } + .code-box { + margin: 0 auto; + width: 500px; + padding: 64px 100px; + border-radius: 10px; + background-color: #e5e5e5; + align-items: center; + box-sizing: border-box; + &-txt { + font-size: 22px; + // color: #999; + } + } + .cancel-txt { + font-size: 18px; + text-align: center; + margin-top: 30px; + text-decoration: underline; + } +} diff --git a/src/subpages/member/index.js b/src/subpages/member/index.js index f33768c..c98e763 100755 --- a/src/subpages/member/index.js +++ b/src/subpages/member/index.js @@ -103,7 +103,8 @@ const initialState = { zitiNum: 0, deposit: 0, isOpen: false, - loading: false + loading: false, + isInternal: false, } function MemberIndex (props) { @@ -299,6 +300,7 @@ function MemberIndex (props) { }) setState((draft) => { draft.deposit = memberRes.deposit / 100 + draft.isInternal = memberRes?.memberInfo?.is_internal }) dispatch(updateUserInfo(memberRes)) } @@ -485,10 +487,16 @@ function MemberIndex (props) { /> - - + + {VipGradeDom()} + + {state.isInternal && + + 扫码入口 + + } {/* {config.menu.member_code && ( diff --git a/src/subpages/member/index.scss b/src/subpages/member/index.scss index 5148efe..ab621ce 100755 --- a/src/subpages/member/index.scss +++ b/src/subpages/member/index.scss @@ -76,6 +76,17 @@ } } .username-wrap { + padding: 20px 0; + } + .san-btn { + padding: 14px 30px; + align-items: center; + justify-content: center; + font-size: 28px; + line-height: 1; + background: #00000085; + color: #fff; + border-radius: 6px; } .user-grade-name { line-height: 35px; diff --git a/src/subpages/member/scan.config.js b/src/subpages/member/scan.config.js new file mode 100644 index 0000000..e11e783 --- /dev/null +++ b/src/subpages/member/scan.config.js @@ -0,0 +1,3 @@ +export default { + navigationBarTitleText: '活动扫码', +} diff --git a/src/subpages/member/scan.js b/src/subpages/member/scan.js new file mode 100644 index 0000000..797cba6 --- /dev/null +++ b/src/subpages/member/scan.js @@ -0,0 +1,113 @@ +import React, { useEffect } from 'react' +import { View, Text, Input, Image } from '@tarojs/components' +import Taro, { getCurrentInstance, useDidShow } from '@tarojs/taro' +import { SpPage, SpHtml, SpCheckbox } from '@/components' +import { useSelector } from 'react-redux' +import { getActiveDetail } from '@/api/community' +import { useImmer } from 'use-immer' +import api from '@/api' +import dayjs from 'dayjs' +import { AtIcon } from 'taro-ui' +import { classNames, navigateTo, getQueryVariable } from '@/utils' +import './scan.scss' + +const initState = { + list: [] +} +export default function scan () { + const [state, setState] = useImmer(initState) + + useEffect(() => { + getRecords() + }, []) + + const handleScan = async (e) => { + e?.stopPropagation() + try { + Taro.scanCode().then(async (res) => { + if (res.errMsg != 'scanCode:ok') { + throw new Error('识别失败') + } + Taro.showLoading({ title: '' }) + const reqData = JSON.parse(res.result) + await api.user.verifyRegistrationRecord(reqData) + await getRecords() + Taro.hideLoading() + const _res = await Taro.showModal({ + title: '提示', + content: `验证成功，是否继续扫码？`, + showCancel: true, + cancelText: '继续', + confirmText: '返回', + cancelColor: '#a5a5a5', + confirmColor: '#000' + }) + if (_res.confirm) return + handleScan() + }).catch((error) => { + Taro.hideLoading() + error.errMsg !== 'scanCode:fail cancel' && Taro.showToast({ + title: '识别失败!请重试～', + icon: 'none' + }) + }) + } catch (error) { + Taro.showToast({ + title: '识别失败!请重试～', + icon: 'none' + }) + } + } + + const getRecords = async () => { + const data = await api.user.registrationRecordList() + const _list = (data?.list || []).filter(n => n.is_write_off == 1).map(item => { + let formData = item.content?.[0]?.formdata || [] + if (formData.length > 0) { + formData.forEach(_item => { + item[_item.field_name] = _item.answer + }) + } + item.date = item.is_write_off_date_format ? dayjs(item.is_write_off_date_format).format('YYYY-MM-DD') : '' + return item + }) + setState((draft) => { + draft.list = _list + }) + } + return ( + + 扫码 + 活动扫码记录 + + + 活动名称 + 姓名 + 签到时间 + {/* 手机号 */} + {/* 签到时间 */} + + + 状态 + + + + {state.list?.map((item, index) => { + return ( + + + {item.activity_name} + {item.username} + {item.date} + {/* {item.mobile} */} + + + {item.is_write_off == 1 ? '已签到' : '未签到'} + + + ) + })} + + + ) +} diff --git a/src/subpages/member/scan.scss b/src/subpages/member/scan.scss new file mode 100644 index 0000000..5440220 --- /dev/null +++ b/src/subpages/member/scan.scss @@ -0,0 +1,61 @@ +.page-member-scan { + height: 95vh; + overflow: hidden; + .sp-page-body { + padding: 30px 40px; + position: relative; + display: flex; + flex-direction: column; + align-items: center; + } + .scan__btn { + width: 100%; + height: 80px; + margin: 0 auto; + display: flex; + align-items: center; + justify-content: center; + font-size: 40px; + line-height: 1; + background: #000; + color: #fff; + border-radius: 6px; + } + .txt { + font-size: 32px; + margin: 30px auto; + font-weight: bold; + text-align: center; + } + .scroll-box { + // @include page-scroll(calc(var(--nav-height) + 150px), 40px); + // height: calc(var(--nav-height) + 150px); + margin-bottom: 10px; + box-sizing: border-box; + flex-direction: column; + display: flex; + flex: 1; + overflow-y: scroll; + } + .item { + display: flex; + align-items: center; + justify-content: space-between; + } + .left { + display: flex; + align-items: center; + > text { + display: inline-block; + width: 180px; + margin-right: 10px; + @include text-overflow(); + &::last-child { + margin-right: 0; + } + } + } + .right { + flex: 1; + } +} diff --git a/src/subpages/member/user-info.js b/src/subpages/member/user-info.js index 0173fd6..569c7cd 100755 --- a/src/subpages/member/user-info.js +++ b/src/subpages/member/user-info.js @@ -619,7 +619,7 @@ function MemberUserInfo () { {/* 选中 */} setState((draft) => { draft.checked = !checked })} /> - setState((draft) => { draft.checked = !draft.checked })} >我已经阅读并同意 + setState((draft) => { draft.checked = !draft.checked })} >我已经阅读并同意 Taro.navigateTo({ url: '/subpages/auth/reg-rule?type=member_logout' })} style={`color: #000000`}