first commit
This commit is contained in:
那些花儿
@@ -0,0 +1,272 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
.list-card {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.list-card-body {
|
||||
width: calc(100% - 140px);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.list-card-body .title {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
.list-card-body .time {
|
||||
color: #9a9696;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.list-card-body .footer {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.list-card-body .footer .tag {
|
||||
border: 1px solid transparent;
|
||||
padding: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar title="活动列表" @click-left="historyBack" left-arrow left-text="返回" placeholder fixed></van-nav-bar>
|
||||
<van-sticky offset-top="46px">
|
||||
<van-dropdown-menu>
|
||||
<year-van-dropdown-item :num="5" @change="doSearch" v-model="pageForm.year"></year-van-dropdown-item>
|
||||
<van-dropdown-item :options="stateList" @change="doSearch" v-model="pageForm.state"></van-dropdown-item>
|
||||
<van-dropdown-item :options="isEnrolledOptions" @change="doSearch" v-model="pageForm.isEnrolledText"></van-dropdown-item>
|
||||
</van-dropdown-menu>
|
||||
</van-sticky>
|
||||
|
||||
<van-pull-refresh v-model="refreshing" @refresh="doSearch" style="min-height: calc(100vh - 94px); background: #f1f1f1">
|
||||
<van-list v-if="tableData && tableData.length>0" v-model="loading" :finished="finished" finished-text="" @load="pageData">
|
||||
<div class="list-card" v-for="item in tableData" :key="item.id" @click="openDetail(item)">
|
||||
<div class="list-card-img">
|
||||
<img :src="item.cover" alt="" />
|
||||
</div>
|
||||
<div class="list-card-body">
|
||||
<div class="title">{{item.name}}</div>
|
||||
<div class="time">{{item.startTime + ' 至 ' + item.endTime}}</div>
|
||||
<div class="footer">
|
||||
<span
|
||||
class="tag"
|
||||
v-if="$moment(item.applyStartTime).valueOf() > $moment().valueOf()"
|
||||
style="color: var(--color-primary); border: 1px solid var(--color-primary)"
|
||||
>
|
||||
未开始报名
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="tag"
|
||||
v-else-if="$moment(item.applyEndTime).valueOf() > $moment().valueOf() && $moment().valueOf() > $moment(item.applyStartTime).valueOf()"
|
||||
style="color: var(--color-primary); border: 1px solid var(--color-primary)"
|
||||
>
|
||||
报名进行中
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="tag"
|
||||
v-else-if="$moment(item.applyEndTime).valueOf() < $moment().valueOf() && $moment().valueOf() < $moment(item.startTime).valueOf()"
|
||||
style="color: var(--color-primary); border: 1px solid var(--color-primary)"
|
||||
>
|
||||
报名已结束
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="tag"
|
||||
v-else-if="$moment(item.startTime).valueOf() < $moment().valueOf() && $moment().valueOf() < $moment(item.endTime).valueOf()"
|
||||
style="color: var(--color-primary); border: 1px solid var(--color-primary)"
|
||||
>
|
||||
活动进行中
|
||||
</span>
|
||||
|
||||
<span class="tag" v-else-if="$moment().valueOf() > $moment(item.endTime).valueOf()" style="color: red; border: 1px solid red">
|
||||
活动已结束
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</van-list>
|
||||
<van-empty description="" v-else></van-empty>
|
||||
</van-pull-refresh>
|
||||
|
||||
<van-popup :style="{ height: '100%',width: '100%'}" position="right" v-model="viewShow">
|
||||
<mobile-culture-apply-user :id="viewData.id" @back="back" @submit_back="submit_back" ref="viewInfo"></mobile-culture-apply-user>
|
||||
</van-popup>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<!--#include("mobileCultureApplyUser.js"){}#-->
|
||||
new Vue({
|
||||
el: "#app",
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
finished: false,
|
||||
loading: false,
|
||||
refreshing: false,
|
||||
pageForm: {
|
||||
state: 2,
|
||||
isEnrolledText: 0,
|
||||
year: new Date().getFullYear(),
|
||||
pageNumber: 1,
|
||||
pageSize: 5,
|
||||
totalCount: 0
|
||||
},
|
||||
yearList: [],
|
||||
isEnrolledOptions: [
|
||||
{ value: 0, text: "未报名" },
|
||||
{ value: 1, text: "已报名" }
|
||||
],
|
||||
stateList: [
|
||||
{ value: 1, text: "全部" },
|
||||
{ value: 2, text: "报名中" },
|
||||
{ value: 3, text: "报名已结束" }
|
||||
],
|
||||
subLoading: false,
|
||||
viewShow: false,
|
||||
viewData: {}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
"mobile-culture-apply-user": MOBILE_CULTURE_APPLY_USER
|
||||
},
|
||||
methods: {
|
||||
pageData() {
|
||||
this.loading = true
|
||||
const loading = createListLoading()
|
||||
const pageForm = {
|
||||
...this.pageForm,
|
||||
isEnrolled: this.pageForm.isEnrolledText === 1
|
||||
}
|
||||
this.$axios
|
||||
.post("/platform/activity/culture/applyUser/pageData", pageForm)
|
||||
.then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.tableData = this.tableData.concat(res.data.list)
|
||||
this.pageForm.totalCount = res.data.totalCount
|
||||
if (this.tableData.length >= res.data.totalCount) {
|
||||
this.finished = true
|
||||
}
|
||||
this.pageForm.pageNumber++
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
loading.close()
|
||||
this.loading = false
|
||||
this.refreshing = false
|
||||
})
|
||||
},
|
||||
|
||||
openDetail(row) {
|
||||
this.$axios.post('/platform/activity/basic/scope/getScopeUser',{activityGroupId:row.groupId}).then(res=>{
|
||||
if(res.code===0){
|
||||
if(res.data>0){
|
||||
this.$pjaxReplace("/platform/h5/activity/culture/signUp?id=" + row.id)
|
||||
}else{
|
||||
this.$toast('您没有权限参加此活动')
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
submit_back(id, countUser) {
|
||||
this.tableData.map((t) => {
|
||||
if (t.id === id) {
|
||||
t.countUser = countUser
|
||||
}
|
||||
})
|
||||
this.viewShow = false
|
||||
this.$toast.success("报名成功")
|
||||
},
|
||||
back() {
|
||||
this.viewShow = false
|
||||
},
|
||||
openAudit(row) {
|
||||
this.viewData = row
|
||||
this.viewShow = true
|
||||
setTimeout(() => {
|
||||
this.$refs.viewInfo.getActivityInfo()
|
||||
}, 500)
|
||||
},
|
||||
async doAdd(row) {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "提示",
|
||||
message: "确认要报名吗?"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/activity/culture/applyUser/singleSignUp", { activityId: row.id }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.loading({
|
||||
duration: 0,
|
||||
forbidClick: true,
|
||||
message: "加载中...."
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.$toast.clear()
|
||||
this.$toast.success(res.msg)
|
||||
this.doSearch()
|
||||
this.subLoading = false
|
||||
}, 1000)
|
||||
} else {
|
||||
this.subLoading = false
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
async doDelete(row) {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "提示",
|
||||
message: "确认要取消报名吗?"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/activity/culture/applyUser/cancelSignUp", { activityId: row.id }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.loading({
|
||||
duration: 0,
|
||||
forbidClick: true,
|
||||
message: "加载中...."
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.$toast.clear()
|
||||
this.$toast.success(res.msg)
|
||||
this.doSearch()
|
||||
this.subLoading = false
|
||||
}, 1000)
|
||||
} else {
|
||||
this.$toast.fail(res.msg)
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
doSearch() {
|
||||
this.tableKey = new Date().getTime()
|
||||
this.pageForm.pageNumber = 1
|
||||
this.pageForm.totalCount = 0
|
||||
this.tableData = []
|
||||
this.pageData()
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,334 @@
|
||||
var MOBILE_CULTURE_APPLY_USER = {
|
||||
template: `
|
||||
<div>
|
||||
<van-nav-bar :title="title" @click-left="back" fixed left-arrow left-text="返回"
|
||||
placeholder></van-nav-bar>
|
||||
<div class="activity_img_back">
|
||||
<van-image :src="viewData.cover" height="200"
|
||||
width="100%"></van-image>
|
||||
</div>
|
||||
<van-cell-group class="mt10" inset>
|
||||
<van-cell :value="viewData.name" title="活动名称"></van-cell>
|
||||
<van-cell :value="viewData.address" title="活动地址"></van-cell>
|
||||
|
||||
<van-cell v-if="viewData.userNumberLimit!=null">
|
||||
<template #title>
|
||||
<span v-if="viewData.userNumberLimit===1">
|
||||
活动限制人数
|
||||
</span>
|
||||
<span v-else-if="viewData.userNumberLimit===2">
|
||||
本工会限制名额
|
||||
</span>
|
||||
</template>
|
||||
<template>
|
||||
<span v-if="viewData.userNumberLimit===1">
|
||||
<span style="color: orange">{{viewData.totalUserNumberLimit }}</span>人
|
||||
</span>
|
||||
<span v-else="viewData.userNumberLimit===2">
|
||||
<span style="color: orange">{{viewData.unionLimitNum }}</span>人
|
||||
</span>
|
||||
</template>
|
||||
</van-cell>
|
||||
<van-cell title="当前活动报名" v-if="viewData.signUpMethod!=null">
|
||||
<template>
|
||||
<span style="color: red">{{viewData.tissuePersonList.length}}</span>人
|
||||
</template>
|
||||
</van-cell>
|
||||
<van-cell title="报名方式" v-if="viewData.signUpMethod">
|
||||
<template>
|
||||
<span v-if="viewData.signUpMethod===1">个人报名</span>
|
||||
<span v-if="viewData.signUpMethod===2">分工会报名</span>
|
||||
<span v-if="viewData.signUpMethod===3">组队报名</span>
|
||||
</template>
|
||||
</van-cell>
|
||||
<van-cell title="组队人数" v-if="viewData.signUpMethod==3">
|
||||
<span style="color: red"> {{viewData.teamNum}}</span>人
|
||||
|
||||
</van-cell>
|
||||
|
||||
<van-cell title="活动内容" v-if="viewData.projectTypeCode!=='50004'">
|
||||
<template #label>
|
||||
<span style="white-space: pre-line">
|
||||
{{viewData.activityContent}}
|
||||
</span>
|
||||
</template>
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
|
||||
<van-cell-group class="mt5" inset>
|
||||
<van-cell class="regCell" title="报名人员">
|
||||
<template #label>
|
||||
<div>
|
||||
<span v-if="viewData.userNumberLimit===1">
|
||||
本活动限制总报名人数：（{{viewData.totalUserNumberLimit}}）人
|
||||
</span>
|
||||
<span v-else-if="viewData.userNumberLimit===2">
|
||||
当前分工会报名限额 <span style="color: orange">（{{viewData.limitUnion.limitNum}}）人</span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="mt5" v-loading="tagCloseable">
|
||||
<div v-if="registerList && registerList.length>0">
|
||||
<template v-for="item in registerList">
|
||||
<van-tag closeable type="success"
|
||||
:plain="false"
|
||||
@close="removeRegUser(item)" style="margin: 5px;font-size: 13px;">
|
||||
<span style="margin: 5px;">{{item.userName}}</span>
|
||||
</van-tag>
|
||||
</template>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div style="text-align: center;margin-top: 20px;">
|
||||
无报名人员
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt5" style="text-align: right"
|
||||
v-if="$moment(viewData.applyStartTime).valueOf() < $moment().valueOf() &&
|
||||
$moment().valueOf() < $moment(viewData.applyEndTime).valueOf()">
|
||||
<van-button @click="openUserActionSheet" size="mini"
|
||||
type="primary" style="font-size: 15px;height:25px;margin: 5px">
|
||||
<span>选择报名人员</span>
|
||||
</van-button>
|
||||
</div>
|
||||
</template>
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
|
||||
<van-action-sheet class="userActionPopup" title="选择报名人员" v-model="userActionSheet">
|
||||
<van-search @search="onSearchUser" placeholder="请输入姓名搜索" show-action
|
||||
v-model="searchKey">
|
||||
<template #action>
|
||||
<div @click="onSearchUser(searchKey)">搜索</div>
|
||||
</template>
|
||||
|
||||
</van-search>
|
||||
<template v-if="searchLoading">
|
||||
<van-loading size="24px" vertical>搜索中...</van-loading>
|
||||
</template>
|
||||
<div>
|
||||
<div class="van-action-sheet__content mt5"
|
||||
v-if="searchUserList && searchUserList.length>0">
|
||||
|
||||
<template>
|
||||
<template v-for="item in searchUserList"
|
||||
v-if="!registerList.map(v=>v.id).includes(item.id)">
|
||||
<button @click="searchUserAdd(item)"
|
||||
class="van-action-sheet__item van-hairline--bottom">
|
||||
<span class="van-action-sheet__name">{{item.userName}}（{{item.loginName}}）</span>
|
||||
</button>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
</div>
|
||||
<van-empty v-else image="/assets/platform/plugins/vant-green/images/nodata/nodata.png" description="暂无数据"></van-empty>
|
||||
</div>
|
||||
</van-action-sheet>
|
||||
|
||||
<div style="margin: 15px">
|
||||
<van-button @click="doSave()" block style="border-radius: 10px;"
|
||||
type="primary">
|
||||
提 交
|
||||
</van-button>
|
||||
</div>
|
||||
</div>
|
||||
`,
|
||||
store,
|
||||
props: {
|
||||
id: {
|
||||
value: { type: Object, default: "" }
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: "活动报名",
|
||||
viewData: {},
|
||||
registerList: [],
|
||||
addRegisterList: [],
|
||||
userActionSheet: false,
|
||||
searchKey: "",
|
||||
searchUserList: [],
|
||||
tagCloseable: true,
|
||||
searchLoading: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async doSave() {
|
||||
if (this.registerList.length === 0) {
|
||||
this.$toast("请添加报名人员后再提交！")
|
||||
return
|
||||
}
|
||||
|
||||
//如果是组队报名
|
||||
if (this.viewData.signUpMethod === 3) {
|
||||
//判断报名了几个人
|
||||
if (this.registerList.length !== this.viewData.teamNum) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "温馨提示",
|
||||
message: "此活动是双人报名模式您需要报名" + this.viewData.teamNum + "人！"
|
||||
})
|
||||
.then(() => {})
|
||||
return
|
||||
}
|
||||
if (!this.registerList.map((v) => v.id).includes(this.$store.state.user.id)) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "温馨提示",
|
||||
message: "此活动是组队模式需要" + this.viewData.teamNum + "个人一起报名！"
|
||||
})
|
||||
.then(() => {})
|
||||
return
|
||||
}
|
||||
|
||||
let arr = []
|
||||
//判断提交的人员当中有没有人报名
|
||||
this.$axios.post("/platform/h5/activity/culture/selectRegisterList", { activityId: this.id }).then((resp) => {
|
||||
this.addRegisterList = resp.data
|
||||
if (this.addRegisterList && this.addRegisterList.length > 0) {
|
||||
this.addRegisterList.forEach((v) => {
|
||||
this.registerList.forEach((r) => {
|
||||
if (v.id === r.id && v.applyUserId !== this.$store.state.user.id) {
|
||||
arr.push(r.userName)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
if (arr && arr.length > 0) {
|
||||
vant.Dialog.alert({
|
||||
title: "温馨提示",
|
||||
message: "【" + arr.toString() + "】已成功报名您无需再报名！"
|
||||
}).then(() => {})
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
const confirm = await this.$dialog.confirm({
|
||||
title: "提示",
|
||||
message: "您确认要报名吗？"
|
||||
})
|
||||
if (confirm === "confirm") {
|
||||
const loading = this.$toast.loading({
|
||||
message: "报名中...",
|
||||
forbidClick: true,
|
||||
overlay: true,
|
||||
duration: 0
|
||||
})
|
||||
const params = {
|
||||
activityId: this.viewData.id,
|
||||
personIds: JSON.stringify(this.registerList.map((v) => v.id))
|
||||
}
|
||||
this.$axios.post("/platform/activity/culture/applyUser/doSaveUnionRegister", params).then((resp) => {
|
||||
if (resp.code === 0) {
|
||||
setTimeout(() => {
|
||||
loading.close()
|
||||
this.$emit("submit_back", this.viewData.id, this.registerList.length)
|
||||
}, 1000)
|
||||
} else {
|
||||
this.$toast.fail(resp.msg)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
searchUserAdd(item) {
|
||||
const { id, userName } = item
|
||||
this.registerList.push({ id, userName })
|
||||
this.$toast.success("添加成功")
|
||||
},
|
||||
onSearchUser(val) {
|
||||
if (!val) {
|
||||
this.$toast.fail("请输入搜索条件")
|
||||
return
|
||||
}
|
||||
this.searchLoading = true
|
||||
this.$axios
|
||||
.post("/platform/h5/activity/culture/searchNoRegisterUser", {
|
||||
activityId: this.viewData.id,
|
||||
searchKey: val
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.code === 0) {
|
||||
this.searchLoading = false
|
||||
this.searchUserList = resp.data.list
|
||||
} else {
|
||||
this.$toast.fail(resp.msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
openUserActionSheet() {
|
||||
this.searchKey = ""
|
||||
this.searchUserList = []
|
||||
this.userActionSheet = true
|
||||
},
|
||||
async removeRegUser(item) {
|
||||
if (this.$store.state.user.id === item.id) {
|
||||
this.$toast.fail("自己不能删除")
|
||||
return
|
||||
}
|
||||
const confirm = await this.$dialog.confirm({
|
||||
title: "提示",
|
||||
message: "您确认要移除吗？"
|
||||
})
|
||||
if (confirm === "confirm") {
|
||||
const index = this.registerList.findIndex((v) => v.id === item.id)
|
||||
this.registerList.splice(index, 1)
|
||||
}
|
||||
},
|
||||
back() {
|
||||
this.$emit("back")
|
||||
},
|
||||
getRegisterUser() {
|
||||
this.$axios.post("/platform/h5/activity/culture/selectRegisterList", { activityId: this.id }).then((resp) => {
|
||||
if (resp.code === 0) {
|
||||
if (this.viewData.signUpMethod === 3) {
|
||||
this.registerList = resp.data.filter((v) => v.applyUserId === this.$store.state.user.id)
|
||||
} else {
|
||||
this.registerList = resp.data
|
||||
}
|
||||
this.addRegisterList = resp.data
|
||||
if (this.registerList.length > 0) {
|
||||
this.tagCloseable = false
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
getActivityInfo() {
|
||||
this.$toast.loading({
|
||||
message: "加载中...",
|
||||
forbidClick: true
|
||||
})
|
||||
this.getRegisterUser()
|
||||
this.$axios.post("/platform/activity/culture/infoManage/findOne", { id: this.id }).then((res) => {
|
||||
if (res.data) {
|
||||
res.data.billFiles = JSON.parse(res.data.billFiles)
|
||||
res.data.photoFiles = JSON.parse(res.data.photoFiles)
|
||||
res.data.otherFiles = JSON.parse(res.data.otherFiles)
|
||||
res.data.unionUserNumberLimit = JSON.parse(res.data.unionUserNumberLimit)
|
||||
if (!this.$store.state.user.union.id) {
|
||||
this.$toast.fail("您的所属工会信息缺失，请联系管理员")
|
||||
return
|
||||
}
|
||||
if (res.data.userNumberLimit === 2) {
|
||||
const unionLimit = res.data.unionUserNumberLimit.find((v) => v.id === this.$store.state.user.union.id)
|
||||
res.data.unionLimitNum = unionLimit.limitNum
|
||||
}
|
||||
this.viewData = res.data
|
||||
|
||||
if (this.viewData.signUpMethod === 3 && this.registerList.length === 0) {
|
||||
this.registerList.push({
|
||||
id: this.$store.state.user.id,
|
||||
userName: this.$store.state.user.username
|
||||
})
|
||||
}
|
||||
|
||||
setTimeout(() => {
|
||||
this.$toast.clear()
|
||||
}, 1000)
|
||||
} else {
|
||||
this.viewData = {}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,694 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
.title {
|
||||
padding: 10px;
|
||||
font-size: 1.2em;
|
||||
font-weight: bold;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.info-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20px 15px;
|
||||
border-bottom: 1px solid #ededed;
|
||||
column-gap: 10px;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.left-tag-title::before {
|
||||
content: "";
|
||||
width: 5px;
|
||||
background: var(--color-primary);
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.users {
|
||||
padding: 10px;
|
||||
margin-top: 10px;
|
||||
border-top: 1px solid #e8e0e0;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.users-title {
|
||||
font-size: 1.1em;
|
||||
position: relative;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.users-content {
|
||||
padding: 10px;
|
||||
overflow-x: auto;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.users-content .users-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
width: 80px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.block {
|
||||
padding: 10px;
|
||||
margin-top: 10px;
|
||||
border-top: 1px solid #e8e0e0;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.notice {
|
||||
padding: 10px;
|
||||
margin-top: 10px;
|
||||
border-top: 1px solid #e8e0e0;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.notice-title {
|
||||
font-size: 1.1em;
|
||||
position: relative;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.notice-content {
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.notice-content img {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
|
||||
.footer {
|
||||
position: fixed;
|
||||
background: #ffffff;
|
||||
height: 56px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.footer .bottom-button {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: rgb(255, 255, 255);
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.form-create-h5 {
|
||||
background-color: #ffffff;
|
||||
margin-top: 10px;
|
||||
padding: 10px 10px 56px 10px;
|
||||
}
|
||||
|
||||
.form-create-h5 .el-form {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.form-create-h5 .el-col-12 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.form-create-h5 .el-row--flex.is-align-middle {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.form-create-h5 .el-form-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.form-create-h5 .el-form-item .el-form-item__label {
|
||||
width: 100% !important;
|
||||
text-align: left !important;
|
||||
color: #000;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.form-create-h5 .el-form-item .el-form-item__content {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
|
||||
.form-create-h5 .el-radio-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 20px;
|
||||
}
|
||||
|
||||
.form-create-h5 .el-radio-group label {
|
||||
width: 100%;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar @click-left="historyBack" placeholder fixed left-arrow left-text="返回" placeholder
|
||||
title="活动详情"></van-nav-bar>
|
||||
|
||||
<div style="background: #ededed; padding-bottom: 56px">
|
||||
<van-image :src="viewData.cover"></van-image>
|
||||
<div class="title">{{viewData.name}}</div>
|
||||
<div class="info">
|
||||
<div class="info-item">
|
||||
<van-icon name="underway-o"></van-icon>
|
||||
<div>{{viewData.startTime}}至{{viewData.endTime}}</div>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<van-icon name="location-o"></van-icon>
|
||||
<div>{{viewData.address}}</div>
|
||||
</div>
|
||||
<div class="info-item" v-if="viewData.userNumberLimit===1">
|
||||
<van-icon name="location-o"></van-icon>
|
||||
活动限制人数
|
||||
<span>{{viewData.totalUserNumberLimit}}人</span>
|
||||
</div>
|
||||
<div class="info-item" v-if="viewData.userNumberLimit===2">
|
||||
<van-icon name="location-o"></van-icon>
|
||||
本工会限制名额
|
||||
<span>{{viewData.unionLimitNum}}人</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<van-icon name="location-o"></van-icon>
|
||||
报名方式：
|
||||
<span v-if="viewData.signUpMethod===1" style="color: var(--color-primary)">个人报名</span>
|
||||
<span v-if="viewData.signUpMethod===2" style="color: var(--color-primary)">分工会报名</span>
|
||||
<span v-if="viewData.signUpMethod===3" style="color: var(--color-primary)">组队报名</span>
|
||||
</div>
|
||||
<div class="info-item" v-if="viewData.signUpMethod==3">
|
||||
<van-icon name="location-o"></van-icon>
|
||||
组队人数：
|
||||
<span style="color: var(--color-primary)">{{viewData.teamNum}}</span>
|
||||
人
|
||||
</div>
|
||||
<!-- <div class="info-item" v-if="viewData.signUpMethod==1">-->
|
||||
<!-- <van-icon name="location-o"></van-icon>-->
|
||||
<!-- 报名人数：-->
|
||||
<!-- <span style="color: var(--color-primary)">2</span>-->
|
||||
<!-- 人-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
|
||||
<div class="notice">
|
||||
<div class="notice-title left-tag-title">活动详情</div>
|
||||
<rich-text :value="viewData.activityContent" :height="300"></rich-text>
|
||||
</div>
|
||||
|
||||
<!-- 个人报名 啥也不要-->
|
||||
<template v-if="viewData.signUpMethod===1" class="block"></template>
|
||||
|
||||
<!-- 组队报名-->
|
||||
<div v-if="viewData.signUpMethod===2" class="block">
|
||||
<div class="notice-title left-tag-title">
|
||||
选择组队队友，组队人数
|
||||
<span style="color: red">{{viewData.teamNum}}</span>
|
||||
人
|
||||
</div>
|
||||
|
||||
<span v-if="!isApplyUser" class="text-primary">如需取消报名，请联系报名人。</span>
|
||||
<div style="margin-top: 10px">
|
||||
<el-select
|
||||
v-if="isApplyUser && inApplyTime"
|
||||
v-model="searchTeammateUserId"
|
||||
filterable
|
||||
clearable
|
||||
remote
|
||||
reserve-keyword
|
||||
placeholder="请输入关键词"
|
||||
:remote-method="queryTeammate"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in teammateOptions"
|
||||
:key="item.userId"
|
||||
:label="item.userName + '(' + item.loginName + ')'"
|
||||
:value="item.userId"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<el-button v-if="isApplyUser && inApplyTime" class="ml5" type="primary" icon="el-icon-plus"
|
||||
@click="addTeamUser">添加
|
||||
</el-button>
|
||||
|
||||
<el-table :data="teamUsers" class="mt10" border>
|
||||
<el-table-column label="序号" type="index" width="60px"></el-table-column>
|
||||
<el-table-column prop="userName" label="姓名"></el-table-column>
|
||||
<el-table-column prop="loginName" label="工号"></el-table-column>
|
||||
<!-- <el-table-column prop="sex" label="性别"></el-table-column>-->
|
||||
<!-- <el-table-column prop="unitName" label="单位"></el-table-column>-->
|
||||
<!-- <el-table-column prop="mobile" label="手机号"></el-table-column>-->
|
||||
<el-table-column prop="applyUserId" label="标识">
|
||||
<template slot-scope="{row}">
|
||||
<!-- v-if="scope.row.applyUserId===scope.row.userId"-->
|
||||
<el-tag size="mini" v-if="row.applyUserId==row.userId">报名人</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="100px"
|
||||
v-if="(isApplyUser || teamUsers.length===0) && inApplyTime">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="danger"
|
||||
size="mini"
|
||||
@click="removeTeamUser(scope.$index)"
|
||||
v-if="scope.row.applyUserId!==scope.row.userId"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-create-h5" v-if="isCustomForm">
|
||||
<div class="notice-title left-tag-title">填写报名信息</div>
|
||||
<form-create :value.sync="dynamicFormData" v-model="fapi" :rule="formCreateRule"
|
||||
:option="formCreateOption"></form-create>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer">
|
||||
<div class="bottom-button" style="background: var(--color-primary)" v-if="!isSignUp && inApplyTime"
|
||||
@click="onConfirm">
|
||||
<span>立即报名</span>
|
||||
<span style="font-size: 12px; margin-top: 5px">{{viewData.applyEndTime}}截止报名</span>
|
||||
</div>
|
||||
|
||||
<div class="bottom-button" style="background: var(--color-primary)" v-if="isSignUp && inApplyTime"
|
||||
@click="onConfirmAgain">
|
||||
<span>重新提交</span>
|
||||
<span style="font-size: 12px; margin-top: 5px">{{viewData.applyEndTime}}截止报名</span>
|
||||
</div>
|
||||
|
||||
<div class="bottom-button" style="background: red" v-if="isSignUp && inApplyTime" @click="onCancel">
|
||||
<span>取消报名</span>
|
||||
<span style="font-size: 12px; margin-top: 5px">{{viewData.applyEndTime}}截止报名</span>
|
||||
</div>
|
||||
|
||||
<div class="bottom-button" v-if="$moment(viewData.endTime).valueOf() < $moment().valueOf()">活动已结束</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
id: GetQueryString("id"),
|
||||
viewData: {},
|
||||
signUpInfo: {},
|
||||
|
||||
dynamicFormData: {},
|
||||
formCreateRule: [],
|
||||
formCreateOption: {},
|
||||
fapi: null,
|
||||
|
||||
//搜索框
|
||||
searchTeammateUserId: null,
|
||||
//搜索框选新娘
|
||||
teammateOptions: [],
|
||||
//表格用户
|
||||
teamUsers: [],
|
||||
//是否报名
|
||||
isSignUp: false
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
isCustomForm() {
|
||||
return this.viewData && this.viewData.formConfig != null && this.viewData.formConfig !== ""
|
||||
},
|
||||
//是否报名人
|
||||
isApplyUser() {
|
||||
if (this.teamUsers) {
|
||||
return this.teamUsers.every((v) => v.applyUserId === this.$store.state.user.id)
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
},
|
||||
//是否在活动报名时间内
|
||||
inApplyTime() {
|
||||
if (this.viewData) {
|
||||
const now = new Date().getTime()
|
||||
const start = this.$moment(this.viewData.applyStartTime).valueOf()
|
||||
const end = this.$moment(this.viewData.applyEndTime).valueOf()
|
||||
return now >= start && now <= end
|
||||
}
|
||||
return false
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
init() {
|
||||
if (this.id) {
|
||||
this.$axios.post("/platform/activity/culture/infoManage/activityInfo", {id: this.id}).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.viewData = res.data
|
||||
if (this.viewData.formConfig) {
|
||||
this.formCreateRule = formCreate.parseJson(this.viewData.formConfig.rule)
|
||||
this.formCreateOption = formCreate.parseJson(this.viewData.formConfig.options)
|
||||
}
|
||||
this.listTeamUser()
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
//查询报名人员
|
||||
listTeamUser() {
|
||||
this.$axios.post("/platform/activity/culture/applyUser/listTeamUser", {activityId: this.id}).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.isSignUp = res.data.length > 0
|
||||
this.teamUsers = res.data
|
||||
this.defaultAddSelf()
|
||||
this.customFormInit()
|
||||
}
|
||||
})
|
||||
},
|
||||
//表单回显
|
||||
customFormInit() {
|
||||
if (this.teamUsers && this.teamUsers.length > 0) {
|
||||
const self = this.teamUsers.find((v) => v.userId === this.$store.state.user.id)
|
||||
if (self && this.isCustomForm) {
|
||||
this.dynamicFormData = self.dynamicFormData
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
//组队和个人报名默认增加自己
|
||||
defaultAddSelf() {
|
||||
if (this.teamUsers.length === 0 && [1, 2].includes(this.viewData.signUpMethod)) {
|
||||
this.teamUsers.push({
|
||||
userId: this.$store.state.user.id,
|
||||
userName: this.$store.state.user.username,
|
||||
loginName: this.$store.state.user.loginname,
|
||||
sex: this.$store.state.user.sex,
|
||||
unitName: this.$store.state.user?.unit?.name,
|
||||
mobile: this.$store.state.user.mobile,
|
||||
applyUserId: this.$store.state.user.id
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
//提交报名
|
||||
async onConfirm() {
|
||||
if (this.isCustomForm && this.fapi) {
|
||||
let formValid = false
|
||||
try {
|
||||
await this.fapi.validate()
|
||||
formValid = true
|
||||
} catch (e) {
|
||||
formValid = false
|
||||
}
|
||||
if (!formValid) {
|
||||
this.$toast('请填写报名信息后再提交')
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
//组队
|
||||
if (this.viewData.signUpMethod === 2) {
|
||||
//组队人数判断
|
||||
if (this.teamUsers.length === 0) {
|
||||
this.$toast("请添加队友后再提交！")
|
||||
return
|
||||
}
|
||||
if (this.teamUsers.length < this.viewData.teamNum) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "您选择的人数小于" + this.viewData.teamNum + "人，请重新选择！"
|
||||
})
|
||||
.then(() => {
|
||||
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.teamUsers.length > this.viewData.teamNum) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "您选择的人数大于" + this.viewData.teamNum + "人，请重新选择！"
|
||||
})
|
||||
.then(() => {
|
||||
|
||||
})
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
//分工会
|
||||
if (this.viewData.signUpMethod === 3) {
|
||||
if (this.teamUsers.length === 0) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "请添加报名人员后再提交！"
|
||||
})
|
||||
.then(() => {
|
||||
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.teamUsers.length > this.viewData.teamNum) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "您选择的人数大于" + this.viewData.teamNum + "人，请重新选择！"
|
||||
})
|
||||
.then(() => {
|
||||
|
||||
})
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
let formData = {
|
||||
activityId: this.id
|
||||
}
|
||||
if (this.isCustomForm) {
|
||||
formData.ext = JSON.stringify(this.fapi.formData())
|
||||
}
|
||||
if (this.viewData.signUpMethod === 2 || this.viewData.signUpMethod === 3) {
|
||||
formData.teamUserIds = JSON.stringify(this.teamUsers.map((v) => v.userId))
|
||||
}
|
||||
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "提示",
|
||||
message: "确定提交报名信息吗？"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/activity/culture/applyUser/signUp", formData).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.success(res.msg)
|
||||
this.listTeamUser()
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
async onConfirmAgain() {
|
||||
if (this.isCustomForm && this.fapi) {
|
||||
let formValid = false
|
||||
try {
|
||||
await this.fapi.validate()
|
||||
formValid = true
|
||||
} catch (e) {
|
||||
formValid = false
|
||||
}
|
||||
if (!formValid) return
|
||||
}
|
||||
|
||||
//组队
|
||||
if (this.viewData.signUpMethod === 2) {
|
||||
//组队人数判断
|
||||
if (this.teamUsers.length === 0) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "请添加队友后再提交！"
|
||||
})
|
||||
.then(() => {
|
||||
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.teamUsers.length < this.viewData.teamNum) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "您选择的人数小于" + this.viewData.teamNum + "人，请重新选择！"
|
||||
})
|
||||
.then(() => {
|
||||
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.teamUsers.length > this.viewData.teamNum) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "您选择的人数大于" + this.viewData.teamNum + "人，请重新选择！"
|
||||
})
|
||||
.then(() => {
|
||||
|
||||
})
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
//分工会
|
||||
if (this.viewData.signUpMethod === 3) {
|
||||
if (this.teamUsers.length === 0) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "请添加报名人员后再提交！"
|
||||
})
|
||||
.then(() => {
|
||||
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.teamUsers.length > this.viewData.teamNum) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "您选择的人数大于" + this.viewData.teamNum + "人，请重新选择！"
|
||||
})
|
||||
.then(() => {
|
||||
|
||||
})
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
let formData = {
|
||||
activityId: this.id,
|
||||
isAgain: true
|
||||
}
|
||||
if (this.isCustomForm) {
|
||||
formData.ext = JSON.stringify(this.fapi.formData())
|
||||
}
|
||||
if (this.viewData.signUpMethod === 2 || this.viewData.signUpMethod === 3) {
|
||||
formData.teamUserIds = JSON.stringify(this.teamUsers.map((v) => v.userId))
|
||||
}
|
||||
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "提示",
|
||||
message: "确定重新提交报名信息吗？"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/activity/culture/applyUser/signUp", formData).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.success(res.msg)
|
||||
this.listTeamUser()
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
//取消报名
|
||||
onCancel() {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "提示",
|
||||
message: "确定取消报名吗？"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/activity/culture/applyUser/cancelSignUp", {activityId: this.id}).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.success(res.msg)
|
||||
this.listTeamUser()
|
||||
this.fapi.resetFields()
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
//查询队友信息
|
||||
queryTeammate(val) {
|
||||
if (val) {
|
||||
this.$axios.post("/platform/activity/culture/applyUser/queryTeammate", {keyword: val}).then((res) => {
|
||||
if (res.code === 0) {
|
||||
res.data.map(v => {
|
||||
v.applyUserId = this.$store.state.user.id
|
||||
})
|
||||
this.teammateOptions = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
//添加队友
|
||||
addTeamUser() {
|
||||
if (!this.searchTeammateUserId) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "请先选择后再添加!"
|
||||
})
|
||||
.then(() => {
|
||||
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.teamUsers.some((v) => v.userId === this.searchTeammateUserId)) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "请勿重复添加!"
|
||||
})
|
||||
.then(() => {
|
||||
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.teamUsers.length >= this.viewData.teamNum) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "已满员!"
|
||||
})
|
||||
.then(() => {
|
||||
|
||||
})
|
||||
return
|
||||
}
|
||||
this.teamUsers.push(this.teammateOptions.find((v) => v.userId === this.searchTeammateUserId))
|
||||
this.searchTeammateUserId = null
|
||||
},
|
||||
|
||||
//移除队友
|
||||
removeTeamUser(index) {
|
||||
this.teamUsers.splice(index, 1)
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.init()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,131 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar title="列表" fixed placeholder left-text="返回" left-arrow @click-left="historyBack"></van-nav-bar>
|
||||
|
||||
<van-sticky offset-top="46px">
|
||||
<van-tabs v-model="pageForm.category" @change="onRefresh">
|
||||
<van-tab v-for="item in dict.type.ACTIVITY_QSV_CATEGORY" :name="item.code" :title="item.label" :key="item.code"></van-tab>
|
||||
</van-tabs>
|
||||
</van-sticky>
|
||||
|
||||
<van-pull-refresh v-model="refreshing" @refresh="onRefresh" style="min-height: calc(100vh - 90px)">
|
||||
<van-list v-if="list && list.length>0" v-model="loading" :finished="finished" finished-text="" @load="onLoad">
|
||||
<div v-for="row in list" :key="row.id">
|
||||
<div
|
||||
style="display: flex; padding: 15px; margin: 20px; box-sizing: border-box; background: #ffffff; border-radius: 10px"
|
||||
@click="itemClick(row)"
|
||||
>
|
||||
<div class="list-item-icon" style="width: 96px; height: 80px; flex-shrink: 0">
|
||||
<img src="/assets/mobile/svg/qsv/icon.svg" alt="" style="width: 100%; height: 100%" />
|
||||
</div>
|
||||
<div style="flex-grow: 1; display: flex; flex-direction: column; justify-content: space-around">
|
||||
<div
|
||||
style="
|
||||
font-weight: bolder;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
"
|
||||
>
|
||||
{{row.title}}
|
||||
</div>
|
||||
<div style="font-size: 13px; color: #606266">
|
||||
开始时间：{{row.startTime}}
|
||||
<br />
|
||||
结束时间：{{row.endTime}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</van-list>
|
||||
<van-empty v-if="list.length===0" description="没有更多了"></van-empty>
|
||||
</van-pull-refresh>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
new Vue({
|
||||
el: "#app",
|
||||
dicts: ["ACTIVITY_QSV_CATEGORY"],
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
finished: false,
|
||||
refreshing: false,
|
||||
list: [],
|
||||
pageForm: {
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
category: "QUIZ"
|
||||
},
|
||||
categoryPaths: {
|
||||
QUIZ: "/platform/h5/qsv/quiz",
|
||||
SURVEY: "/platform/h5/qsv/survey",
|
||||
VOTE: "/platform/h5/qsv/vote"
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onLoad() {
|
||||
this.loading = true
|
||||
const loading = createListLoading()
|
||||
this.$axios
|
||||
.post("/platform/h5/qsv/pageData", this.pageForm)
|
||||
.then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.list = this.list.concat(res.data.list)
|
||||
this.pageForm.totalCount = res.data.totalCount
|
||||
if (this.list.length >= this.pageForm.totalCount) {
|
||||
this.finished = true
|
||||
}
|
||||
this.pageForm.pageNumber++
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
loading.close()
|
||||
this.loading = false
|
||||
this.refreshing = false
|
||||
})
|
||||
},
|
||||
onRefresh() {
|
||||
this.pageForm.pageNumber = 1
|
||||
this.list = []
|
||||
this.finished = false
|
||||
this.onLoad()
|
||||
},
|
||||
async itemClick(item) {
|
||||
if (item.groupId) {
|
||||
const { code, data } = await this.$axios.post("/open/common/checkGroupPermission", { groupId: item.groupId })
|
||||
if (code === 0) {
|
||||
if (!data) {
|
||||
this.$toast.fail("您没有权限参与")
|
||||
return
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const { startTime, endTime } = item
|
||||
if (this.$moment(startTime).unix() > this.$moment().unix()) {
|
||||
this.$toast("未开始")
|
||||
return
|
||||
}
|
||||
|
||||
const path = this.categoryPaths[item.category]
|
||||
if (path) {
|
||||
this.$pjaxReplace(path + "?id=" + item.id)
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.onLoad()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,370 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
.container {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.container .title {
|
||||
text-align: center;
|
||||
padding: 20px;
|
||||
background: #ffffff;
|
||||
/*margin: 10px 0;*/
|
||||
margin-bottom: 10px;
|
||||
color: var(--color-primary);
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.container .card {
|
||||
padding: 10px;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.subject {
|
||||
background: #fff;
|
||||
padding: 15px;
|
||||
margin-bottom: 15px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.subject p {
|
||||
font-size: 16px;
|
||||
margin: 20px 0 10px 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.subject .tag {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.timer {
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
background: #fff;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.submit-button {
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.result {
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.button-control {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
column-gap: 20px;
|
||||
background: #fff;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar title="问卷调查" left-arrow @click-left="historyBack" placeholder fixed></van-nav-bar>
|
||||
<div class="container" :style="{'padding-bottom': answerRecord.isFinish ? 0 : '84px'}">
|
||||
<van-sticky offset-top="46px">
|
||||
<!--开启计时 未完成 活动未结束-->
|
||||
<div class="timer" v-if="activity.timeLimit > 0 && !answerRecord.isFinish && !isEnd">⏰{{ remainingTime }}s</div>
|
||||
<h2 class="title">{{ activity.title }}</h2>
|
||||
</van-sticky>
|
||||
|
||||
<div v-if="!answerRecord.isFinish">
|
||||
<div v-for="(subject, index) in subjects" :key="index" class="subject">
|
||||
<p>{{index+1}}、{{ subject.title }}</p>
|
||||
<div class="tag">
|
||||
<van-tag v-if="subject.type === 'checkbox'" type="primary" size="large">多选</van-tag>
|
||||
<van-tag v-if="subject.type === 'radio'" type="primary" size="large">单选</van-tag>
|
||||
<van-tag v-if="subject.score" type="primary" size="large">{{subject.score}}分</van-tag>
|
||||
</div>
|
||||
|
||||
<van-checkbox-group v-model="subject.userSelectOptionIds" :ref="'subject'+subject.id">
|
||||
<van-cell-group>
|
||||
<van-cell
|
||||
v-for="(option,index) in subject.options"
|
||||
clickable
|
||||
:key="option.id"
|
||||
:title="option.text"
|
||||
@click="cellToggle(subject,option.id)"
|
||||
>
|
||||
<template #icon>
|
||||
<van-checkbox
|
||||
:name="option.id"
|
||||
:ref="'option'+option.id"
|
||||
:disabled="answerRecord.isFinish"
|
||||
:shape="subject.type==='checkbox' ? 'square' : 'round'"
|
||||
style="margin-right: 10px"
|
||||
></van-checkbox>
|
||||
</template>
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
</van-checkbox-group>
|
||||
</div>
|
||||
<div class="button-control" v-if="!answerRecord.isFinish">
|
||||
<van-button type="primary" @click="onSubmit" block :disabled="isEnd">{{isEnd ? '已结束' : '提交'}}</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
data() {
|
||||
return {
|
||||
list: [],
|
||||
id: GetQueryString("id"),
|
||||
subjects: [],
|
||||
activity: {},
|
||||
// remainingTime: 0,
|
||||
isFinished: false,
|
||||
answerRecord: {},
|
||||
answerRecordId: null,
|
||||
|
||||
//历史记录
|
||||
historyScores: [],
|
||||
|
||||
//答题用时
|
||||
answerTime: 0
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isEnd() {
|
||||
if (this.activity) {
|
||||
return this.$moment().unix() > this.$moment(this.activity.endTime).unix()
|
||||
}
|
||||
return true
|
||||
},
|
||||
remainingTime() {
|
||||
if (this.activity && this.activity.timeLimit > 0) {
|
||||
return this.activity.timeLimit * 60 - this.answerTime
|
||||
}
|
||||
return 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//获取活动、题目
|
||||
listSubjects() {
|
||||
this.$axios.post("/platform/h5/qsv/quiz/subjects", { activityId: this.id }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.activity = res.data.activity
|
||||
this.subjects = res.data.subjects
|
||||
this.answerRecordId = res.data.answerRecordId
|
||||
this.checkGroupPermission()
|
||||
this.getAnswerRecord()
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//获取回答记录
|
||||
getAnswerRecord() {
|
||||
this.$axios.post("/platform/h5/qsv/quiz/answerRecord", { answerRecordId: this.answerRecordId }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.answerRecord = res.data
|
||||
|
||||
if (this.answerRecord.isFinish || this.$moment().unix() > this.$moment(this.activity.endTime)) {
|
||||
this.$pjaxReplace("/platform/h5/qsv/quiz/result?answerRecordId=" + this.answerRecordId)
|
||||
}
|
||||
|
||||
this.initAnswer()
|
||||
this.checkTimer()
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//答案回显
|
||||
initAnswer() {
|
||||
this.subjects.forEach((subject, subjectIndex) => {
|
||||
if (subject.type === "radio") {
|
||||
this.$refs["subject" + subject.id][0].toggleAll(false)
|
||||
}
|
||||
if (this.answerRecord.optionIds) {
|
||||
this.answerRecord.optionIds[subjectIndex].forEach((optionId) => {
|
||||
this.$refs["option" + optionId][0].toggle()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//答题计时器
|
||||
checkTimer() {
|
||||
if (this.timerInterval) {
|
||||
clearInterval(this.timerInterval)
|
||||
}
|
||||
|
||||
//开启计时
|
||||
const startInterval = () => {
|
||||
this.timerInterval = setInterval(() => {
|
||||
this.answerTime++
|
||||
if (this.activity.timeLimit > 0 && this.answerTime >= this.activity.timeLimit * 60) {
|
||||
clearInterval(this.timerInterval)
|
||||
const loading = this.$toast.loading({
|
||||
message: "答题时间到，自动提交中",
|
||||
forbidClick: true
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.autoSubmit(loading)
|
||||
}, 1500)
|
||||
}
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
if (!this.isEnd && !this.answerRecord.isFinish) {
|
||||
if (this.activity.timeLimit > 0) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "本次答题时间" + this.activity.timeLimit + "分钟，点击确认开始答题"
|
||||
})
|
||||
.then(() => {
|
||||
startInterval()
|
||||
})
|
||||
} else {
|
||||
startInterval()
|
||||
}
|
||||
}
|
||||
|
||||
// if (this.activity.timeLimit > 0 && !this.isEnd) {
|
||||
// if (!this.answerRecord.isFinish) {
|
||||
// this.$dialog
|
||||
// .alert({
|
||||
// title: "提示",
|
||||
// message: "本次答题时间" + this.activity.timeLimit + "分钟，点击确认开始答题"
|
||||
// })
|
||||
// .then(() => {
|
||||
// this.remainingTime = this.activity.timeLimit * 60
|
||||
// this.timerInterval = setInterval(() => {
|
||||
// if (this.remainingTime > 0) {
|
||||
// this.remainingTime--
|
||||
// } else {
|
||||
// clearInterval(this.timerInterval)
|
||||
// const loading = this.$toast.loading({
|
||||
// message: "答题时间到，自动提交中",
|
||||
// forbidClick: true
|
||||
// })
|
||||
// this.autoSubmit(loading)
|
||||
// }
|
||||
// }, 1000)
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
},
|
||||
|
||||
historyScore() {
|
||||
this.$axios.post("/platform/h5/qsv/quiz/historyScore", { activityId: this.activityId }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.historyScores = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//选项点击
|
||||
cellToggle(subject, optionId) {
|
||||
if (this.answerRecord.isFinish) {
|
||||
return
|
||||
}
|
||||
|
||||
if (subject.type === "radio") {
|
||||
this.$refs["subject" + subject.id][0].toggleAll(false)
|
||||
}
|
||||
this.$refs["option" + optionId][0].toggle()
|
||||
},
|
||||
|
||||
//手动提交
|
||||
onSubmit() {
|
||||
if (this.isEnd) {
|
||||
this.$toast("调查已结束")
|
||||
return
|
||||
}
|
||||
|
||||
//提示那些题没有作答
|
||||
for (let i = 0; i < this.subjects.length; i++) {
|
||||
let subject = this.subjects[i]
|
||||
//["radio", "checkbox"].includes(subject.type) &&
|
||||
if (!subject.userSelectOptionIds || subject.userSelectOptionIds.length === 0) {
|
||||
this.$toast.fail("第" + (i + 1) + "题未做答")
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
if (this.timerInterval) {
|
||||
clearInterval(this.timerInterval)
|
||||
}
|
||||
|
||||
this.autoSubmit()
|
||||
},
|
||||
|
||||
//自动提交
|
||||
autoSubmit(loading = null) {
|
||||
this.$axios
|
||||
.post("/platform/h5/qsv/quiz/submitAnswer", {
|
||||
answer: JSON.stringify({
|
||||
activityId: this.id,
|
||||
answerRecordId: this.answerRecordId,
|
||||
subjects: this.subjects.map((subject) => {
|
||||
return {
|
||||
id: subject.id,
|
||||
userSelectOptionIds: ["checkbox", "radio"].includes(subject.type) ? subject.userSelectOptionIds : []
|
||||
}
|
||||
}),
|
||||
answerTime: this.answerTime
|
||||
})
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.success(res.msg)
|
||||
this.$pjaxReplace("/platform/h5/qsv/quiz/result?answerRecordId=" + this.answerRecordId)
|
||||
// this.getAnswerRecord()
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
if (loading) {
|
||||
loading.clear()
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
async checkGroupPermission() {
|
||||
const groupId = this.activity.groupId
|
||||
if (groupId) {
|
||||
const { code, data } = await this.$axios.post("/open/common/checkGroupPermission", { groupId })
|
||||
if (code === 0) {
|
||||
if (!data) {
|
||||
this.$dialog
|
||||
.alert({
|
||||
title: "提示",
|
||||
message: "您没有权限参与"
|
||||
})
|
||||
.then(() => {
|
||||
location.back()
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.timerInterval) {
|
||||
clearInterval(this.timerInterval)
|
||||
}
|
||||
if (this.id) {
|
||||
this.listSubjects()
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,330 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
.container {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.container .title {
|
||||
text-align: center;
|
||||
padding: 20px;
|
||||
background: #ffffff;
|
||||
color: var(--color-primary);
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.container .score {
|
||||
}
|
||||
|
||||
.container .card {
|
||||
padding: 10px;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.subject {
|
||||
background: #fff;
|
||||
padding: 15px;
|
||||
margin-bottom: 15px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.subject p {
|
||||
font-size: 16px;
|
||||
margin: 20px 0 10px 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.subject .tag {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.score-form {
|
||||
background: #ffffff;
|
||||
display: flex;
|
||||
margin-bottom: 10px;
|
||||
border-top: 1px solid #f1f1f1;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.score-form-total {
|
||||
flex: 1;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
padding: 10px 20px 10px 0;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.score-text-news {
|
||||
flex: 1;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.score-font-style {
|
||||
font-size: 32px;
|
||||
color: #ff6a00;
|
||||
word-break: keep-all;
|
||||
line-height: 38px;
|
||||
min-width: 47px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.score-underline {
|
||||
background: url(//image.wjx.cn/images/newimg/score-form/score-underline@2x.png) no-repeat center;
|
||||
background-size: 47px 16px;
|
||||
display: inline-block;
|
||||
height: 16px;
|
||||
width: 47px;
|
||||
margin-top: 7px;
|
||||
}
|
||||
|
||||
.van-checkbox__icon--checked .van-icon {
|
||||
color: #fff !important;
|
||||
background-color: var(--color-primary) !important;
|
||||
border-color: var(--color-primary) !important;
|
||||
}
|
||||
|
||||
.van-checkbox__icon--disabled .van-icon {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.answer-container {
|
||||
padding: 16px;
|
||||
}
|
||||
.correct-answer {
|
||||
color: green;
|
||||
}
|
||||
.incorrect-answer {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.button-control {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
column-gap: 20px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.history-list {
|
||||
background: #f1f1f1;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.history-item {
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
padding: 16px;
|
||||
margin: 20px 10px;
|
||||
box-shadow:
|
||||
8px 8px 16px #d9d9d9,
|
||||
-8px -8px 16px #ffffff;
|
||||
transition: transform 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.history-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.history-header span {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.history-header .tag {
|
||||
margin-left: 8px;
|
||||
color: #fff;
|
||||
padding: 2px 5px;
|
||||
}
|
||||
|
||||
.history-info {
|
||||
font-size: 14px;
|
||||
color: #555;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar title="问卷调查" left-arrow @click-left="historyBack" placeholder fixed></van-nav-bar>
|
||||
<div class="container" :style="{'padding-bottom': answerRecord.isFinish ? 0 : '84px'}">
|
||||
<van-sticky offset-top="46px">
|
||||
<h2 class="title">{{ activity.title }}</h2>
|
||||
<div class="score-form">
|
||||
<div class="score-form-total">
|
||||
<div class="score-font-style">{{totalScore}}</div>
|
||||
<i class="score-underline"></i>
|
||||
</div>
|
||||
</div>
|
||||
</van-sticky>
|
||||
|
||||
<div>
|
||||
<div v-for="(subject, index) in subjects" :key="index" class="subject">
|
||||
<p>{{index+1}}、{{ subject.title }}</p>
|
||||
<div class="tag">
|
||||
<van-tag v-if="subject.type === 'checkbox'" type="primary" size="large">多选</van-tag>
|
||||
<van-tag v-if="subject.type === 'radio'" type="primary" size="large">单选</van-tag>
|
||||
<van-tag v-if="subject.score" type="primary" size="large">{{subject.score}}分</van-tag>
|
||||
</div>
|
||||
|
||||
<van-checkbox-group v-model="subject.userSelectOptionIds" :ref="'subject'+subject.id">
|
||||
<van-cell-group>
|
||||
<van-cell v-for="(option,index) in subject.options" clickable :key="option.id" :title="option.text">
|
||||
<template #title>
|
||||
<span :style="{color : option.isCorrect ? 'green' : ''}">{{option.text}}</span>
|
||||
</template>
|
||||
<template #icon>
|
||||
<van-checkbox
|
||||
:name="option.id"
|
||||
:ref="'option'+option.id"
|
||||
:disabled="answerRecord.isFinish"
|
||||
style="margin-right: 10px"
|
||||
></van-checkbox>
|
||||
</template>
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
</van-checkbox-group>
|
||||
|
||||
<div class="answer-container">
|
||||
<div v-if="answerRecord.extJson?.[subject.id]?.isCorrect" class="correct-answer">
|
||||
<van-icon name="passed"></van-icon>
|
||||
回答正确
|
||||
</div>
|
||||
<div v-else-if="answerRecord.extJson?.[subject.id]" class="incorrect-answer">
|
||||
<van-icon name="close"></van-icon>
|
||||
回答错误
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="button-control">
|
||||
<van-button type="primary" @click="openHistory" block>查看全部答题记录</van-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<van-action-sheet v-model="historyShow" title="历史记录">
|
||||
<div class="history-list">
|
||||
<div v-for="item in historyList" class="history-item">
|
||||
<div class="history-header">
|
||||
<span>{{ item.date }}</span>
|
||||
<van-tag v-if="item.isHighestScore" type="danger" class="tag">最高分</van-tag>
|
||||
<van-tag v-if="item.isLatestScore" type="primary" class="tag">最新得分</van-tag>
|
||||
</div>
|
||||
<div class="history-info">答题分数：{{ item.totalScore }}</div>
|
||||
<div class="history-info">答题用时：{{ item.answerTime | formatSeconds }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</van-action-sheet>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
data() {
|
||||
return {
|
||||
answerRecordId: GetQueryString("answerRecordId"),
|
||||
answerRecord: {},
|
||||
subjects: [],
|
||||
activity: {},
|
||||
list: [],
|
||||
historyShow: false,
|
||||
historyList: []
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
totalScore() {
|
||||
if (!this.answerRecord || !this.answerRecord.extJson) {
|
||||
return 0
|
||||
}
|
||||
let totalScore = 0
|
||||
for (const key in this.answerRecord.extJson) {
|
||||
if (this.answerRecord.extJson.hasOwnProperty(key)) {
|
||||
totalScore += this.answerRecord.extJson[key].score || 0
|
||||
}
|
||||
}
|
||||
return totalScore
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
formatSeconds(seconds) {
|
||||
if (seconds) {
|
||||
const minutes = Math.floor(seconds / 60) // 获取总分钟数
|
||||
const remainingSeconds = seconds % 60 // 获取剩余秒数
|
||||
// 格式化输出，确保秒数始终为两位数
|
||||
return minutes + "分钟" + String(remainingSeconds).padStart(2, "0") + "秒"
|
||||
}
|
||||
return null
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getAnswerResult() {
|
||||
this.$axios.post("/platform/h5/qsv/quiz/answerResult", { answerRecordId: this.answerRecordId }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.subjects = res.data.subjects
|
||||
this.activity = res.data.activity
|
||||
this.getAnswerRecord()
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//获取回答记录
|
||||
getAnswerRecord() {
|
||||
this.$axios.post("/platform/h5/qsv/quiz/answerRecord", { answerRecordId: this.answerRecordId }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.answerRecord = res.data
|
||||
this.initAnswer()
|
||||
}
|
||||
})
|
||||
},
|
||||
//答案回显
|
||||
initAnswer() {
|
||||
this.subjects.forEach((subject, subjectIndex) => {
|
||||
const answer = this.answerRecord.extJson[subject.id]
|
||||
if (["radio", "checkbox"].includes(subject.type)) {
|
||||
this.$nextTick(() => {
|
||||
this.$refs["subject" + subject.id][0].toggleAll(false)
|
||||
})
|
||||
answer?.optionIds.forEach((optionId) => {
|
||||
this.$nextTick(() => {
|
||||
this.$refs["option" + optionId][0].toggle()
|
||||
})
|
||||
})
|
||||
} else if (subject.type === "text") {
|
||||
subject.userFillContent = answer?.text
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
historyBack() {
|
||||
this.$pjaxReplace("/platform/h5/qsv")
|
||||
},
|
||||
|
||||
openHistory() {
|
||||
this.historyShow = true
|
||||
this.$axios.post("/platform/h5/qsv/quiz/historyScore", { activityId: this.activity.id }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.historyList = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getAnswerResult()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,292 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
.container {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.container .title {
|
||||
text-align: center;
|
||||
padding: 20px;
|
||||
background: #ffffff;
|
||||
margin: 0 0 10px 0;
|
||||
}
|
||||
|
||||
.container .card {
|
||||
padding: 10px;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.subject {
|
||||
background: #fff;
|
||||
padding: 15px;
|
||||
margin-bottom: 15px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.subject p {
|
||||
font-size: 16px;
|
||||
margin: 20px 0 10px 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.subject .tag {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.button-control {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
column-gap: 20px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.van-checkbox__icon--checked .van-icon {
|
||||
color: #fff !important;
|
||||
background-color: var(--color-primary) !important;
|
||||
border-color: var(--color-primary) !important;
|
||||
}
|
||||
|
||||
.van-checkbox__icon--disabled .van-icon {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.ui-input-box {
|
||||
border: 1px solid #e3e3e3;
|
||||
margin: 5px 0;
|
||||
background-color: #fff;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.ui-input-box input {
|
||||
background-color: #fff;
|
||||
border: none !important;
|
||||
padding: 10px;
|
||||
font-size: 14px;
|
||||
line-height: 18px;
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
-webkit-appearance: none;
|
||||
resize: none;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar title="问卷调查" left-arrow @click-left="historyBack" placeholder fixed></van-nav-bar>
|
||||
<div class="container" :style="{'padding-bottom': answerRecord.isFinish ? 0 : '84px'}">
|
||||
<h2 class="title">{{ activity.title }}</h2>
|
||||
<div v-if="!isFinished">
|
||||
<div v-for="(subject, index) in subjects" :key="index" class="subject">
|
||||
<p>{{index+1}}、{{ subject.title }}</p>
|
||||
<div class="tag">
|
||||
<van-tag v-if="subject.type === 'checkbox'" type="primary" size="large">多选</van-tag>
|
||||
<van-tag v-if="subject.type === 'radio'" type="primary" size="large">单选</van-tag>
|
||||
<van-tag v-if="subject.score" type="primary" size="large">{{subject.score}}分</van-tag>
|
||||
</div>
|
||||
|
||||
<!--单选、多选-->
|
||||
<van-checkbox-group
|
||||
v-model="subject.userSelectOptionIds"
|
||||
:ref="'subject'+subject.id"
|
||||
v-if="['radio','checkbox'].includes(subject.type)"
|
||||
>
|
||||
<van-cell-group>
|
||||
<van-cell
|
||||
v-for="(option,index) in subject.options"
|
||||
clickable
|
||||
:key="option.id"
|
||||
:title="option.text"
|
||||
@click="cellToggle(subject,option.id)"
|
||||
>
|
||||
<template #icon>
|
||||
<van-checkbox :name="option.id" :ref="'option'+option.id" style="margin-right: 10px"></van-checkbox>
|
||||
</template>
|
||||
<img
|
||||
slot="right-icon"
|
||||
v-if="option.imgUrl"
|
||||
:src="option.imgUrl"
|
||||
alt=""
|
||||
style="width: 40px; height: 40px"
|
||||
@click.stop="previewOptionImg(option.imgUrl)"
|
||||
/>
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
</van-checkbox-group>
|
||||
|
||||
<!--填空题-->
|
||||
<div class="ui-input-box" v-if="subject.type==='text'">
|
||||
<input type="text" v-model="subject.userFillContent" :readonly="answerRecord.isFinish" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="button-control" v-if="!answerRecord.isFinish">
|
||||
<van-button type="primary" @click="onSubmit" block :disabled="isEnd">{{isEnd ? '已结束' : '提交'}}</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
data() {
|
||||
return {
|
||||
list: [],
|
||||
id: null,
|
||||
subjects: [],
|
||||
activity: {},
|
||||
remainingTime: 0,
|
||||
isFinished: false,
|
||||
answerRecord: {},
|
||||
answerRecordId: null
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
isEnd() {
|
||||
if (this.activity) {
|
||||
return this.$moment().unix() > this.$moment(this.activity.endTime).unix()
|
||||
}
|
||||
return true
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
//获取活动、题目
|
||||
listSubjects() {
|
||||
this.$axios.post("/platform/h5/qsv/survey/subjects", { activityId: this.id }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.activity = res.data.activity
|
||||
this.subjects = res.data.subjects
|
||||
this.answerRecordId = res.data.answerRecordId
|
||||
this.getAnswerRecord()
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//获取回答记录
|
||||
getAnswerRecord() {
|
||||
this.$axios.post("/platform/h5/qsv/survey/answerRecord", { answerRecordId: this.answerRecordId }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.answerRecord = res.data
|
||||
if (this.answerRecord.isFinish) {
|
||||
this.$toast.success("您已完成该调查")
|
||||
}
|
||||
this.initAnswer()
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//答案回显
|
||||
initAnswer() {
|
||||
this.subjects.forEach((subject, subjectIndex) => {
|
||||
const answer = this.answerRecord.extJson[subject.id]
|
||||
|
||||
if (["radio", "checkbox"].includes(subject.type)) {
|
||||
this.$refs["subject" + subject.id][0].toggleAll(false)
|
||||
answer?.optionIds.forEach((optionId) => {
|
||||
this.$nextTick(() => {
|
||||
this.$refs["option" + optionId][0].toggle()
|
||||
})
|
||||
})
|
||||
} else if (subject.type === "text") {
|
||||
subject.userFillContent = answer?.text
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//选项点击
|
||||
cellToggle(subject, optionId) {
|
||||
if (this.answerRecord.isFinish) {
|
||||
return
|
||||
}
|
||||
|
||||
if (subject.type === "radio") {
|
||||
this.$refs["subject" + subject.id][0].toggleAll(false)
|
||||
}
|
||||
this.$refs["option" + optionId][0].toggle()
|
||||
},
|
||||
|
||||
//预览图片
|
||||
previewOptionImg(img) {
|
||||
vant.ImagePreview([img])
|
||||
},
|
||||
|
||||
//手动提交
|
||||
onSubmit() {
|
||||
const endTime = this.activity.endTime
|
||||
if (this.isEnd) {
|
||||
this.$toast("调查已结束")
|
||||
return
|
||||
}
|
||||
|
||||
//提示那些题没有作答
|
||||
for (let i = 0; i < this.subjects.length; i++) {
|
||||
const subject = this.subjects[i]
|
||||
if (["radio", "checkbox"].includes(subject.type)) {
|
||||
if (!subject.userSelectOptionIds || subject.userSelectOptionIds.length === 0) {
|
||||
this.$toast.fail("第" + (i + 1) + "题未做答")
|
||||
return
|
||||
}
|
||||
} else if ("text" === subject.type) {
|
||||
if (!subject.userFillContent) {
|
||||
this.$toast.fail("第" + (i + 1) + "题未作答")
|
||||
return
|
||||
}
|
||||
}
|
||||
}
|
||||
this.autoSubmit()
|
||||
},
|
||||
|
||||
//自动提交
|
||||
autoSubmit(loading = null) {
|
||||
this.$axios
|
||||
.post("/platform/h5/qsv/survey/submitAnswer", {
|
||||
answer: JSON.stringify({
|
||||
activityId: this.id,
|
||||
answerRecordId: this.answerRecordId,
|
||||
subjects: this.subjects.map((subject) => {
|
||||
return {
|
||||
id: subject.id,
|
||||
userSelectOptionIds: ["checkbox", "radio"].includes(subject.type) ? subject.userSelectOptionIds : [],
|
||||
userFillContent: subject.type === "text" ? subject.userFillContent : null
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.success(res.msg)
|
||||
this.getAnswerRecord()
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
if (loading) {
|
||||
loading.clear()
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
const id = GetQueryString("id")
|
||||
if (id) {
|
||||
this.id = id
|
||||
this.listSubjects()
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,140 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
<style>
|
||||
.van-tag--default {
|
||||
background-color: #f1f1f1 !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar title="活动列表" @click-left="()=>this.$pjaxReplace('/platform/home')" left-arrow left-text="返回" placeholder fixed></van-nav-bar>
|
||||
<van-sticky offset-top="46px">
|
||||
<van-dropdown-menu>
|
||||
<year-van-dropdown-item :num="5" @change="pageData" v-model="pageForm.year"></year-van-dropdown-item>
|
||||
<van-dropdown-item :options="stateList" @change="pageData"
|
||||
v-model="pageForm.isActivity"></van-dropdown-item>
|
||||
<van-dropdown-item :options="applyStatusOptions" @change="pageData"
|
||||
v-model="pageForm.applyStatus"></van-dropdown-item>
|
||||
</van-dropdown-menu>
|
||||
</van-sticky>
|
||||
|
||||
<div>
|
||||
<van-list :finished="finished" @load="pageData" finished-text="没有更多了" v-if="tableData.length>0"
|
||||
v-model="loading">
|
||||
<div class="table-list">
|
||||
<div :key="row.id" class="table-card" v-for="row in tableData">
|
||||
<van-tag mark size="large" style="position: absolute; right: 0%; top: 5px; z-index: 1">
|
||||
<span style="color: forestgreen"
|
||||
v-if="$moment(row.applyStartTime).valueOf() > $moment().valueOf()">未开始报名</span>
|
||||
<span
|
||||
style="color: forestgreen"
|
||||
v-else-if="$moment(row.applyEndTime).valueOf() > $moment().valueOf() &&
|
||||
$moment().valueOf() > $moment(row.applyStartTime).valueOf()"
|
||||
>
|
||||
报名中
|
||||
</span>
|
||||
<span
|
||||
style="color: #ee1919"
|
||||
v-else-if="$moment(row.applyEndTime).valueOf() < $moment().valueOf() &&
|
||||
$moment().valueOf() < $moment(row.startTime).valueOf()"
|
||||
>
|
||||
报名结束
|
||||
</span>
|
||||
<span
|
||||
style="color: forestgreen"
|
||||
v-else-if="$moment(row.startTime).valueOf() < $moment().valueOf() &&
|
||||
$moment().valueOf() < $moment(row.endTime).valueOf()"
|
||||
>
|
||||
活动进行中
|
||||
</span>
|
||||
<span style="color: #ee1919" v-else-if="$moment().valueOf() > $moment(row.endTime).valueOf()">活动结束</span>
|
||||
</van-tag>
|
||||
<van-image :src="row.image" fit="cover" height="200" v-if="row.image" width="100%"></van-image>
|
||||
<van-cell>
|
||||
<template slot="title">
|
||||
<div class="flex-align margin-top20">
|
||||
<span class="font-size3 bold">{{row.NAME}}</span>
|
||||
</div>
|
||||
</template>
|
||||
</van-cell>
|
||||
<van-cell :value="row.applyStartTime" title="报名开始时间"></van-cell>
|
||||
<van-cell :value="row.applyEndTime" title="报名结束时间"></van-cell>
|
||||
<van-cell class="table-card-footer">
|
||||
<template>
|
||||
<van-button :loading="subLoading" @click="openView(row)" round size="small" type="primary">查 看</van-button>
|
||||
</template>
|
||||
</van-cell>
|
||||
</div>
|
||||
</div>
|
||||
</van-list>
|
||||
<van-empty image="/assets/platform/plugins/vant-green/images/nodata/nodata.png" description="暂无数据"
|
||||
v-else></van-empty>
|
||||
</div>
|
||||
|
||||
<activity_event_notification
|
||||
:event_notification="viewData.eventNotification"
|
||||
:id="viewData.id"
|
||||
ref="eventNotification"
|
||||
></activity_event_notification>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<!--#include("eventNotification.js"){}#-->
|
||||
new Vue({
|
||||
el: "#app",
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
finished: false,
|
||||
loading: false,
|
||||
pageForm: {
|
||||
isActivity: 2,
|
||||
applyStatus: 2,
|
||||
year: new Date().getFullYear(),
|
||||
pageNumber: 1,
|
||||
pageSize: 5,
|
||||
totalCount: 0
|
||||
},
|
||||
yearList: [],
|
||||
applyStatusOptions: [
|
||||
{value: 1, text: "未报名"},
|
||||
{value: 2, text: "已报名"}
|
||||
],
|
||||
stateList: [
|
||||
{value: 1, text: "全部"},
|
||||
{value: 2, text: "报名中"},
|
||||
{value: 3, text: "报名已结束"}
|
||||
],
|
||||
subLoading: false,
|
||||
viewShow: false,
|
||||
viewData: {}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
activity_event_notification: ACTIVITY_EVENT_NOTIFICATION
|
||||
},
|
||||
methods: {
|
||||
openView(row) {
|
||||
this.viewData = row
|
||||
this.$refs.eventNotification.viewShow = true
|
||||
},
|
||||
pageData() {
|
||||
this.loading = true
|
||||
this.$axios.post("/platform/h5/activity/apply/activityData", this.pageForm).then((res) => {
|
||||
this.tableData = res.data
|
||||
|
||||
this.finished = true
|
||||
this.loading = false
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,130 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-sticky>
|
||||
<van-nav-bar
|
||||
@click-left="()=>this.$pjaxReplace('/platform/h5/activity/apply/applyUser')"
|
||||
left-arrow
|
||||
left-text="返回"
|
||||
placeholder
|
||||
title="项目列表"
|
||||
></van-nav-bar>
|
||||
</van-sticky>
|
||||
|
||||
<div>
|
||||
<van-list :finished="finished" @load="pageData" finished-text="没有更多了" v-if="tableData.length>0" v-model="loading">
|
||||
<div class="table-list">
|
||||
<div :key="row.id" class="table-card" v-for="row in tableData">
|
||||
<van-image :src="row.image" fit="cover" height="200" v-if="row.image" width="100%"></van-image>
|
||||
<van-cell>
|
||||
<template slot="title">
|
||||
<div class="flex-align">
|
||||
<span class="font-size3 bold">{{row.allName}}</span>
|
||||
</div>
|
||||
</template>
|
||||
<template #right-icon>
|
||||
<div style="display: flex; justify-content: flex-end" v-if="row.status">
|
||||
<van-tag type="primary" v-if="row.status===1">待审核</van-tag>
|
||||
<van-tag type="success" v-if="row.status===2">已成功报名</van-tag>
|
||||
<van-tag type="danger" v-if="row.status===3">审核不通过</van-tag>
|
||||
</div>
|
||||
</template>
|
||||
</van-cell>
|
||||
<van-cell title="可报队数" v-if="row.eveProjectType==='2'">
|
||||
<template #right-icon>{{ row.restrictTotalTeam }}队</template>
|
||||
</van-cell>
|
||||
<van-cell title="每队可报人数" v-if="row.athletesMaxNum<=99">
|
||||
<template #right-icon>
|
||||
<span v-if="row.athletesMaxNum">{{ row.athletesMaxNum }}人</span>
|
||||
<span v-else-if="row.applyType===1">{{ row.athletesMaxNum * row.restrictTotalTeam}}人</span>
|
||||
<span v-else-if="row.applyType===2&&row.eveProjectType==='1'">{{row.athletesMaxNum}}人</span>
|
||||
<span v-else-if="row.applyType===2&&row.eveProjectType==='2'">
|
||||
{{(row.restrictGirlNum ? row.restrictGirlNum : 0) + (row.restrictBoyNum ? row.restrictBoyNum : 0)}}人
|
||||
</span>
|
||||
<span v-else>暂无</span>
|
||||
</template>
|
||||
</van-cell>
|
||||
<van-cell title="已报名总人数">
|
||||
<template #right-icon>
|
||||
<span v-if="row.successUserApply>0&&row.applyType!==3">{{ row.successUserApply }}人</span>
|
||||
<span v-else-if="JSON.parse(row.applyWay).length===2&&row.applyWay.includes(1)">{{row.totalApplyNum}}人</span>
|
||||
<span v-else-if="row.totalApplyNum>0&&row.applyType===3">{{ row.totalApplyNum }}人</span>
|
||||
<span v-else>0人</span>
|
||||
</template>
|
||||
</van-cell>
|
||||
<van-cell title="已报名人员" v-if="JSON.parse(row.applyWay).length===1">
|
||||
<template #right-icon>
|
||||
<span @click="openApplyUser(row)" v-if="row.userApplyNames">{{ row.userApplyNames}}</span>
|
||||
<span v-else>暂无</span>
|
||||
</template>
|
||||
</van-cell>
|
||||
<!--<van-cell class="table-card-footer">
|
||||
<template>
|
||||
<van-button :loading="subLoading" @click="openView(row)" round
|
||||
size="small"
|
||||
type="primary">
|
||||
报名
|
||||
</van-button>
|
||||
</template>
|
||||
</van-cell>-->
|
||||
</div>
|
||||
</div>
|
||||
</van-list>
|
||||
<van-empty image="/assets/platform/plugins/vant-green/images/nodata/nodata.png" description="暂无数据" v-else></van-empty>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
new Vue({
|
||||
el: "#app",
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
finished: false,
|
||||
loading: false,
|
||||
pageForm: {
|
||||
activityId: GetQueryString("activityId"),
|
||||
pageNumber: 1,
|
||||
pageSize: 5,
|
||||
totalCount: 0
|
||||
},
|
||||
subLoading: false
|
||||
}
|
||||
},
|
||||
components: {},
|
||||
methods: {
|
||||
openApplyUser() {},
|
||||
openView(row) {},
|
||||
pageData() {
|
||||
this.loading = true
|
||||
this.$axios.post("/platform/h5/activity/apply/pageData", { data: JSON.stringify(this.pageForm) }).then((res) => {
|
||||
this.tableData = this.tableData.concat(res.data.list)
|
||||
if (this.tableData.length === res.data.totalCount) {
|
||||
this.finished = true
|
||||
} else {
|
||||
this.pageForm.pageNumber++
|
||||
}
|
||||
this.pageForm.totalCount = res.data.totalCount
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
findOneActivity() {
|
||||
this.$axios.post("/platform/h5/activity/apply/findOneActivity", { activityId: this.pageForm.activityId }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.activityData = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.findOneActivity()
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,36 @@
|
||||
let ACTIVITY_EVENT_NOTIFICATION = {
|
||||
template: `
|
||||
<div>
|
||||
<van-popup :style="{ height: '100%',width: '100%'}" position="right" safe-area-inset-bottom v-model="viewShow">
|
||||
<van-sticky>
|
||||
<van-nav-bar @click-left="viewShow=false" left-arrow left-text="返回" title="活动通知"></van-nav-bar>
|
||||
</van-sticky>
|
||||
<div style="height: calc(100vh - 44px); overflow-y: auto">
|
||||
<div v-html="event_notification"class="paddingX10" style="padding-bottom: 44px;white-space: pre-wrap;overflow-x: hidden" v-if="event_notification"></div>
|
||||
<div v-else>暂无</div>
|
||||
<van-button @click="openReg" block style="position: fixed; bottom: 0;"
|
||||
type="primary">进入报名
|
||||
</van-button>
|
||||
</div>
|
||||
</van-popup>
|
||||
</div>
|
||||
`,
|
||||
props: {
|
||||
event_notification: {
|
||||
value: { type: String, default: "暂无" }
|
||||
},
|
||||
id: {
|
||||
value: { type: String, default: "暂无" }
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
viewShow: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
openReg() {
|
||||
this.$pjaxReplace("/platform/h5/activity/apply/eventList?activityId=" + this.id)
|
||||
}
|
||||
}
|
||||
}
|
||||
+142
@@ -0,0 +1,142 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
<style>
|
||||
.van-image {
|
||||
display: inherit;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-weight: bold;
|
||||
background-color: white;
|
||||
padding: 13px;
|
||||
box-shadow: 0 8px 12px #ebedf0;
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
.van-tabs {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.van-tab {
|
||||
-webkit-flex: none;
|
||||
}
|
||||
|
||||
.van-tab--active {
|
||||
color: #1867b0;
|
||||
}
|
||||
|
||||
.van-tabs__nav--line {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.van-tabs__content {
|
||||
padding: 13px 13px 50px 13px;
|
||||
background-color: white;
|
||||
line-height: 28px;
|
||||
}
|
||||
|
||||
.content_title {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pre_text {
|
||||
white-space: break-spaces;
|
||||
padding-left: 7px;
|
||||
/*margin-top: 30px;*/
|
||||
}
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar
|
||||
title="活动详情"
|
||||
left-text="返回"
|
||||
left-arrow
|
||||
@click-left="$pjaxReplace('/platform/mobile/trainSignUpActivity/trainList')"
|
||||
></van-nav-bar>
|
||||
|
||||
<van-image height="186" src="/assets/mobile/img/trainSignUp/3quhtakfd4heeqsk6irqhft60p.png"></van-image>
|
||||
<div class="title">{{activity.activityName}}</div>
|
||||
|
||||
<van-tabs v-model:active="tabActive" shrink>
|
||||
<van-tab title="详细信息" name="a">
|
||||
<div class="pre_text" v-html="activity.introduce"></div>
|
||||
</van-tab>
|
||||
</van-tabs>
|
||||
|
||||
<van-button @click="toSign" type="primary" block style="position: fixed; bottom: 0; z-index: 2">去报名</van-button>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
new Vue({
|
||||
el: "#app",
|
||||
data() {
|
||||
return {
|
||||
trainType: "培训班",
|
||||
trainTypeList: [],
|
||||
tabActive: "a",
|
||||
activityId: "",
|
||||
activity: {}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async findOne() {
|
||||
const resp = await this.$axios.post("/platform/mobile/trainSignUpActivity/findOne", {
|
||||
id: this.activityId,
|
||||
tabIndex: 0
|
||||
})
|
||||
if (resp.code === 0) {
|
||||
this.activity = resp.data
|
||||
}
|
||||
},
|
||||
async toSign() {
|
||||
const nowTime = this.$moment().unix()
|
||||
if (nowTime < this.$moment(this.activity.activitySignUpStartTime).unix()) {
|
||||
vant.Dialog.alert({
|
||||
title: "提示",
|
||||
message: "活动报名还未开始"
|
||||
})
|
||||
return
|
||||
}
|
||||
if (nowTime > this.$moment(this.activity.activitySignUpEndTime).unix()) {
|
||||
vant.Dialog.alert({
|
||||
title: "提示",
|
||||
message: "活动报名已结束"
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.activity.activityGroupId != null) {
|
||||
const isExist = await this.getScopeUser(this.activity.activityGroupId)
|
||||
if (!isExist) {
|
||||
vant.Dialog.alert({
|
||||
title: "参加人员范围",
|
||||
message: this.activity.activityGroupName
|
||||
})
|
||||
return
|
||||
}
|
||||
}
|
||||
this.$pjaxReplace(
|
||||
"/platform/mobile/trainSignUpActivity/trainInfo?activityId=" +
|
||||
this.activity.id +
|
||||
"&endTime=" +
|
||||
this.activity.activitySignUpEndTime +
|
||||
"&isMySign=" +
|
||||
GetQueryString("isMySign")
|
||||
)
|
||||
},
|
||||
async getScopeUser(activityGroupId) {
|
||||
const resp = await this.$axios.post("/platform/activity/basic/scope/getScopeUser", { activityGroupId: activityGroupId })
|
||||
return resp.data
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.$businessTool.getDictOptions("TRAIN_SIGNUP_TYPE").then((data) => {
|
||||
this.trainTypeList = data
|
||||
})
|
||||
this.activityId = GetQueryString("activityId")
|
||||
this.findOne()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,838 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
<style>
|
||||
.van-card {
|
||||
background: #ffffff;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.van-card__thumb {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.van-card__content > div {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.van-doc-card {
|
||||
margin: 14px;
|
||||
padding: 16px;
|
||||
background-color: #fff;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 8px 12px #ebedf0;
|
||||
line-height: 25px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.van-doc-card-my {
|
||||
margin: 14px;
|
||||
padding: 16px;
|
||||
background-color: #fff;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 8px 12px #ebedf0;
|
||||
line-height: 25px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.train-title {
|
||||
color: grey;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 16px 16px 10px;
|
||||
min-height: 100px;
|
||||
max-height: 360px;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #cccdd1;
|
||||
}
|
||||
|
||||
.time {
|
||||
font-family: -webkit-pictograph, serif;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.popup {
|
||||
width: 90%;
|
||||
max-height: 70%;
|
||||
overflow-y: auto;
|
||||
border-radius: 10px;
|
||||
padding: 2px 10px 12px 10px;
|
||||
}
|
||||
|
||||
.van-card__thumb {
|
||||
width: 35px;
|
||||
height: 38px;
|
||||
margin-right: 20px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.van-card__content {
|
||||
min-height: 30px;
|
||||
}
|
||||
|
||||
.van-card__title {
|
||||
font-weight: bold;
|
||||
font-size: 13px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.van-dropdown-menu__item {
|
||||
flex: auto;
|
||||
}
|
||||
|
||||
.van-empty {
|
||||
background-color: transparent;
|
||||
position: relative;
|
||||
transform: translate(0%, 50%);
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.joinPopup {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #f6f7f9;
|
||||
}
|
||||
|
||||
.join_content {
|
||||
padding: 20px;
|
||||
/*height: calc(100% - 40px - 46px - 60px);*/
|
||||
height: calc(100vh - 46px - 50px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.join_submit {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.van-card-header {
|
||||
padding: 14px 20px;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
box-sizing: border-box;
|
||||
color: #0e78c5;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.van-card-body {
|
||||
padding: 0px 10px 0px 10px;
|
||||
}
|
||||
|
||||
.van-doc-card-two {
|
||||
background-color: #fff;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 8px 12px #ebedf0;
|
||||
line-height: 25px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.footer .van-button {
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.amap-logo {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.amap-copyright {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.van-tabs__nav--complete {
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar
|
||||
:title="trainType + '列表'"
|
||||
left-text="返回"
|
||||
left-arrow
|
||||
@click-left="$pjaxReplace('/platform/mobile/trainSignUpActivity/trainList?isMySign=' + isMySign)"
|
||||
></van-nav-bar>
|
||||
|
||||
<van-sticky>
|
||||
<van-dropdown-menu>
|
||||
<van-dropdown-item @change="tabChange" v-model="activityStatus" :options="activityOptions"></van-dropdown-item>
|
||||
<van-dropdown-item @change="courseChange" v-model="courseType" :options="courseOptions"></van-dropdown-item>
|
||||
</van-dropdown-menu>
|
||||
</van-sticky>
|
||||
|
||||
<van-tabs v-if="activityStatus != '1' && assortList.length > 0" v-model="assort" type="card" style="margin-top: 10px" @click="tabClick">
|
||||
<van-tab v-for="item in assortList" :key="item" :name="item" :title="item"></van-tab>
|
||||
</van-tabs>
|
||||
|
||||
<template>
|
||||
<div id="parentDiv" v-if="tableData.courseList && tableData.courseList.length>0">
|
||||
<template v-for="o in tableData.courseList">
|
||||
<div style="position: relative" :class="activityStatus !== '1' ? 'van-doc-card' : 'van-doc-card-my'">
|
||||
<div>
|
||||
<van-tag :plain="false" type="primary" size="medium">{{getCourseTypeName(o)}}</van-tag>
|
||||
<span style="font-weight: bold; font-size: 14px">
|
||||
{{o.courseName}}
|
||||
<span v-if="activityStatus !== '1'">
|
||||
<span v-html="calcSignUpCount(o)"></span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="train-title">校  区：</span>
|
||||
<span>{{o.campus}}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="train-title">活动地点：</span>
|
||||
<span>{{o.courseLocation}}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="train-title">联 系 人：</span>
|
||||
<span>{{o.courseInstructor}}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="train-title">活动时间：</span>
|
||||
<span v-if="o.courseTimeList && o.courseTimeList.length > 1" @click="trainClick(o)" style="color: #1867b0">点我查看</span>
|
||||
<span @click="trainClick(o)" v-if="o.courseTimeList && o.courseTimeList.length === 1" style="color: #1867b0">
|
||||
{{o.courseTimeList[0].courseStartTime.substring(11, 19) + ' ~ ' + o.courseTimeList[0].courseEndTime.substring(11, 19)}}
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<span @click.stop="showPic(tableData.wechat)" v-if="o.isSign === true && tableData.wechat" style="color: #dd6363">
|
||||
点我查看微信群二维码
|
||||
</span>
|
||||
</div>
|
||||
<van-button
|
||||
type="primary"
|
||||
round
|
||||
size="mini"
|
||||
v-if="activityStatus !== '1' && o.isSign === false"
|
||||
style="position: absolute; left: 74%; bottom: 10%; width: 74px; height: 28px"
|
||||
@click.stop="signUp(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>
|
||||
|
||||
<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/trainSignUp/sign_up.svg"
|
||||
></image>
|
||||
|
||||
<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>
|
||||
<van-empty v-else image="/assets/platform/plugins/vant-green/images/nodata/nodata.png" description="暂无数据"></van-empty>
|
||||
</template>
|
||||
|
||||
<van-popup v-model:show="popupShow" class="popup">
|
||||
<div id="map" v-if="course.isMobileSign === true && course.signType === 3" style="width: 100%; height: 250px"></div>
|
||||
|
||||
<van-card
|
||||
:title="item.courseStartTime.substring(0, 10) + '（' +
|
||||
getWeek(item.courseStartTime.substring(0, 10)) + '）'"
|
||||
v-for="(item,index) in qdArray"
|
||||
:key="index"
|
||||
thumb="/assets/mobile/svg/trainSignUp/qd1.svg"
|
||||
>
|
||||
<template #desc>
|
||||
<div style="margin-top: 7px">{{item.courseStartTime.substring(11, 19) + ' ~ ' + item.courseEndTime.substring(11, 19)}}</div>
|
||||
<div v-if="item.courseLocationCoordinates && item.isMobileSign === true && activityStatus === '1'">
|
||||
<van-button
|
||||
type="primary"
|
||||
color="#1867b0"
|
||||
round
|
||||
size="mini"
|
||||
@click.stop="showQRCode(item, 2)"
|
||||
v-if="(item.isAttend === true && course.giftType === 1 && item.state === 1)
|
||||
|| ($moment().unix() > $moment(item.courseEndTime).unix() && item.state === 3 && item.isAttend === true && course.giftType === 1)"
|
||||
style="position: absolute; right: 65px; top: 25%; width: 60px; height: 25px"
|
||||
>
|
||||
礼品码
|
||||
</van-button>
|
||||
<van-button
|
||||
type="primary"
|
||||
color="#e1e1e1"
|
||||
round
|
||||
size="mini"
|
||||
v-if="(item.isAttend === false && findTime(item) === false && item.state === 1)
|
||||
|| ($moment().unix() > $moment(item.courseEndTime).unix() && item.state === 3 && item.isAttend === false)"
|
||||
style="position: absolute; right: 0; top: 25%; width: 60px; height: 25px"
|
||||
>
|
||||
未签到
|
||||
</van-button>
|
||||
<van-button
|
||||
type="primary"
|
||||
color="#1867b0"
|
||||
round
|
||||
size="mini"
|
||||
v-if="(item.isAttend === false && findTime(item) === true && item.state === 1)
|
||||
|| ($moment().unix() > $moment(item.courseEndTime).unix() && item.state === 3 && item.isAttend === false)"
|
||||
style="position: absolute; right: 0; top: 25%; width: 60px; height: 25px"
|
||||
@click.stop="signIn(item)"
|
||||
>
|
||||
签 到
|
||||
</van-button>
|
||||
<van-button
|
||||
type="primary"
|
||||
color="#61ce98"
|
||||
round
|
||||
size="mini"
|
||||
v-if="(item.isAttend === true && item.state === 1)
|
||||
|| ($moment().unix() > $moment(item.courseEndTime).unix() && item.state === 3 && item.isAttend === true)"
|
||||
style="position: absolute; right: 0; top: 25%; width: 60px; height: 25px"
|
||||
>
|
||||
已签到
|
||||
</van-button>
|
||||
</div>
|
||||
</template>
|
||||
</van-card>
|
||||
</van-popup>
|
||||
|
||||
<van-popup class="joinPopup" position="right" v-model:show="joinPopup">
|
||||
<van-nav-bar @click-left="joinPopup = false" left-text="返回" fixed left-arrow placeholder title="活动报名"></van-nav-bar>
|
||||
<div class="join_content">
|
||||
<van-form @submit="joinSubmit" :show-error-message="false">
|
||||
<div class="van-doc-card-two" style="margin: 0 0 16px 0">
|
||||
<div></div>
|
||||
<div class="van-card-header">基础信息</div>
|
||||
<div class="van-card-body">
|
||||
<van-field name="userName" label="姓名" readonly v-model="formData.userName"></van-field>
|
||||
<van-field name="loginName" label="工号" readonly v-model="formData.loginName"></van-field>
|
||||
<van-field name="unitName" label="所在单位" readonly v-model="formData.unitName"></van-field>
|
||||
<van-field name="unionName" label="所属工会" readonly v-model="formData.unionName"></van-field>
|
||||
<van-field name="sex" label="性别" readonly v-model="formData.sex"></van-field>
|
||||
<van-field
|
||||
label="联系方式"
|
||||
required
|
||||
name="mobile"
|
||||
:rules="[{ required: true, message: '请填写联系方式' }]"
|
||||
placeholder="请填写联系方式"
|
||||
v-model="formData.mobile"
|
||||
></van-field>
|
||||
<train-dynamic-form v-model="dynamicColumnsData" ref="trainDynamicForm"></train-dynamic-form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<van-button class="join_submit" type="primary">提交报名</van-button>
|
||||
</div>
|
||||
</van-form>
|
||||
</div>
|
||||
</van-popup>
|
||||
</div>
|
||||
|
||||
<script src="${base!}/assets/platform/plugins/jr-qrcode/jr-qrcode.js"></script>
|
||||
<script>
|
||||
let locations = null
|
||||
let map = null
|
||||
let geolocation = null
|
||||
new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
tableData: [],
|
||||
formData: {},
|
||||
assort: "",
|
||||
assortList: [],
|
||||
allColumnsData: [],
|
||||
dynamicColumnsData: [],
|
||||
trainType: "培训班",
|
||||
trainTypeList: [],
|
||||
actionShow: false,
|
||||
timeList: [],
|
||||
activityId: "",
|
||||
activityStatus: "0",
|
||||
joinPopup: false,
|
||||
popupShow: false,
|
||||
courseText: "",
|
||||
qdInfoList: [],
|
||||
course: [],
|
||||
qdArray: [],
|
||||
activityOptions: [
|
||||
{ text: "全部", value: "0" },
|
||||
{ text: "我报名的", value: "1" }
|
||||
],
|
||||
courseOptions: [],
|
||||
courseType: "0",
|
||||
tempArray: [],
|
||||
activitySignUpStartTime: null,
|
||||
choose: {},
|
||||
activity: "",
|
||||
isMySign: 0
|
||||
}
|
||||
},
|
||||
components: {
|
||||
"train-dynamic-form": httpVueLoader("/components/module/trainSignUp/TrainDynamicForm.vue")
|
||||
},
|
||||
methods: {
|
||||
tabClick(name, title) {
|
||||
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) {
|
||||
let lave = 0
|
||||
let lave2 = 0
|
||||
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 +
|
||||
"人" +
|
||||
"，<span style='color: red'>候补余" +
|
||||
lave2 +
|
||||
"</span>/" +
|
||||
o.courseReservedNumber +
|
||||
"人）"
|
||||
return str
|
||||
} else {
|
||||
if (o.coursePeopleNumber === 0) {
|
||||
return "（<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 + "人）"
|
||||
}
|
||||
}
|
||||
},
|
||||
getCourseTypeName(o) {
|
||||
const b = this.courseOptions.find((item) => item.value === o.courseType)
|
||||
return b ? b.text : ""
|
||||
},
|
||||
//二维码
|
||||
showQRCode(item, type) {
|
||||
const o = {
|
||||
userId: item.userId,
|
||||
signId: item.id,
|
||||
activityId: item.activityId,
|
||||
activityCourseId: item.activityCourseId,
|
||||
isMobileSign: item.isMobileSign,
|
||||
signType: item.signType,
|
||||
isReceiveGift: item.isReceiveGift,
|
||||
giftType: item.giftType,
|
||||
type: type
|
||||
}
|
||||
// 生成二维码的 base64 编码
|
||||
const content = jrQrcode.getQrBase64(JSON.stringify(o))
|
||||
vant.ImagePreview([content])
|
||||
},
|
||||
showPic(url) {
|
||||
vant.ImagePreview([url])
|
||||
},
|
||||
findTime(o) {
|
||||
const today = this.$moment().format("YYYY-MM-DD")
|
||||
return o.courseStartTime.substr(0, 10) === today
|
||||
},
|
||||
findQd() {
|
||||
const today = this.$moment().format("YYYY-MM-DD")
|
||||
const day = this.qdInfoList.find((item) => {
|
||||
return item.courseStartTime.substr(0, 10) === today
|
||||
})
|
||||
if (day === undefined) {
|
||||
return 3
|
||||
} else {
|
||||
return day.isAttend ? 2 : 1
|
||||
}
|
||||
},
|
||||
async signIn(o) {
|
||||
if (o.signType === 1) {
|
||||
vant.Dialog.alert({ message: "功能马上推出，敬请期待！" })
|
||||
return
|
||||
}
|
||||
if (o.signType === 2) {
|
||||
this.showQRCode(o, 1)
|
||||
}
|
||||
if (o.signType === 3) {
|
||||
const start = new Date(o.courseStartTime).getTime() - 1000 * 60 * 30
|
||||
const end = new Date(o.courseEndTime).getTime()
|
||||
|
||||
const now = new Date().getTime()
|
||||
if (now < start || now > end) {
|
||||
vant.Toast("请在规定时间签到")
|
||||
return
|
||||
}
|
||||
const that = this
|
||||
geolocation.getCurrentPosition(async function (status, result) {
|
||||
if (status === "complete") {
|
||||
locations = [result.position.getLng(), result.position.getLat()]
|
||||
//用户当前位置
|
||||
const userPoint = new AMap.LngLat(result.position.getLng(), result.position.getLat())
|
||||
//课程位置
|
||||
const coursePoint = new AMap.LngLat(that.course.courseLocationCoordinates[0], that.course.courseLocationCoordinates[1])
|
||||
const distance = Math.round(userPoint.distance(coursePoint))
|
||||
if (distance > 250) {
|
||||
vant.Toast("请在250米内签到")
|
||||
return
|
||||
}
|
||||
const array = [result.position.getLng(), result.position.getLat()]
|
||||
const resp = await this.$axios.post("/platform/mobile/trainSignUpActivity/doQd", {
|
||||
id: o.id,
|
||||
courseId: that.course.id,
|
||||
point: JSON.stringify(array)
|
||||
})
|
||||
if (resp.code === 0) {
|
||||
await that.pageData()
|
||||
}
|
||||
vant.Toast(resp.msg)
|
||||
that.popupShow = false
|
||||
} else {
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
//获取当前坐标点
|
||||
getPoint() {
|
||||
/*return new Promise((resolve, reject) => {
|
||||
window.navigator.geolocation.getCurrentPosition(position => {
|
||||
pointArray = [position.coords.longitude, position.coords.latitude]
|
||||
resolve(pointArray)
|
||||
}, error => {
|
||||
vant.Toast(error.message)
|
||||
pointArray = []
|
||||
reject([])
|
||||
})
|
||||
})*/
|
||||
geolocation.getCurrentPosition(function (status, result) {
|
||||
if (status === "complete") {
|
||||
//alert(result.position)
|
||||
locations = result.position
|
||||
} else {
|
||||
}
|
||||
})
|
||||
},
|
||||
cancel(o) {
|
||||
vant.Dialog.confirm({
|
||||
title: "温馨提示",
|
||||
message: "您确定要<span style='color: red'>取消【" + o.courseName + "】</span>吗？",
|
||||
confirmButtonColor: "#1867b0"
|
||||
})
|
||||
.then(async () => {
|
||||
const resp = await this.$axios.post("/platform/mobile/trainSignUpActivity/cancelSignUp", {
|
||||
activityId: o.activityId,
|
||||
courseId: o.id
|
||||
})
|
||||
vant.Toast(resp.msg)
|
||||
if (resp.code === 0) {
|
||||
await this.pageData()
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
async signUp(o) {
|
||||
this.choose = o
|
||||
|
||||
const res = await this.$axios.post("/platform/mobile/trainSignUpActivity/validateSignUp", {
|
||||
courseId: o.id
|
||||
})
|
||||
if (res.code !== 0) {
|
||||
vant.Dialog.alert({
|
||||
title: "提示",
|
||||
message: res.msg
|
||||
})
|
||||
if (res.code !== 3) {
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
this.formData = {
|
||||
userName: this.$store.state.user.username,
|
||||
loginName: this.$store.state.user.loginname,
|
||||
mobile: this.$store.state.user.mobile,
|
||||
sex: this.$store.state.user.sex,
|
||||
birthday: this.$store.state.user.birthday,
|
||||
unionName: this.$store.state.user.union.name,
|
||||
unitName: this.$store.state.user.unit.name
|
||||
}
|
||||
this.$set(this.formData, "activityId", o.activityId)
|
||||
this.$set(this.formData, "courseId", o.id)
|
||||
|
||||
const column = this.allColumnsData.find((x) => x.id === o.courseType)
|
||||
this.dynamicColumnsData = column ? column.trainMobileSignColumnList : []
|
||||
this.dynamicColumnsData.forEach((item) => {
|
||||
item.columnValue = ""
|
||||
})
|
||||
this.joinPopup = true
|
||||
},
|
||||
async joinSubmit() {
|
||||
let valid = false
|
||||
try {
|
||||
await this.$refs.trainDynamicForm.$refs.form.validate()
|
||||
valid = true
|
||||
} catch (e) {
|
||||
valid = false
|
||||
}
|
||||
if (!valid) return
|
||||
//获取家属是多少人
|
||||
let per = 0
|
||||
this.dynamicColumnsData.forEach((item) => {
|
||||
if (item.columnCode === "xdqsrs") {
|
||||
per += Number(item.columnValue)
|
||||
}
|
||||
})
|
||||
const res = await this.$axios.post("/platform/mobile/trainSignUpActivity/validateSignUp", {
|
||||
courseId: this.choose.id,
|
||||
currentFamilyNumber: per
|
||||
})
|
||||
if (res.code !== 0) {
|
||||
vant.Dialog.alert({
|
||||
title: "提示",
|
||||
message: res.msg
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
vant.Dialog.confirm({
|
||||
title: "温馨提示",
|
||||
message: "您确定要选择【" + this.choose.courseName + "】吗？"
|
||||
})
|
||||
.then(async () => {
|
||||
const toast = vant.Toast.loading({
|
||||
duration: 0,
|
||||
forbidClick: true,
|
||||
overlay: true,
|
||||
message: "努力提交中"
|
||||
})
|
||||
const mobileColumnsValue = this.dynamicColumnsData.map((v) => {
|
||||
return {
|
||||
columnName: v.columnName,
|
||||
columnValue: v.columnValue,
|
||||
columnCode: v.columnCode,
|
||||
columnFormType: v.columnFormType
|
||||
}
|
||||
})
|
||||
this.formData.mobileColumnsValue = JSON.stringify(mobileColumnsValue)
|
||||
const resp = await this.$axios.post("/platform/mobile/trainSignUpActivity/doSignUp", this.formData)
|
||||
vant.Toast(resp.msg)
|
||||
if (resp.code === 0) {
|
||||
await this.pageData()
|
||||
this.joinPopup = false
|
||||
}
|
||||
toast.clear()
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
trainClick(o) {
|
||||
this.timeList = o.courseTimeList
|
||||
this.course = o
|
||||
this.qdArray =
|
||||
this.activityStatus === "0"
|
||||
? o.courseTimeList
|
||||
: this.qdInfoList.filter((item) => {
|
||||
return item.courseId === o.id
|
||||
})
|
||||
if (o.signType === 3) {
|
||||
this.initMap(o)
|
||||
}
|
||||
this.popupShow = true
|
||||
},
|
||||
initMap(o) {
|
||||
if (o.courseLocationCoordinates && o.courseLocationCoordinates.length < 2) {
|
||||
return
|
||||
}
|
||||
this.$nextTick(async () => {
|
||||
// 地图初始化应该在地图容器div已经添加到DOM树之后
|
||||
map = new AMap.Map("map", {
|
||||
zoom: 12,
|
||||
center: o.courseLocationCoordinates,
|
||||
resizeEnable: true,
|
||||
scrollWheel: true
|
||||
})
|
||||
AMap.plugin("AMap.Geolocation", function () {
|
||||
geolocation = new AMap.Geolocation({
|
||||
// 是否使用高精度定位，默认：true
|
||||
enableHighAccuracy: true,
|
||||
// 设置定位超时时间，默认：无穷大
|
||||
timeout: 10000,
|
||||
// 定位按钮的停靠位置的偏移量，默认：Pixel(10, 20)
|
||||
buttonOffset: new AMap.Pixel(10, 20),
|
||||
// 定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
|
||||
//zoomToAccuracy: true,
|
||||
// 定位按钮的排放位置, RB表示右下
|
||||
buttonPosition: "RB",
|
||||
showCircle: false
|
||||
//showButton: false,
|
||||
})
|
||||
map.addControl(geolocation)
|
||||
})
|
||||
|
||||
// 创建一个 Marker 实例：
|
||||
var marker = new AMap.Marker({
|
||||
position: new AMap.LngLat(o.courseLocationCoordinates[0], o.courseLocationCoordinates[1]), // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
|
||||
title: "签到点"
|
||||
})
|
||||
|
||||
//获取当前坐标点
|
||||
await this.getPoint()
|
||||
|
||||
var circle = new AMap.Circle({
|
||||
center: new AMap.LngLat(o.courseLocationCoordinates[0], o.courseLocationCoordinates[1]), // 圆心位置
|
||||
radius: 250, // 圆半径
|
||||
borderWeight: 1,
|
||||
strokeOpacity: 1,
|
||||
fillOpacity: 0.4
|
||||
})
|
||||
|
||||
map.add(circle)
|
||||
// 缩放地图到合适的视野级别
|
||||
map.setFitView([circle])
|
||||
|
||||
// 多个点实例组成的数组
|
||||
var markerList = [marker]
|
||||
map.add(markerList)
|
||||
})
|
||||
},
|
||||
async pageData() {
|
||||
const resp = await this.$axios.post("/platform/mobile/trainSignUpActivity/findOne", {
|
||||
id: this.activityId,
|
||||
tabIndex: this.activityStatus
|
||||
})
|
||||
if (resp.code === 0) {
|
||||
this.tableData = resp.data
|
||||
this.assortList = Array.from(new Set(this.tableData.courseList.map((o) => o.assort).filter((o) => o !== "" && o !== undefined)))
|
||||
this.tempArray = JSON.parse(JSON.stringify(this.tableData))
|
||||
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)
|
||||
this.trainType = type ? type.name : "培训班"
|
||||
} else {
|
||||
this.tableData = []
|
||||
this.loading = false
|
||||
}
|
||||
await this.getQdInfoList()
|
||||
this.courseChange(this.courseType, 1)
|
||||
this.loading = false
|
||||
},
|
||||
async getQdInfoList() {
|
||||
const resp = await this.$axios.post("/platform/mobile/trainSignUpActivity/getQdInfoList", {
|
||||
activityId: this.activityId
|
||||
})
|
||||
if (resp.code === 0) {
|
||||
this.qdInfoList = resp.data
|
||||
}
|
||||
},
|
||||
getWeek(dateString) {
|
||||
var dateArray = dateString.split("-")
|
||||
const date = new Date(dateArray[0], parseInt(dateArray[1] - 1), dateArray[2])
|
||||
return "周" + "日一二三四五六".charAt(date.getDay())
|
||||
},
|
||||
tabChange(val) {
|
||||
this.tabName = val
|
||||
this.tableData = []
|
||||
this.pageData()
|
||||
},
|
||||
async getAllType() {
|
||||
const resp = await this.$axios.post("/platform/trainSingUp/manage/type/getAllType", {})
|
||||
this.allColumnsData = resp.data
|
||||
return resp.data
|
||||
},
|
||||
async getCourseText() {
|
||||
const courseArray = await this.getAllType()
|
||||
this.courseOptions = []
|
||||
this.courseOptions.push({ text: "全部类型", value: "0" })
|
||||
for (const item of courseArray) {
|
||||
if (item.personMaxRegisterNum > 0) {
|
||||
this.courseText += item.value + "报名最多选" + item.personMaxRegisterNum + "项，"
|
||||
}
|
||||
this.courseOptions.push({ text: item.lxname, value: item.id })
|
||||
}
|
||||
this.courseText = this.courseText.substr(0, this.courseText.length - 1)
|
||||
},
|
||||
courseChange(value, item) {
|
||||
if (item === undefined) {
|
||||
this.tableData.courseList = []
|
||||
}
|
||||
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
|
||||
)
|
||||
}
|
||||
} else {
|
||||
this.tableData.courseList =
|
||||
value === "0" ? this.tempArray.courseList : this.tempArray.courseList.filter((item) => item.courseType === value)
|
||||
}
|
||||
},
|
||||
async getActivity() {
|
||||
const resp = await this.$axios.post("/platform/mobile/trainSignUpActivity/findOne", {
|
||||
id: this.activityId,
|
||||
tabIndex: 0
|
||||
})
|
||||
if (resp.code === 0) {
|
||||
this.activity = resp.data
|
||||
}
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.$businessTool.getDictOptions("TRAIN_SIGNUP_TYPE").then((data) => {
|
||||
this.trainTypeList = data
|
||||
})
|
||||
this.activityId = GetQueryString("activityId")
|
||||
this.isMySign = Number(GetQueryString("isMySign"))
|
||||
const time = GetQueryString("endTime")
|
||||
if (this.isMySign === 1) {
|
||||
this.activityOptions = [{ text: "我报名的", value: "1" }]
|
||||
this.activityStatus = "1"
|
||||
} else {
|
||||
this.activityOptions = [
|
||||
{ text: "全部", value: "0" },
|
||||
{ text: "我报名的", value: "1" }
|
||||
]
|
||||
this.activityStatus = new Date().getTime() > new Date(time).getTime() ? "1" : "0"
|
||||
}
|
||||
this.activitySignUpStartTime = GetQueryString("activitySignUpStartTime")
|
||||
vant.Toast.setDefaultOptions({ duration: 2000 })
|
||||
this.pageData()
|
||||
await this.getCourseText()
|
||||
await this.getActivity()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,258 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
<style>
|
||||
.van-card {
|
||||
background: #ffffff;
|
||||
margin: 10px auto 0;
|
||||
width: 96%;
|
||||
border-radius: 10px;
|
||||
padding: 14px 12px;
|
||||
}
|
||||
|
||||
.van-card__thumb {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.van-card__content > div {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.train-title {
|
||||
flex: 0.6;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.van-doc-card {
|
||||
margin: 14px;
|
||||
padding: 12px;
|
||||
background-color: #fff;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 8px 12px #ebedf0;
|
||||
line-height: 20px;
|
||||
font-size: 12px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.van-divider {
|
||||
margin: 6px 0 5px 0px;
|
||||
border-color: #1867b0;
|
||||
}
|
||||
|
||||
.van-image__img {
|
||||
max-height: 200px;
|
||||
}
|
||||
|
||||
.van-image__error,
|
||||
.van-image__loading {
|
||||
height: 200px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.tag {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
background-color: #1867b0;
|
||||
color: #fff;
|
||||
font-size: 10px;
|
||||
top: 1px;
|
||||
border-radius: 6px;
|
||||
right: -8px;
|
||||
padding: 1px 7px;
|
||||
transform: rotate(17deg);
|
||||
}
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar title="活动列表" @click-left="historyBack" left-arrow left-text="返回" placeholder fixed></van-nav-bar>
|
||||
<van-sticky offset-top="46px">
|
||||
<van-dropdown-menu>
|
||||
<van-dropdown-item v-model="pageForm.year" :options="yearList" @change="formChange"></van-dropdown-item>
|
||||
<van-dropdown-item v-model="pageForm.activityStatus" :options="activityStatusList" @change="formChange"></van-dropdown-item>
|
||||
</van-dropdown-menu>
|
||||
</van-sticky>
|
||||
|
||||
<div>
|
||||
<van-list :finished="finished" finished-text="没有更多了" v-if="tableData && tableData.length>0" v-model="loading" @load="pageData">
|
||||
<div v-for="o in tableData" class="van-doc-card">
|
||||
<div>
|
||||
<div class="tag" style="background-color: #bc62c5" v-if="o.isDisabled">活动未开启</div>
|
||||
<div class="tag" v-else-if="!o.isDisabled && $moment(o.activitySignUpStartTime).valueOf() > $moment().valueOf()">未开始报名</div>
|
||||
<div
|
||||
class="tag"
|
||||
v-else-if="!o.isDisabled && $moment(o.activitySignUpEndTime).valueOf() > $moment().valueOf() && $moment().valueOf() > $moment(o.activitySignUpStartTime).valueOf()"
|
||||
>
|
||||
报名中
|
||||
</div>
|
||||
<div
|
||||
class="tag"
|
||||
style="background-color: #f14646"
|
||||
v-else-if="!o.isDisabled && $moment(o.activityEndTime).valueOf() < $moment().valueOf() && $moment().valueOf() < $moment(o.activityStartTime).valueOf()"
|
||||
>
|
||||
报名结束
|
||||
</div>
|
||||
<div
|
||||
class="tag"
|
||||
v-else-if="!o.isDisabled && $moment(o.activityStartTime).valueOf() < $moment().valueOf() && $moment().valueOf() < $moment(o.activityEndTime).valueOf()"
|
||||
>
|
||||
活动进行中
|
||||
</div>
|
||||
<div
|
||||
class="tag"
|
||||
style="background-color: #f14646"
|
||||
v-else-if="!o.isDisabled && $moment().valueOf() > $moment(o.activityEndTime).valueOf()"
|
||||
>
|
||||
活动结束
|
||||
</div>
|
||||
</div>
|
||||
<div @click="activityClick(o)">
|
||||
<div>
|
||||
<van-image :src="o.cover" style="display: contents" v-if="o.cover"></van-image>
|
||||
<van-image src="" style="display: contents" v-else></van-image>
|
||||
</div>
|
||||
<div>
|
||||
<div class="van-ellipsis" style="margin-top: 6px; font-size: 15px; font-weight: bold; flex: 1">{{o.activityName}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="train-title">
|
||||
<span style="color: grey">年   度：</span>
|
||||
<span>{{o.year}}</span>
|
||||
</div>
|
||||
<div class="train-title">
|
||||
<span style="color: grey">活动对象：</span>
|
||||
<span>{{o.activityGroupName}}</span>
|
||||
</div>
|
||||
<van-divider></van-divider>
|
||||
</div>
|
||||
<div class="train-title">
|
||||
<span style="color: grey">报名时间：</span>
|
||||
<span>{{$moment(o.activitySignUpStartTime).format('YYYY-MM-DD HH:mm')}}</span>
|
||||
<span>~</span>
|
||||
<span>{{$moment(o.activitySignUpEndTime).format('YYYY-MM-DD HH:mm') }}</span>
|
||||
</div>
|
||||
<div style="margin-top: 6px">
|
||||
<span style="color: grey">活动时间：</span>
|
||||
<span>{{$moment(o.activityStartTime).format('YYYY-MM-DD HH:mm')}}</span>
|
||||
<span>~</span>
|
||||
<span>{{$moment(o.activityEndTime).format('YYYY-MM-DD HH:mm') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</van-list>
|
||||
<van-empty v-else image="/assets/platform/plugins/vant-green/images/nodata/nodata.png" description="暂无数据"></van-empty>
|
||||
</div>
|
||||
|
||||
<van-tabbar v-model="pageForm.activityType" @change="doSearch">
|
||||
<van-tabbar-item icon="wap-home-o">活动列表</van-tabbar-item>
|
||||
<van-tabbar-item icon="user-o">我报名的</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
finished: false,
|
||||
loading: false,
|
||||
tableData: [],
|
||||
tarBarActive: 0,
|
||||
pageForm: {
|
||||
year: "",
|
||||
activityStatus: null,
|
||||
pageNumber: 1,
|
||||
pageSize: 5,
|
||||
totalCount: 0,
|
||||
searchKeyword: "",
|
||||
activityType: 0
|
||||
},
|
||||
activityLevelList: [],
|
||||
activityStatusList: [
|
||||
{ text: "全部", value: 1 },
|
||||
{ text: "未开始", value: 6 },
|
||||
{ text: "报名中", value: 2 },
|
||||
{ text: "进行中", value: 3 },
|
||||
{ text: "已结束", value: 4 }
|
||||
],
|
||||
yearList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
createYearList() {
|
||||
for (let i = new Date().getFullYear() - 50; i <= new Date().getFullYear(); i++) {
|
||||
this.yearList.unshift({ value: i, text: i + "年" })
|
||||
}
|
||||
},
|
||||
doSearch() {
|
||||
this.pageForm.pageNumber = 1
|
||||
this.pageForm.totalCount = 0
|
||||
this.tableData = []
|
||||
this.pageData()
|
||||
},
|
||||
formChange() {
|
||||
this.pageForm.pageNumber = 1
|
||||
this.tableData = []
|
||||
this.pageData()
|
||||
},
|
||||
async activityClick(o) {
|
||||
if (o.isDisabled) {
|
||||
this.$toast("活动未开启")
|
||||
return
|
||||
}
|
||||
if (this.$moment(o.applyStartTime).valueOf() > this.$moment().valueOf()) {
|
||||
this.$toast("活动未开始报名")
|
||||
return
|
||||
}
|
||||
this.$pjaxReplace(
|
||||
"/platform/mobile/trainSignUpActivity/activityInfo?activityId=" +
|
||||
o.id +
|
||||
"&endTime=" +
|
||||
o.activitySignUpEndTime +
|
||||
"&isMySign=" +
|
||||
this.pageForm.activityType
|
||||
)
|
||||
},
|
||||
async pageData() {
|
||||
const resp = await this.$axios.post("/platform/mobile/trainSignUpActivity/pageData", this.pageForm)
|
||||
if (resp.code === 0) {
|
||||
if (resp.data.list.length === 0) {
|
||||
this.tableData = []
|
||||
this.loading = false
|
||||
this.finished = true
|
||||
} else {
|
||||
this.tableData = this.tableData.concat(resp.data.list)
|
||||
}
|
||||
if (this.tableData.length === resp.data.totalCount) {
|
||||
this.finished = true
|
||||
} else {
|
||||
this.pageForm.pageNumber++
|
||||
}
|
||||
}
|
||||
this.loading = false
|
||||
},
|
||||
tabChange(val) {
|
||||
this.tabName = val
|
||||
this.tableData = []
|
||||
this.pageForm.pageNumber = 1
|
||||
this.pageData()
|
||||
},
|
||||
async init() {
|
||||
this.$set(this.pageForm, "activityStatus", 1)
|
||||
this.$set(this.pageForm, "year", new Date().getFullYear())
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.createYearList()
|
||||
await this.init()
|
||||
this.pageData()
|
||||
this.pageForm.activityType = Number(GetQueryString("isMySign"))
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,7 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,7 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
22222222222
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,8 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Title</title>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user