|
@@ -5,9 +5,9 @@
|
|
|
<view class="g-shoping-info">
|
|
|
<image class="shoping-img" :src="previewCourseInfo.cover" mode=""></image>
|
|
|
<view class="shoping-info">
|
|
|
- <view class="name">{{previewCourseInfo.name}}</view>
|
|
|
+ <view class="name">{{ previewCourseInfo.name }}</view>
|
|
|
<view class="price-info">
|
|
|
- <view class="price"><text class="mini-text">¥</text>{{previewCourseInfo.sellingPrice}}</view>
|
|
|
+ <view class="price"><text class="mini-text">¥</text>{{ previewCourseInfo.sellingPrice }}</view>
|
|
|
<view class="price-stepper">
|
|
|
<view class="minus" @click="minusNum">-</view>
|
|
|
<input v-model="countTotal" disabled type="number" />
|
|
@@ -19,20 +19,20 @@
|
|
|
<view class="g-shoping-total">
|
|
|
<view class="total-price">
|
|
|
<view class="">商品总价(共1件)</view>
|
|
|
- <view class="">¥{{previewCourseInfo.sellingPrice}}</view>
|
|
|
+ <view class="">¥{{ previewCourseInfo.sellingPrice }}</view>
|
|
|
</view>
|
|
|
<view class="total-price">
|
|
|
<view class="">
|
|
|
- <text v-if="loadType==1||loadType==2">试听优惠</text>
|
|
|
- <text v-if="loadType==3">团购优惠</text>
|
|
|
+ <text v-if="loadType == 1 || loadType == 2">试听优惠</text>
|
|
|
+ <text v-if="loadType == 3">团购优惠</text>
|
|
|
</view>
|
|
|
- <view class="">-¥{{previewCourseInfo.discountPrice}}</view>
|
|
|
+ <view class="">-¥{{ previewCourseInfo.discountPrice }}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="subtotal">小计 ¥{{previewCourseInfo.subtotal}}</view>
|
|
|
+ <view class="subtotal">小计 ¥{{ previewCourseInfo.subtotal }}</view>
|
|
|
</view>
|
|
|
<!-- 无固定场进入 -->
|
|
|
- <view class="g-buy-tips" v-if="loadType==4">
|
|
|
+ <view class="g-buy-tips" v-if="loadType == 4">
|
|
|
<view class="tips-title">购买须知</view>
|
|
|
<view class="tips-info-card">
|
|
|
<view class="title">有效期</view>
|
|
@@ -49,30 +49,50 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- 课程进入 -->
|
|
|
- <!-- v-if="loadType==1||loadType==3" -->
|
|
|
- <view class="g-insurance-card">
|
|
|
- <view class="g-insurance-info">
|
|
|
- <view class="insurance-type">
|
|
|
- <view class="type-name">
|
|
|
- <view class="name">意外险</view>
|
|
|
- <view class="tips">不支持退款</view>
|
|
|
+ <!-- v-if="loadType==1||loadType==3" -->
|
|
|
+ <view class="r-insurance">
|
|
|
+ <view class="r-insurance-infobox">
|
|
|
+ <view class="r-image-box">
|
|
|
+ <image src="https://img.keaitupian.cn/newupload/08/1629449018344288.jpg" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="r-insurance-title">
|
|
|
+ <view class="r-insurance-name">
|
|
|
+ <view class="r-name">运动无忧保</view>
|
|
|
+ <view class="r-tags">不支持退款</view>
|
|
|
</view>
|
|
|
- <view class="insurance-more">
|
|
|
- <text>查看详情</text>
|
|
|
- <zzx-icon name="ashRight" size="12"></zzx-icon>
|
|
|
+ <view class="r-insurance-desc">意外身故、残疾10万;意外医疗1万;意外补充医疗1万;</view>
|
|
|
+ <view class="r-insurance-type">保险公司:中国人保</view>
|
|
|
+ <view class="r-insurance-price">
|
|
|
+ <view class="r-price">¥2/天·人</view>
|
|
|
+ <!-- RouterUtils.to_page('/pages/index/insure/index') -->
|
|
|
+ <view class="r-insurance-btn" @click="insurePopup.open()">去投保
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="insurance-num" @click="select_insurance=!select_insurance">
|
|
|
- <view class="">¥3/人×1份(意外事故10万,社保内医疗1万)</view>
|
|
|
- <zzx-icon :name="select_insurance?'selected' : 'unchecked'" size="14"></zzx-icon>
|
|
|
- </view>
|
|
|
</view>
|
|
|
- <view class="insurance-total">
|
|
|
- <view class="text">保险总价(共2件)</view>
|
|
|
- <view class="price">¥6</view>
|
|
|
+ <view class="line"></view>
|
|
|
+ <view class="r-insurance-adduser">
|
|
|
+ <view class="r-adduser-btn" @click="toUserList">
|
|
|
+ <view class="r-celar" @click="clearUser">清除</view>
|
|
|
+ <view class="r-edit" @click="editUser">修改</view>
|
|
|
+ </view>
|
|
|
+ <view class="r-userinfo-list">
|
|
|
+ <view class="r-userinfo-item">
|
|
|
+ <view class="r-item-title">被保人</view>
|
|
|
+ <view class="r-item-info">2人(杨锦新、赵四儿)</view>
|
|
|
+ </view>
|
|
|
+ <view class="r-userinfo-item">
|
|
|
+ <view class="r-item-title">生效时间</view>
|
|
|
+ <view class="r-item-info">2天(2025.07.24-2025.07-28)</view>
|
|
|
+ </view>
|
|
|
+ <view class="r-userinfo-item">
|
|
|
+ <view class="r-item-title">保费总金额</view>
|
|
|
+ <view class="r-item-info">¥8</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <!-- v-if="loadType==1||loadType==3" -->
|
|
|
+ <!-- v-if="loadType==1||loadType==3" -->
|
|
|
<view class="g-userinfo-card">
|
|
|
<view class="r-user">
|
|
|
<view class="user-title">用户信息</view>
|
|
@@ -87,8 +107,8 @@
|
|
|
<view class="r-user-list" v-for="item in userData" :key="item.id">
|
|
|
<view class="minus-user" @click="deleteUser(item)">-</view>
|
|
|
<view class="r-list">
|
|
|
- <view class="name">{{item.fullName}}</view>
|
|
|
- <view class="id-num">身份证 {{idCardHide(item.identityCard)}}</view>
|
|
|
+ <view class="name">{{ item.fullName }}</view>
|
|
|
+ <view class="id-num">身份证 {{ idCardHide(item.identityCard) }}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="g-adduser-btn" @click="toUserList">
|
|
@@ -96,7 +116,7 @@
|
|
|
<view class="add-text">添加用户</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <!-- v-if="loadType==1" -->
|
|
|
+ <!-- v-if="loadType==1" -->
|
|
|
<view class="g-usetips-card">
|
|
|
<view class="use-title">使用须知</view>
|
|
|
<view class="use-text">
|
|
@@ -113,496 +133,702 @@
|
|
|
<view class="footer footer-box">
|
|
|
<view class="footer-price">
|
|
|
<view class="total-price">合计:</view>
|
|
|
- <view class="price"><text class="mini-text">¥</text>{{previewCourseInfo.totalPrice}}</view>
|
|
|
- <view class="discount">优惠¥{{previewCourseInfo.totalDiscount}}</view>
|
|
|
+ <view class="price"><text class="mini-text">¥</text>{{ previewCourseInfo.totalPrice }}</view>
|
|
|
+ <view class="discount">优惠¥{{ previewCourseInfo.totalDiscount }}</view>
|
|
|
</view>
|
|
|
- <view class="footer-btn" @click="to_pay">
|
|
|
+ <view class="footer-btn" @click="submitOrder">
|
|
|
<button>
|
|
|
- <view class="btn-price">¥{{previewCourseInfo.totalPrice}}</view>
|
|
|
+ <view class="btn-price">¥{{ previewCourseInfo.totalPrice }}</view>
|
|
|
<view class="btn-price">立即支付</view>
|
|
|
</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
+ <uni-popup ref="insurePopup" type="center">
|
|
|
+ <view class="r-center-popup">
|
|
|
+ <view class="r-popup-title">无保险免责声明</view>
|
|
|
+ <view class="r-popup-content">
|
|
|
+ 一、本声明的目的是为了使用体育场地的人员明确
|
|
|
+ 知晓体育活动所存在的风险,凡签署本声明的人员,
|
|
|
+ 均视为已经仔细阅读和完全理解并同意接受本声明
|
|
|
+ 的全部条款。对于违反国家相关法规、恶意侵犯他
|
|
|
+ 人或其他涉及犯罪行为的事件,均不在本声明范国
|
|
|
+ 内跟覆篮戏娇须由个人承担相应的法律责任。
|
|
|
+ 一、本声明的目的是为了使用体育场地的人员明确
|
|
|
+ 知晓体育活动所存在的风险,凡签署本声明的人员,
|
|
|
+ 均视为已经仔细阅读和完全理解并同意接受本声明
|
|
|
+ 的全部条款。对于违反国家相关法规、恶意侵犯他
|
|
|
+ 人或其他涉及犯罪行为的事件,均不在本声明范国
|
|
|
+ 内跟覆篮戏娇须由个人承担相应的法律责任。
|
|
|
+ 一、本声明的目的是为了使用体育场地的人员明确
|
|
|
+ 知晓体育活动所存在的风险,凡签署本声明的人员,
|
|
|
+ 均视为已经仔细阅读和完全理解并同意接受本声明
|
|
|
+ 的全部条款。对于违反国家相关法规、恶意侵犯他
|
|
|
+ 人或其他涉及犯罪行为的事件,均不在本声明范国
|
|
|
+ 内跟覆篮戏娇须由个人承担相应的法律责任。
|
|
|
+ 一、本声明的目的是为了使用体育场地的人员明确
|
|
|
+ 知晓体育活动所存在的风险,凡签署本声明的人员,
|
|
|
+ 均视为已经仔细阅读和完全理解并同意接受本声明
|
|
|
+ 的全部条款。对于违反国家相关法规、恶意侵犯他
|
|
|
+ 人或其他涉及犯罪行为的事件,均不在本声明范国
|
|
|
+ 内跟覆篮戏娇须由个人承担相应的法律责任。
|
|
|
+ </view>
|
|
|
+ <view class="r-popup-footer">
|
|
|
+ <view class="r-popup-needbtn" @click="toNeed">我需要购买保险</view>
|
|
|
+ <view class="r-popup-refusebtn" @click="toRefuse">我拒绝购买保险</view>
|
|
|
+ <view class="r-popup-checkbox" @click="select_insurance = !select_insurance">
|
|
|
+ <zzx-icon :name="select_insurance ? 'selected' : 'unchecked'" size="14"></zzx-icon>
|
|
|
+ <text>我已认真阅读及确认</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </uni-popup>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
- import { ref, onMounted,computed } from 'vue';
|
|
|
- import { onLoad, onPageScroll } from '@dcloudio/uni-app';
|
|
|
- import { RouterUtils, TipsUtils,idCardHide } from '@/utils/util';
|
|
|
- import { http } from '@/utils/http'
|
|
|
- const select_insurance = ref(false);
|
|
|
- const loadType = ref(1)
|
|
|
- onLoad((options) => {
|
|
|
- console.log(options);
|
|
|
- loadType.value = options.type
|
|
|
- courseId.value = options.courseId
|
|
|
- })
|
|
|
- onMounted(() => {
|
|
|
- get_previewOrderCourse()
|
|
|
- get_userData()
|
|
|
- })
|
|
|
-
|
|
|
-
|
|
|
- const to_pay = () => {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/index/toBeUsed/index'
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- const toUserList = () => {
|
|
|
- RouterUtils.to_page('/pages/index/userList/index')
|
|
|
- }
|
|
|
-
|
|
|
- const userData=ref()
|
|
|
- const get_userData=()=>{
|
|
|
- uni.$on('userData',function(data){
|
|
|
- userData.value=data
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- const deleteUser=async(e)=>{
|
|
|
- let res = await TipsUtils.tips_alert('确定删除该用户吗?',true)
|
|
|
- if(res.confirm){
|
|
|
- userData.value=userData.value.filter(user=>user.id!==e.id)
|
|
|
+import { ref, onMounted, computed } from 'vue';
|
|
|
+import { onLoad, onPageScroll } from '@dcloudio/uni-app';
|
|
|
+import { RouterUtils, TipsUtils, idCardHide } from '@/utils/util';
|
|
|
+import { http } from '@/utils/http'
|
|
|
+const insurePopup = ref()
|
|
|
+const select_insurance = ref(false)
|
|
|
+const loadType = ref(1)
|
|
|
+onLoad((options) => {
|
|
|
+ loadType.value = options.type
|
|
|
+ courseId.value = options.courseId
|
|
|
+ orderFormData.value.type = options.orderType
|
|
|
+})
|
|
|
+onMounted(() => {
|
|
|
+ get_previewOrderCourse()
|
|
|
+ get_userData()
|
|
|
+})
|
|
|
+
|
|
|
+const toUserList = () => {
|
|
|
+ RouterUtils.to_page('/pages/index/userList/index')
|
|
|
+}
|
|
|
+
|
|
|
+const userData = ref()
|
|
|
+const get_userData = () => {
|
|
|
+ uni.$on('userData', function (data) {
|
|
|
+ userData.value = data
|
|
|
+ if (data.length > 0) {
|
|
|
+ let familyIds = data.map(item => item.id)
|
|
|
+ orderFormData.value.familyIds = familyIds.join(',')
|
|
|
+ } else {
|
|
|
+ orderFormData.value.familyIds = []
|
|
|
}
|
|
|
- }
|
|
|
+ })
|
|
|
+}
|
|
|
|
|
|
- const courseId = ref()
|
|
|
- const previewCourseInfo = ref()
|
|
|
- const get_previewOrderCourse = () => {
|
|
|
- http.get('/order/previewOrderCourse', { data: { courseId: courseId.value }, loading: true }).then((res) => {
|
|
|
- previewCourseInfo.value = res.result
|
|
|
- })
|
|
|
+const deleteUser = async (e) => {
|
|
|
+ let res = await TipsUtils.tips_alert('确定删除该用户吗?', true)
|
|
|
+ if (res.confirm) {
|
|
|
+ userData.value = userData.value.filter(user => user.id !== e.id)
|
|
|
}
|
|
|
+}
|
|
|
+
|
|
|
+const courseId = ref()
|
|
|
+const previewCourseInfo = ref()
|
|
|
+const get_previewOrderCourse = () => {
|
|
|
+ http.get('/order/previewOrderCourse', { data: { courseId: courseId.value }, loading: true }).then((res) => {
|
|
|
+ previewCourseInfo.value = res.result
|
|
|
+ orderFormData.value.productIds = res.result.id
|
|
|
+ })
|
|
|
+}
|
|
|
|
|
|
- const countTotal = ref(1)
|
|
|
- const minusNum = () => {
|
|
|
- if (countTotal.value > 1) {
|
|
|
- countTotal.value--
|
|
|
+const countTotal = ref(1)
|
|
|
+const minusNum = () => {
|
|
|
+ if (countTotal.value > 1) {
|
|
|
+ countTotal.value--
|
|
|
+ orderFormData.value.amount = countTotal.value
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// const subtotal=computed(()=>{
|
|
|
+// return (previewCourseInfo.value.subtotal*countTotal.value).toFixed(2)-previewCourseInfo.value.
|
|
|
+// })
|
|
|
+
|
|
|
+const addNum = () => {
|
|
|
+ get_checkCourseLimitNum(countTotal.value + 1)
|
|
|
+ orderFormData.value.amount = countTotal.value+1
|
|
|
+}
|
|
|
+
|
|
|
+const get_checkCourseLimitNum = (targetNum) => {
|
|
|
+ http.get('/order/checkCourseLimitNum', {
|
|
|
+ data: {
|
|
|
+ courseId: courseId.value,
|
|
|
+ limitNum: targetNum
|
|
|
+ },
|
|
|
+ loading: true
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.result === true) {
|
|
|
+ countTotal.value = targetNum
|
|
|
+ } else {
|
|
|
+ TipsUtils.tips_toast('超出可购数量')
|
|
|
}
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+const toNeed = () => {
|
|
|
+ if (!select_insurance.value) return TipsUtils.tips_toast('请先阅读并同意协议')
|
|
|
+ insurePopup.value.close()
|
|
|
+ RouterUtils.to_page('/pages/index/insure/index')
|
|
|
+}
|
|
|
+
|
|
|
+const toRefuse = () => {
|
|
|
+ if (select_insurance.value) {
|
|
|
+ insurePopup.value.close()
|
|
|
+ } else {
|
|
|
+ TipsUtils.tips_toast('请先阅读并同意协议')
|
|
|
}
|
|
|
-
|
|
|
- // const subtotal=computed(()=>{
|
|
|
- // return (previewCourseInfo.value.subtotal*countTotal.value).toFixed(2)-previewCourseInfo.value.
|
|
|
- // })
|
|
|
+}
|
|
|
+
|
|
|
+// uni.navigateTo({
|
|
|
+// url: '/pages/index/toBeUsed/index'
|
|
|
+// })
|
|
|
+let orderFormData = ref({
|
|
|
+ type: null,
|
|
|
+ orderType: null,
|
|
|
+ orFreeOrder: 1,
|
|
|
+ productIds: null,
|
|
|
+ amount: null,
|
|
|
+ familyIds: null,
|
|
|
+})
|
|
|
+const submitOrder = () => {
|
|
|
+ if (!userData.value) return TipsUtils.tips_toast('请添加用户信息')
|
|
|
+ http.post('/order/createOrder', orderFormData.value, { loading: true }).then((res) => {
|
|
|
|
|
|
- const addNum = () => {
|
|
|
- get_checkCourseLimitNum(countTotal.value + 1)
|
|
|
- }
|
|
|
-
|
|
|
- const get_checkCourseLimitNum = (targetNum) => {
|
|
|
- http.get('/order/checkCourseLimitNum', {
|
|
|
- data: {
|
|
|
- courseId: courseId.value,
|
|
|
- limitNum: targetNum
|
|
|
- },
|
|
|
- loading: true
|
|
|
- }).then((res) => {
|
|
|
- if (res.result === true) {
|
|
|
- countTotal.value = targetNum
|
|
|
- } else {
|
|
|
- TipsUtils.tips_toast('超出可购数量')
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
+ })
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
- .g-orderinfo-card {
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 32rpx;
|
|
|
- padding: 20rpx;
|
|
|
- margin-top: 20rpx;
|
|
|
+.g-orderinfo-card {
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 32rpx;
|
|
|
+ padding: 20rpx;
|
|
|
+ margin-top: 20rpx;
|
|
|
+
|
|
|
+ .g-shoping-info {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 20rpx;
|
|
|
+
|
|
|
+ .shoping-img {
|
|
|
+ width: 200rpx;
|
|
|
+ height: 200rpx;
|
|
|
+ border-radius: 32rpx;
|
|
|
+ }
|
|
|
|
|
|
- .g-shoping-info {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- gap: 20rpx;
|
|
|
+ .shoping-info {
|
|
|
+ width: 440rpx;
|
|
|
|
|
|
- .shoping-img {
|
|
|
- width: 200rpx;
|
|
|
- height: 200rpx;
|
|
|
- border-radius: 32rpx;
|
|
|
+ .name {
|
|
|
+ font-weight: 800;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #222222;
|
|
|
+ line-height: 44rp
|
|
|
}
|
|
|
|
|
|
- .shoping-info {
|
|
|
- width: 440rpx;
|
|
|
+ .price-info {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-top: 26rpx;
|
|
|
|
|
|
- .name {
|
|
|
+ .price {
|
|
|
font-weight: 800;
|
|
|
- font-size: 32rpx;
|
|
|
- color: #222222;
|
|
|
- line-height: 44rp
|
|
|
+ font-size: 48rpx;
|
|
|
+ color: #FB5B5B;
|
|
|
}
|
|
|
|
|
|
- .price-info {
|
|
|
+ .price-stepper {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- margin-top: 26rpx;
|
|
|
+ border: 1rpx solid #F0F0F0;
|
|
|
+ border-radius: 8rpx;
|
|
|
|
|
|
- .price {
|
|
|
- font-weight: 800;
|
|
|
- font-size: 48rpx;
|
|
|
- color: #FB5B5B;
|
|
|
+ .minus {
|
|
|
+ text-align: center;
|
|
|
+ width: 44rpx;
|
|
|
+ border-right: 1rpx solid #F0F0F0;
|
|
|
}
|
|
|
|
|
|
- .price-stepper {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- border: 1rpx solid #F0F0F0;
|
|
|
- border-radius: 8rpx;
|
|
|
-
|
|
|
- .minus {
|
|
|
- text-align: center;
|
|
|
- width: 44rpx;
|
|
|
- border-right: 1rpx solid #F0F0F0;
|
|
|
- }
|
|
|
-
|
|
|
- &>input {
|
|
|
- width: 80rpx;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #222222;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .add {
|
|
|
- text-align: center;
|
|
|
- width: 44rpx;
|
|
|
- border-left: 1rpx solid #F0F0F0;
|
|
|
- }
|
|
|
+ &>input {
|
|
|
+ width: 80rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .add {
|
|
|
+ text-align: center;
|
|
|
+ width: 44rpx;
|
|
|
+ border-left: 1rpx solid #F0F0F0;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .g-shoping-total {
|
|
|
- height: 148rpx;
|
|
|
- margin-top: 24rpx;
|
|
|
- border-top: 1rpx solid #F0F0F0;
|
|
|
+ .g-shoping-total {
|
|
|
+ height: 148rpx;
|
|
|
+ margin-top: 24rpx;
|
|
|
+ border-top: 1rpx solid #F0F0F0;
|
|
|
|
|
|
- .total-price {
|
|
|
- margin-top: 24rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .subtotal {
|
|
|
- border-top: 1rpx solid #F0F0F0;
|
|
|
- height: 84rpx;
|
|
|
- line-height: 84rpx;
|
|
|
- font-weight: bold;
|
|
|
+ .total-price {
|
|
|
+ margin-top: 24rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
font-size: 28rpx;
|
|
|
- color: #FB5B5B;
|
|
|
- text-align: right;
|
|
|
+ color: #222222;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .g-buy-tips {
|
|
|
+ .subtotal {
|
|
|
+ border-top: 1rpx solid #F0F0F0;
|
|
|
+ height: 84rpx;
|
|
|
+ line-height: 84rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #FB5B5B;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.g-buy-tips {
|
|
|
+ margin-top: 20rpx;
|
|
|
+
|
|
|
+ .tips-title {
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #222222;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tips-info-card {
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 32rpx;
|
|
|
+ padding: 20rpx;
|
|
|
margin-top: 20rpx;
|
|
|
|
|
|
- .tips-title {
|
|
|
+ .title {
|
|
|
font-weight: bold;
|
|
|
- font-size: 32rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
color: #222222;
|
|
|
}
|
|
|
|
|
|
- .tips-info-card {
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 32rpx;
|
|
|
- padding: 20rpx;
|
|
|
+ .text {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #AAAAAA;
|
|
|
margin-top: 20rpx;
|
|
|
-
|
|
|
- .title {
|
|
|
- font-weight: bold;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
-
|
|
|
- .text {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #AAAAAA;
|
|
|
- margin-top: 20rpx;
|
|
|
- margin-bottom: 20rpx;
|
|
|
- }
|
|
|
+ margin-bottom: 20rpx;
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
+
|
|
|
+.r-insurance {
|
|
|
+ margin-top: 20rpx;
|
|
|
+ padding: 20rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 32rpx;
|
|
|
+
|
|
|
+ .r-insurance-infobox {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ gap: 20rpx;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+
|
|
|
+ .r-image-box {
|
|
|
+ &>image {
|
|
|
+ width: 200rpx;
|
|
|
+ height: 200rpx;
|
|
|
+ border-radius: 32rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .g-insurance-card {
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 32rpx;
|
|
|
- padding: 20rpx;
|
|
|
- margin-top: 20rpx;
|
|
|
-
|
|
|
- .g-insurance-info {
|
|
|
- .insurance-type {
|
|
|
+ .r-insurance-title {
|
|
|
+ .r-insurance-name {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- .type-name {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- gap: 10rpx;
|
|
|
+ gap: 16rpx;
|
|
|
|
|
|
- .name {
|
|
|
- font-weight: bold;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
-
|
|
|
- .tips {
|
|
|
- width: 136rpx;
|
|
|
- height: 36rpx;
|
|
|
- background: #FDD143;
|
|
|
- border-radius: 8rpx;
|
|
|
- font-size: 22rpx;
|
|
|
- color: #222222;
|
|
|
- text-align: center;
|
|
|
- line-height: 36rpx;
|
|
|
- }
|
|
|
+ .r-name {
|
|
|
+ font-weight: 800;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
}
|
|
|
|
|
|
- .insurance-more {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- gap: 10rpx;
|
|
|
-
|
|
|
- &>text {
|
|
|
- margin-bottom: 4rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- color: #AAAAAA;
|
|
|
- }
|
|
|
+ .r-tags {
|
|
|
+ width: 136rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ background: #FDD143;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ font-size: 22rpx;
|
|
|
+ color: #222222;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 36rpx;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .insurance-num {
|
|
|
- margin-top: 16rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
+ .r-insurance-desc {
|
|
|
+ margin-top: 10rpx;
|
|
|
font-size: 24rpx;
|
|
|
color: #AAAAAA;
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- .insurance-total {
|
|
|
- margin-top: 20rpx;
|
|
|
- border-top: 1rpx solid #F0F0F0;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- height: 88rpx;
|
|
|
-
|
|
|
- .text {
|
|
|
- font-size: 28rpx;
|
|
|
- color: #222222;
|
|
|
+ .r-insurance-type {
|
|
|
+ margin-top: 10rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #AAAAAA;
|
|
|
}
|
|
|
|
|
|
- .price {
|
|
|
- font-weight: bold;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #FB5B5B;
|
|
|
+ .r-insurance-price {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .r-price {
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #FB5B5B;
|
|
|
+ }
|
|
|
+
|
|
|
+ .r-insurance-btn {
|
|
|
+ width: 200rpx;
|
|
|
+ height: 68rpx;
|
|
|
+ background: #C8FF0C;
|
|
|
+ border-radius: 60rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 68rpx;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .g-userinfo-card {
|
|
|
- margin-top: 20rpx;
|
|
|
- padding: 20rpx;
|
|
|
- background: #FFFFFF;
|
|
|
+ .r-insurance-adduser {
|
|
|
+ background: #F6F6F6;
|
|
|
border-radius: 32rpx;
|
|
|
+ padding: 20rpx;
|
|
|
+ margin-top: 20rpx;
|
|
|
|
|
|
- .r-user {
|
|
|
+ .r-adduser-btn {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
+ justify-content: flex-end;
|
|
|
+ gap: 20rpx;
|
|
|
|
|
|
- .user-title {
|
|
|
+ .r-celar {
|
|
|
+ width: 192rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 60rpx;
|
|
|
+ border: 2rpx solid #FB5B5B;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #FB5B5B;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 68rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .r-edit {
|
|
|
+ width: 200rpx;
|
|
|
+ height: 68rpx;
|
|
|
+ background: #C8FF0C;
|
|
|
+ border-radius: 60rpx;
|
|
|
font-weight: bold;
|
|
|
font-size: 28rpx;
|
|
|
color: #222222;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 68rpx;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .invite {
|
|
|
+ .r-userinfo-list {
|
|
|
+ .r-userinfo-item {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- gap: 8rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- color: #AAAAAA;
|
|
|
- position: relative;
|
|
|
- .g-share-btn{
|
|
|
- position: absolute;
|
|
|
- width: 200rpx;
|
|
|
- height: 60rpx;
|
|
|
- opacity: 0;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-top: 20rpx;
|
|
|
+
|
|
|
+ .r-item-title {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #AAAAAA;
|
|
|
+ }
|
|
|
+
|
|
|
+ .r-item-info {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
- .user-tags {
|
|
|
- margin-top: 20rpx;
|
|
|
- width: 112rpx;
|
|
|
- height: 40rpx;
|
|
|
- background: #FDD143;
|
|
|
- border-radius: 8rpx;
|
|
|
- line-height: 40rpx;
|
|
|
+.g-userinfo-card {
|
|
|
+ margin-top: 20rpx;
|
|
|
+ padding: 20rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 32rpx;
|
|
|
+
|
|
|
+ .r-user {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .user-title {
|
|
|
font-weight: bold;
|
|
|
font-size: 28rpx;
|
|
|
color: #222222;
|
|
|
- text-align: center;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #222222;
|
|
|
}
|
|
|
|
|
|
- .r-user-list {
|
|
|
- margin-top: 20rpx;
|
|
|
+ .invite {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- gap: 20rpx;
|
|
|
- border-top: 1rpx solid #F0F0F0;
|
|
|
- height: 140rpx;
|
|
|
-
|
|
|
- .minus-user {
|
|
|
- width: 30rpx;
|
|
|
- height: 30rpx;
|
|
|
- border-radius: 50%;
|
|
|
- background: #FB5B5B;
|
|
|
- text-align: center;
|
|
|
- line-height: 20rpx;
|
|
|
- font-weight: 600;
|
|
|
- color: #fff;
|
|
|
- font-size: 40rpx;
|
|
|
+ gap: 8rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #AAAAAA;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .g-share-btn {
|
|
|
+ position: absolute;
|
|
|
+ width: 200rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ opacity: 0;
|
|
|
}
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .r-list {
|
|
|
- .name {
|
|
|
- font-weight: bold;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
+ .user-tags {
|
|
|
+ margin-top: 20rpx;
|
|
|
+ width: 112rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ background: #FDD143;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
+ }
|
|
|
|
|
|
- .id-num {
|
|
|
- font-size: 28rpx;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
- }
|
|
|
+ .r-user-list {
|
|
|
+ margin-top: 20rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 20rpx;
|
|
|
+ border-top: 1rpx solid #F0F0F0;
|
|
|
+ height: 140rpx;
|
|
|
+
|
|
|
+ .minus-user {
|
|
|
+ width: 30rpx;
|
|
|
+ height: 30rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ background: #FB5B5B;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 20rpx;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 40rpx;
|
|
|
}
|
|
|
|
|
|
- .g-adduser-btn {
|
|
|
- display: flex;
|
|
|
- height: 88rpx;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- gap: 20rpx;
|
|
|
- border-top: 1rpx solid #F0F0F0;
|
|
|
-
|
|
|
- .add-icon {
|
|
|
- width: 30rpx;
|
|
|
- height: 30rpx;
|
|
|
- border-radius: 50%;
|
|
|
- background: #FDD143;
|
|
|
- font-size: 30rpx;
|
|
|
- font-weight: 600;
|
|
|
- color: #fff;
|
|
|
- text-align: center;
|
|
|
- line-height: 20rpx;
|
|
|
+ .r-list {
|
|
|
+ .name {
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
}
|
|
|
|
|
|
- .add-text {
|
|
|
+ .id-num {
|
|
|
font-size: 28rpx;
|
|
|
- color: #FDD143;
|
|
|
+ color: #222222;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .g-usetips-card {
|
|
|
+ .g-adduser-btn {
|
|
|
+ display: flex;
|
|
|
+ height: 88rpx;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ gap: 20rpx;
|
|
|
+ border-top: 1rpx solid #F0F0F0;
|
|
|
+
|
|
|
+ .add-icon {
|
|
|
+ width: 30rpx;
|
|
|
+ height: 30rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ background: #FDD143;
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #fff;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .add-text {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #FDD143;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.g-usetips-card {
|
|
|
+ margin-top: 20rpx;
|
|
|
+ padding: 20rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 32rpx;
|
|
|
+
|
|
|
+ .use-title {
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
+ }
|
|
|
+
|
|
|
+ .use-text {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #222222;
|
|
|
+
|
|
|
+ .item-text {
|
|
|
+ margin-top: 20rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .use-tips-more {
|
|
|
margin-top: 20rpx;
|
|
|
- padding: 20rpx;
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 32rpx;
|
|
|
|
|
|
- .use-title {
|
|
|
+ .more-text {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #CCCCCC;
|
|
|
+ }
|
|
|
+
|
|
|
+ .use-line {
|
|
|
+ margin: auto;
|
|
|
+ margin-top: 10rpx;
|
|
|
+ width: 38rpx;
|
|
|
+ height: 4rpx;
|
|
|
+ background: #CCCCCC;
|
|
|
+ border-radius: 2rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.footer {
|
|
|
+ left: 0;
|
|
|
+
|
|
|
+ .footer-price {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .total-price {
|
|
|
font-weight: bold;
|
|
|
font-size: 28rpx;
|
|
|
color: #222222;
|
|
|
}
|
|
|
|
|
|
- .use-text {
|
|
|
+ .price {
|
|
|
+ font-weight: 800;
|
|
|
+ font-size: 48rpx;
|
|
|
+ color: #FB5B5B;
|
|
|
+ }
|
|
|
+
|
|
|
+ .discount {
|
|
|
+ margin-left: 10rpx;
|
|
|
font-size: 24rpx;
|
|
|
color: #222222;
|
|
|
-
|
|
|
- .item-text {
|
|
|
- margin-top: 20rpx;
|
|
|
- }
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .use-tips-more {
|
|
|
- margin-top: 20rpx;
|
|
|
-
|
|
|
- .more-text {
|
|
|
- text-align: center;
|
|
|
- font-size: 24rpx;
|
|
|
- color: #CCCCCC;
|
|
|
- }
|
|
|
+ .footer-btn {
|
|
|
+ &>button {
|
|
|
+ width: 226rpx;
|
|
|
+ height: 100rpx;
|
|
|
+ background: #C8FF0C;
|
|
|
+ border-radius: 60rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #222222;
|
|
|
+ line-height: 44rpx;
|
|
|
+ }
|
|
|
|
|
|
- .use-line {
|
|
|
- margin: auto;
|
|
|
- margin-top: 10rpx;
|
|
|
- width: 38rpx;
|
|
|
- height: 4rpx;
|
|
|
- background: #CCCCCC;
|
|
|
- border-radius: 2rpx;
|
|
|
- }
|
|
|
+ &>button::after {
|
|
|
+ border: none;
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
+
|
|
|
+.r-center-popup {
|
|
|
+ width: 646rpx;
|
|
|
+ height: 1000rpx;
|
|
|
+ background: #F6F6F6;
|
|
|
+ border-radius: 32rpx;
|
|
|
+ padding: 20rpx;
|
|
|
+
|
|
|
+ .r-popup-title {
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #222222;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
|
|
|
- .footer {
|
|
|
- left: 0;
|
|
|
-
|
|
|
- .footer-price {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
+ .r-popup-content {
|
|
|
+ margin-top: 28rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
+ height: 600rpx;
|
|
|
+ overflow: auto;
|
|
|
+ }
|
|
|
|
|
|
- .total-price {
|
|
|
- font-weight: bold;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
+ .r-popup-footer {
|
|
|
+ margin-top: 20rpx;
|
|
|
|
|
|
- .price {
|
|
|
- font-weight: 800;
|
|
|
- font-size: 48rpx;
|
|
|
- color: #FB5B5B;
|
|
|
- }
|
|
|
+ .r-popup-needbtn {
|
|
|
+ margin: auto;
|
|
|
+ width: 598rpx;
|
|
|
+ height: 100rpx;
|
|
|
+ background: #C8FF0C;
|
|
|
+ border-radius: 60rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #222222;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 100rpx;
|
|
|
+ }
|
|
|
|
|
|
- .discount {
|
|
|
- margin-left: 10rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
+ .r-popup-refusebtn {
|
|
|
+ margin: auto;
|
|
|
+ margin-top: 24rpx;
|
|
|
+ width: 598rpx;
|
|
|
+ height: 100rpx;
|
|
|
+ background: #f0eeee;
|
|
|
+ border-radius: 60rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #AAAAAA;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 100rpx;
|
|
|
}
|
|
|
|
|
|
- .footer-btn {
|
|
|
- &>button {
|
|
|
- width: 226rpx;
|
|
|
- height: 100rpx;
|
|
|
- background: #C8FF0C;
|
|
|
- border-radius: 60rpx;
|
|
|
- font-weight: bold;
|
|
|
- font-size: 32rpx;
|
|
|
- color: #222222;
|
|
|
- line-height: 44rpx;
|
|
|
- }
|
|
|
+ .r-popup-checkbox {
|
|
|
+ margin-top: 20rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ gap: 16rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #AAAAAA;
|
|
|
|
|
|
- &>button::after {
|
|
|
- border: none;
|
|
|
+ &>text {
|
|
|
+ margin-bottom: 8rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</style>
|