first commit
This commit is contained in:
@@ -0,0 +1,557 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
<style>
|
||||
.table-list .collapse .van-cell__left-icon {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.table-list .table-card .goodsPm {
|
||||
font-size: 13px;
|
||||
background-color: rgb(253, 247, 229);
|
||||
color: rgb(202, 156, 108);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.table-list .table-card .goodsYxz {
|
||||
font-size: 13px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 30px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-sticky>
|
||||
<van-nav-bar
|
||||
@click-left="()=>this.$pjaxReplace('/platform/h5/benefit/userSelection')"
|
||||
left-arrow
|
||||
left-text="返回"
|
||||
placeholder
|
||||
title="商品列表"
|
||||
></van-nav-bar>
|
||||
</van-sticky>
|
||||
<div>
|
||||
<div class="table-list">
|
||||
<div class="table-card">
|
||||
<van-collapse class="collapse" v-model="benefitViews">
|
||||
<van-collapse-item icon="star" name="1" title="福利信息">
|
||||
<div>
|
||||
<van-cell-group>
|
||||
<van-cell :value="viewData.name" title="福利名称"></van-cell>
|
||||
<van-cell title="是否电子签字">
|
||||
<dict-tag :options="dict.type.BENEFIT_SIGN_MODE"
|
||||
:value="viewData.signMode"></dict-tag>
|
||||
</van-cell>
|
||||
<van-cell title="发放形式">
|
||||
<dict-tag :options="dict.type.BENEFIT_PROVIDE_MODE"
|
||||
:value="viewData.provideMode"></dict-tag>
|
||||
</van-cell>
|
||||
<van-cell title="选择开始时间" v-if="viewData.provideMode==='BENEFIT_PROVIDE_MODE_TWO'">
|
||||
{{$moment(viewData.startChoiceTime).format("YYYY-MM-DD HH:mm")}}
|
||||
</van-cell>
|
||||
<van-cell title="选择结束时间" v-if="viewData.provideMode==='BENEFIT_PROVIDE_MODE_TWO'">
|
||||
{{$moment(viewData.endChoiceTime).format("YYYY-MM-DD HH:mm")}}
|
||||
</van-cell>
|
||||
<van-cell title="逾期选择时间" v-if="viewData.provideMode==='BENEFIT_PROVIDE_MODE_TWO'">
|
||||
<span v-if="viewData.endOverdueChoiceTime">
|
||||
{{ $moment(viewData.endOverdueChoiceTime).format("YYYY-MM-DD HH:mm") }}
|
||||
</span>
|
||||
<span v-else>暂无</span>
|
||||
</van-cell>
|
||||
<van-cell title="福利总积分" v-if="viewData.provideMode==='BENEFIT_PROVIDE_MODE_TWO'">
|
||||
{{viewData.totalMoney}}
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
</div>
|
||||
</van-collapse-item>
|
||||
</van-collapse>
|
||||
</div>
|
||||
<!-- 如果是统一发放并且需要签字-->
|
||||
<div v-if="viewData.signMode==='BENEFIT_SIGN_MODE_ONE'&&viewData.provideMode === 'BENEFIT_PROVIDE_MODE_ONE'">
|
||||
<van-cell>
|
||||
<van-icon class="van-cell__left-icon" color="red" name="info" slot="icon"></van-icon>
|
||||
<div slot="title" style="font-weight: bold; font-size: 15px">电子签名</div>
|
||||
<template #label>
|
||||
<div>
|
||||
<h5-signature v-model="formData.userSign"></h5-signature>
|
||||
</div>
|
||||
</template>
|
||||
</van-cell>
|
||||
<div style="padding: 10px 16px; left: 0; right: 0; bottom: 0; background: #ffffff">
|
||||
<van-button @click="submit" round style="width: 100%" type="primary">提交</van-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 如果是意向选择-->
|
||||
<div v-if="viewData.provideMode==='BENEFIT_PROVIDE_MODE_TWO'">
|
||||
<div class="table-card" v-for="(item,index) in viewData.benefitGoodsList">
|
||||
<div>
|
||||
<van-row gutter="5">
|
||||
<van-col span="2">
|
||||
<van-image height="30" src="/assets/mobile/img/benefit/1.png" width="30"></van-image>
|
||||
</van-col>
|
||||
<van-col span="14">
|
||||
<div class="goodsPm">此套餐在本次福利排行第{{index+1}}名</div>
|
||||
</van-col>
|
||||
<van-col span="8">
|
||||
<div class="goodsYxz">已选择{{item.choiceNum}}件</div>
|
||||
</van-col>
|
||||
</van-row>
|
||||
</div>
|
||||
<van-card :price="item.money.toFixed(2)" tag="">
|
||||
<template #title>
|
||||
<div
|
||||
@click="openViewDesc(item.description)"
|
||||
style="font-weight: bold; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis"
|
||||
>
|
||||
{{item.name}}
|
||||
</div>
|
||||
</template>
|
||||
<template #desc>
|
||||
<div @click="openViewDesc(item.description)" style="margin: 5px">{{item.simpleDesc}}</div>
|
||||
</template>
|
||||
<template #thumb>
|
||||
<van-image :src="item.imgUrl[0].url" @click="openViewDesc(item.description)" height="80"
|
||||
width="80" v-if="item.imgUrl&&item.imgUrl.length>0"></van-image>
|
||||
<van-image
|
||||
src="/assets/mobile/img/benefit/2.png"
|
||||
@click="openViewDesc(item.description)" height="80"
|
||||
width="80" v-else></van-image>
|
||||
</template>
|
||||
<template #num>
|
||||
<van-stepper
|
||||
:default-value="0"
|
||||
:min="0"
|
||||
async-change
|
||||
button-size="20"
|
||||
disable-input
|
||||
integer
|
||||
theme="round"
|
||||
v-model="item.selectNum"
|
||||
></van-stepper>
|
||||
</template>
|
||||
</van-card>
|
||||
</div>
|
||||
<div style="padding-top: 100px">
|
||||
<van-submit-bar
|
||||
:button-text="confirmButtonInfo.text"
|
||||
:price="sumSelectMoney"
|
||||
@submit="openSubmit"
|
||||
class="submitBar"
|
||||
tip="您可以在福利选择截至时间之前修改福利套餐"
|
||||
tip-icon="info-o"
|
||||
></van-submit-bar>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<van-popup :style="{ height: '100%',width: '100%'}" position="right" safe-area-inset-bottom v-model="descPopup">
|
||||
<van-sticky>
|
||||
<van-nav-bar @click-left="descPopup=false" fixed left-arrow left-text="返回" placeholder
|
||||
title="详情"></van-nav-bar>
|
||||
</van-sticky>
|
||||
<div style="margin-top: 45px">
|
||||
<div @click="descImgClick" class="desc" v-html="description"></div>
|
||||
</div>
|
||||
</van-popup>
|
||||
|
||||
<van-action-sheet :close-on-click-overlay="false" title="确认福利套餐" v-model="confirmPopup">
|
||||
<div>
|
||||
<!--选择的信息-->
|
||||
<van-cell>
|
||||
<van-icon class="van-cell__left-icon" color="red" name="info" slot="icon"></van-icon>
|
||||
<div slot="title" style="font-weight: bold; font-size: 15px">已选福利</div>
|
||||
</van-cell>
|
||||
<van-cell style="padding: 0" v-for="(item,index) in formData.benefitGoodsList">
|
||||
<van-card
|
||||
:key="item.id"
|
||||
:num="item.selectNum"
|
||||
:thumb="(item.imgUrl&&item.imgUrl.length>0)?item.imgUrl[0].url:'/assets/mobile/img/benefit/2.png'"
|
||||
:title="item.name"
|
||||
center
|
||||
desc=""
|
||||
style="border-radius: 8px; background: #ffffff"
|
||||
></van-card>
|
||||
|
||||
<!-- 有规格时出现-->
|
||||
<van-radio-group v-model="item.specificationsId">
|
||||
<van-cell-group>
|
||||
<van-cell
|
||||
:key="index"
|
||||
:title="specifications.name"
|
||||
@click="specificationsClick(specifications,index)"
|
||||
clickable
|
||||
v-for="(specifications,index) in item.benefitGoodsSpecificationsList"
|
||||
>
|
||||
<template #right-icon>
|
||||
<van-radio :name="specifications.id" :ref="'radio'+specifications.id"></van-radio>
|
||||
</template>
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
</van-radio-group>
|
||||
|
||||
<!--邮寄到家 填写收货地址-->
|
||||
<div v-if="item.goodsProvideMode==='GOODS_PROVIDE_MODE_POST'">
|
||||
<van-cell @click="goodsAddressClick(item,index)" class="confirmWelfareCell" is-link>
|
||||
<van-icon class="van-cell__left-icon" color="red" name="info" slot="icon"></van-icon>
|
||||
<div slot="title" style="font-weight: bold; font-size: 15px">收货地址</div>
|
||||
<template #label>
|
||||
<span v-if="!item.receiveAddress">请选择地址</span>
|
||||
<span v-else>{{item.receiveAddress}}</span>
|
||||
</template>
|
||||
</van-cell>
|
||||
</div>
|
||||
|
||||
<!--收货门店-->
|
||||
<div v-if="item.goodsProvideMode==='GOODS_PROVIDE_MODE_SHOP'">
|
||||
<van-cell @click="goodsShopAddressClick(item,index)" class="confirmWelfareCell" is-link>
|
||||
<van-icon class="van-cell__left-icon" color="red" name="info" slot="icon"></van-icon>
|
||||
<div slot="title" style="font-weight: bold; font-size: 15px">收货门店</div>
|
||||
<template #label>
|
||||
<span v-if="!item.shopAddress">请选择收货门店</span>
|
||||
<span v-else>{{item.shopAddress}}</span>
|
||||
</template>
|
||||
</van-cell>
|
||||
</div>
|
||||
</van-cell>
|
||||
<!--电子签字-->
|
||||
<van-cell v-if="viewData.signMode==='BENEFIT_SIGN_MODE_ONE'">
|
||||
<van-icon class="van-cell__left-icon" color="red" name="info" slot="icon"></van-icon>
|
||||
<div slot="title" style="font-weight: bold; font-size: 15px">电子签名</div>
|
||||
<template #label>
|
||||
<div>
|
||||
<h5-signature v-model="formData.userSign"></h5-signature>
|
||||
</div>
|
||||
</template>
|
||||
</van-cell>
|
||||
<div style="padding: 10px 16px; left: 0; right: 0; bottom: 0; background: #ffffff">
|
||||
<van-button @click="submit" round style="width: 100%" type="primary">提交</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</van-action-sheet>
|
||||
|
||||
<van-action-sheet :close-on-click-overlay="false" title="确认收货门店" v-model="shopAddressPopup">
|
||||
<div style="position: relative; height: 500px; overflow-y: auto">
|
||||
<van-cell :key="index" @click="shopAddressClick(item)" clickable icon="location-o"
|
||||
v-for="(item,index) in goodsData.shopAddressList">
|
||||
<template #title>{{item.name}}</template>
|
||||
</van-cell>
|
||||
</div>
|
||||
</van-action-sheet>
|
||||
|
||||
<van-action-sheet :close-on-click-overlay="false" title="地址管理" v-model="editAddressPopup">
|
||||
<benefit-address @address_click="addressClick" ref="address"></benefit-address>
|
||||
</van-action-sheet>
|
||||
</div>
|
||||
<script nonce="${cspNonce!}">
|
||||
<!--#include("../address/address.js"){}#-->
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
dicts: ["BENEFIT_FESTIVAL", "BENEFIT_SIGN_MODE", "BENEFIT_PROVIDE_MODE", "BENEFIT_GOODS_PROVIDE_MODE"],
|
||||
data() {
|
||||
return {
|
||||
benefitId: GetQueryString("benefitId"),
|
||||
benefitViews: [],
|
||||
viewData: {
|
||||
benefitGoodsList: []
|
||||
},
|
||||
description: "",
|
||||
descPopup: false,
|
||||
confirmPopup: false,
|
||||
isChoice: false,
|
||||
selectTime: false,
|
||||
formData: {
|
||||
benefitGoodsList: []
|
||||
},
|
||||
selectAddressPopup: false,
|
||||
addressOptions: [],
|
||||
goodsData: {},
|
||||
goodsDataIndex: 0,
|
||||
shopAddressPopup: false,
|
||||
editAddressPopup: false,
|
||||
userSelection: []
|
||||
}
|
||||
},
|
||||
components: {
|
||||
"benefit-address": ADDRESS
|
||||
},
|
||||
computed: {
|
||||
sumSelectMoney() {
|
||||
if (this.viewData && this.viewData.benefitGoodsList) {
|
||||
let totalMoney = 0
|
||||
const benefitGoodsList = this.viewData.benefitGoodsList.filter((b) => b.selectNum > 0)
|
||||
benefitGoodsList.map((b) => {
|
||||
totalMoney = totalMoney + b.selectNum * b.money
|
||||
})
|
||||
return totalMoney * 100
|
||||
}
|
||||
return 0
|
||||
},
|
||||
confirmButtonInfo() {
|
||||
if (this.viewData) {
|
||||
const {startChoiceTime, endChoiceTime, endOverdueChoiceTime} = this.viewData
|
||||
const now = moment().valueOf()
|
||||
|
||||
if (endOverdueChoiceTime == null || endOverdueChoiceTime === "") {
|
||||
if (now > moment(startChoiceTime).valueOf() && now < moment(endChoiceTime).valueOf()) {
|
||||
return {
|
||||
text: "提交商品",
|
||||
disabled: false
|
||||
}
|
||||
} else if (now > moment(endChoiceTime).valueOf()) {
|
||||
return {text: "选择已结束", disabled: true}
|
||||
} else if (now < moment(startChoiceTime).valueOf()) {
|
||||
return {text: "选择未开始", disabled: true}
|
||||
}
|
||||
} else {
|
||||
//已选择了不能再动了
|
||||
if (this.isChoice) {
|
||||
if (moment(this.selectTime).valueOf() > moment(endChoiceTime).valueOf() && now < moment(endOverdueChoiceTime).valueOf()) {
|
||||
return {text: "提交商品", disabled: false}
|
||||
}
|
||||
return {text: "选择已结束", disabled: true}
|
||||
} else {
|
||||
if (now > moment(startChoiceTime).valueOf() && now < moment(endOverdueChoiceTime).valueOf()) {
|
||||
return {
|
||||
text: "提交商品",
|
||||
disabled: false
|
||||
}
|
||||
} else if (now > moment(endOverdueChoiceTime).valueOf()) {
|
||||
return {text: "选择已结束", disabled: true}
|
||||
} else if (now < moment(startChoiceTime).valueOf()) {
|
||||
return {text: "选择未开始", disabled: true}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return {text: "", disabled: true}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
*如果福利项目发放形式是统一发放true
|
||||
* @returns {boolean}
|
||||
*/
|
||||
getBenefitProvideMode() {
|
||||
console.log(this.viewData.provideMode === "BENEFIT_PROVIDE_MODE_ONE")
|
||||
return this.viewData.provideMode === "BENEFIT_PROVIDE_MODE_ONE"
|
||||
},
|
||||
/**
|
||||
* 查询单个福利
|
||||
* @param id
|
||||
* @returns {Promise<*>}
|
||||
*/
|
||||
async findOneBenefit() {
|
||||
const res = await this.$axios.post("/platform/benefit/userSelection/findOneBenefit", {id: this.benefitId})
|
||||
if (res.code === 0) {
|
||||
this.viewData = res.data
|
||||
}
|
||||
},
|
||||
//查看详情
|
||||
openViewDesc(description) {
|
||||
if (description == null || description.length === 0) {
|
||||
this.$toast("没有更多了")
|
||||
return
|
||||
}
|
||||
this.description = description
|
||||
this.descPopup = true
|
||||
},
|
||||
descImgClick(e) {
|
||||
if (e.target.tagName === "IMG") {
|
||||
vant.ImagePreview([e.target.src])
|
||||
}
|
||||
},
|
||||
async openSubmit() {
|
||||
let totalMoney = 0
|
||||
const benefitGoodsList = this.viewData.benefitGoodsList.filter((b) => b.selectNum > 0)
|
||||
benefitGoodsList.map((b) => {
|
||||
totalMoney = totalMoney + b.selectNum * b.money
|
||||
})
|
||||
|
||||
if (totalMoney === 0) {
|
||||
this.$toast("请选择后再提交！")
|
||||
return
|
||||
}
|
||||
if (totalMoney !== this.viewData.totalMoney) {
|
||||
this.$toast("本次福利积分【" + this.viewData.totalMoney + "】请检查商品数量！")
|
||||
return
|
||||
}
|
||||
this.formData.benefitGoodsList = benefitGoodsList
|
||||
this.formData.benefitGoodsList.forEach((b) => {
|
||||
if (b.goodsProvideMode === "GOODS_PROVIDE_MODE_POST" && !b.receiveAddress) {
|
||||
//如果是邮寄商品，并且有默认地址，并且是第一次进来没有选择，则默认地址为收货地址
|
||||
const defaultAddress = this.addressOptions.find((a) => a.isDefault)
|
||||
b.receiveAddress = defaultAddress.name
|
||||
if (b.postProvideConfig.choiceMunicipality || b.postProvideConfig.choiceProvince) {
|
||||
//如果有地址限制
|
||||
b.receiveAddress = ""
|
||||
}
|
||||
}
|
||||
})
|
||||
this.confirmPopup = true
|
||||
},
|
||||
submit() {
|
||||
if (this.viewData.signMode === "BENEFIT_SIGN_MODE_ONE" && !this.formData.userSign) {
|
||||
this.$toast("请签字后再提交！")
|
||||
return
|
||||
}
|
||||
let flag = false
|
||||
let msg = ""
|
||||
this.formData.benefitGoodsList.some((b) => {
|
||||
if (b.goodsProvideMode === "GOODS_PROVIDE_MODE_POST" && !b.receiveAddress) {
|
||||
flag = true
|
||||
msg = "商品中存在未填写的收货地址，请检查！"
|
||||
return true
|
||||
}
|
||||
if (b.benefitGoodsSpecificationsList && b.benefitGoodsSpecificationsList.length > 0 && !b.specificationsId) {
|
||||
flag = true
|
||||
msg = "商品中存在未填写的规格，请检查！"
|
||||
return true
|
||||
}
|
||||
if (b.shopAddressList && b.shopAddressList.length > 0 && !b.shopAddress) {
|
||||
flag = true
|
||||
msg = "商品中存在未填写的门店地址，请检查！"
|
||||
return true
|
||||
}
|
||||
return false
|
||||
})
|
||||
if (flag) {
|
||||
this.$toast(msg)
|
||||
return
|
||||
}
|
||||
const loading = this.$toast.loading({
|
||||
message: "提交中...",
|
||||
forbidClick: true,
|
||||
overlay: true,
|
||||
duration: 0
|
||||
})
|
||||
const benefitUserSelection = this.formData.benefitGoodsList.map((b) => {
|
||||
let data = {
|
||||
specificationsId: b.specificationsId,
|
||||
receiveAddress: b.receiveAddress,
|
||||
shopAddress: b.shopAddress,
|
||||
selectNum: b.selectNum,
|
||||
benefitId: this.viewData.id,
|
||||
goodsId: b.id,
|
||||
selectUserId: b.selectUserId,
|
||||
userSign: this.formData.userSign
|
||||
}
|
||||
return data
|
||||
})
|
||||
this.$axios
|
||||
.post("/platform/benefit/userSelection/submit", {
|
||||
benefitUserSelection: JSON.stringify(benefitUserSelection),
|
||||
benefitId: this.viewData.id,
|
||||
userId: this.$store.state.user.id
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code === 0) {
|
||||
setTimeout(() => {
|
||||
this.selectSelectionBenefit()
|
||||
this.$toast.success(res.msg)
|
||||
loading.close()
|
||||
this.confirmPopup = false
|
||||
}, 500)
|
||||
} else {
|
||||
this.$toast.fail(res.msg)
|
||||
loading.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
*查询用户选择的商品
|
||||
* @param benefitId
|
||||
* @param userId
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async selectSelectionBenefit() {
|
||||
const res = await this.$axios.post("/platform/benefit/userSelection/selectSelectionBenefit", {
|
||||
benefitId: this.benefitId,
|
||||
userId: this.$store.state.user.id
|
||||
})
|
||||
if (res.code === 0) {
|
||||
this.userSelection = res.data
|
||||
}
|
||||
},
|
||||
addressClick(item) {
|
||||
const address = this.addressOptions.find((a) => a.id === item.id)
|
||||
const {province, city, county, name, tel} = address
|
||||
if (this.goodsData.postProvideConfig.choiceMunicipality && city !== this.goodsData.postProvideConfig.choiceMunicipality) {
|
||||
this.$toast("当前福利限制只能邮寄" + this.goodsData.postProvideConfig.choiceMunicipality + "！")
|
||||
return
|
||||
}
|
||||
if (this.goodsData.postProvideConfig.choiceProvince && province !== this.goodsData.postProvideConfig.choiceProvince) {
|
||||
this.$toast("当前福利限制只能邮寄" + this.goodsData.postProvideConfig.choiceProvince + "！")
|
||||
return
|
||||
}
|
||||
if (address) {
|
||||
this.$set(this.formData.benefitGoodsList[this.goodsDataIndex], "receiveAddress", address.name)
|
||||
}
|
||||
this.editAddressPopup = false
|
||||
},
|
||||
|
||||
goodsAddressClick(goods, index) {
|
||||
this.goodsData = goods
|
||||
this.goodsDataIndex = index
|
||||
this.editAddressPopup = true
|
||||
},
|
||||
goodsShopAddressClick(goods, index) {
|
||||
this.goodsData = goods
|
||||
this.goodsDataIndex = index
|
||||
this.shopAddressPopup = true
|
||||
},
|
||||
shopAddressClick(item) {
|
||||
if (item) {
|
||||
this.$set(this.formData.benefitGoodsList[this.goodsDataIndex], "shopAddress", item.name)
|
||||
}
|
||||
this.shopAddressPopup = false
|
||||
},
|
||||
/**
|
||||
* 回显用户选择的数据
|
||||
* @param benefitId
|
||||
* @param userId
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async echoUserSelection() {
|
||||
await this.selectSelectionBenefit()
|
||||
//获取用户当前选择的数量
|
||||
this.viewData.benefitGoodsList.map((v) => {
|
||||
const goods = this.userSelection.find((x) => x.goodsId === v.id)
|
||||
if (goods) {
|
||||
v.selectNum = goods.selectNum
|
||||
v.selectUserId = goods.selectUserId
|
||||
v.receiveAddress = goods.receiveAddress
|
||||
v.specificationsId = goods.specificationsId
|
||||
v.shopAddress = goods.shopAddress
|
||||
this.formData.userSign = goods.userSign
|
||||
} else {
|
||||
v.selectNum = 0
|
||||
}
|
||||
})
|
||||
},
|
||||
specificationsClick(item, index) {
|
||||
this.$set(this.viewData.benefitGoodsList[index], "specificationsId", item.specificationsId)
|
||||
this.$refs["radio" + item.id][0].toggle()
|
||||
this.$forceUpdate()
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
await this.findOneBenefit()
|
||||
await this.echoUserSelection()
|
||||
if (this.viewData.signMode === "BENEFIT_SIGN_MODE_ONE" && this.viewData.provideMode === "BENEFIT_PROVIDE_MODE_ONE") {
|
||||
this.benefitViews = ["1"]
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,94 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
<style>
|
||||
.table-card .van-image__img {
|
||||
border-radius: 5%;
|
||||
}
|
||||
|
||||
.benefitName {
|
||||
font-weight: bold;
|
||||
font-size: 17px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-sticky>
|
||||
<van-nav-bar @click-left="()=>this.$pjaxReplace('/platform/h5/home')" left-arrow left-text="返回" placeholder title="选择福利"></van-nav-bar>
|
||||
<van-dropdown-menu>
|
||||
<year-van-dropdown-item :num="5" @change="doSearch" v-model="pageForm.year"></year-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" @click="openChoose(row)" class="table-card" v-for="row in tableData">
|
||||
<van-image :src="row.cover" fit="cover" height="200" width="100%"></van-image>
|
||||
<div style="margin: 10px">
|
||||
<div class="benefitName">{{row.benefitName}}</div>
|
||||
<div style="font-size: 15px">选择开始时间：{{$moment(row.startChoiceTime).format('YYYY-MM-DD HH:mm')}}</div>
|
||||
<div style="font-size: 15px">选择结束时间：{{$moment(row.endChoiceTime).format('YYYY-MM-DD HH:mm')}}</div>
|
||||
<div style="display: flex; justify-content: flex-end">{{row.isChoice?'已选择':'未选择'}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</van-list>
|
||||
<van-empty description="暂无数据" image="/assets/platform/plugins/vant-green/images/nodata/nodata.png" v-else></van-empty>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script nonce="${cspNonce!}">
|
||||
new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
finished: false,
|
||||
loading: false,
|
||||
pageForm: {
|
||||
pageNumber: 1,
|
||||
pageSize: 5,
|
||||
totalCount: 0,
|
||||
year: new Date().getFullYear()
|
||||
},
|
||||
yearList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doSearch() {
|
||||
this.tableKey = new Date().getTime()
|
||||
this.pageForm.pageNumber = 1
|
||||
this.pageForm.totalCount = 0
|
||||
this.tableData = []
|
||||
this.pageData()
|
||||
},
|
||||
pageData() {
|
||||
this.loading = true
|
||||
this.$axios.post("/platform/benefit/userSelection/pageData", 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
|
||||
})
|
||||
},
|
||||
async openChoose(row) {
|
||||
this.$pjaxReplace("/platform/h5/benefit/userSelection/goodsSelection?benefitId=" + row.benefitId)
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
Reference in New Issue
Block a user