c-zhouhf1/zhgh_hmc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

commit

Browse Source
This commit is contained in:
c-zhouhf1
2026-04-14 10:29:00 +08:00
parent 5fe73bf0e2
commit e2b6568552
1 changed files with 123 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/views/mobile/train/trainInfo.html
+123 -70
View File
@@ -39,6 +39,42 @@ layout("/mobile/platform.html"){
font-size: 12px;
}
.train-card {
position: relative;
overflow: hidden;
}
.train-card-actions {
display: flex;
justify-content: flex-end;
align-items: center;
flex-wrap: wrap;
gap: 8px;
margin-top: 10px;
}
.train-card-button {
width: 74px;
height: 28px;
}
.train-card-status {
width: 74px;
text-align: right;
line-height: 1;
}
.train-card-status image {
width: 52px;
height: auto;
}
.train-list-wrapper {
/* 给底部固定 tabbar 和安全区预留空间，避免最后一张卡片被遮挡 */
padding-bottom: calc(80px + env(safe-area-inset-bottom));
box-sizing: border-box;
}
.train-title {
color: grey;
}
@@ -152,6 +188,7 @@ layout("/mobile/platform.html"){
.van-tabs__nav--complete {
padding: 0;
}
.risk-dialog-wrapper {
display: flex;
flex-direction: column;
@@ -166,18 +203,18 @@ layout("/mobile/platform.html"){
padding-bottom: 16px; /* 给按钮留点空间 */
}
.remark-content{
.remark-content {
width: 100%;
max-width: 100%;
/* height: calc(100vh - 46px - 44px);
overflow-y: auto;*/
/* height: calc(100vh - 46px - 44px);
overflow-y: auto;*/
}
.remark-content *{
max-width: 100%!important;
.remark-content * {
max-width: 100% !important;
}
.table-class{
.table-class {
width: 100%;
margin-top: 10px;
border-radius: 5px;
@@ -186,14 +223,17 @@ layout("/mobile/platform.html"){
font-size: 13px;
table-layout: fixed;
border-collapse: collapse;
th {
background-color: #f2f2f2;
border: 1px solid #dddddd;
}
tr {
text-align: center;
border-bottom: 1px solid #dddddd;
}
td {
border: 1px solid #dddddd;
}
@@ -209,24 +249,24 @@ layout("/mobile/platform.html"){
:options="activityOptions"></van-dropdown-item>
<van-dropdown-item @change="courseChange" v-model="courseType" :options="courseOptions"></van-dropdown-item>
</van-dropdown-menu>
<van-tabs v-if="activityStatus != '1' && assortList.length > 0" v-model="assort" color="#1867B0"
@click="tabClick">
<van-tab v-for="item in assortList" :name="item" :title="item">
</van-tab>
</van-tabs>
</van-sticky>
<van-tabs v-if="activityStatus != '1' && assortList.length > 0" v-model="assort" type="card" color="#1867B0"
style="margin-top: 10px" @click="tabClick">
<van-tab v-for="item in assortList" :name="item" :title="item">
</van-tab>
</van-tabs>
<!--<van-notice-bar
left-icon="volume-o"
text="温馨提示：每人只能填报一项活动">
</van-notice-bar>-->
<template>
<div id="parentDiv" v-model="loading" v-if="tableData.courseList && tableData.courseList.length>0" style="margin-bottom: 60px">
<div id="parentDiv" class="train-list-wrapper" v-model="loading"
v-if="tableData.courseList && tableData.courseList.length>0">
<template v-for="o in tableData.courseList">
<div style="position: relative"
<div class="train-card"
:class="activityStatus !== '1' ? 'van-doc-card' : 'van-doc-card-my'">
<div>
<van-tag type="primary" size="medium">
@@ -282,29 +322,33 @@ layout("/mobile/platform.html"){
v-if="o.isSign === true && tableData.wechat"
style="color: #dd6363">点我查看微信群二维码</span>
</div>
<van-button type="primary" color="#1867b0" round size="mini"
v-if="activityStatus !== '1' && o.isSign === false"
style="position: absolute; left: 74%; bottom: 10%; width: 74px; height: 28px"
@click.stop="openRiskText(o)">
我要报名
</van-button>
<div class="train-card-actions"
v-if="activityStatus !== '1' || (o.isSign === true && moment().valueOf() < moment(activity.activitySignUpEndTime).valueOf())">
<van-button type="primary" color="#1867b0" round size="mini"
class="train-card-button"
v-if="activityStatus !== '1' && o.isSign === false"
@click.stop="openRiskText(o)">
我要报名
</van-button>
<van-button type="primary" color="#dd6363" round size="mini"
v-if="o.isSign === true && moment().valueOf() < moment(activity.activitySignUpEndTime).valueOf()"
style="position: absolute; left: 74%; bottom: 10%; width: 74px; height: 28px"
@click.stop="cancel(o)">
取消报名
</van-button>
<van-button type="primary" color="#dd6363" round size="mini"
class="train-card-button"
v-if="o.isSign === true && moment().valueOf() < moment(activity.activitySignUpEndTime).valueOf()"
@click.stop="cancel(o)">
取消报名
</van-button>
<image v-if="activityStatus !== '1' && o.isSign === true && moment().valueOf() >= moment(activity.activitySignUpEndTime).valueOf()"
style="position: absolute; left: 77%; top: 58%;"
src="/assets/mobile/svg/train/sign_up.svg"></image>
<div class="train-card-status"
v-if="activityStatus !== '1' && o.isSign === true && moment().valueOf() >= moment(activity.activitySignUpEndTime).valueOf()">
<image src="/assets/mobile/svg/train/sign_up.svg"></image>
</div>
</div>
<!-- <div @click="trainClick(o)" v-if="activityStatus === '1'"-->
<!-- style="text-align: center; line-height: 40px; width: 40px; height: 40px;display: inline-block; font-size: 14px;-->
<!-- position: absolute; right: -10px; top: 8%; background-color: #00c698; border-radius: 7px; color: white">-->
<!-- 签到-->
<!-- </div>-->
<!-- <div @click="trainClick(o)" v-if="activityStatus === '1'"-->
<!-- style="text-align: center; line-height: 40px; width: 40px; height: 40px;display: inline-block; font-size: 14px;-->
<!-- position: absolute; right: -10px; top: 8%; background-color: #00c698; border-radius: 7px; color: white">-->
<!-- 签到-->
<!-- </div>-->
</div>
</template>
</div>
@@ -383,7 +427,8 @@ layout("/mobile/platform.html"){
<van-field label="联系方式" required :rules="[{ required: true, message: '请填写联系方式' }]"
placeholder="请填写联系方式" v-model="formData.mobile"></van-field>
<template v-if="this.choose.courseIsLimitApply">
<van-field label="报名时段" required :rules="[{ required: true, message: '请选择报名时段' }]"
<van-field label="报名时段" required
:rules="[{ required: true, message: '请选择报名时段' }]"
readonly @click="showCoursePicker = true;getCourseTimeSelectList(choose);"
placeholder="请选择报名时段" v-model="formData.courseTimeName"></van-field>
<van-popup v-model="showCoursePicker" position="bottom">
@@ -410,17 +455,21 @@ layout("/mobile/platform.html"){
</van-action-sheet>-->
<van-popup class="joinPopup" position="right" v-model:show="remarkShow">
<van-nav-bar @click-left="remarkShow = false" fixed left-arrow placeholder :title="clickCourseRemark.courseName"></van-nav-bar>
<van-nav-bar @click-left="remarkShow = false" fixed left-arrow placeholder
:title="clickCourseRemark.courseName"></van-nav-bar>
<van-tabs v-model="remarkActive" @change="remarkActiveClick">
<van-tab title="详细信息">
<div class="remark-content" v-html="courseRemark" @click="remarkClick"></div>
</van-tab>
<van-tab title="报名人员">
<van-dropdown-menu active-color="#1989fa">
<van-dropdown-item v-model="registerForm.unionId" @change="getSignUsers" :options="unionList"></van-dropdown-item>
<van-dropdown-item v-model="registerForm.sex" @change="getSignUsers" :options="sexList"></van-dropdown-item>
<van-dropdown-item v-model="registerForm.unionId" @change="getSignUsers"
:options="unionList"></van-dropdown-item>
<van-dropdown-item v-model="registerForm.sex" @change="getSignUsers"
:options="sexList"></van-dropdown-item>
</van-dropdown-menu>
<van-search v-model="registerForm.searchKeyword" placeholder="请输入姓名查询" @search="getSignUsers"></van-search>
<van-search v-model="registerForm.searchKeyword" placeholder="请输入姓名查询"
@search="getSignUsers"></van-search>
<table class="table-class" v-if="signUsers && signUsers.length > 0">
<thead>
<tr>
@@ -438,10 +487,10 @@ layout("/mobile/platform.html"){
</tbody>
</table>
<van-empty
v-else
class="custom-image"
image="https://img01.yzcdn.cn/vant/custom-empty-image.png"
description="暂无报名人员"
v-else
class="custom-image"
image="https://img01.yzcdn.cn/vant/custom-empty-image.png"
description="暂无报名人员"
></van-empty>
</van-tab>
</van-tabs>
@@ -463,8 +512,12 @@ layout("/mobile/platform.html"){
<div>
<van-tabbar v-model="tarBarActive">
<van-tabbar-item icon="home-o" replace @click="pjaxReplace('/platform/mobile/trainSignUpActivity/trainList')">活动报名</van-tabbar-item>
<van-tabbar-item icon="manager-o" replace @click="pjaxReplace('/platform/mobile/trainSignUpActivity/trainList?type=my')">我的活动</van-tabbar-item>
<van-tabbar-item icon="home-o" replace
@click="pjaxReplace('/platform/mobile/trainSignUpActivity/trainList')">活动报名
</van-tabbar-item>
<van-tabbar-item icon="manager-o" replace
@click="pjaxReplace('/platform/mobile/trainSignUpActivity/trainList?type=my')">我的活动
</van-tabbar-item>
</van-tabbar>
</div>
</div>
@@ -573,24 +626,24 @@ layout("/mobile/platform.html"){
this.signUsers = data
},
tabClick(name, title) {
if(this.courseType === '0' &&　this.activityStatus !== '1') {
if (this.courseType === '0' && this.activityStatus !== '1') {
this.tableData.courseList = this.tempArray.courseList.filter(o => o.assort === title)
} else {
this.tableData.courseList = this.tempArray.courseList.filter(o => o.assort === title && o.courseType === this.courseType)
}
},
calcSignUpCount(o) {
if(o.reserveMode === 2) {
if (o.reserveMode === 2) {
let lave = 0
let lave2 = 0
if(o.hasRegisterNum < o.coursePeopleNumber) {
if (o.hasRegisterNum < o.coursePeopleNumber) {
lave = o.coursePeopleNumber - o.hasRegisterNum
lave2 = o.courseReservedNumber
} else {
lave = 0
lave2 = (o.coursePeopleNumber + o.courseReservedNumber) - o.hasRegisterNum
}
let str = "（<span style='color: red'>余" + lave +"</span>/" + o.coursePeopleNumber + "人"
let str = "（<span style='color: red'>余" + lave + "</span>/" + o.coursePeopleNumber + "人"
+ "，<span style='color: red'>候补余" + lave2 + "</span>/" + o.courseReservedNumber + "人）"
return str
} else {
@@ -598,7 +651,7 @@ layout("/mobile/platform.html"){
return "（<span style='color: #ff8400'>无名额限制</span>/已报<span style='color: red'>" + o.hasRegisterNum + "</span>人）"
} else {
let lave = o.coursePeopleNumber - (o.hasRegisterNum + o.courseReservedNumber)
return "（<span style='color: red'>余" + lave +"</span>/" + o.coursePeopleNumber + "人）"
return "（<span style='color: red'>余" + lave + "</span>/" + o.coursePeopleNumber + "人）"
}
}
},
@@ -654,7 +707,7 @@ layout("/mobile/platform.html"){
clickCourseId: o.courseId,
id: o.id,
})
if(resp.code === 0) {
if (resp.code === 0) {
vant.Dialog.alert({message: '签到成功'})
await this.pageData()
o.isAttend = true
@@ -725,11 +778,11 @@ layout("/mobile/platform.html"){
reject([])
})
})*/
geolocation.getCurrentPosition(function(status,result){
if(status === 'complete'){
geolocation.getCurrentPosition(function (status, result) {
if (status === 'complete') {
//alert(result.position)
locations = result.position
}else{
} else {
}
});
},
@@ -769,13 +822,13 @@ layout("/mobile/platform.html"){
await this.getCourseTimeSelectList(o)
}
if(res.code !== 0) {
if (res.code !== 0) {
vant.Dialog.alert({
title: '提示',
message: res.msg,
confirmButtonColor: '#1867b0'
})
if(res.code !== 3) {
if (res.code !== 3) {
return
}
}
@@ -800,14 +853,14 @@ layout("/mobile/platform.html"){
this.joinPopup = true
},
async getCourseTimeSelectList(o) {
const resp = await $.post('/platform/mobile/trainSignUpActivity/getCourseTimeSelectList',{courseId: o.id})
const resp = await $.post('/platform/mobile/trainSignUpActivity/getCourseTimeSelectList', {courseId: o.id})
if (resp.code === 0) {
this.courseTimeSelectList = resp.data
} else {
this.$toast.fail("获取时段信息失败，请联系管理员")
}
},
onCourseConfirm(val){
onCourseConfirm(val) {
this.formData.activityCourseId = val.value
this.$set(this.formData, "activityCourseId", val.value)
this.$set(this.formData, "courseTimeName", val.text.substring(0, 12))
@@ -825,7 +878,7 @@ layout("/mobile/platform.html"){
//获取家属是多少人
let per = 0
this.dynamicColumnsData.forEach(item => {
if(item.columnCode === 'xdqsrs') {
if (item.columnCode === 'xdqsrs') {
per += Number(item.columnValue)
}
})
@@ -834,7 +887,7 @@ layout("/mobile/platform.html"){
courseId: this.choose.id,
currentFamilyNumber: per,
})
if(res.code !== 0) {
if (res.code !== 0) {
vant.Dialog.alert({
title: '提示',
message: res.msg,
@@ -845,7 +898,7 @@ layout("/mobile/platform.html"){
let flag = this.choose.courseIsLimitApply
if (flag) {
const resp = await $.post('/platform/mobile/trainSignUpActivity/validateSourceSignUp',{activityCourseId: this.formData.activityCourseId})
const resp = await $.post('/platform/mobile/trainSignUpActivity/validateSourceSignUp', {activityCourseId: this.formData.activityCourseId})
if (resp.code !== 0) {
vant.Dialog.alert({
title: '温馨提示',
@@ -902,14 +955,14 @@ layout("/mobile/platform.html"){
}
this.popupShow = true
},
showRemark(o){
showRemark(o) {
this.remarkShow = true
this.clickCourseRemark = o
this.courseRemark = o.remarks
},
remarkClick(event){
remarkClick(event) {
//如果点击的是图片
if(event.target.tagName === 'IMG'){
if (event.target.tagName === 'IMG') {
vant.ImagePreview([event.target.src])
}
},
@@ -926,7 +979,7 @@ layout("/mobile/platform.html"){
scrollWheel: true,
})
AMap.plugin('AMap.Geolocation', function() {
AMap.plugin('AMap.Geolocation', function () {
geolocation = new AMap.Geolocation({
// 是否使用高精度定位，默认：true
enableHighAccuracy: true,
@@ -979,7 +1032,7 @@ layout("/mobile/platform.html"){
this.tableData = resp.data
this.assortList = Array.from(new Set(this.tableData.courseList.map(o => o.assort).filter(o => o !== '' && o !== undefined)))
this.tempArray = clone(this.tableData)
if(this.assortList.length > 0 && this.activityStatus !== '1') {
if (this.assortList.length > 0 && this.activityStatus !== '1') {
this.tableData.courseList = this.tableData.courseList.filter(o => o.assort === this.assortList[0])
}
const type = this.trainTypeList.find(o => o.code === this.tableData.trainType)
@@ -1034,8 +1087,8 @@ layout("/mobile/platform.html"){
this.tableData.courseList = []
this.startLoading()
}
if(this.assortList.length > 0 && this.activityStatus !== '1') {
if(value === '0') {
if (this.assortList.length > 0 && this.activityStatus !== '1') {
if (value === '0') {
this.tableData.courseList = this.tempArray.courseList.filter(o => o.assort === this.assort)
} else {
this.tableData.courseList = this.tempArray.courseList.filter(item => item.courseType === value && item.assort === this.assort)
@@ -1054,7 +1107,7 @@ layout("/mobile/platform.html"){
this.activity = resp.data
}
},
async getUnionList(){
async getUnionList() {
const {data} = await $.get("/platform/vi/common/unions")
data.forEach(v => {
v.text = v.unionname