commit
This commit is contained in:
@@ -51,7 +51,7 @@ layout("/layouts/platform_h5.html"){
|
||||
></activity_event_notification>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<script nonce="${cspNonce!}">
|
||||
<!--#include("eventNotification.js"){}#-->
|
||||
new Vue({
|
||||
el: "#app",
|
||||
|
||||
@@ -53,12 +53,18 @@ layout("/layouts/platform_h5.html"){
|
||||
<span v-else>暂无</span>
|
||||
</template>
|
||||
</van-cell>
|
||||
<van-cell title="已报名总人数">
|
||||
<!-- <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="暂保存人数">
|
||||
<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>
|
||||
<span v-if="row.apply_num_bc>0">已保存({{row.apply_num_bc}})人</span>
|
||||
<span v-else>暂无已保存人数</span>
|
||||
</template>
|
||||
</van-cell>
|
||||
<van-cell title="已报名人员" v-if="JSON.parse(row.applyWay).length===1">
|
||||
@@ -103,7 +109,7 @@ layout("/layouts/platform_h5.html"){
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<script nonce="${cspNonce!}">
|
||||
new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
|
||||
@@ -91,7 +91,7 @@ layout("/layouts/platform_h5.html"){
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<script nonce="${cspNonce!}">
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
|
||||
@@ -4,7 +4,8 @@ const times = {
|
||||
`
|
||||
<div>
|
||||
<van-action-sheet v-model="visible" title="时间段" cancel-text="取消">
|
||||
<div id="mapContainer" v-if="row?.isMobileSign === true && row?.signType === 3" style="width: 100%; height: 250px"></div>
|
||||
<div id="mapContainer" v-if="row?.isMobileSign === true && row?.signType === 3"
|
||||
style="width: 100%; height: 250px"></div>
|
||||
<button v-for="(item,index) in row?.courseTimes" type="button" class="van-action-sheet__item">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center">
|
||||
<div>
|
||||
@@ -13,21 +14,28 @@ const times = {
|
||||
<label>{{ $moment(item.courseDate).format('YYYY-MM-DD') }}</label>
|
||||
</div>
|
||||
<div class="van-action-sheet__subname">
|
||||
{{$moment(item.courseStartTime).format('MM-DD HH:mm') + ' 至 ' + $moment(item.courseEndTime).format('MM-DD HH:mm')}}
|
||||
{{$moment(item.courseStartTime).format('MM-DD HH:mm') + ' 至 ' +
|
||||
$moment(item.courseEndTime).format('MM-DD HH:mm')}}
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="row.isSign === true && row.isMobileSign === true" class="sign_button">
|
||||
<van-button v-if="item.isAttend !== true" @click.stop="onSign(item)" size="mini" type="info">签到</van-button>
|
||||
<van-button v-if="item.isAttend === true" size="mini" type="info" disabled>已签到</van-button>
|
||||
<van-button
|
||||
v-if="item.isAttend !== true
|
||||
&&
|
||||
$moment(item.courseEndTime).unix()>$moment().unix()"
|
||||
@click.stop="onSign(item)" size="mini" type="info">签到
|
||||
</van-button>
|
||||
<van-button v-if="item.isAttend === true" size="mini" type="info" disabled>已签到
|
||||
</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
</van-action-sheet>
|
||||
|
||||
<van-popup round :safe-area-inset-bottom="true"
|
||||
:close-on-click-overlay="false"
|
||||
v-model="signVisible"
|
||||
:style="{ width: '80%', height: '66%' }"
|
||||
<van-popup round :safe-area-inset-bottom="true"
|
||||
:close-on-click-overlay="false"
|
||||
v-model="signVisible"
|
||||
:style="{ width: '80%', height: '66%' }"
|
||||
get-container="#app"
|
||||
@close="onSignClose"
|
||||
closeable
|
||||
@@ -39,7 +47,7 @@ const times = {
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
visible:false,
|
||||
visible: false,
|
||||
row: null,
|
||||
weekdayCNMap: {0: '周日', 1: '周一', 2: '周二', 3: '周三', 4: '周四', 5: '周五', 6: '周六'},
|
||||
|
||||
@@ -62,8 +70,8 @@ const times = {
|
||||
this.row = row
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
if(this.row.signType === 3) {
|
||||
if(this.map) this.map.destroy()
|
||||
if (this.row.signType === 3) {
|
||||
if (this.map) this.map.destroy()
|
||||
this.initMap()
|
||||
this.getLocation((coords) => {
|
||||
if (coords) {
|
||||
@@ -115,7 +123,8 @@ const times = {
|
||||
},
|
||||
getLocation(callback) {
|
||||
if (typeof callback !== 'function') {
|
||||
callback = () => {};
|
||||
callback = () => {
|
||||
};
|
||||
}
|
||||
if (!navigator.geolocation) {
|
||||
this.$toast('当前浏览器不支持定位功能');
|
||||
@@ -161,7 +170,7 @@ const times = {
|
||||
);
|
||||
},
|
||||
initMap() {
|
||||
if(!this.row.courseLocationCoordinates) {
|
||||
if (!this.row.courseLocationCoordinates) {
|
||||
this.$toast('未设置签到点')
|
||||
return
|
||||
}
|
||||
@@ -210,11 +219,11 @@ const times = {
|
||||
const content = jrQrcode.getQrBase64(data)
|
||||
vant.ImagePreview([content])
|
||||
},
|
||||
onClose(){
|
||||
onClose() {
|
||||
this.visible = false
|
||||
},
|
||||
},
|
||||
style: /*language=CSS*/ `
|
||||
|
||||
|
||||
`
|
||||
}
|
||||
|
||||
@@ -94,7 +94,7 @@ layout("/layouts/platform_h5.html"){
|
||||
</div>
|
||||
|
||||
<script src="${base!}/assets/platform/plugins/jr-qrcode/jr-qrcode.js"></script>
|
||||
<script>
|
||||
<script nonce="${cspNonce!}">
|
||||
<!--#include('../common/times.js'){}#-->
|
||||
<!--#include('applyForm.js'){}#-->
|
||||
const vue = new Vue({
|
||||
|
||||
@@ -78,7 +78,7 @@ layout("/layouts/platform_h5.html"){
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<script nonce="${cspNonce!}">
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
|
||||
@@ -30,7 +30,7 @@ layout("/layouts/platform_h5.html"){
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<script nonce="${cspNonce!}">
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
|
||||
@@ -37,7 +37,7 @@ layout("/layouts/platform_h5.html"){
|
||||
</van-action-sheet>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<script nonce="${cspNonce!}">
|
||||
<!--#include("/platform/zhghh5/welfare/include/areaList.js"){}#-->
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
|
||||
@@ -85,11 +85,11 @@ layout("/layouts/platform_h5.html"){
|
||||
<div class="wf-card-heading">{{row.name}}</div>
|
||||
<div class="wf-time-row">
|
||||
<span class="wf-time-label">开始时间:</span>
|
||||
{{row.choiceTimeStart}}
|
||||
{{$moment(row.choiceTimeStart).format('YYYY-MM-DD HH:mm')}}
|
||||
</div>
|
||||
<div class="wf-time-row">
|
||||
<span class="wf-time-label">结束时间:</span>
|
||||
{{row.choiceTimeEnd}}
|
||||
{{$moment(row.choiceTimeEnd).format('YYYY-MM-DD HH:mm')}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -101,7 +101,7 @@ layout("/layouts/platform_h5.html"){
|
||||
<select-view ref="selectViewRef"></select-view>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<script nonce="${cspNonce!}">
|
||||
<!--#include('selectView.js'){}#-->
|
||||
|
||||
new Vue({
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
const selectView = {
|
||||
template: /*language=HTML*/ `
|
||||
<van-action-sheet
|
||||
v-model="visible"
|
||||
:title="'我的福利选择'"
|
||||
close-icon="close"
|
||||
safe-area-inset-bottom
|
||||
@close="handleClose"
|
||||
:overlay-class="detailVisible ? 'no-overlay' : ''"
|
||||
v-model="visible"
|
||||
:title="'我的福利选择'"
|
||||
close-icon="close"
|
||||
safe-area-inset-bottom
|
||||
@close="handleClose"
|
||||
:overlay-class="detailVisible ? 'no-overlay' : ''"
|
||||
>
|
||||
<div class="welfare-view">
|
||||
<!-- 内容区域 -->
|
||||
@@ -14,37 +14,58 @@ const selectView = {
|
||||
<van-pull-refresh v-model="refreshing" @refresh="onRefresh">
|
||||
<van-skeleton title :row="6" :loading="loading" animated>
|
||||
<!-- 项目基本信息 -->
|
||||
|
||||
<div class="welfare-card">
|
||||
<div class="welfare-card__header">
|
||||
<i class="el-icon-s-flag"></i>
|
||||
<span>项目基本信息</span>
|
||||
</div>
|
||||
<div class="welfare-card__content">
|
||||
<div class="info-row">
|
||||
<div class="info-row__label">项目名称</div>
|
||||
<div class="info-row__value">{{ projectInfo.name }}</div>
|
||||
</div>
|
||||
<div class="info-row info-row--time">
|
||||
<div class="info-row__label">选择时间</div>
|
||||
<div class="info-row__value">
|
||||
<div class="time-item time-item--start">{{ projectInfo.choiceTimeStart }}</div>
|
||||
<div class="time-item time-item--end">{{ projectInfo.choiceTimeEnd }}</div>
|
||||
<van-collapse v-model="activeNames">
|
||||
<van-collapse-item name="1">
|
||||
<template #title>
|
||||
<div class="welfare-card__header">
|
||||
<i class="el-icon-s-flag"></i>
|
||||
<span>项目基本信息</span>
|
||||
</div>
|
||||
</template>
|
||||
<div class="welfare-card__content">
|
||||
<div class="info-row">
|
||||
<div class="info-row__label">项目名称</div>
|
||||
<div class="info-row__value">{{ projectInfo.name }}</div>
|
||||
</div>
|
||||
<div class="info-row info-row--time">
|
||||
<div class="info-row__label">选择时间</div>
|
||||
<div class="info-row__value">
|
||||
<div class="time-item time-item--start">{{
|
||||
$moment(projectInfo.choiceTimeStart).format('YYYY-MM-DD HH:mm')
|
||||
}}
|
||||
</div>
|
||||
<div class="time-item time-item--end">{{
|
||||
$moment(projectInfo.choiceTimeEnd).format('YYYY-MM-DD HH:mm') }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-row info-row--time">
|
||||
<div class="info-row__label">发放时间</div>
|
||||
<div class="info-row__value">
|
||||
<div class="time-item time-item--start">{{
|
||||
$moment(projectInfo.provideTimeStart).format('YYYY-MM-DD HH:mm')
|
||||
}}
|
||||
</div>
|
||||
<div class="time-item time-item--end">{{
|
||||
$moment(projectInfo.provideTimeEnd).format('YYYY-MM-DD HH:mm')
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-row">
|
||||
<div class="info-row__label">发放地点</div>
|
||||
<div class="info-row__value">{{ projectInfo.provideAddress || '暂无'
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-row info-row--time">
|
||||
<div class="info-row__label">发放时间</div>
|
||||
<div class="info-row__value">
|
||||
<div class="time-item time-item--start">{{ projectInfo.provideTimeStart }}</div>
|
||||
<div class="time-item time-item--end">{{ projectInfo.provideTimeEnd }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-row">
|
||||
<div class="info-row__label">发放地点</div>
|
||||
<div class="info-row__value">{{ projectInfo.provideAddress || '暂无' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</van-collapse-item>
|
||||
</van-collapse>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 联系信息 -->
|
||||
<div class="welfare-card">
|
||||
<div class="welfare-card__header">
|
||||
@@ -58,7 +79,9 @@ const selectView = {
|
||||
</div>
|
||||
<div class="info-row">
|
||||
<div class="info-row__label">收货地址</div>
|
||||
<div class="info-row__value">{{ mergedSelections[0]?.receiveAddress || '暂无' }}</div>
|
||||
<div class="info-row__value">{{ mergedSelections[0]?.receiveAddress || '暂无'
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -73,11 +96,11 @@ const selectView = {
|
||||
|
||||
<div v-if="mergedSelections.length > 0" class="selection-list">
|
||||
<div class="selection-item"
|
||||
v-for="item in mergedSelections"
|
||||
:key="item.id"
|
||||
@click="showOptionDetail(item)">
|
||||
v-for="item in mergedSelections"
|
||||
:key="item.id"
|
||||
@click="showOptionDetail(item)">
|
||||
<div class="selection-item__image">
|
||||
<img :src="item.imgUrl"
|
||||
<img :src="item.imgUrl"
|
||||
alt="福利图片"
|
||||
@error="handleImageError">
|
||||
</div>
|
||||
@@ -110,16 +133,17 @@ const selectView = {
|
||||
|
||||
<!-- 选项详情弹窗 -->
|
||||
<van-action-sheet
|
||||
v-model="detailVisible"
|
||||
:title="currentOption?.optionName || '福利详情'"
|
||||
close-icon="close"
|
||||
safe-area-inset-bottom
|
||||
@close="closeDetail"
|
||||
:z-index="2001"
|
||||
v-model="detailVisible"
|
||||
:title="currentOption?.optionName || '福利详情'"
|
||||
close-icon="close"
|
||||
safe-area-inset-bottom
|
||||
@close="closeDetail"
|
||||
:z-index="2001"
|
||||
>
|
||||
<div class="welfare-detail" v-if="currentOption">
|
||||
<van-skeleton title :row="10" :loading="descLoading" animated>
|
||||
<div class="welfare-detail__content rich-text" v-html="currentOption.description || '暂无详细说明'"></div>
|
||||
<div class="welfare-detail__content rich-text"
|
||||
v-html="currentOption.description || '暂无详细说明'"></div>
|
||||
</van-skeleton>
|
||||
</div>
|
||||
</van-action-sheet>
|
||||
@@ -144,7 +168,8 @@ const selectView = {
|
||||
},
|
||||
selectedOptions: [],
|
||||
detailVisible: false,
|
||||
currentOption: null
|
||||
currentOption: null,
|
||||
activeNames:[]
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
@@ -82,7 +82,7 @@ layout("/layouts/platform_h5.html"){
|
||||
}
|
||||
|
||||
.welfare-info-header {
|
||||
padding: 16px;
|
||||
/*padding: 16px;*/
|
||||
color: var(--text-primary);
|
||||
font-weight: 600;
|
||||
font-size: 17px;
|
||||
@@ -192,7 +192,7 @@ layout("/layouts/platform_h5.html"){
|
||||
}
|
||||
|
||||
.welfare-option-content {
|
||||
padding: 12px;
|
||||
padding: 6px 12px;
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -277,8 +277,8 @@ layout("/layouts/platform_h5.html"){
|
||||
|
||||
.welfare-tag {
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 8px;
|
||||
right: 41px;
|
||||
top: -3px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
@@ -531,20 +531,31 @@ layout("/layouts/platform_h5.html"){
|
||||
text-align: center;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
.welfare-info-card .van-collapse-item__content {
|
||||
padding: 0;
|
||||
}
|
||||
.welfare-info-card .welfare-cell-group .van-cell__title {
|
||||
max-width: 70px;
|
||||
}
|
||||
.welfare-info-card .welfare-cell-group .van-cell {
|
||||
padding: 8px 16px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<div class="page-container">
|
||||
<van-nav-bar title="福利选择" left-text="返回" left-arrow @click-left="historyBack" fixed placeholder></van-nav-bar>
|
||||
<van-nav-bar title="福利选择" left-text="返回" left-arrow @click-left="historyBack" fixed
|
||||
placeholder></van-nav-bar>
|
||||
|
||||
<!-- 项目头部信息 -->
|
||||
<div class="welfare-header" v-if="projectInfo.id">
|
||||
<img :src="projectInfo.cover" class="welfare-header-img" />
|
||||
<img :src="projectInfo.cover" class="welfare-header-img"/>
|
||||
<div class="welfare-header-overlay">
|
||||
<div class="welfare-title">{{ projectInfo.name }}</div>
|
||||
<div class="welfare-subtitle">
|
||||
<van-icon name="calendar-o" />
|
||||
<span>{{ projectInfo.festival }} · {{ projectInfo.year }}年</span>
|
||||
<van-icon name="calendar-o"/>
|
||||
<span>{{ projectInfo.year }}年</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -552,14 +563,14 @@ layout("/layouts/platform_h5.html"){
|
||||
<!-- 加载中 -->
|
||||
<van-empty v-if="!projectInfo.id" description="加载中...">
|
||||
<template #image>
|
||||
<van-loading type="spinner" color="#1989fa" />
|
||||
<van-loading type="spinner" color="#1989fa"/>
|
||||
</template>
|
||||
</van-empty>
|
||||
|
||||
<div class="main-content" v-if="projectInfo.id">
|
||||
<!-- 截止时间提醒 -->
|
||||
<div class="welfare-deadline" v-if="isDeadlineSoon">
|
||||
<van-icon name="warning-o" />
|
||||
<van-icon name="warning-o"/>
|
||||
<span>选择截止时间即将到期,请尽快选择!</span>
|
||||
</div>
|
||||
|
||||
@@ -567,26 +578,37 @@ layout("/layouts/platform_h5.html"){
|
||||
<div class="welfare-notice">
|
||||
<van-notice-bar wrapable :scrollable="false" background="#ecf6ff" color="var(--primary-color)">
|
||||
<van-icon name="info-o" style="margin-right: 5px"></van-icon>
|
||||
{{ projectInfo.isCheckBox === "radio" ? "请选择一项福利" : "您可以选择多项福利,最多可选 " + (projectInfo.multiSelectNum ||
|
||||
{{ projectInfo.isCheckBox === "radio" ? "请选择一项福利" : "您可以选择多项福利,最多可选 " +
|
||||
(projectInfo.multiSelectNum ||
|
||||
projectInfo.options.length) + " 项" }}
|
||||
</van-notice-bar>
|
||||
</div>
|
||||
|
||||
<!-- 项目信息卡片 -->
|
||||
<div class="welfare-info-card">
|
||||
<div class="welfare-info-header">
|
||||
<div class="header-text">
|
||||
<van-icon name="info-o" />
|
||||
<span>项目信息</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="welfare-cell-group">
|
||||
<van-cell title="选择时间" :value="formatTimeRange(projectInfo.choiceTimeStart, projectInfo.choiceTimeEnd)"></van-cell>
|
||||
<van-cell title="发放时间" :value="formatTimeRange(projectInfo.provideTimeStart, projectInfo.provideTimeEnd)"></van-cell>
|
||||
<van-cell title="发放地点" :value="projectInfo.provideAddress"></van-cell>
|
||||
|
||||
|
||||
<van-collapse v-model="activeNames">
|
||||
<van-collapse-item name="1">
|
||||
<template #title>
|
||||
<div class="welfare-info-header">
|
||||
<div class="header-text">
|
||||
<van-icon name="info-o"></van-icon>
|
||||
<span>项目信息</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="welfare-cell-group">
|
||||
<van-cell title="选择时间"
|
||||
:value="formatTimeRange(projectInfo.choiceTimeStart, projectInfo.choiceTimeEnd)"></van-cell>
|
||||
<van-cell title="发放时间"
|
||||
:value="formatTimeRange(projectInfo.provideTimeStart, projectInfo.provideTimeEnd)"></van-cell>
|
||||
<van-cell title="发放地点" :value="projectInfo.provideAddress"></van-cell>
|
||||
</div>
|
||||
</van-collapse-item>
|
||||
<!-- <van-cell title="发放方式" :value="getProvideModeName(projectInfo.provideMode)"></van-cell>-->
|
||||
<!-- <van-cell title="签字方式" :value="getSignModeName(projectInfo.signMode)"></van-cell>-->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="section-divider"></div>
|
||||
@@ -594,7 +616,7 @@ layout("/layouts/platform_h5.html"){
|
||||
<!-- 福利选项标题 -->
|
||||
<div class="welfare-section-title">
|
||||
<div class="title-text">
|
||||
<van-icon name="gift-o" />
|
||||
<van-icon name="gift-o"/>
|
||||
<span>福利选项</span>
|
||||
<span class="title-count">共 {{ projectInfo.options.length }} 项</span>
|
||||
</div>
|
||||
@@ -603,15 +625,16 @@ layout("/layouts/platform_h5.html"){
|
||||
<!-- 福利选项列表 -->
|
||||
<div class="welfare-options-container">
|
||||
<div
|
||||
v-for="(option,index) in projectInfo.options"
|
||||
:key="option.id"
|
||||
class="welfare-option"
|
||||
:class="{ selected: projectInfo.isCheckBox === 'radio' ? selectedRadioId === option.id : option.selectNum > 0 }"
|
||||
@click="projectInfo.isCheckBox === 'radio' && !isDeadlinePassed ? selectRadioOption(option.id) : null"
|
||||
v-for="(option,index) in projectInfo.options"
|
||||
:key="option.id"
|
||||
class="welfare-option"
|
||||
:class="{ selected: projectInfo.isCheckBox === 'radio' ? selectedRadioId === option.id : option.selectNum > 0 }"
|
||||
@click="projectInfo.isCheckBox === 'radio' && !isDeadlinePassed ? selectRadioOption(option.id) : null"
|
||||
>
|
||||
<div class="welfare-option-image">
|
||||
<van-image :src="option.imgUrl" fit="cover" width="100%" height="100%" radius="4px"></van-image>
|
||||
<div class="welfare-tag" v-if="projectInfo.isCheckBox === 'radio' ? selectedRadioId === option.id : option.selectNum > 0">
|
||||
<div class="welfare-tag"
|
||||
v-if="projectInfo.isCheckBox === 'radio' ? selectedRadioId === option.id : option.selectNum > 0">
|
||||
<van-tag type="primary" round>已选择</van-tag>
|
||||
</div>
|
||||
</div>
|
||||
@@ -621,34 +644,34 @@ layout("/layouts/platform_h5.html"){
|
||||
|
||||
<!-- 查看详情按钮 -->
|
||||
<div class="welfare-detail-btn" @click.stop="showOptionDetail(option)">
|
||||
<van-icon name="info-o" />
|
||||
<span>查看详情</span>
|
||||
<van-icon name="info-o"/>
|
||||
<span style="position: relative; top: -0.5px">查看详情</span>
|
||||
</div>
|
||||
|
||||
<!-- 单选模式使用单选按钮 -->
|
||||
<div class="welfare-option-radio" v-if="projectInfo.isCheckBox === 'radio'">
|
||||
<van-radio
|
||||
:name="option.id"
|
||||
v-model="selectedRadioId"
|
||||
@click.stop="isDeadlinePassed ? $toast.fail('已过选择截止时间,无法修改') : selectRadioOption(option.id)"
|
||||
:disabled="isDeadlinePassed"
|
||||
:name="option.id"
|
||||
v-model="selectedRadioId"
|
||||
@click.stop="isDeadlinePassed ? $toast.fail('已过选择截止时间,无法修改') : selectRadioOption(option.id)"
|
||||
:disabled="isDeadlinePassed"
|
||||
></van-radio>
|
||||
</div>
|
||||
|
||||
<!-- 多选模式使用步进器 -->
|
||||
<div class="welfare-option-checkbox" v-else>
|
||||
<van-stepper
|
||||
:key="'input-number-'+index+'-'+option.selectNumKey|| 0"
|
||||
v-model="option.selectNum"
|
||||
integer
|
||||
disable-input
|
||||
:default-value="0"
|
||||
:min="0"
|
||||
:disabled="isDeadlinePassed"
|
||||
input-width="40px"
|
||||
button-size="22px"
|
||||
@change="selectNumChange(index,option.selectNum)"
|
||||
theme="round"
|
||||
:key="'input-number-'+index+'-'+option.selectNumKey|| 0"
|
||||
v-model="option.selectNum"
|
||||
integer
|
||||
disable-input
|
||||
:default-value="0"
|
||||
:min="0"
|
||||
:disabled="isDeadlinePassed"
|
||||
input-width="40px"
|
||||
button-size="22px"
|
||||
@change="selectNumChange(index,option.selectNum)"
|
||||
theme="round"
|
||||
></van-stepper>
|
||||
</div>
|
||||
</div>
|
||||
@@ -658,38 +681,50 @@ layout("/layouts/platform_h5.html"){
|
||||
|
||||
<!-- 底部提交按钮 -->
|
||||
<div class="welfare-footer" v-if="projectInfo.id">
|
||||
<van-button type="primary" class="welfare-submit-btn" :disabled="submitButtonDisabled" @click="submitSelection" round>
|
||||
<van-button type="primary" class="welfare-submit-btn" :disabled="submitButtonDisabled"
|
||||
@click="submitSelection" round>
|
||||
{{ isDeadlinePassed ? '已截止' : '确认选择' }}
|
||||
</van-button>
|
||||
</div>
|
||||
|
||||
<!-- 确认弹窗 -->
|
||||
<van-action-sheet v-model="showConfirmDialog" :close-on-click-overlay="false" :round="true" :style="{ maxHeight: '90%' }">
|
||||
<van-action-sheet v-model="showConfirmDialog" :close-on-click-overlay="false" :round="true"
|
||||
:style="{ maxHeight: '90%' }">
|
||||
<div class="confirm-action-sheet">
|
||||
<div class="confirm-sheet-title">确认选择</div>
|
||||
|
||||
<div class="confirm-content-scroll">
|
||||
<!-- 手机号输入 -->
|
||||
<div class="mobile-input-section">
|
||||
<van-field
|
||||
v-model="formData.mobile"
|
||||
label="联系电话"
|
||||
placeholder="请输入手机号码"
|
||||
:error="mobileError"
|
||||
@focus="mobileError = false"
|
||||
maxlength="11"
|
||||
required
|
||||
></van-field>
|
||||
<!--收货地址-->
|
||||
<van-field
|
||||
v-if="projectInfo.provideMode == 3"
|
||||
v-model="formData.receiveAddress"
|
||||
label="收货地址"
|
||||
placeholder="请选择收货地址"
|
||||
readonly
|
||||
is-link
|
||||
@click="showAddressSheet = true"
|
||||
required
|
||||
v-if="projectInfo.provideMode == 3"
|
||||
v-model="formData.receiveAddress"
|
||||
label="收货地址"
|
||||
rows="2"
|
||||
type="textarea"
|
||||
placeholder="请选择收货地址"
|
||||
readonly
|
||||
is-link
|
||||
@click="showAddressSheet = true"
|
||||
required
|
||||
></van-field>
|
||||
<van-field
|
||||
v-model="formData.userName"
|
||||
label="收货人"
|
||||
placeholder="请输入收货人"
|
||||
:error="userNameError"
|
||||
@focus="userNameError = false"
|
||||
required
|
||||
></van-field>
|
||||
<van-field
|
||||
v-model="formData.mobile"
|
||||
label="联系电话"
|
||||
placeholder="请输入手机号码"
|
||||
:error="mobileError"
|
||||
@focus="mobileError = false"
|
||||
maxlength="11"
|
||||
required
|
||||
></van-field>
|
||||
</div>
|
||||
|
||||
@@ -711,9 +746,11 @@ layout("/layouts/platform_h5.html"){
|
||||
|
||||
<!-- 签字组件 -->
|
||||
<div class="confirm-section" v-if="projectInfo.signMode === 2">
|
||||
<div class="confirm-section-title">请签字确认</div>
|
||||
<div class="confirm-section-title">请签字(下滑此页面打开签字版签字)</div>
|
||||
<h5-signature v-model="formData.userSign" ref="signatureRef"></h5-signature>
|
||||
<div class="signature-tips">{{ formData.userSign ? '您已完成签名' : '请在上方空白区域完成签名' }}</div>
|
||||
<div class="signature-tips">{{ formData.userSign ? '您已完成签名' : '请在上方空白区域完成签名'
|
||||
}}
|
||||
</div>
|
||||
<div style="text-align: right; margin-top: 8px">
|
||||
<van-button size="small" type="default" @click="resetSignature">重新签名</van-button>
|
||||
</div>
|
||||
@@ -721,14 +758,19 @@ layout("/layouts/platform_h5.html"){
|
||||
</div>
|
||||
|
||||
<div class="confirm-fixed-buttons">
|
||||
<van-button type="default" block round class="action-sheet-cancel" @click="showConfirmDialog = false">取消</van-button>
|
||||
<van-button type="primary" block round @click="doSubmit">{{ hasSubmittedBefore ? '确认修改' : '确认提交' }}</van-button>
|
||||
<van-button type="default" block round class="action-sheet-cancel"
|
||||
@click="showConfirmDialog = false">取消
|
||||
</van-button>
|
||||
<van-button type="primary" block round @click="doSubmit">
|
||||
{{ hasSubmittedBefore ? '确认修改' : '确认提交'}}
|
||||
</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</van-action-sheet>
|
||||
|
||||
<!-- 选项详情弹窗 -->
|
||||
<van-popup v-model="showOptionDetailDialog" round closeable close-icon="close" position="bottom" :style="{ maxHeight: '70%' }">
|
||||
<van-popup v-model="showOptionDetailDialog" round closeable close-icon="close" position="bottom"
|
||||
:style="{ maxHeight: '70%' }">
|
||||
<div class="welfare-detail-popup" v-if="selectedOption">
|
||||
<div class="welfare-detail-title">{{ selectedOption.optionName }}</div>
|
||||
<div class="welfare-detail-content" v-html="selectedOption.description"></div>
|
||||
@@ -739,25 +781,29 @@ layout("/layouts/platform_h5.html"){
|
||||
<van-action-sheet v-model="showAddressSheet" title="选择收货地址" :round="true">
|
||||
<div style="padding: 16px 0 0">
|
||||
<div
|
||||
v-for="address in addressOptions"
|
||||
:key="address.id"
|
||||
class="address-item"
|
||||
@click="selectAddress(address)"
|
||||
style="padding: 12px 16px; border-bottom: 1px solid #f0f0f0; cursor: pointer"
|
||||
v-for="address in addressOptions"
|
||||
:key="address.id"
|
||||
class="address-item"
|
||||
@click="selectAddress(address)"
|
||||
style="padding: 12px 16px; border-bottom: 1px solid #f0f0f0; cursor: pointer"
|
||||
>
|
||||
<div style="display: flex; justify-content: space-between; align-items: flex-start">
|
||||
<div style="flex: 1">
|
||||
<div style="font-size: 16px; font-weight: 500; color: #323233; margin-bottom: 4px">
|
||||
{{ address.userName }} {{ address.tel }}
|
||||
收货人:{{ address.userName }}{{ address.tel }}
|
||||
</div>
|
||||
<div style="font-size: 14px; color: #646566; line-height: 1.4">
|
||||
{{ address.province }}{{ address.city }}{{ address.county }}{{ address.addressDetail }}
|
||||
收货地址: {{ address.province }}{{ address.city }}{{ address.county }}
|
||||
{{address.addressDetail }}
|
||||
</div>
|
||||
</div>
|
||||
<van-tag v-if="address.isDefault" type="primary" size="mini" style="margin-left: 8px">默认</van-tag>
|
||||
<van-tag v-if="address.isDefault" type="primary" size="mini" style="margin-left: 8px">默认
|
||||
</van-tag>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="addressOptions.length === 0" style="text-align: center; padding: 40px 16px; color: #969799">暂无收货地址</div>
|
||||
<div v-if="addressOptions.length === 0" style="text-align: center; padding: 40px 16px; color: #969799">
|
||||
暂无收货地址
|
||||
</div>
|
||||
</div>
|
||||
<div style="padding: 16px; border-top: 1px solid #f0f0f0; background: #fafafa">
|
||||
<van-button type="info" block round @click="goToAddressManage">收货地址管理</van-button>
|
||||
@@ -766,12 +812,13 @@ layout("/layouts/platform_h5.html"){
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<script nonce="${cspNonce!}">
|
||||
new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
activeNames: [],
|
||||
projectInfo: {},
|
||||
userSelection: [],
|
||||
welfareProvideMode: [],
|
||||
@@ -784,10 +831,12 @@ layout("/layouts/platform_h5.html"){
|
||||
showOptionDetailDialog: false, // 选项详情弹窗
|
||||
selectedOption: null, // 当前选中的选项
|
||||
mobileError: false, // 手机号错误标记
|
||||
userNameError: false, // 收货人错误标记
|
||||
formData: {
|
||||
userSign: "", // 用户签名
|
||||
mobile: "", // 手机号码
|
||||
address: "" // 收货地址
|
||||
address: "",// 收货地址
|
||||
userName: "",//收货人
|
||||
},
|
||||
|
||||
addressOptions: [],
|
||||
@@ -879,7 +928,7 @@ layout("/layouts/platform_h5.html"){
|
||||
}
|
||||
},
|
||||
getProjectInfo() {
|
||||
this.$axios.post("/platform/welfare/common/projectInfo", { id: this.projectId }).then((res) => {
|
||||
this.$axios.post("/platform/welfare/common/projectInfo", {id: this.projectId}).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.projectInfo = res.data
|
||||
|
||||
@@ -904,7 +953,7 @@ layout("/layouts/platform_h5.html"){
|
||||
|
||||
// 获取用户选择的数据
|
||||
getUserSelection() {
|
||||
this.$axios.post("/platform/welfare/userSelect/getUserSelection", { projectId: this.projectId }).then((resp) => {
|
||||
this.$axios.post("/platform/welfare/userSelect/getUserSelection", {projectId: this.projectId}).then((resp) => {
|
||||
if (resp.code === 0) {
|
||||
this.userSelection = resp.data
|
||||
this.hasSubmittedBefore = this.userSelection.length > 0
|
||||
@@ -912,14 +961,17 @@ layout("/layouts/platform_h5.html"){
|
||||
// 如果有用户选择数据,从中获取手机号
|
||||
if (this.userSelection && this.userSelection.length > 0 && this.userSelection[0].mobile) {
|
||||
this.formData.mobile = this.userSelection[0].mobile
|
||||
this.formData.userName = this.userSelection[0].userName
|
||||
|
||||
// 获取签名信息(如果有)
|
||||
if (this.userSelection[0].userSign) {
|
||||
this.formData.userSign = this.userSelection[0].userSign
|
||||
}
|
||||
} else if (this.$store.user && this.$store.user.mobile) {
|
||||
} else if (this.$store.state.user && this.$store.state.user.mobile) {
|
||||
// 如果没有选择过,使用store中的默认手机号
|
||||
this.formData.mobile = this.$store.user.mobile
|
||||
this.formData.mobile = this.$store.state.user.mobile
|
||||
}else if (this.$store.state.user && this.$store.state.user.username){
|
||||
this.formData.userName = this.$store.state.user.username
|
||||
}
|
||||
|
||||
// 地址回显
|
||||
@@ -966,6 +1018,11 @@ layout("/layouts/platform_h5.html"){
|
||||
return
|
||||
}
|
||||
|
||||
// 验证收货人
|
||||
if (!this.validateUserName()) {
|
||||
return;
|
||||
}
|
||||
|
||||
// 验证手机号
|
||||
if (!this.validateMobile()) {
|
||||
return
|
||||
@@ -1001,7 +1058,8 @@ layout("/layouts/platform_h5.html"){
|
||||
{
|
||||
selectOptionId: this.selectedRadioId,
|
||||
selectNum: 1,
|
||||
mobile: this.formData.mobile
|
||||
mobile: this.formData.mobile,
|
||||
userName: this.formData.userName
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -1011,7 +1069,8 @@ layout("/layouts/platform_h5.html"){
|
||||
selections = this.selectedOptions.map((option) => ({
|
||||
selectOptionId: option.id,
|
||||
selectNum: option.selectNum,
|
||||
mobile: this.formData.mobile
|
||||
mobile: this.formData.mobile,
|
||||
userName: this.formData.userName
|
||||
}))
|
||||
}
|
||||
|
||||
@@ -1072,6 +1131,16 @@ layout("/layouts/platform_h5.html"){
|
||||
return true
|
||||
},
|
||||
|
||||
// 验证收货人
|
||||
validateUserName() {
|
||||
if (!this.formData.userName) {
|
||||
this.userNameError = true;
|
||||
this.$toast.fail("请输入收货人姓名");
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
|
||||
// 格式化时间范围
|
||||
formatTimeRange(start, end) {
|
||||
if (!start || !end) return "未设置"
|
||||
@@ -1169,8 +1238,10 @@ layout("/layouts/platform_h5.html"){
|
||||
|
||||
// 选择收货地址
|
||||
selectAddress(address) {
|
||||
this.formData.receiveAddress =
|
||||
address.userName + " " + address.tel + " " + address.province + address.city + address.county + address.addressDetail
|
||||
// "收货人:" + address.userName + ",联系电话:" + address.tel + ",收货地址:" +
|
||||
this.formData.userName = address.userName
|
||||
this.formData.mobile = address.tel
|
||||
this.formData.receiveAddress = address.province + address.city + address.county + address.addressDetail
|
||||
this.showAddressSheet = false
|
||||
},
|
||||
|
||||
|
||||
@@ -86,11 +86,11 @@ layout("/layouts/platform_h5.html"){
|
||||
<div class="wf-card-heading">{{row.name}}</div>
|
||||
<div class="wf-time-row">
|
||||
<span class="wf-time-label">开始时间:</span>
|
||||
{{row.choiceTimeStart}}
|
||||
{{$moment(row.choiceTimeStart).format('YYYY-MM-DD HH:mm')}}
|
||||
</div>
|
||||
<div class="wf-time-row">
|
||||
<span class="wf-time-label">结束时间:</span>
|
||||
{{row.choiceTimeEnd}}
|
||||
{{$moment(row.choiceTimeEnd).format('YYYY-MM-DD HH:mm')}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -101,7 +101,7 @@ layout("/layouts/platform_h5.html"){
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<script nonce="${cspNonce!}">
|
||||
new Vue({
|
||||
el: "#app",
|
||||
data() {
|
||||
|
||||
@@ -87,7 +87,7 @@ layout("/layouts/platform_h5.html"){
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<script nonce="${cspNonce!}">
|
||||
new Vue({
|
||||
el: "#app",
|
||||
data() {
|
||||
|
||||
@@ -269,7 +269,7 @@ layout("/layouts/platform_h5.html"){
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<script nonce="${cspNonce!}">
|
||||
new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
|
||||
@@ -87,7 +87,7 @@ layout("/layouts/platform_h5.html"){
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
<script nonce="${cspNonce!}">
|
||||
new Vue({
|
||||
el: "#app",
|
||||
data() {
|
||||
|
||||
Reference in New Issue
Block a user