Skip to content

C
center-register-show-h5
提交 cef37336 authored 作者: lihuihui's avatar lihuihui
浏览文件
操作

Merge branch 'master' of https://gitlab-pro.ezijing.com/ezijing-web/highway-h5

上级 604d424a 2dbbee72
隐藏空白字符变更
内嵌 并排
正在显示 包含 153 行增加 和 212 行删除
src/assets/css/base.css
浏览文件 @ cef37336
......@@ -2,3 +2,6 @@
margin: 0;
padding: 0;
}
body {
background: #f7f7f7;
}
src/modules/home/components/ImgShow.vue
浏览文件 @ cef37336
<template>
<div class="main">
<commonheader @back="handlePrev" :callBack="true" />
<commonheader @back="handlePrev" :callBack="true" :title="title" />
<!-- 展示页面 -->
<div class="show_content">
<div class="show_content_img" v-html="data.desc"></div>
</div>
<div class="main_footer">
<div class="show_content_btn" @click="handleSubmit">{{ data.title }}</div>
</div>
</div>
......@@ -12,12 +14,16 @@
<script>
import Commonheader from '../components/Commonheader.vue'
export default {
data() {
return {
title: '报名'
}
},
components: { Commonheader },
props: {
data: { type: Object }
},
mounted() {
},
mounted() {},
methods: {
handlePrev() {
this.$emit('prev')
......@@ -38,6 +44,13 @@ export default {
margin-top: 0.84rem;
width: 6.9rem;
}
}
.main_footer {
width: 100%;
height: 1.81rem;
background: #fff;
position: fixed;
bottom: 0;
.show_content_btn {
width: 6.42rem;
height: 0.88rem;
......
src/modules/home/components/SignForm.vue
浏览文件 @ cef37336
<template>
<div class="main">
<commonheader :title="title" />
<div class="main_content">
<div class="main_content_banner" v-html="data.desc"></div>
<div class="main_content_form">
<van-form>
<van-form class="main_content_form_con">
<div v-for="(listIt, formIndex) in data.user_fields" :key="formIndex" class="main_content_form_list">
<img
src="https://webapp-pub.ezijing.com/highway/h5/form_minus.png"
......@@ -22,9 +23,10 @@
:placeholder="item.placeholder"
:rules="[{ required: item.required, message: item.placeholder }]"
clearable
border
:border="true"
:disabled="formIndex === 0 && (item.key === 'mobile' || item.key === 'name')"
/>
<div class="line"></div>
</div>
<!-- 单选框 -->
<div v-if="item.type === 'radio'">
......@@ -37,6 +39,7 @@
</van-radio-group>
</template>
</van-field>
<div class="line"></div>
</div>
<!-- 选择器 -->
......@@ -59,7 +62,9 @@
@cancel="showPicker = false"
/>
</van-popup>
<div class="line"></div>
</div>
<!-- 时间 -->
<div v-if="item.type === 'datetime'">
<van-field
......@@ -75,6 +80,7 @@
<van-popup v-model="item.showPicker" position="bottom">
<van-datetime-picker type="datetime" @confirm="onConfirmTime" @cancel="showPickerTime = false" />
</van-popup>
<div class="line"></div>
</div>
</div>
</div>
......@@ -83,28 +89,41 @@
<img src="https://webapp-pub.ezijing.com/highway/h5/form_add.png" class="btn_add" @click="handleAdd" />
</div>
</div>
<div class="main_content_footer">
<template v-if="data.can_skip_pay === 1">
<van-checkbox v-model="checkedPay" shape="square" class="main_content_skipPay">
{{ data.skip_pay_title }}</van-checkbox
>
</template>
</div>
<div class="main_footer">
<div class="main_footer_top" v-if="data.can_skip_pay === 1">
<van-checkbox icon-size="13px" v-model="checkedPay" shape="square" class="main_content_skipPay">
{{ data.skip_pay_title }}</van-checkbox
>
</div>
<div class="main_footer_bottom">
<van-button
round
block
native-type="submit"
:class="[data.can_skip_pay === 1 ? 'main_content_btn' : 'main_content_btn1']"
@click="onSubmit"
:class="[data.can_skip_pay === 1 ? 'main_content_btn' : 'main_content_btn1']"
>{{ data.title }}</van-button
>
</div>
<!-- <template v-if="data.can_skip_pay === 1">
<van-checkbox icon-size="13px" v-model="checkedPay" shape="square" class="main_content_skipPay">
{{ data.skip_pay_title }}</van-checkbox
>
</template>
<div >
<van-button round block native-type="submit" @click="onSubmit">{{ data.title }}</van-button>
</div> -->
</div>
</div>
</template>
<script>
import Commonheader from '../components/Commonheader.vue'
import { saveStepInfo } from '../api'
export default {
components: { Commonheader },
props: {
stepList: { type: Array },
data: { type: Object },
......@@ -114,6 +133,7 @@ export default {
},
data() {
return {
title: '报名',
checkedPay: false, // 勾选是否跳过按钮
index: 0,
cIndex: 0,
......@@ -156,6 +176,7 @@ export default {
} else {
this.$emit('next', res.data)
}
this.checkedPay = false
}
})
},
......@@ -208,25 +229,24 @@ export default {
<style lang="scss" scoped>
.main {
background-color: #f7f7f7;
height: 100vh;
.main_content {
padding: 0.21rem 0.3rem 4.13rem 0.3rem;
.main_content_banner {
margin-top: 0.84rem;
width: 100%;
// height: 2.97rem;
// border: 1px solid #707070;
// border-radius: 0.2rem;
}
.main_content_form {
width: 6.9rem;
opacity: 1;
border-radius: 20px;
margin-top: 0.32rem;
}
.main_content_form_list {
border-radius: 20px;
margin-top: 0.43rem;
background: #fff;
padding-bottom: 0.68rem;
padding-top: 0.4rem;
.btn_minus {
float: right;
width: 0.5072rem;
......@@ -245,48 +265,49 @@ export default {
margin-right: 0.31rem;
}
}
.main_content_footer {
height: 1.81rem;
position: fixed;
bottom: 0.3rem;
background: #fff;
width: 100%;
margin-left: -0.3rem;
margin-bottom: -0.3rem;
.main_content_skipPay {
font-size: 0.24rem;
font-weight: 400;
color: #999999;
margin-left: 0.8rem;
opacity: 1;
}
}
.main_footer {
width: 100%;
height: 1.81rem;
background: #fff;
position: fixed;
bottom: 0;
display: flex;
justify-content: space-around;
align-items: flex-start;
flex-direction: column;
.main_footer_top {
font-size: 0.24rem;
font-weight: 400;
color: #999999;
margin-left: 0.8rem;
margin-top: 0.15rem;
}
.main_footer_bottom {
margin-top: -0.18rem;
.main_content_btn {
width: 6.9rem;
background: #b80140;
color: #ffffff;
margin-left: 0.28rem;
margin-top: -0.18rem;
}
.main_content_btn1 {
width: 6.9rem;
background: #b80140;
color: #ffffff;
margin-left: 0.28rem;
margin-top: 0.4rem;
margin-top: 0.3rem;
}
}
}
}
::v-deep .van-checkbox__icon .van-icon {
width: 0.25rem;
height: 0.26rem;
text-align: center;
margin-top: 0.06rem;
}
::v-deep .van-checkbox__icon .van-checkbox__icon {
font-size: 0.16rem;
}
::v-deep .van-checkbox__icon .van-checkbox__label {
color: #999999;
margin-top: -0.9rem;
::v-deep {
.van-checkbox__icon {
border-radius: 3px;
overflow: hidden;
}
}
</style>
src/modules/home/views/MyOrder.vue
浏览文件 @ cef37336
......@@ -21,11 +21,11 @@
<div class="orderList_con_left_tit">{{ item.activity.name }}</div>
<div class="orderList_con_left_num">人数：{{ item.count }}</div>
</div>
<div class="orderList_con_price">¥{{ item.amount }}</div>
<div class="orderList_con_price">¥{{ item.amount.toFixed(2) }}</div>
</div>
<div class="orderList_pay">
<div class="orderList_pay_tit">需付款：</div>
<div class="orderList_pay_price">{{ item.amount }}</div>
<div class="orderList_pay_price">{{ item.amount.toFixed(2) }}</div>
</div>
<div class="orderList_btn">
<van-button
......@@ -34,6 +34,7 @@
style="margin-left: 0.42rem"
v-if="item.status === 0 || item.status === 1"
@click="handlePay(item)"
class="pay_btn"
>去支付</van-button
>
</div>
......@@ -106,7 +107,6 @@ export default {
<style lang="scss" scoped>
.main {
min-height: 100vh;
background-color: #f7f7f7;
.main_content {
......@@ -202,4 +202,11 @@ export default {
z-index: 1000;
top: 0.9rem;
}
::v-deep .pay_btn {
border-radius: 0.31rem;
border: 1px solid #c01540;
color: #c01540;
font-size: 0.28rem;
}
</style>
src/modules/home/views/OrderConfirm.vue
浏览文件 @ cef37336
......@@ -10,21 +10,20 @@
<div class="card_header">
<van-checkbox :name="item" :disabled="item.pay_record.pay_status === '1'"></van-checkbox>
<!-- <span class="card_header_title">{{ JSON.parse($route.query.detailListName) }}</span> -->
<div class="card_con">
<p>{{ item.name }} {{ item.mobile }}</p>
</div>
</div>
<div class="card_con">
<p>{{ item.name }} {{ item.mobile }}</p>
</div>
<div class="card_fotter">
<div class="card_fotter_left">
<span class="price">¥</span>
<span class="price_num">{{ payPrice }}<span class="price_num"></span></span>
<span class="price_num" v-html="getPayPrice()"></span>
</div>
<div class="card_fotter_left card_fotter_right">
<span class="price">单位已优惠</span>
<span class="price">¥</span>
<span class="price_num">{{
(Number(payPrice).toFixed(2) - Number(item.pay_record.pay_amount).toFixed(2)).toFixed(2)
}}</span>
<span class="price_num" v-html="getCompanyPrice(item)"></span>
</div>
</div>
</div>
......@@ -38,12 +37,12 @@
<div class="main_footer_total_top">
<div class="total_text">合计:</div>
<div class="total_sign">¥</div>
<div class="price">{{ totalPrice }}</div>
<div class="price" v-html="getTotalPrice()"></div>
</div>
<div class="main_footer_total_bottom">
<div class="company_yh">单位已优惠</div>
<div class="company_yh">共优惠</div>
<div class="company_sign">¥</div>
<div class="company_yh">{{ totalCompanyPrice.toFixed(2) }}</div>
<div class="company_yh" v-html="totalCompanyPrice"></div>
</div>
</div>
<van-button round @click="handlePrev" class="prev_btn">上一页</van-button>
......@@ -82,7 +81,10 @@ export default {
computed: {
totalPrice() {
return this.selctOrderData.map(item => Number(item.pay_record.pay_amount)).reduce((pre, nex) => (pre += nex), 0)
return this.selctOrderData
.map(item => Number(item.pay_record.pay_amount))
.reduce((pre, nex) => (pre += nex), 0)
.toFixed(2)
},
payPrice() {
return this.data.payData.pay_price
......@@ -91,12 +93,34 @@ export default {
return this.selctOrderData
.map(item => Number(this.payPrice) - Number(item.pay_record.pay_amount))
.reduce((pre, nex) => (pre += nex), 0)
.toFixed(2)
}
},
mounted() {
this.stepOrderInfo = this.data.payData.list
},
methods: {
getTotalTotalCompanyPrice() {
const splitPrice = this.totalCompanyPrice.split('.')
// //2.重新赋值
return `<span style="font-size:0.34rem;">${splitPrice[0]}</span>.<span style="font-size:0.2rem;">${splitPrice[1]}</span>`
},
getTotalPrice() {
const splitPrice = this.totalPrice.split('.')
// //2.重新赋值
return `<span style="font-size:0.34rem;">${splitPrice[0]}</span>.<span style="font-size:0.2rem;">${splitPrice[1]}</span>`
},
getPayPrice() {
const splitPrice = this.payPrice.split('.')
// //2.重新赋值
return `<span style="font-size:0.34rem;">${splitPrice[0]}</span>.<span style="font-size:0.2rem;">${splitPrice[1]}</span>`
},
getCompanyPrice(item) {
const companyPrice = (Number(this.payPrice).toFixed(2) - Number(item.pay_record.pay_amount).toFixed(2)).toFixed(2)
const splitPrice = companyPrice.split('.')
// //2.重新赋值
return `<span style="font-size:0.34rem;">${splitPrice[0]}</span>.<span style="font-size:0.2rem;">${splitPrice[1]}</span>`
},
checkItem() {
if (this.selctOrderData.length === this.stepOrderInfo.filter(item => item.pay_record.pay_status !== '1').length) {
this.isAll = true
......@@ -143,7 +167,6 @@ export default {
<style lang="scss" scoped>
.main {
background-color: #f7f7f7;
height: 100vh;
.main_content {
padding: 0.51rem 0.3rem 0.3rem 0.3rem;
margin-top: 0.9rem;
......@@ -176,7 +199,7 @@ export default {
.card_con {
font-weight: 400;
color: #999999;
margin-left: 0.66rem;
margin-left: 0.33rem;
font-size: 0.24rem;
}
.card_fotter {
......@@ -192,6 +215,7 @@ export default {
font-size: 0.2rem;
color: #b80140;
font-weight: 300;
margin-top: 0.1rem;
}
.price_num {
font-size: 0.28rem;
......@@ -227,23 +251,30 @@ export default {
align-items: flex-start;
.main_footer_total_top {
display: flex;
align-items: flex-end;
.total_text {
font-size: 0.24rem;
font-weight: 400;
color: #333333;
padding-top: 0.11rem;
}
.total_sign {
font-size: 0.2rem;
color: #b80140;
margin-top: 0.18rem;
margin-left: 0.1rem;
}
.price {
font-size: 0.2rem;
font-weight: bold;
color: #b80140;
margin-left: 0.1rem;
margin-top: 0.11rem;
}
}
.main_footer_total_bottom {
display: flex;
align-items: flex-end;
.company_yh {
font-size: 0.24rem;
......
src/modules/home/views/PayDetail.vue
浏览文件 @ cef37336
<template>
<div class="main">
<!-- <commonheader :title="title" /> -->
<commonheader :title="title" />
<div class="main_content">
<div class="main_content_desc">1.打开支付宝扫码二维码支付，或长按保存二维码打开支付宝支付。</div>
<div class="main_content_qdCode">
......@@ -24,18 +24,10 @@
复制链接在浏览器打开去支付
</div>
<div class="main_btn">
<van-button
class="main_btn_home"
round
@click="$router.push('/')"
v-if="isLastStep && status == 1"
<van-button class="main_btn_home" round @click="$router.push('/')" v-if="isLastStep && status == 1"
>首页</van-button
>
<van-button
round
class="main_btn_home"
@click="$router.go(0)"
v-if="!isLastStep && status == 1"
<van-button round class="main_btn_home" @click="$router.go(0)" v-if="!isLastStep && status == 1"
>继续报名</van-button
>
<van-button round class="main_btn_order" @click="$router.push('/MyOrder')">我的订单</van-button>
......@@ -52,7 +44,7 @@ import Clipboard from 'clipboard'
import { Toast } from 'vant'
import { getPayStatus } from '../api'
// import commonheader from '../components/Commonheader.vue'
import commonheader from '../components/Commonheader.vue'
export default {
props: {
data: {
......@@ -63,7 +55,8 @@ export default {
}
},
components: {
QrcodeVue
QrcodeVue,
commonheader
},
data() {
return {
......@@ -161,18 +154,18 @@ export default {
.main {
background: #f7f7f7;
.main_content {
padding: 0.57rem 0.58rem 0 0.46rem;
background: #fff;
display: flex;
align-items: center;
flex-direction: column;
margin: 1.2rem 0.3rem 0.64rem 0.3rem;
.main_content_desc {
// width: 5.56rem;
font-size: 0.3rem;
font-weight: 400;
color: #333333;
margin-top: 0.57rem;
margin: 0.57rem 0.3rem 0 0.3rem;
}
.main_content_qdCode {
width: 2.88rem;
......@@ -193,14 +186,22 @@ export default {
}
}
.main_btn {
margin-top: 1.12rem;
margin-bottom: 0.64rem;
display: flex;
justify-content: center;
.main_btn_home {
background: #b80140;
color: #fff;
font-size: 0.3rem;
font-weight: 400;
}
.main_btn_order {
margin-left: 0.2rem;
background: #f5f5f5;
font-size: 0.3rem;
font-weight: 400;
color: #333333;
}
}
#value {
......
src/modules/home/views/PersonalCenter.vue
浏览文件 @ cef37336
......@@ -38,7 +38,6 @@ export default {
<style lang="scss" scoped>
.main {
.main_content {
height: calc(100vh - 46px);
margin-top: 0.46rem;
padding: 0.51rem 0.3rem 0 0.3rem;
background-color: #f7f7f7;
......
src/modules/home/views/SignMainPage copy.vue deleted 100644 → 0
浏览文件 @ 604d424a
<template>
<div class="main">
<commonheader @back="handlePrev" :callBack="true" :title="title" />
<!-- 展示 -->
<template v-if="Object.keys(stepList).length">
<img-show
:stepList="stepList"
:data="setpItem"
@prev="handlePrev"
@next="handleNext"
v-if="setpItem.type === 1"
/>
<!-- 表单 -->
<sign-form
:myInfoList="myInfoList"
:personalInfo="detailList.info"
:data="setpItem"
:stepList="stepList"
:stepIndex="stepIndex"
@prev="handlePrev"
@next="handleNext"
v-if="setpItem.type === 2"
:isShowSkip="isShowSkip"
:detailList="detailList"
:order_join_rand="$route.query.join_rand"
/>
</template>
</div>
</template>
<script>
import SignForm from '../components/SignForm.vue'
import ImgShow from '../components/ImgShow.vue'
import Commonheader from '../components/Commonheader.vue'
import { getActivityDetail } from '../api'
export default {
components: { SignForm, ImgShow, Commonheader },
data() {
return {
title: '报名主页面',
stepIndex: 0,
isShowSkip: '',
stepList: [],
detailList: {
info: {}
}
}
},
computed: {
setpItem() {
if (this.$route.query.stepIndex) {
return this.stepList[this.$route.query.stepIndex]
} else {
return this.stepList[this.stepIndex]
}
}
},
mounted() {
this.activity_detail_id = this.$route.query.activity_detail_id
this.getActivityDetail()
},
methods: {
// 获取活动详情
getActivityDetail() {
const params = { id: this.$route.query.id || this.$route.query.activityId }
getActivityDetail(params).then(res => {
this.detailList = res.data
this.myInfoList = res.data.other_fill_in.list
// console.log(this.detailList.activity.details.slice(-1), '0000')
if (this.detailList.other_fill_in.need_fill_in_status) {
this.detailList.activity.details.forEach(item => {
if (item.id === this.detailList.other_fill_in.need_fill_in_id) {
const details = this.detailList.activity.details.indexOf(item)
console.log(details, '111')
if (details === 0) {
this.stepList = res.data.activity.details
console.log(this.stepList, '1')
} else if (details > 0) {
console.log(details, 'details')
this.stepList = this.detailList.activity.details.splice(details)
console.log(this.stepList, '2')
}
}
})
} else {
if (this.detailList.self_fill_in.need_fill_in_status) {
this.detailList.activity.details.forEach(item => {
if (item.id === this.detailList.self_fill_in.need_fill_in_id) {
const details = this.detailList.activity.details.indexOf(item)
console.log(details, '222')
if (details === 0) {
this.stepList = res.data.activity.details
console.log(this.stepList, '3')
} else if (details > 0) {
console.log(details, 'details1')
this.stepList = this.detailList.activity.details.splice(details)
console.log(this.stepList, '4')
}
}
})
} else {
this.stepList = res.data.activity.details
console.log(this.stepList, '5')
}
}
const newIndex = this.stepList.findIndex(item => {
return item.id === this.$route.query.activity_detail_id
})
if (this.$route.query.stepIndex) {
this.stepIndex = parseInt(this.$route.query.stepIndex)
} else {
this.stepIndex = newIndex < 0 ? 0 : newIndex
}
})
},
handlePrev() {
if (this.stepIndex <= 0) {
this.$router.push('/')
} else {
this.stepIndex--
}
},
handleNext() {
this.stepIndex++
}
}
}
</script>
<style lang="scss" scoped></style>
src/modules/home/views/SignMainPage.vue
浏览文件 @ cef37336
......@@ -162,7 +162,6 @@ export default {
}
return a
}, [])
console.log(this.stepList)
this.stepList.map((item, index) => {
item.num = index + 1
return item
......@@ -180,11 +179,10 @@ export default {
this.stepIndex++
if (data) {
this.setpItem.payData = data
console.log(this.setpItem)
}
}
}
}
}
</script>
<style lang="scss" scoped></style>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论