first commit

This commit is contained in:
2026-09-08 19:49:21 +08:00
commit ebffbab428
7320 changed files with 1477614 additions and 0 deletions
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,29 @@
const welfareMixins = {
data() {
return {
tarBarActive: '',
addressList: [],
isReceive: false,
isChoice: false,
isAutoSelect: false
}
},
methods: {
async selectAddressList() {
const resp = await $.get('/mobile/welfare/mine/selectUserAddress')
this.addressList = resp.data
},
async getReceive() {
const resp = await $.get('/mobile/welfare/mine/isReceive', {projectId: this.projectId})
this.isReceive = resp.data
},
async getChoice() {
const resp = await $.get('/mobile/welfare/mine/isChoice', {projectId: this.projectId})
this.isChoice = resp.data
},
async getAutoSelect() {
const resp = await $.get('/mobile/welfare/mine/isAutoSelect', {projectId: this.projectId})
this.isAutoSelect = resp.data
}
}
}
@@ -0,0 +1,4 @@
<van-tabbar v-model="tarBarActive">
<van-tabbar-item icon="home-o" url="/mobile/welfare/list/index">首页</van-tabbar-item>
<van-tabbar-item icon="manager-o" url="/mobile/welfare/mine/index">我的</van-tabbar-item>
</van-tabbar>
@@ -0,0 +1,23 @@
<!--#
layout("/mobile/platform.html"){
#-->
<div id="app" v-cloak>
<van-cell-group inset>
<van-cell title="单元格" value="内容"></van-cell>
<van-cell title="单元格" value="内容" label="描述信息"></van-cell>
</van-cell-group>
</div>
<script>
var vue = new Vue({
el: '#app',
mixins: [mobileMixins],
data() {
return {}
}
})
</script>
<!--#
}
#-->
@@ -0,0 +1,244 @@
<!--#
layout("/mobile/platform.html"){
#-->
<style>
.van-card {
background: #ffffff;
margin: 10px 10px;
border-radius: 10px;
}
.van-card__thumb {
align-self: center;
}
.van-card__content > div {
height: 100%;
display: flex;
flex-direction: column;
}
.welfare_card {
position: relative;
}
.welfare_card .receive_img {
position: absolute;
right: 15px;
top: 0px;
}
.van-card__header {
height: 102px;
}
</style>
<div id="app" v-cloak>
<van-sticky>
<van-nav-bar title="福利列表" left-arrow
@click-left="history.go(-1)"></van-nav-bar>
</van-sticky>
<van-sticky>
<van-tabs v-model="pageForm.tabName" @change="tabChange">
<van-tab title="进行中" name="ing"></van-tab>
<van-tab title="已结束" name="end"></van-tab>
</van-tabs>
</van-sticky>
<template v-if="vLoading && !vLoading.value">
<van-list :finished="finished" :finished-text="tableData.length>0?'没有更多了':''"
v-if="tableData && tableData.length>0"
v-model="loading"
@load="pageData">
<template v-for="o in tableData">
<div class="welfare_card">
<van-card @click="welfareClick(o)">
<template #thumb>
<img :src="FILE_STREAM_PREVIEW_ADDRESS+'?id='+o.cover" alt=""
class="van-image__img"
v-if="o.cover">
<image v-else src="/assets/mobile/svg/welfare/welfareHome.svg"></image>
</template>
<template #title>
<div class="van-ellipsis"
style="font-size: 15px;font-weight: bold;line-height: 30px;">
{{o.name}}
</div>
</template>
<template #desc>
<div>
<template v-if="new Date().getTime()>moment(o.choiceTimeStart).valueOf()
&&new Date().getTime()<moment(o.choiceTimeEnd).valueOf()">
<div style="flex: 1.5">
选择开始时间:
{{moment(o.choiceTimeStart).format('YYYY/MM/DD HH:mm')}}
</div>
<div style="flex: 1.5">
选择结束时间:
{{moment(o.choiceTimeEnd).format('YYYY/MM/DD HH:mm')}}
</div>
</template>
<template v-else>
<div style="flex: 1.5">
发放开始时间:
{{moment(o.provideTimeStart).format('YYYY/MM/DD HH:mm')}}
</div>
<div style="flex: 1.5">
发放结束时间:
{{moment(o.provideTimeEnd).format('YYYY/MM/DD HH:mm')}}
</div>
</template>
<div class="van-ellipsis" style="flex: 1">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;称:{{o.gift}}</div>
</div>
</template>
</van-card>
<div class="receive_img">
<template v-if="new Date().getTime()>moment(o.choiceTimeStart).valueOf()
&&new Date().getTime()<moment(o.choiceTimeEnd).valueOf()">
<image v-if="o.isSelect&&!o.isReceive"
src="/assets/mobile/svg/welfare/yxz.png"></image>
<image v-else-if="!o.isSelect&&!o.isReceive"
src="/assets/mobile/svg/welfare/wxz.png"></image>
<image v-else-if="o.isSelect&&o.isReceive"
src="/assets/mobile/svg/welfare/ylq.png"></image>
<image v-else-if="o.isSelect&&!o.isReceive"
src="/assets/mobile/svg/welfare/wlq.png"></image>
</template>
<template v-else>
<!-- <div class="van-ellipsis"
style="font-size: 15px;font-weight: bold;flex: 2;color: rgb(24,103,179)"
v-if="o.isReceive">已发放
</div>
<div class="van-ellipsis"
style="font-size: 15px;font-weight: bold;flex: 2;color: rgb(24,103,179)"
v-else>未发放
</div>-->
<div style="size: 10px">
<image v-if="o.isReceive"
src="/assets/mobile/svg/welfare/ylq.png"></image>
<image v-else src="/assets/mobile/svg/welfare/wlq.png"></image>
</div>
</template>
</div>
</div>
</template>
</van-list>
<van-empty v-else description="暂无数据"></van-empty>
</template>
</div>
<script>
<!--#include("/mobile/welfare/include/mixins.js"){}#-->
var vue = new Vue({
el: '#app',
mixins: [mobileMixins, welfareMixins],
data() {
return {
tabName: 'ing',
tarBarActive: 0
}
},
methods: {
async welfareClick(o) {
const {
id,
provideMode,
flexible,
provideTimeEnd,
provideTimeStart,
choiceTimeEnd,
choiceTimeStart
} = o
const resp = await $.get('/mobile/welfare/mine/isReceive', {projectId: id})
const isReceive = resp.data
if (this.tabName === 'ing') {
if (flexible) {
if (moment().valueOf() < moment(provideTimeEnd).valueOf() &&
moment().valueOf() > moment(provideTimeStart).valueOf()) {
if (moment().valueOf() > moment(choiceTimeEnd).valueOf()) {
if (!o.isSelect) {
vant.Dialog.alert({
title: '提醒',
message: '您在规定时间内没有选择,无法领取!',
}).then(() => {
});
return
}
}
}
location.href = '/mobile/welfare/list/receive?projectId=' + id
} else {
location.href = '/mobile/welfare/list/receive_success?projectId=' + id + '&provideMode=' + provideMode
}
} else if (this.tabName === 'end') {
if (isReceive) {
location.href = '/mobile/welfare/list/receive_success?projectId=' + id + '&provideMode=' + provideMode
} else {
this.$toast('福利发放已结束')
}
}
},
async pageData() {
this.mLoading = true
const resp = await $.post('/mobile/welfare/list/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;
this.mLoading = false
},
tabChange(val) {
this.tabName = val
this.startLoading()
this.tableData = []
this.pageForm.pageNumber = 1
this.pageData()
this.closeLoading()
},
init() {
this.startLoading()
this.tarBarActive = Number(GetQueryString("tarBarActive"))
this.pageForm.tabName = 'ing'
this.pageData()
this.closeLoading()
}
},
created() {
this.init()
},
})
window.addEventListener('pageshow', e => {
if (e.persisted || (window.performance && window.performance.navigation.type === 2)) {
vue.onRefresh()
}
})
</script>
<!--#
}
#-->
@@ -0,0 +1,57 @@
<!--#
layout("/mobile/platform.html"){
#-->
<style>
#app {
background: #ffffff;
}
.desc {
padding: 10px;
word-wrap: break-word;
word-break: normal;
}
@media (max-width: 750px) {
img {
background-size: contain;
width: 90%;
height: auto;
margin: 0 auto;
display: block;
}
}
</style>
<div id="app" v-cloak>
<van-sticky>
<van-nav-bar @click-left="history.back()" left-arrow
title="详情"></van-nav-bar>
</van-sticky>
<div class="desc" v-html="desc"></div>
</div>
<script>
var vue = new Vue({
el: '#app',
mixins: [mobileMixins],
data() {
return {
desc: null
}
},
methods: {},
created() {
const id = GetQueryString("optionId")
if (id) {
this.desc = window.localStorage.getItem('welfare_option_desc_' + id)
}
}
})
</script>
<!--#
}
#-->
@@ -0,0 +1,912 @@
<!--#
layout("/mobile/platform.html"){
#-->
<style>
.van-cell-group--inset {
margin: 10px 16px !important;
overflow: hidden;
/*border-radius: 8px;*/
}
.selection:not(:last-child) {
border-bottom: 1px dashed lightgrey;
}
.selection .van-checkbox-group .van-cell, .selection .van-radio-group .van-cell {
flex-direction: row-reverse;
}
.selection .van-checkbox-group .van-cell .van-cell__title, .selection .van-radio-group .van-cell .van-cell__title {
padding-left: 20px;
}
.address-cell .van-cell__title {
flex: unset;
width: 70px;
overflow: hidden;
}
.address-cell .van-cell__value {
text-align: left;
display: flex;
align-items: baseline;
}
.van-empty {
position: absolute;
}
.van-collapse-item .van-collapse-item__title {
}
.selection .van-radio {
display: flex;
align-items: baseline;
}
.selection .van-cell__label {
max-height: 80px;
margin-left: 20px;
}
.selection .van-cell__label .welfare_img {
width: 100px;
height: 80px;
}
.welfare_img .van-image__error, .welfare_img .van-image__img, .welfare_img .van-image__loading {
border-radius: 10px;
margin-left: -35px;
}
.selection .van-cell__label .welfare_desc {
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
width: calc(100% - 25px);
padding: 0 20px;
line-height: 20px;
max-height: 80px;
/*position: relative;*/
}
.selection .van-cell__label .welfare_desc .more {
/*content:"更多";*/
position: absolute;
bottom: 0;
right: 10px;
color: #1867b0;
}
#signature {
height: 30vh;
background: #fff;
border: 1px dashed grey;
position: relative;
}
#signature .signature_reset {
position: absolute;
bottom: 2px;
right: 2px;
}
.welfare_optionType {
margin-left: 35px;
}
.van-image {
width: 140%;
height: 120%;
}
.desc img {
width: 100%;
}
</style>
<div id="app" v-cloak>
<van-sticky>
<van-nav-bar title="福利详情" left-arrow
@click-left="history.go(-1)"></van-nav-bar>
</van-sticky>
<template v-show="vLoading && !vLoading.value">
<!--基本信息-->
<van-collapse class="van-cell-group--inset" v-model="activeNames">
<van-collapse-item name="1">
<template #title>
<div style="font-weight: bold;font-size: 15px;display: flex;align-items: center">
<van-icon class="van-cell__left-icon" color="red" name="star"></van-icon>
福利信息
</div>
</template>
<van-cell-group class="--van-cell-group--inset">
<van-cell :border="false" :value="projectInfo.name" title="福利名称"></van-cell>
<van-cell :border="false" :value="projectInfo.festival" title="发放节日"></van-cell>
<van-cell :border="false" :value="projectInfo.gift" title="福利礼品"
v-if="!projectInfo.flexible"></van-cell>
<van-cell :border="false" :value="projectInfo.provideAddress"
title="发放地点"></van-cell>
<van-cell :border="false" title="是否多选">
{{projectInfo.isCheckBox==='checkBox'?'多选':'单选'}}
</van-cell>
<van-cell :border="false" :value="projectInfo.multiSelectNum" title="最多选几个"
v-if="projectInfo.isCheckBox==='checkBox'"></van-cell>
<van-cell :border="false" title="发放形式">
<template>
{{welfareProvideMode.find(v=>v.code==projectInfo.provideMode) &&
welfareProvideMode.find(v=>v.code==projectInfo.provideMode).description}}
</template>
</van-cell>
<van-cell :border="false" title="签收形式">
<template>
{{welfareSignMode.find(v=>v.code==projectInfo.signMode) &&
welfareSignMode.find(v=>v.code==projectInfo.signMode).description}}
</template>
</van-cell>
<van-cell :border="false" title="选择时间">
<template #label>
{{projectInfo.choiceTimeStart + ' 至 ' + projectInfo.choiceTimeEnd}}
</template>
</van-cell>
<van-cell :border="false" title="发放时间">
<template #label>
{{projectInfo.provideTimeStart + ' 至 ' + projectInfo.provideTimeEnd}}
</template>
</van-cell>
</van-cell-group>
</van-collapse-item>
</van-collapse>
<!--礼品套餐-->
<div v-if="projectInfo.flexible && [2,3,4].includes(projectInfo.provideMode) && projectInfo.welfareProjectSubjects && projectInfo.welfareProjectSubjects.length>0"
class="van-cell-group--inset"
style="margin:10px auto">
<div v-for="(subject,sidx) in projectInfo.welfareProjectSubjects" class="selection">
<van-radio-group v-model="subject.selection"
v-for="(option, oidx) in subject.options"
v-if="subject.subjectType==='radio'"
:disabled="(isProvideTime&&!isChoiceTime)||isReceive">
<van-cell style="margin-bottom: 10px;border-radius: 8px;height: 150px"
clickable
inset
center
@click="selectionClick(option,subject,option.id,option.disabled,oidx)"
:key="option.id"
title="">
<template #label>
<van-row>
<van-col span="10">
<div class="welfare_img" v-if="option.imgUrl">
<van-image
:src="FILE_STREAM_PREVIEW_ADDRESS+'?id='+option.imgUrl"
></van-image>
</div>
</van-col>
<van-col span="14">
<div class="welfare_desc">
<span style="font-weight: bold;font-size: 15px;color: #323233">{{option.optionName}}</span>
</div>
<div class="welfare_desc">
<van-tag type="primary" plain>
{{option.optionType}}
</van-tag>
</div>
<div class="welfare_desc" v-if="option.description">
{{removeHTMLTag(option.description?option.description:'').substr(0,25)+'...'}}
<a @click.stop="viewDesc(option.id,option.description)"
class="more"
href="#">查看更多</a>
</div>
</van-col>
</van-row>
</template>
<template #right-icon>
<van-radio :name="option.id" :disabled="option.disabled"
ref="radio"></van-radio>
</template>
</van-cell>
</van-radio-group>
<van-checkbox-group v-model="subject.selection"
v-if="subject.subjectType==='checkBox'"
:max="selectionMax"
:disabled="(isProvideTime&&!isChoiceTime)||isReceive"
@change="checkboxChange(subject.selection)">
<van-cell
v-for="(option, oidx) in subject.options"
style="margin-bottom: 10px;border-radius: 8px;padding-bottom: 40px"
clickable
inset
center
@click="checkBoxToggle('checkboxes-'+option.id,option,subject)"
:key="option.id">
<template #title>
<span v-if="option.isSystemDefault"
style="color: red">(默认选项您无需选择)</span>
</template>
<template #label>
<van-row>
<van-col span="10">
<div class="welfare_img" v-if="option.imgUrl">
<van-image
:src="FILE_STREAM_PREVIEW_ADDRESS+'?id='+option.imgUrl"
></van-image>
</div>
</van-col>
<van-col span="14">
<div class="welfare_desc">
<span style="font-weight: bold;font-size: 15px;color: #323233">{{option.optionName}}</span>
</div>
<div class="welfare_desc">
<van-tag type="primary" plain>
{{option.optionType}}
</van-tag>
</div>
<div class="welfare_desc" v-if="option.description">
{{removeHTMLTag(option.description).substr(0,25)+'...'}}
<a @click.stop="viewDesc(option.id,option.description)"
class="more"
href="#">查看更多</a>
</div>
</van-col>
</van-row>
</template>
<template #right-icon>
<van-checkbox :name="option.id"
:disabled="option.isSystemDefault"
:ref="'checkboxes-'+option.id"></van-checkbox>
</template>
</van-cell>
</van-checkbox-group>
<!--不要删除-->
<!-- <van-cell v-for="(option, oidx) in subject.options"
style="margin-bottom: 10px;border-radius: 8px;">
<template #icon>
<van-icon class="van-cell__left-icon" name="fire" color="red"></van-icon>
</template>
<template #title>
<span style="font-weight: bold;font-size: 15px">{{option.optionName}}</span>
<van-radio-group v-model="subject.selection"
v-if="subject.subjectType==='radio'"
:disabled="(isProvideTime&&!isChoiceTime)||isReceive">
<van-cell
:border="false"
clickable
center
@click="selectionClick(option,subject,option.id,option.disabled,oidx)"
:key="option.id"
title="">
<template #label>
<van-row>
<van-col span="10">
<div class="welfare_img" v-if="option.imgUrl">
<van-image
:src="FILE_STREAM_PREVIEW_ADDRESS+'?id='+option.imgUrl"
height="80"
width="100"
></van-image>
</div>
</van-col>
<van-col span="14">
<div class="welfare_desc" v-if="option.description">
{{removeHTMLTag(option.description).substr(0,25)+'...'}}
<a @click.stop="viewDesc(option.id,option.description)"
class="more"
href="#"
v-if="removeHTMLTag(option.description).length>25">查看更多</a>
</div>
<div class="welfare_desc">
<van-tag type="primary" plain>
{{option.optionType}}
</van-tag>
</div>
</van-col>
</van-row>
</template>
<template #right-icon>
<van-radio :name="option.id" :disabled="option.disabled"
ref="radio"></van-radio>
</template>
</van-cell>
</van-radio-group>
<van-checkbox-group v-model="subject.selection"
v-if="subject.subjectType==='checkBox'"
:max="selectionMax"
:disabled="(isProvideTime&&!isChoiceTime)||isReceive"
@change="checkboxChange(subject.selection)">
<van-cell
v-for="(option, oidx) in subject.options"
:border="false"
clickable
@click="checkBoxToggle('checkboxes-'+option.id,option,subject)"
:key="option.id">
<template #title>
<span style="font-weight:bold ">{{option.optionName}}</span>
<span v-if="option.isSystemDefault"
style="color: red">(默认选项您无需选择)</span>
</template>
<template #label>
<van-row>
<van-col span="10">
<div class="welfare_img" v-if="option.imgUrl">
<van-image
:src="FILE_STREAM_PREVIEW_ADDRESS+'?id='+option.imgUrl"
height="80"
width="100"
></van-image>
</div>
</van-col>
<van-col span="14">
<div class="welfare_desc" v-if="option.description">
{{removeHTMLTag(option.description).substr(0,25)+'...'}}
<a @click.stop="viewDesc(option.id,option.description)"
class="more"
href="#"
v-if="removeHTMLTag(option.description).length>25">查看更多</a>
</div>
<div class="welfare_desc">
<van-tag type="primary" plain>
{{option.optionType}}
</van-tag>
</div>
</van-col>
</van-row>
</template>
<template #right-icon>
<van-checkbox :name="option.id"
:disabled="option.isSystemDefault"
:ref="'checkboxes-'+option.id"></van-checkbox>
</template>
</van-cell>
</van-checkbox-group>
</template>
</van-cell>-->
</div>
</div>
<div v-if="isChoiceTime&&!isReceive&&!projectInfo.isRoutine&&optionType!=='套餐'"
class="van-cell-group--inset"
style="margin:10px auto">
<van-cell>
<template #icon>
<van-icon class="van-cell__left-icon" name="setting-o"
:color="themeColor"></van-icon>
</template>
<template #title>
<div style="font-weight: bold;font-size: 15px">
是否开启本年福利自动选择当前提货券(可在下次选择福利或在本次福利选择时段取消)
</div>
<van-cell center title="">
<template #right-icon>
<van-switch v-model="isAutoSelect" size="24" :active-color="themeColor"
inactive-color="#dcdee0"></van-switch>
</template>
</van-cell>
</template>
</van-cell>
</div>
<!--邮寄到家-->
<div v-if="projectInfo.provideMode===3&&optionType==='套餐'" class="van-cell-group--inset">
<van-cell>
<template #icon>
<van-icon class="van-cell__left-icon" name="location" color="red"></van-icon>
</template>
<template #title>
<div style="font-weight: bold;font-size: 15px">收货地址</div>
</template>
</van-cell>
<van-cell title="收获地址" is-link class="address-cell" @click="clickSelectAddressPopup">
<template>
<span v-if="$.isEmptyObject(selectAddress)">请选择地址</span>
<span v-else>
{{selectAddress.province + selectAddress.city + selectAddress.county + selectAddress.address}}
</span>
</template>
</van-cell>
</div>
<!--电子签字-->
<div v-if="projectInfo.signMode===2
&& isProvideTime"
class="van-cell-group--inset">
<van-cell>
<template #icon>
<van-icon class="van-cell__left-icon" name="location" color="red"></van-icon>
</template>
<template #title>
<div style="font-weight: bold;font-size: 15px">电子签名</div>
</template>
</van-cell>
<van-cell title="">
<template #label>
<div id="signature">
<van-tag type="danger" class="signature_reset" @click="resetSignature">重写
</van-tag>
</div>
</template>
</van-cell>
</div>
<!-- 选择时间段出现-->
<div v-if="isChoiceTime&&!isReceive"
style="margin: 20px 20px 10px 20px">
<van-button
@click="doChoice" style="border-radius: 10px" block type="info"
:color="themeColor">
{{isChoice?'重新选择':'选择'}}
</van-button>
</div>
<!-- 发放时间段出现-->
<div v-if="isProvideTime&&!isReceive&&isChoice"
style="margin: 20px 20px 10px 20px">
<van-button
@click="doReceive" style="border-radius: 10px" block type="info"
:color="themeColor">
确认发放
</van-button>
</div>
</template>
<van-popup v-model="selectAddressPopup" closeable position="bottom" :style="{ height: '70%' }"
safe-area-inset-bottom>
<div style="height: 100%">
<div style="font-size: 15px;font-weight: bold;text-align: center;padding-top: 16px;">
配送至
</div>
<template v-if="addressList && addressList.length>0">
<van-cell v-for="item in addressList" icon="location-o" clickable
@click="selectAddress = item;selectAddressPopup=false">
<template #title>
{{item.address}}
</template>
<template #label>
<div>{{"地区:" + item.province + item.city + item.county}}</div>
<div>{{"收件人:" + item.name}}</div>
<div>{{"联系方式:" + item.tel}}</div>
</template>
</van-cell>
</template>
<van-empty v-else description="暂无地址"></van-empty>
<div style="position: absolute;bottom: 0;left: 0;box-sizing: border-box;width: 100%;padding: 0 16px;background: #fff">
<van-button @click="doAddress" block round
type="danger"
style="height: 40px;margin: 5px 0">
地址管理
</van-button>
</div>
</div>
</van-popup>
<van-popup v-model="descPopup" position="right" :style="{ height: '100%',width: '100%'}"
safe-area-inset-bottom>
<van-sticky>
<van-nav-bar @click-left="descPopup=false" left-arrow
title="详情"></van-nav-bar>
</van-sticky>
<div class="desc" v-html="desc" @click="descClick($event)"></div>
</van-popup>
</div>
<script>
<!--#include("/mobile/welfare/include/mixins.js"){}#-->
var vue = new Vue({
el: '#app',
mixins: [mobileMixins, welfareMixins],
data() {
return {
desc: "",
optionType: "",
shoppingTypeOptions: [],
selectionMax: 0,
isProvideTime: false,
isSelectCard: false,
isChoiceTime: false,
activeNames: [],
tabName: 'ing',
tarBarActive: 0,
projectId: null,
projectInfo: {},
welfareProvideMode: [],
welfareSignMode: [],
selectAddressPopup: false,
selectAddress: {},
mySignature: null,
userSign: {
data: null
},
imagePreview: false,
userSelection: [],
descPopup: false
}
},
methods: {
descClick(e) {
if (e.target.tagName === 'IMG') {
vant.ImagePreview([e.target.src])
}
},
doAddress() {
location.href = '/mobile/welfare/mine/address'
window.sessionStorage.setItem('welfareProjectId', this.projectId)
},
checkboxChange(selection) {
},
clickSelectAddressPopup() {
if (this.isProvideTime && !this.isChoiceTime) {
vant.Toast('福利发放中暂无法修改')
} else {
this.selectAddressPopup = true
}
},
selectionClick(option, selection, id, disabled, oidx) {
this.optionType = option.optionType
this.isAutoSelect = option.optionType !== "套餐"
if ((this.isProvideTime && !this.isChoiceTime) || this.isReceive) {
return
}
if (!this.isProvideTime) {
selection.selection = id
}
this.$refs.radio[oidx].toggle()
},
async findOne() {
const resp = await $.get('/mobile/welfare/list/findOne', {projectId: this.projectId})
if (resp.code === 0) {
if (resp.data.flexible) {
this.userSelection = await this.getUserSelection(this.projectId)
await this.initSubject(resp.data)
}
if (resp.data.isCheckBox === "checkBox") {
//找出默认选项赋值,默认选项用户不需要选
const {options, selection} = resp.data.welfareProjectSubjects[0]
const option = options.find(o => o.isSystemDefault)
this.selectionMax = option ? (resp.data.multiSelectNum + 1) : resp.data.multiSelectNum
//如果有必选就加到已选择
if (option && selection.length === 0) {
selection.push(option.id)
}
} else {
//找出今年第一次福利是否开启了是否常规福利
//如果不是常规福利,用户在第一次福利选择了购物卡以后的每次福利都是购物卡,并默认给选择第一次选的的那个卡
//如果是常规的不做判断
//找出今年第一次福利信息
const welfare = await $.get("/mobile/welfare/list/getWelfareOneByYear", {year: moment().format('YYYY')})
//如果第一次福利不是常规福利
const welfareData = welfare.data
if (welfareData && !welfareData.isRoutine && welfareData.id !== this.projectId) {
this.isSelectCard = true
}
}
resp.data.multiSelectNum = resp.data.multiSelectNum ? resp.data.multiSelectNum : 1
this.projectInfo = resp.data
if (this.projectInfo.provideMode === 3) {
await this.selectAddressList()
const defaultAddress = this.addressList.find(v => v.isDefault)
this.selectAddress = defaultAddress ? defaultAddress : {}
}
if (this.projectInfo.signMode === 2) {
const resp = await $.get('/mobile/welfare/mine/getMySignature')
this.userSign = resp.data
setTimeout(() => {
$('#signature').jSignature({
width: '100%',
height: '100%',
lineWidth: 1
})
if (this.userSign.data) {
$('#signature').jSignature("setData", this.userSign.data)
}
}, 1000)
}
}
},
async initSubject(data) {
if (data.welfareProjectSubjects && data.welfareProjectSubjects.length > 0) {
data.welfareProjectSubjects && data.welfareProjectSubjects.forEach(v => {
if (v.subjectType === 'checkBox') {
if (this.userSelection && this.userSelection.length > 0) {
v.selection = this.userSelection.filter(s => s.subjectId === v.id).map(s => s.selectOptionId)
} else {
v.selection = []
}
}
if (v.subjectType === 'radio') {
if (this.userSelection && this.userSelection.length > 0) {
const selection = this.userSelection.find(s => s.subjectId === v.id)
if (selection) {
v.selection = selection.selectOptionId
}
} else {
v.selection = null
}
}
})
}
},
checkBoxToggle(checkBoxRefId, option, subject) {
this.optionType = option.optionType
if (this.isProvideTime && this.isChoice) {
return;
}
if (option.isSystemDefault) {
vant.Toast('此福利是必选您无需选择')
return
}
this.$refs[checkBoxRefId][0].toggle()
},
addressClick(item) {
this.selectAddress = item
},
validateOption(welfareProjectSubjects) {
return !welfareProjectSubjects.some(v => {
if (v.subjectType === 'checkBox' && v.selection.length === 0) {
return true
}
return v.subjectType === 'radio' && (v.selection === '' || v.selection == null);
})
},
resetSignature() {
$('#signature').jSignature('clear')
this.userSign.data = null
},
async saveSignature() {
const sign = $('#signature').jSignature("getData", "default")
this.userSign.data = sign
await $.post('/mobile/welfare/mine/saveMySignature', this.userSign)
},
async doChoice() {
const {
flexible,
provideMode,
signMode,
welfareProjectSubjects,
multiSelectNum,
gift,
provideTimeStart
} = this.projectInfo
if (flexible && welfareProjectSubjects && welfareProjectSubjects.length > 0) {
if (!this.validateOption(welfareProjectSubjects)) {
this.$toast('请选择福利')
return
}
}
if (signMode === 2
&& this.isProvideTime
&& $("#signature").jSignature('getData', 'native').length === 0
&& !this.userSign.data) {
this.$toast('请先签字!')
return
}
const selection = this.projectInfo.welfareProjectSubjects[0].selection
const optionsLength = welfareProjectSubjects[0].options.filter(v => v.isSystemDefault).length
let selectionNum = optionsLength === 1 ? (selection.length - 1) : selection.length
if (selectionNum < multiSelectNum) {
vant.Toast('请您选择' + multiSelectNum + '个,方可提交!')
return
}
if (signMode === 2) {
await this.saveSignature()
}
let formData = {}
formData.projectId = this.projectInfo.id
formData.isAutoSelect = this.isAutoSelect
formData.mySignature = this.userSign.data
formData.answers = JSON.stringify(this.projectInfo.welfareProjectSubjects)
const {province, city, county, address, name, tel} = this.selectAddress
formData.receiveAddress = "收获地址:" + province + city + county + address + "," + "收件人:" + name + "," + "联系方式:" + tel
const optionNames = this.projectInfo.welfareProjectSubjects[0].options
let optionName = ""
if (provideMode === 3 && $.isEmptyObject(this.selectAddress) && this.optionType === "套餐") {
this.$toast('请选择收货地址')
return
} else if (this.optionType !== "套餐") {
formData.receiveAddress = null
}
if (this.projectInfo.isCheckBox === "checkBox") {
const ff = optionNames.filter(o => selection.includes(o.id))
const names = ff.map(f => f.optionName)
optionName = names.join(",")
} else {
const names = optionNames.find(o => o.id === selection)
optionName = names.optionName
}
const aa = "您确认将【" + gift + "】修改为【" + optionName + "】吗?"
let msg = this.isChoice ? aa : '您确认要选择吗?'
const confirm = await vant.Dialog.confirm({
title: '选择结果',
message: msg,
})
if (confirm) {
const loading = this.$toast.loading({
message: '领取中...',
forbidClick: true,
overlay: true,
duration: 0
})
const resp = await $.post('/mobile/welfare/mine/doChoice', formData)
await this.getReceive()
loading.close()
if (resp.code === 0) {
window.location.href = '/mobile/welfare/list/receive_success?projectId=' + this.projectId + '&provideMode=' + this.projectInfo.provideMode + "&code=1"
}
}
},
async doReceive() {
const {
flexible,
provideMode,
signMode,
welfareProjectSubjects,
provideTimeEnd,
provideTimeStart,
} = this.projectInfo
if (this.isProvideTime
&& signMode === 2
&& $("#signature").jSignature('getData', 'native').length === 0
&& !this.userSign.data) {
this.$toast('请先签字!')
return
}
if (signMode === 2) {
this.saveSignature()
}
let formData = {}
formData.projectId = this.projectInfo.id
formData.mySignature = this.userSign.data
const confirm = await vant.Dialog.confirm({
title: '标题',
message: '您确定要签收吗?',
})
if (confirm) {
const loading = this.$toast.loading({
message: '领取中...',
forbidClick: true,
overlay: true,
duration: 0
})
const resp = await $.post('/mobile/welfare/mine/doReceive', formData)
await this.getReceive()
loading.close()
if (resp.code === 0) {
window.location.href = '/mobile/welfare/list/receive_success?projectId=' + this.projectId + '&provideMode=' + this.projectInfo.provideMode + "&code=2"
// this.$toast.success('领取成功')
}
}
},
async getUserSelection(projectId) {
const resp = await $.get('/mobile/welfare/mine/getUserSelection', {projectId: projectId})
return resp.data
},
viewDesc(optionId, desc) {
this.desc = desc
// window.localStorage.setItem("welfare_option_desc_" + optionId, desc)
// window.location.href = '/mobile/welfare/list/option_desc?optionId=' + optionId
this.descPopup = true
},
async init() {
this.startLoading()
const id = GetQueryString("projectId")
if (id) {
this.projectId = id
await this.findOne()
const {
choiceTimeEnd,
choiceTimeStart,
provideTimeEnd,
provideTimeStart
} = this.projectInfo
//判断是否在选择时间段
if (moment().valueOf() < moment(choiceTimeEnd).valueOf() &&
moment().valueOf() > moment(choiceTimeStart).valueOf()) {
this.isChoiceTime = true
}
//判断是否在发放时间段
if (moment().valueOf() < moment(provideTimeEnd).valueOf() &&
moment().valueOf() > moment(provideTimeStart).valueOf()) {
this.isProvideTime = true
}
await this.getReceive()
await this.getChoice()
await this.getAutoSelect()
this.welfareProvideMode = await getEnumOptions("WelfareProvideMode")
this.welfareSignMode = await getEnumOptions("WelfareSignMode")
}
const loginname = "${@shiro.getPrincipalProperty('loginname')}";
const {data} = await $.post("/platform/welfare/list/mange/pageData", {
searchName: "loginname",
searchKeyword: loginname,
projectId: id,
pageNumber: 1,
pageSize: 1,
})
if (data.list && data.list.length > 0) {
this.optionType = data.list[0].receiveAddress ? "套餐" : null
}
if (this.isSelectCard) {
vant.Dialog.alert({
message: '因为您开启了本年自动选择福利,您上次选择了购物卡,您现在默认选择上一次选择的选项',
}).then(() => {
// on close
});
}
this.closeLoading()
}
},
async created() {
this.init()
},
})
window.addEventListener('pageshow', e => {
if (e.persisted || (window.performance && window.performance.navigation.type === 2)) {
vue.init()
}
})
</script>
<!--#
}
#-->
@@ -0,0 +1,72 @@
<!--#
layout("/mobile/platform.html"){
#-->
<style>
#app {
background: #ffffff;
}
</style>
<div id="app" v-cloak>
<van-sticky>
<van-nav-bar :title="title" left-arrow
@click-left="history.back()"></van-nav-bar>
</van-sticky>
<div style="text-align: center;margin-top: 200px;">
<svg t="1642388297798" class="icon" viewBox="0 0 1024 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="3082" width="80" height="80">
<path d="M37.36963 583.753525a440.246475 430.879529 90 1 0 861.759058 0 440.246475 430.879529 90 1 0-861.759058 0Z"
fill="#07C160" p-id="3083"></path>
<path d="M247.376566 529.799914L391.065522 674.425565l299.742281-299.742281 59.948456 59.948456-359.690737 358.754043L187.240771 589.748371z"
fill="#FFFFFF" p-id="3084"></path>
<path d="M955.330366 240.548613h-83.927839a30.723584 30.723584 0 0 0-31.472939 30.161567v1.124034a30.910923 30.910923 0 0 0 30.348906 31.472939H955.330366a30.723584 30.723584 0 0 0 31.2856-30.348906v-1.124033A30.536245 30.536245 0 0 0 955.330366 240.548613z m-72.125487-168.605033a32.222295 32.222295 0 0 0-43.837308 4.121457L786.725333 141.071644a31.285601 31.285601 0 0 0 48.146104 39.903191l52.080221-64.819268a30.536245 30.536245 0 0 0-2.810084-42.900614zM683.126907 0.005433a30.910923 30.910923 0 0 0-31.47294 30.161567v84.864533a30.723584 30.723584 0 0 0 30.348906 31.285601h1.124034a30.536245 30.536245 0 0 0 31.2856-30.161567V31.291033A30.723584 30.723584 0 0 0 684.25094 0.005433z"
fill="#07C160" p-id="3085"></path>
</svg>
<div style="margin-top: 20px;">{{code=='2' ? '您已领取' : '您已选择'}}</div>
<div style="margin: 20px auto 0px auto;width: 300px;word-break: break-all">
福利品: {{selectOptionNames}}
</div>
<van-button style="margin-top: 20px;width: 100px" size="small" hairline type="primary"
@click="back">返回
</van-button>
</div>
</div>
<script>
<!--#include("/mobile/welfare/include/mixins.js"){}#-->
var vue = new Vue({
el: '#app',
mixins: [mobileMixins, welfareMixins],
data() {
return {
selectOptionNames: null
}
},
methods: {
async getUserSelection() {
const resp = await $.get('/mobile/welfare/mine/getUserSelect', {projectId: this.projectId})
this.selectOptionNames = resp.data
},
back() {
window.history.go(-1)
}
},
created() {
const id = GetQueryString("projectId")
if (id) {
this.projectId = id
this.getUserSelection()
}
this.provideMode = GetQueryString("provideMode")
this.code = GetQueryString("code")
this.title = this.code === '1' ? "选择结果" : '领取结果'
}
})
</script>
<!--#
}
#-->
@@ -0,0 +1,74 @@
<!--#
layout("/mobile/platform.html"){
#-->
<style>
.van-cell-group--inset {
margin: 0 16px;
overflow: hidden;
border-radius: 8px;
}
.bottom-button {
width: 160px;
height: 40px;
}
.van-button {
position: initial !important;
}
</style>
<div id="app" v-cloak>
<van-sticky>
<van-nav-bar title="地址管理" left-arrow
@click-left="history.go(-1)"></van-nav-bar>
</van-sticky>
<div v-if="vLoading && !vLoading.value">
<van-address-list
v-if="addressList && addressList.length>0 "
v-model="chosenAddressId"
:list="addressList"
default-tag-text="默认"
@add="onAdd"
@edit="onEdit"
></van-address-list>
<van-empty v-else description="暂无地址">
<van-button round type="danger" class="bottom-button" @click="onAdd">新增地址</van-button>
</van-empty>
</div>
</div>
<script>
<!--#include("/mobile/welfare/include/mixins.js"){}#-->
var vue = new Vue({
el: '#app',
mixins: [mobileMixins, welfareMixins],
data() {
return {
chosenAddressId: null
}
},
methods: {
onAdd() {
window.location.href = '/mobile/welfare/mine/addressEdit'
},
onEdit(item, index) {
window.location.href = '/mobile/welfare/mine/addressEdit?id=' + item.id
}
},
async created() {
this.startLoading()
await this.selectAddressList()
this.closeLoading()
}
})
</script>
<!--#
}
#-->
@@ -0,0 +1,109 @@
<!--#
layout("/mobile/platform.html"){
#-->
<style>
.van-cell-group--inset {
margin: 0 16px;
overflow: hidden;
border-radius: 8px;
}
</style>
<div id="app" v-cloak>
<van-sticky>
<van-nav-bar title="地址管理" left-arrow placeholder fixed
@click-left="location.href = '/mobile/welfare/mine/address'"></van-nav-bar>
</van-sticky>
<div v-if="vLoading && !vLoading.value">
<van-address-edit
ref="address"
:area-list="areaList"
:show-delete="addressId"
:address-info="addressInfo"
show-set-default
show-search-result
tel-maxlength="11"
:area-columns-placeholder="['请选择', '请选择', '请选择']"
@save="onSave"
@delete="onDelete"
></van-address-edit>
</div>
</div>
<script>
<!--#include("/mobile/welfare/include/areaList.js"){};include("/mobile/welfare/include/mixins.js"){}#-->
var vue = new Vue({
el: '#app',
mixins: [mobileMixins, welfareMixins],
data() {
return {
areaList: areaList,
addressInfo: {},
addressId: null
};
},
methods: {
async onSave(content) {
const loading = this.$toast.loading({
message: '保存中...',
forbidClick: true,
overlay: true,
duration: 0
})
content.userName = content.name
const resp = await $.post('/mobile/welfare/mine/doSaveUserAddress', content)
loading.close()
if (resp.code === 0) {
this.$toast.success(resp.msg)
setTimeout(() => {
let welfareProjectId = window.sessionStorage.getItem("welfareProjectId");
if (welfareProjectId) {
window.location.href = '/mobile/welfare/list/receive?projectId=' + welfareProjectId
window.sessionStorage.removeItem("welfareProjectId");
} else {
window.location.href = '/mobile/welfare/mine/address'
}
}, 1000)
}
},
async onDelete(content) {
const loading = this.$toast.loading({
message: '删除中...',
forbidClick: true,
overlay: true,
duration: 0
})
const resp = await $.post('/mobile/welfare/mine/deleteAddress', {id: content.id})
loading.close()
if (resp.code === 0) {
this.$toast.success(resp.msg)
setTimeout(() => {
window.location.href = '/mobile/welfare/mine/address'
}, 1000)
}
}
},
async created() {
this.startLoading()
this.addressId = GetQueryString("id") === '' ? null : GetQueryString("id")
if (this.addressId) {
const resp = await $.get('/mobile/welfare/mine/findOneUserAddress', {id: this.addressId})
if (resp.code === 0) {
this.addressInfo = resp.data
}
this.closeLoading()
} else {
this.addressInfo.name = "${@shiro.getPrincipalProperty('username')}";
this.closeLoading()
}
}
})
</script>
<!--#
}
#-->
@@ -0,0 +1,63 @@
<!--#
layout("/mobile/platform.html"){
#-->
<style>
.van-cell-group--inset {
margin: 0 16px;
overflow: hidden;
border-radius: 8px;
}
</style>
<div id="app" v-cloak>
<van-sticky>
<van-nav-bar title="个人信息" left-arrow placeholder fixed
@click-left="history.back()"></van-nav-bar>
</van-sticky>
<div class="mt10" v-if="vLoading && !vLoading.value">
<van-cell-group class="van-cell-group--inset">
<van-cell>
<template #title>
<div style="font-weight: bold;font-size: 15px">个人信息</div>
</template>
</van-cell>
<van-cell :border="false" is-link title="我的福利" url="/mobile/welfare/mine/myWelfare">
<template #icon>
<van-icon class="van-cell__left-icon" color="red" name="star"></van-icon>
</template>
</van-cell>
<van-cell :border="false" is-link title="我的地址" url="/mobile/welfare/mine/address">
<template #icon>
<van-icon class="van-cell__left-icon" color="red" name="location"></van-icon>
</template>
</van-cell>
<van-cell :border="false" is-link title="我的签名" url="/mobile/welfare/mine/sign">
<template #icon>
<van-icon class="van-cell__left-icon" color="red" name="coupon"></van-icon>
</template>
</van-cell>
</van-cell-group>
</div>
</div>
<script>
<!--#include("/mobile/welfare/include/mixins.js"){}#-->
var vue = new Vue({
el: '#app',
mixins: [mobileMixins, welfareMixins],
data() {
return {
tarBarActive: 1
}
},
created() {
this.startLoading()
this.closeLoading()
}
})
</script>
<!--#
}
#-->
@@ -0,0 +1,206 @@
<!--#
layout("/mobile/platform.html"){
#-->
<style>
.content {
padding: 10px;
}
.base-one-circle {
width: 100%;
min-height: 100px;
padding: 10px 0;
position: relative;
display: flex;
background: radial-gradient(circle at left bottom, transparent 10px, #fff 0) top left / 40% 50% no-repeat,
radial-gradient(circle at left top, transparent 10px, #fff 0) bottom left /40% 50% no-repeat,
radial-gradient(circle at right bottom, transparent 10px, #fff 0) top right /60% 50% no-repeat,
radial-gradient(circle at right top, transparent 10px, #fff 0) bottom right /60% 50% no-repeat;
margin-bottom: 10px;
border-radius: 10px;
}
.base-one-circle .left_img {
min-width: 100px;
width: 120px;
display: flex;
justify-content: center;
align-items: center;
margin-right: 10px;
margin-left: 15px;
}
.base-one-circle .right_content {
flex: 1;
max-width: calc(100% - 120px);
width: calc(100% - 120px);
padding-left: 10px;
}
.welfare_name {
width: calc(100% - 50px);;
max-width: 100%;
word-break: break-word;
height: 40px;
line-height: 30px;
}
.welfare_time {
height: 25px;
line-height: 15px;
font-size: 12px;
color: gray
}
.welfare_gift {
font-size: 12px;
color: gray;
margin-top: 10px;
line-height: 15px;
display: flex;
}
.receive_img {
position: absolute;
right: 0;
top: 10px;
}
.van-image__img {
border-radius: 10px;
object-fit: revert;
}
</style>
<div id="app" v-cloak>
<van-sticky>
<van-nav-bar title="我的福利" left-arrow
@click-left="history.go(-1)"></van-nav-bar>
</van-sticky>
<van-tabs v-model="tabActive" @change="tabChange">
<van-tab title="全部"></van-tab>
<van-tab title="已领取"></van-tab>
<van-tab title="未领取"></van-tab>
</van-tabs>
<div class="content">
<template v-for="item in welfareList">
<div class="base-one-circle">
<div class="left_img">
<img :src="FILE_STREAM_PREVIEW_ADDRESS+'?id='+item.cover" alt="" class="van-image__img"
v-if="item.cover">
<image v-else src="/assets/mobile/svg/welfare/welfareHome.svg"></image>
</div>
<div class="right_content">
<div class="welfare_name van-ellipsis">【{{item.name}}】</div>
<div class="welfare_time">
<template v-if="new Date().getTime()>moment(item.choiceTimeStart).valueOf()
&&new Date().getTime()<moment(item.choiceTimeEnd).valueOf()">
<div style="flex: 1">选择开始时间:{{item.choiceTimeStart}}</div>
<div style="flex: 1">选择结束时间:{{item.choiceTimeEnd}}</div>
</template>
<template v-else>
<div style="flex: 1">发放开始时间:{{item.provideTimeStart}}</div>
<div style="flex: 1">发放结束时间:{{item.provideTimeEnd}}</div>
</template>
</div>
<div class="welfare_gift">
<div style="width: 60px;" v-if="item.isReceive">已领礼品:</div>
<div style="width: 60px;" v-if="!item.isReceive">已选礼品:</div>
<div style="width: calc(100% - 60px);word-break: break-word">
{{item.flexible?item.optionName:item.gift}}
</div>
</div>
<div class="welfare_gift" v-if="item.provideMode===3">
<div style="width: 60px;">快递单号:</div>
<div>
{{item.courierNumber}}
</div>
</div>
</div>
<div class="receive_img">
<template v-if="new Date().getTime()>moment(item.choiceTimeStart).valueOf()
&&new Date().getTime()<moment(item.choiceTimeEnd).valueOf()">
<div class="van-ellipsis"
style="font-size: 15px;font-weight: bold;flex: 2;color: rgb(24,103,179);margin-right: 5px;"
v-if="item.isChoice">已选择
</div>
<div class="van-ellipsis"
style="font-size: 15px;font-weight: bold;flex: 2;color: rgb(24,103,179);margin-right: 5px;"
v-else>未选择
</div>
<!-- <image v-if="o.isSelect" src="/assets/mobile/svg/welfare/ylq.svg"></image>
<image v-else src="/assets/mobile/svg/welfare/wlq.svg"></image>-->
</template>
<template v-else>
<div class="van-ellipsis"
style="font-size: 15px;font-weight: bold;flex: 2;color: rgb(24,103,179);margin-right: 5px;"
v-if="item.isReceive">已发放
</div>
<div class="van-ellipsis"
style="font-size: 15px;font-weight: bold;flex: 2;color: rgb(24,103,179);margin-right: 5px;"
v-else>未发放
</div>
<!-- <image v-if="o.isSelect" src="/assets/mobile/svg/welfare/ylq.svg"></image>
<image v-else src="/assets/mobile/svg/welfare/wlq.svg"></image>-->
</template>
</div>
</div>
</template>
</div>
</div>
<script>
<!--#include("/mobile/welfare/include/mixins.js"){}#-->
var vue = new Vue({
el: '#app',
mixins: [mobileMixins, welfareMixins],
data() {
return {
fullWelfareList: [],
welfareList: [],
tabActive: 0
}
},
methods: {
async getData() {
const resp = await $.post('/mobile/welfare/mine/getMyWelfare', {tabActive: this.tabActive})
this.fullWelfareList = resp.data
this.welfareList = resp.data
},
tabChange(val) {
if (val === 0) {
this.welfareList = this.fullWelfareList
}
switch (val) {
case 0: {
this.welfareList = this.fullWelfareList
break
}
case 1: {
this.welfareList = this.fullWelfareList.filter(v => v.isReceive || [1].includes(v.provideMode))
break
}
case 2: {
this.welfareList = this.fullWelfareList.filter(v => !v.isReceive)
break
}
}
}
},
created() {
this.startLoading()
this.getData()
this.closeLoading()
}
})
</script>
<!--#
}
#-->
@@ -0,0 +1,126 @@
<!--#
layout("/mobile/platform.html"){
#-->
<style>
#app {
background: #FFFFFF;
}
#signature {
/*height: calc(100vh - 136px);*/
height: 300px;
background: #fff;
border: 1px dashed grey;
margin: 10px;
}
.button-operation {
display: flex;
height: 50px;
align-items: center;
position: fixed;
/*bottom: 0;*/
width: 100%;
margin: 10px 0;
}
.button-operation > div {
flex: 1;
text-align: center;
margin: 0 10px;
}
.button-operation > div > button {
width: 100%;
}
</style>
<div id="app" v-cloak>
<van-sticky>
<van-nav-bar title="我的签名" left-arrow
@click-left="history.go(-1)"></van-nav-bar>
</van-sticky>
<div id="signature"></div>
<div class="button-operation">
<div>
<van-button type="danger" @click="reset">重写</van-button>
</div>
<div>
<van-button type="info" @click="save">保存</van-button>
</div>
</div>
</div>
<script>
<!--#include("/mobile/welfare/include/mixins.js"){}#-->
var vue = new Vue({
el: '#app',
mixins: [mobileMixins, welfareMixins],
data() {
return {
userSign: {
data: null
}
}
},
methods: {
reset() {
const val = $('#signature').jSignature("getData", "default")
$('#signature').jSignature('clear')
this.userSign.data = null
},
async save() {
const slength = $("#signature").jSignature('getData', 'native').length
if (slength === 0 && !this.userSign.data) {
this.$toast('请先签字!')
return
}
const loading = this.$toast.loading({
message: '保存中...',
forbidClick: true,
overlay: true,
duration: 0
})
this.userSign.data = $('#signature').jSignature("getData", "default")
const resp = await $.post('/mobile/welfare/mine/saveMySignature', this.userSign)
loading.close()
if (resp.code === 0) {
this.userSign = resp.data
this.$toast.success('保存成功!')
}
},
async getSignature() {
const resp = await $.get('/mobile/welfare/mine/getMySignature')
if (resp.code === 0) {
this.userSign = resp.data
if (this.userSign.data) {
$('#signature').jSignature("setData", resp.data.data)
// $('#signature').jSignature("importData", resp.data.data)
}
}
}
},
mounted() {
$('#signature').jSignature({
width: '100%',
height: '100%',
lineWidth: 1
})
document.body.addEventListener('touchmove', function (e) {
e.preventDefault(); //阻止默认的处理方式(阻止下拉滑动的效果)
}, {passive: false}); //passive 参数不能省略,用来兼容ios和android
},
created() {
this.getSignature()
}
})
</script>
<!--#
}
#-->