|
|
@@ -4,159 +4,172 @@
|
|
|
<image src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/19/54b75bc8-d926-449b-95a5-1126f700b481.png" class="top_bg_img" mode="widthFix"></image>
|
|
|
<div class="top">
|
|
|
<div class="top-status adfacjb">
|
|
|
- <div class="left">{{'已报名'}}</div>
|
|
|
- <div class="right"><span>{{200}}</span>爱心值</div>
|
|
|
+ <div class="left">{{signupStateDict[info?.signupState]||'未知'}}</div>
|
|
|
+ <div class="right" v-if="info?.activityLimit==1"><span>{{info?.valueLimit||0}}</span>爱心值</div>
|
|
|
+ <div class="right" v-else-if="info?.activityLimit==2"><span>{{info?.valueLimit||0}}</span>张专享券</div>
|
|
|
+ <div class="right" v-else-if="info?.activityLimit==3"><span>免费</span></div>
|
|
|
</div>
|
|
|
- <div class="top-no">善行少年编号:{{'Pinan202501'}}</div>
|
|
|
+ <div class="top-no">善行少年编号:{{info?.uniqueNo||''}}</div>
|
|
|
</div>
|
|
|
<div class="box box1 adf" style="margin-top: 30rpx;">
|
|
|
<div class="box1-left">
|
|
|
- <image src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/23/b3a3b866-e31c-4c33-bbce-a61f8689354c.png"></image>
|
|
|
+ <image :src="info?.coverFile||''"></image>
|
|
|
</div>
|
|
|
<div class="box1-right">
|
|
|
- <div class="title">{{'环保知识知多少?让孩子成为大自然的守护者!'}}</div>
|
|
|
- <div class="memo">{{'每200爱心值守护一条河流,让河流恢复往日的清澈模样'}}</div>
|
|
|
+ <div class="title">{{info?.activityName||''}}</div>
|
|
|
+ <div class="memo">{{info?.loveValueContent||''}}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="box box2">
|
|
|
<div class="box-title">活动信息</div>
|
|
|
- <div class="box2-item adfacjb">
|
|
|
+ <div class="box2-item adf">
|
|
|
<div class="left">报名时间</div>
|
|
|
- <div class="right">{{'2025-06-01 ~ 2025-06-02'}}</div>
|
|
|
+ <div class="right">{{info?.signupStartTime||''}} ~ {{info?.signupEndTime||''}}</div>
|
|
|
</div>
|
|
|
- <div class="box2-item adfacjb">
|
|
|
+ <div class="box2-item adf">
|
|
|
<div class="left">活动时间</div>
|
|
|
- <div class="right">{{'2025-06-01 ~ 2025-06-02'}}</div>
|
|
|
+ <div class="right">{{info?.activityStartTime||''}} ~ {{info?.activityEndTime||''}}</div>
|
|
|
</div>
|
|
|
- <div class="box2-item adfacjb">
|
|
|
+ <div class="box2-item adf">
|
|
|
<div class="left">活动地点</div>
|
|
|
- <div class="right">{{'广东省深圳市'}}</div>
|
|
|
+ <div class="right">{{info?.provinceName||''}}{{info?.cityName||''}}</div>
|
|
|
</div>
|
|
|
- <div class="box2-item adfacjb">
|
|
|
+ <div class="box2-item adf">
|
|
|
<div class="left">招募人数</div>
|
|
|
- <div class="right">{{40}}/{{50}}</div>
|
|
|
+ <div class="right">{{info?.recruitmentNow||0}}/{{info?.recruitmentMax||'无限制'}}</div>
|
|
|
</div>
|
|
|
- <div class="box2-item adfacjb">
|
|
|
+ <div class="box2-item adf">
|
|
|
<div class="left">联系人</div>
|
|
|
- <div class="right">{{'周小瑾'}}/{{'13111987666'}}</div>
|
|
|
+ <div class="right">{{info?.activityContact||''}}/{{info?.activityContactPhone||''}}</div>
|
|
|
</div>
|
|
|
- <div class="box2-item adfacjb">
|
|
|
+ <div class="box2-item adf">
|
|
|
<div class="left">公益支持</div>
|
|
|
- <div class="right">{{'深圳慈善会公益基金'}}</div>
|
|
|
+ <div class="right">{{info?.channelName||''}}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="box box3">
|
|
|
<div class="box-title">报名信息</div>
|
|
|
<div class="box3-list">
|
|
|
- <div class="box3-list-item adfacjb" v-for="(user,index) in userList" :key="index">
|
|
|
+ <div class="box3-list-item adfacjb">
|
|
|
<div class="left">
|
|
|
<div class="top adfac">
|
|
|
- <div class="name">{{'张琳琳'}}</div>
|
|
|
- <image class="sex" v-if="user.sex==2" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/12/b6d1fcb3-55ba-4104-b8cd-756b963a4da8.png"></image>
|
|
|
- <image class="sex" v-else-if="user.sex==1" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/12/a1899fd0-c468-48d9-b554-2f17b75a4157.png"></image>
|
|
|
- <div class="age" :class="{'women':user.sex==2,'man':user.sex==1}">{{46}}岁</div>
|
|
|
+ <div class="name">{{info?.memberName||''}}</div>
|
|
|
+ <image class="sex" v-if="info?.gender==1" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/12/b6d1fcb3-55ba-4104-b8cd-756b963a4da8.png"></image>
|
|
|
+ <image class="sex" v-else-if="info?.gender==0" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/12/a1899fd0-c468-48d9-b554-2f17b75a4157.png"></image>
|
|
|
+ <div class="age" :class="{'women':info?.gender==1,'man':info?.gender==0}">{{info?.age}}岁</div>
|
|
|
</div>
|
|
|
- <div class="left-bottom">身份证 {{'340123**********09'}}</div>
|
|
|
+ <div class="left-bottom">身份证 {{info?.idCardCopy}}</div>
|
|
|
</div>
|
|
|
- <!-- <div class="right">
|
|
|
- <image src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/23/ebdf1327-3eeb-4797-8840-cb1ec4840d9a.png"></image>
|
|
|
- </div> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <!-- <div class="box box4">
|
|
|
- <div class="box-title">活动详情</div>
|
|
|
- <div class="box4-detail">
|
|
|
- <up-read-more :toggle="true" showHeight="374rpx" color="#989998" fontSize="24rpx" openText="收起更多信息" closeText="展开更多信息">
|
|
|
- <rich-text :nodes="detail"></rich-text>
|
|
|
- </up-read-more>
|
|
|
- </div>
|
|
|
- </div> -->
|
|
|
<div class="user">
|
|
|
<div class="user-pre adfacjb">
|
|
|
<div class="user-pre-left">联系人姓名</div>
|
|
|
- <div class="user-pre-right">{{'周小瑾'}}</div>
|
|
|
+ <div class="user-pre-right">{{info?.contact||''}}</div>
|
|
|
</div>
|
|
|
<div class="user-pre adfacjb">
|
|
|
<div class="user-pre-left">联系人电话</div>
|
|
|
- <div class="user-pre-right">{{'13688889999'}}</div>
|
|
|
+ <div class="user-pre-right">{{info?.contactPhone||''}}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="bottom adfacjb">
|
|
|
- <div class="left adffcacjc" @tap="handleShare">
|
|
|
- <up-icon name="share-square" color="#252525" size="48rpx"></up-icon>
|
|
|
- <text>分享</text>
|
|
|
- </div>
|
|
|
- <div class="right" @click="handleCancel">取消报名</div>
|
|
|
- </div>
|
|
|
- <div class="dialog" v-if="show">
|
|
|
- <div class="dbox">
|
|
|
- <div class="dbox-title">报名信息</div>
|
|
|
- <image class="close" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/10/10/7d1c7cf4-199a-4008-8114-ee0e1a8f0cc3.png" @click="show=false"></image>
|
|
|
- <div class="dbox-select adfacjb">
|
|
|
- <div class="dbox-select-left">请选择人员</div>
|
|
|
- <div class="dbox-select-right adfac" v-if="multiple">
|
|
|
- <text>全选</text>
|
|
|
- <image v-if="selectAll" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/12/87b5b244-d14f-43cd-991b-4ac9f48d909e.png"></image>
|
|
|
- <image v-else src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/12/b8a5cabd-57f8-4ad7-9677-f6372423c50a.png"></image>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="dbox-list">
|
|
|
- <div class="dbox-list-item adfacjb" v-for="(item,index) in selectUsers" :key="index" @click="handleSelectUser(item,index)">
|
|
|
- <div class="dbox-list-item-left">
|
|
|
- <div class="dbox-list-item-left-top adfac">
|
|
|
- <div class="name">{{'张琳琳'}}</div>
|
|
|
- <image class="sex" v-if="item.sex==2" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/12/b6d1fcb3-55ba-4104-b8cd-756b963a4da8.png"></image>
|
|
|
- <image class="sex" v-else-if="item.sex==1" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/12/a1899fd0-c468-48d9-b554-2f17b75a4157.png"></image>
|
|
|
- <div class="age" :class="{'women':item.sex==2,'man':item.sex==1}">{{46}}岁</div>
|
|
|
- </div>
|
|
|
- <div class="dbox-list-item-left-bottom">身份证 {{'340123**********09'}}</div>
|
|
|
- </div>
|
|
|
- <div class="dbox-list-item-right">
|
|
|
- <image v-if="item.select" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/12/87b5b244-d14f-43cd-991b-4ac9f48d909e.png"></image>
|
|
|
- <image v-else src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/12/b8a5cabd-57f8-4ad7-9677-f6372423c50a.png"></image>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="dbox-btn">{{'取消报名'}}</div>
|
|
|
- </div>
|
|
|
+ <div class="right" @click="handleCancel" v-if="info?.activeState==1&&info?.signupState==1">取消报名</div>
|
|
|
+ <div class="right" @click="handleSignup" v-if="info?.activeState==1&&info?.signupState==-1">立即报名</div>
|
|
|
+ <div class="right" v-if="info?.activeState==2&&info?.signupState==1">去签到</div>
|
|
|
+ <div class="right" v-if="info?.activeState==3&&info?.signupState==2">写档案</div>
|
|
|
+ <div class="right" v-if="info?.activeState==3&&info?.signupState==3">查看档案</div>
|
|
|
</div>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script setup name="">
|
|
|
- import { onShareAppMessage } from '@dcloudio/uni-app';
|
|
|
import CusHeader from '@/components/CusHeader/index.vue'
|
|
|
- import { ref } from 'vue'
|
|
|
+ import { ref, getCurrentInstance } from 'vue'
|
|
|
+ import { onLoad } from '@dcloudio/uni-app'
|
|
|
+ const { proxy } = getCurrentInstance()
|
|
|
|
|
|
- const userList = ref([{sex:2},{sex:1}])
|
|
|
- const detail = ref(`山不在高,有仙则名。水不在深,有龙则灵。斯是陋室,惟吾德馨。
|
|
|
- 苔痕上阶绿,草色入帘青。谈笑有鸿儒,往来无白丁。可以调素琴,阅金经。
|
|
|
- 无丝竹之乱耳,无案牍之劳形。南阳诸葛庐,西蜀子云亭。孔子云:何陋之有?<br>山不在高,有仙则名。水不在深,有龙则灵。斯是陋室,惟吾德馨。
|
|
|
- 苔痕上阶绿,草色入帘青。谈笑有鸿儒,往来无白丁。可以调素琴,阅金经。
|
|
|
- 无丝竹之乱耳,无案牍之劳形。南阳诸葛庐,西蜀子云亭。孔子云:何陋之有?`)
|
|
|
- const show = ref(false)
|
|
|
- const multiple = ref(false)
|
|
|
- const selectAll = ref(false)
|
|
|
- const selectUsers = ref([{sex:2,select:false},{sex:2,select:false}])
|
|
|
+ const info = ref(null)
|
|
|
+ const memberSignupId = ref('')
|
|
|
+ const signupStateDict = ref({
|
|
|
+ '-1':'已取消',
|
|
|
+ 1:'已报名',
|
|
|
+ 2:'已签到',
|
|
|
+ 3:'已填档案'
|
|
|
+ })
|
|
|
|
|
|
- const handleShare = () => {
|
|
|
- uni.showToast({
|
|
|
- title: '请点击右上角进行分享',
|
|
|
- icon: 'none'
|
|
|
- });
|
|
|
- };
|
|
|
+ const getUserActivityDetail = () => {
|
|
|
+ proxy.$api.get(`/core/activity/signup/myActivityInfo/${memberSignupId.value}`).then(({data:res})=>{
|
|
|
+ if(res.code!==0) return proxy.$showToast(res.msg)
|
|
|
+ info.value = res.data;
|
|
|
+ info.value.age = getAge(info.value.idCard);
|
|
|
+ info.value.idCardCopy = info.value.idCard.replace(/^(\d{6})(\d{8})(\d{3}[\dX])$/i,'$1********$3');
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ const isValid = (idCard) => {
|
|
|
+ // 正则表达式校验18位身份证号码(最后一位可以是数字或X/x)
|
|
|
+ const regex = /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
|
|
|
+ return typeof idCard === 'string' && regex.test(idCard);
|
|
|
+ }
|
|
|
+
|
|
|
+ const getAge = (idCard) => {
|
|
|
+ if (!isValid(idCard)) return 0
|
|
|
+
|
|
|
+ // 从身份证的第7位开始,截取8位作为出生日期字符串 (YYYYMMDD)
|
|
|
+ const birthDateStr = idCard.substring(6, 14);
|
|
|
+ const birthYear = parseInt(birthDateStr.substring(0, 4), 10);
|
|
|
+ const birthMonth = parseInt(birthDateStr.substring(4, 6), 10);
|
|
|
+ const birthDay = parseInt(birthDateStr.substring(6, 8), 10);
|
|
|
+
|
|
|
+ const today = new Date();
|
|
|
+ const currentYear = today.getFullYear();
|
|
|
+ const currentMonth = today.getMonth() + 1; // getMonth() 返回 0-11
|
|
|
+ const currentDay = today.getDate();
|
|
|
+
|
|
|
+ // 计算周岁
|
|
|
+ let age = currentYear - birthYear;
|
|
|
+
|
|
|
+ // 如果当前月份小于出生月份,或者月份相同但日期小于出生日期,说明今年的生日还没过
|
|
|
+ if (currentMonth < birthMonth || (currentMonth === birthMonth && currentDay < birthDay)) {
|
|
|
+ age--;
|
|
|
+ }
|
|
|
+
|
|
|
+ return age < 0 ? 0 : age;
|
|
|
+ }
|
|
|
|
|
|
const handleCancel = () => {
|
|
|
- show.value = true;
|
|
|
+ uni.showModal({
|
|
|
+ title:'温馨提示',
|
|
|
+ content:'确认取消本次报名吗?取消后可再次报名本活动。',
|
|
|
+ success: (res) => {
|
|
|
+ if(res.confirm){
|
|
|
+ proxy.$api.get(`/core/activity/signup/cancelSignupBySingle/${memberSignupId.value}`).then(({data:res})=>{
|
|
|
+ if(res.code!==0) return proxy.$showToast(res.msg)
|
|
|
+ getUserActivityDetail()
|
|
|
+ proxy.$showToast('取消报名成功')
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
|
|
|
- onShareAppMessage(() => {
|
|
|
- return {
|
|
|
- title: '公益活动详情',
|
|
|
- path: '/pagesNonprofit/detail'
|
|
|
- };
|
|
|
- });
|
|
|
+ const handleSignup = () => {
|
|
|
+ proxy.$api.post(`/core/activity/signup/signupBySingle`,{
|
|
|
+ couponId:'',
|
|
|
+ memberSignupId:memberSignupId.value,
|
|
|
+ userId:JSON.parse(uni.getStorageSync('userInfo')).id
|
|
|
+ }).then(({data:res})=>{
|
|
|
+ if(res.code!==0) return proxy.$showToast(res.msg)
|
|
|
+ getUserActivityDetail()
|
|
|
+ proxy.$showToast('报名成功')
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ onLoad((options)=>{
|
|
|
+ memberSignupId.value = options?.memberSignupId;
|
|
|
+ getUserActivityDetail()
|
|
|
+ })
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
@@ -257,14 +270,19 @@
|
|
|
.box2{
|
|
|
&-item{
|
|
|
margin-top: 40rpx;
|
|
|
+ justify-content: space-between;
|
|
|
.left{
|
|
|
font-family: PingFangSC, PingFang SC;
|
|
|
font-weight: 400;
|
|
|
font-size: 28rpx;
|
|
|
color: #676775;
|
|
|
line-height: 28rpx;
|
|
|
+ width: 120rpx;
|
|
|
}
|
|
|
.right{
|
|
|
+ width: calc(100% - 120rpx);
|
|
|
+ padding-left: 20rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
font-family: PingFangSC, PingFang SC;
|
|
|
font-weight: 400;
|
|
|
font-size: 28rpx;
|
|
|
@@ -367,7 +385,7 @@
|
|
|
height: 191rpx;
|
|
|
background: #FFFFFF;
|
|
|
box-shadow: 0rpx -2rpx 8rpx 0rpx rgba(178,178,178,0.1);
|
|
|
- padding: 0 30rpx 0 54rpx;
|
|
|
+ padding: 0 30rpx;
|
|
|
box-sizing: border-box;
|
|
|
position: fixed;
|
|
|
left: 0;
|
|
|
@@ -383,7 +401,7 @@
|
|
|
}
|
|
|
}
|
|
|
.right{
|
|
|
- width: 540rpx;
|
|
|
+ width: 100%;
|
|
|
height: 90rpx;
|
|
|
background: #B7F358;
|
|
|
border-radius: 45rpx;
|