|
|
|
|
|
<template>
|
|
|
|
|
|
<view class="complete-claims">
|
|
|
|
|
|
<u-navbar title="完善理赔信息" titleStyle="{'font-weight':'500','font-size':'32rpx'}" height="108rpx" placeholder="true"></u-navbar>
|
|
|
|
|
|
<view class="complete-body">
|
|
|
|
|
|
<!-- 顶部提示 -->
|
|
|
|
|
|
<view class="tips">
|
|
|
|
|
|
<image src="../../static/img/complete-tips.png" class="tips-img"></image>
|
|
|
|
|
|
<text class="tips-text">需扫描绑于螃蟹身上的验蟹师吊牌码添加哦</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<!-- 已申请的理赔 -->
|
|
|
|
|
|
<view class="item">
|
|
|
|
|
|
<view class="item-left">
|
|
|
|
|
|
<image src="https://wx3.sinaimg.cn/large/0060qb9Xgy1hsby36rqrxj335s35snpd.jpg"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="item-right">
|
|
|
|
|
|
<image src="../../static/img/item-img.png"></image>
|
|
|
|
|
|
<view class="item-num">YXS234568798097871</view>
|
|
|
|
|
|
<view class="item-con">死蟹｜2 两 公蟹</view>
|
|
|
|
|
|
<view class="item-price">
|
|
|
|
|
|
预计理赔<text>12.1222222</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<!-- <view class="item">
|
|
|
|
|
|
<view class="item-left">
|
|
|
|
|
|
<image src="https://wx3.sinaimg.cn/large/0060qb9Xgy1hsby36rqrxj335s35snpd.jpg"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="item-right">
|
|
|
|
|
|
<image src="../../static/img/item-img.png"></image>
|
|
|
|
|
|
<view class="item-num">YXS234568798097871</view>
|
|
|
|
|
|
<view class="item-con">死蟹｜2 两 公蟹</view>
|
|
|
|
|
|
<view class="item-price">
|
|
|
|
|
|
预计理赔<text>12.1222222</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="item">
|
|
|
|
|
|
<view class="item-left">
|
|
|
|
|
|
<image src="https://wx3.sinaimg.cn/large/0060qb9Xgy1hsby36rqrxj335s35snpd.jpg"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="item-right">
|
|
|
|
|
|
<image src="../../static/img/item-img.png"></image>
|
|
|
|
|
|
<view class="item-num">YXS234568798097871</view>
|
|
|
|
|
|
<view class="item-con">死蟹｜2 两 公蟹</view>
|
|
|
|
|
|
<view class="item-price">
|
|
|
|
|
|
预计理赔<text>12.1222222</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="item">
|
|
|
|
|
|
<view class="item-left">
|
|
|
|
|
|
<image src="https://wx3.sinaimg.cn/large/0060qb9Xgy1hsby36rqrxj335s35snpd.jpg"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="item-right">
|
|
|
|
|
|
<image src="../../static/img/item-img.png"></image>
|
|
|
|
|
|
<view class="item-num">YXS234568798097871</view>
|
|
|
|
|
|
<view class="item-con">死蟹｜2 两 公蟹</view>
|
|
|
|
|
|
<view class="item-price">
|
|
|
|
|
|
预计理赔<text>12.1222222</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="item">
|
|
|
|
|
|
<view class="item-left">
|
|
|
|
|
|
<image src="https://wx3.sinaimg.cn/large/0060qb9Xgy1hsby36rqrxj335s35snpd.jpg"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="item-right">
|
|
|
|
|
|
<image src="../../static/img/item-img.png"></image>
|
|
|
|
|
|
<view class="item-num">YXS234568798097871</view>
|
|
|
|
|
|
<view class="item-con">死蟹｜2 两 公蟹</view>
|
|
|
|
|
|
<view class="item-price">
|
|
|
|
|
|
预计理赔<text>12.1222222</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="item">
|
|
|
|
|
|
<view class="item-left">
|
|
|
|
|
|
<image src="https://wx3.sinaimg.cn/large/0060qb9Xgy1hsby36rqrxj335s35snpd.jpg"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="item-right">
|
|
|
|
|
|
<image src="../../static/img/item-img.png"></image>
|
|
|
|
|
|
<view class="item-num">YXS234568798097871</view>
|
|
|
|
|
|
<view class="item-con">死蟹｜2 两 公蟹</view>
|
|
|
|
|
|
<view class="item-price">
|
|
|
|
|
|
预计理赔<text>12.1222222</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="item">
|
|
|
|
|
|
<view class="item-left">
|
|
|
|
|
|
<image src="https://wx3.sinaimg.cn/large/0060qb9Xgy1hsby36rqrxj335s35snpd.jpg"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="item-right">
|
|
|
|
|
|
<image src="../../static/img/item-img.png"></image>
|
|
|
|
|
|
<view class="item-num">YXS234568798097871</view>
|
|
|
|
|
|
<view class="item-con">死蟹｜2 两 公蟹</view>
|
|
|
|
|
|
<view class="item-price">
|
|
|
|
|
|
预计理赔<text>12.1222222</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view> -->
|
|
|
|
|
|
<!-- 添加新的理赔 -->
|
|
|
|
|
|
<view class="add-btn" @click="show = true">
|
|
|
|
|
|
<view class="btn-bgColor">
|
|
|
|
|
|
<image src="../../static/img/add-scan.png"></image>
|
|
|
|
|
|
<button>扫码添加</button>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<!-- 底部按钮 -->
|
|
|
|
|
|
<view class="complete-bottom" >
|
|
|
|
|
|
<view class="bottom-left">
|
|
|
|
|
|
<view>共<text>288888</text>只</view>
|
|
|
|
|
|
<view>预计赔付</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="bottom-price">
|
|
|
|
|
|
32.12222222
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="bottom-btn">
|
|
|
|
|
|
完成理赔
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<u-popup ref="popup" :show="show" mode="bottom" @open="open" :safeAreaInsetBottom="false" :round="16" :closeOnClickOverlay="false">
|
|
|
|
|
|
<view class="complete-popup">
|
|
|
|
|
|
<image src="../../static/img/popup-close.png" @click="close"></image>
|
|
|
|
|
|
<view class="popup-title">补充理赔规格信息</view>
|
|
|
|
|
|
<scroll-view scroll-y="true" :style="{height: `${scroll_height}rpx`}"><!-- 允许上下滚动 -->
|
|
|
|
|
|
<view class="popup-tips">
|
|
|
|
|
|
<image src="../../static/img/complete-tips.png" class="tips-img"></image>
|
|
|
|
|
|
<text class="tips-text">规格信息可在包装外侧或购买订单中查看</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="popup-item">
|
|
|
|
|
|
<view class="popup-item-title">
|
|
|
|
|
|
螃蟹类型
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="popup-item-box">
|
|
|
|
|
|
<view :class="['box-con',{'act': maleIsAct==true}]" @click="isActive">
|
|
|
|
|
|
<view class="box-left">
|
|
|
|
|
|
<image src="../../static/img/w1.png"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="box-right">
|
|
|
|
|
|
<view class="name">公蟹</view>
|
|
|
|
|
|
<view class="type">尖脐 钳大蟹钳毛多</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view :class="['box-con',{'act': maleIsAct==false}]" @click="isActive">
|
|
|
|
|
|
<view class="box-left">
|
|
|
|
|
|
<image src="../../static/img/w1.png"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="box-right">
|
|
|
|
|
|
<view class="name">母蟹</view>
|
|
|
|
|
|
<view class="type">圆脐 钳小蟹钳毛少</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="popup-item">
|
|
|
|
|
|
<view class="popup-item-title">
|
|
|
|
|
|
螃蟹规格
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="popup-item-box">
|
|
|
|
|
|
<view :class="['type-item',{'act': item.checked}]" v-for="item in typeList" @click="isTypeActive" :data-id='item.num'>{{item.name}}</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="popup-item">
|
|
|
|
|
|
<view class="popup-item-title img">
|
|
|
|
|
|
单只蟹称重照片
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="item-addition">
|
|
|
|
|
|
漏出清晰的重量数字及溯源二维码。
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="image-box">
|
|
|
|
|
|
<view class="image-item">
|
|
|
|
|
|
<image src="https://wx2.sinaimg.cn/large/006WYq6ngy1hsd6nwzzj8j30u00u2dip.jpg"></image>
|
|
|
|
|
|
<view class="image-tip">
|
|
|
|
|
|
<image class="tip-icon" src="../../static/img/image-icon.png"></image>
|
|
|
|
|
|
示例
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="image-bottom">需要 1 张</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="image-item">
|
|
|
|
|
|
<image src="https://wx2.sinaimg.cn/large/006WYq6ngy1hsd6nwzzj8j30u00u2dip.jpg"></image>
|
|
|
|
|
|
<view class="image-tip">
|
|
|
|
|
|
<image class="tip-icon" src="../../static/img/image-icon.png"></image>
|
|
|
|
|
|
示例
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="image-bottom">需要 1 张</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="image-item">
|
|
|
|
|
|
<image src="https://wx2.sinaimg.cn/large/006WYq6ngy1hsd6nwzzj8j30u00u2dip.jpg"></image>
|
|
|
|
|
|
<view class="image-tip">
|
|
|
|
|
|
<image class="tip-icon" src="../../static/img/image-icon.png"></image>
|
|
|
|
|
|
示例
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="image-bottom">需要 1 张</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="image-item">
|
|
|
|
|
|
<image src="https://wx2.sinaimg.cn/large/006WYq6ngy1hsd6nwzzj8j30u00u2dip.jpg"></image>
|
|
|
|
|
|
<view class="image-tip">
|
|
|
|
|
|
<image class="tip-icon" src="../../static/img/image-icon.png"></image>
|
|
|
|
|
|
示例
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="image-bottom">需要 1 张</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="image-item">
|
|
|
|
|
|
<image class="image-add" src="../../static/img/image-add.png"></image>
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</scroll-view>
|
|
|
|
|
|
<view class="popup-btn">
|
|
|
|
|
|
<view class="input-btn">确认提交</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</u-popup>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
export default {
|
|
|
|
|
|
data(){
|
|
|
|
|
|
return{
|
|
|
|
|
|
show:false,
|
|
|
|
|
|
typeList:
|
|
|
|
|
|
[{
|
|
|
|
|
|
name:'1.5两以下',
|
|
|
|
|
|
num:0,
|
|
|
|
|
|
checked:false
|
|
|
|
|
|
},{
|
|
|
|
|
|
name:'1.5 两',
|
|
|
|
|
|
num:1,
|
|
|
|
|
|
checked:false
|
|
|
|
|
|
},{
|
|
|
|
|
|
name:'2 两',
|
|
|
|
|
|
num:2,
|
|
|
|
|
|
checked:false
|
|
|
|
|
|
},{
|
|
|
|
|
|
name:'2.5 两',
|
|
|
|
|
|
num:3,
|
|
|
|
|
|
checked:false
|
|
|
|
|
|
},{
|
|
|
|
|
|
name:'3 两',
|
|
|
|
|
|
num:4,
|
|
|
|
|
|
checked:false
|
|
|
|
|
|
},{
|
|
|
|
|
|
name:'3.5两',
|
|
|
|
|
|
num:5,
|
|
|
|
|
|
checked:false
|
|
|
|
|
|
},{
|
|
|
|
|
|
name:'4 两',
|
|
|
|
|
|
num:6,
|
|
|
|
|
|
checked:false
|
|
|
|
|
|
},{
|
|
|
|
|
|
name:'4.5 两',
|
|
|
|
|
|
num:7,
|
|
|
|
|
|
checked:false
|
|
|
|
|
|
},{
|
|
|
|
|
|
name:'5 两',
|
|
|
|
|
|
num:8,
|
|
|
|
|
|
checked:false
|
|
|
|
|
|
},{
|
|
|
|
|
|
name:'5 两以上',
|
|
|
|
|
|
num:9,
|
|
|
|
|
|
checked:false
|
|
|
|
|
|
}],
|
|
|
|
|
|
maleIsAct:false,
|
|
|
|
|
|
scroll_height:0
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
onLoad() {
|
|
|
|
|
|
let windowHeight = wx.getSystemInfoSync().windowHeight;
|
|
|
|
|
|
let windowWidth = wx.getSystemInfoSync().windowWidth;
|
|
|
|
|
|
this.scroll_height = windowHeight*750/windowWidth - 400 - 30
|
|
|
|
|
|
},
|
|
|
|
|
|
methods:{
|
|
|
|
|
|
open(){
|
|
|
|
|
|
this.show = true
|
|
|
|
|
|
},
|
|
|
|
|
|
close(){
|
|
|
|
|
|
this.show = false
|
|
|
|
|
|
},
|
|
|
|
|
|
isActive(){
|
|
|
|
|
|
if(this.maleIsAct == true){
|
|
|
|
|
|
this.maleIsAct = false
|
|
|
|
|
|
}else{
|
|
|
|
|
|
this.maleIsAct = true
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
isTypeActive:function(e){
|
|
|
|
|
|
var index = e.currentTarget.dataset.id
|
|
|
|
|
|
var list = this.typeList
|
|
|
|
|
|
console.log(index)
|
|
|
|
|
|
console.log(list[index].checked)
|
|
|
|
|
|
if(list[index].checked == true){
|
|
|
|
|
|
list[index].checked = false
|
|
|
|
|
|
}else{
|
|
|
|
|
|
for (var item of this.typeList){
|
|
|
|
|
|
item.checked = false
|
|
|
|
|
|
}
|
|
|
|
|
|
list[index].checked = true
|
|
|
|
|
|
}
|
|
|
|
|
|
this.typeList = list
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<style lang="scss">
|
|
|
|
|
|
.complete-body{
|
|
|
|
|
|
width: 750rpx;
|
|
|
|
|
|
min-height: 70vh;
|
|
|
|
|
|
background: #F5F5F5;
|
|
|
|
|
|
padding-bottom: 200rpx;
|
|
|
|
|
|
.tips{
|
|
|
|
|
|
width: 750rpx;
|
|
|
|
|
|
height: 60rpx;
|
|
|
|
|
|
background: #FFFAEE;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
padding-top: 15rpx;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
}
|
|
|
|
|
|
.item{
|
|
|
|
|
|
width: 678rpx;
|
|
|
|
|
|
height: 180rpx;
|
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
|
border-radius: 16rpx;
|
|
|
|
|
|
margin: 24rpx 36rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
padding: 24rpx;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
.item-left{
|
|
|
|
|
|
width: 120rpx;
|
|
|
|
|
|
height: 120rpx;
|
|
|
|
|
|
border-radius: 12rpx;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
>image{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.item-right{
|
|
|
|
|
|
.item-num{
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: rgba(0,0,0,0.6);
|
|
|
|
|
|
line-height: 39rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
.item-con{
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
color: #000000;
|
|
|
|
|
|
line-height: 45rpx;
|
|
|
|
|
|
text-align: left;
|
|
|
|
|
|
}
|
|
|
|
|
|
.item-price{
|
|
|
|
|
|
width: 490rpx;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
color: rgba(0,0,0,0.3);
|
|
|
|
|
|
line-height: 34rpx;
|
|
|
|
|
|
text-align: right;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
>text{
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
color: #000000;
|
|
|
|
|
|
line-height: 56rpx;
|
|
|
|
|
|
text-align: right;
|
|
|
|
|
|
&::before{
|
|
|
|
|
|
content: '¥';
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
margin-right: 6rpx;
|
|
|
|
|
|
margin-left: 8rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
>image{
|
|
|
|
|
|
width: 32rpx;
|
|
|
|
|
|
height: 32rpx;
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
right: 24rpx;
|
|
|
|
|
|
top: 24rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.add-btn{
|
|
|
|
|
|
margin-left: 36rpx;
|
|
|
|
|
|
.btn-bgColor{
|
|
|
|
|
|
width: 678rpx;
|
|
|
|
|
|
height: 92rpx;
|
|
|
|
|
|
border-radius: 24rpx;
|
|
|
|
|
|
padding: 2rpx;
|
|
|
|
|
|
background-image: linear-gradient(91deg, rgba(67, 161, 255, 1), rgba(47, 128, 249, 1));
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
z-index: 5;
|
|
|
|
|
|
>image{
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
width: 36rpx;
|
|
|
|
|
|
height: 36rpx;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
left: 260rpx;
|
|
|
|
|
|
top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
>button{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
border-radius: 24rpx;
|
|
|
|
|
|
background: #F5F5F5;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #2388FF;
|
|
|
|
|
|
line-height: 39rpx;
|
|
|
|
|
|
padding-left: 60rpx;
|
|
|
|
|
|
padding-top: 24rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.complete-bottom{
|
|
|
|
|
|
width: 750rpx;
|
|
|
|
|
|
height: 184rpx;
|
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
bottom: 0;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
|
padding: 24rpx;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
.bottom-left{
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
color: rgba(0,0,0,0.3);
|
|
|
|
|
|
text-align-last: justify;
|
|
|
|
|
|
>view{
|
|
|
|
|
|
white-space: nowrap; //强制禁止换行
|
|
|
|
|
|
>text{
|
|
|
|
|
|
color: #000000 ;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.bottom-price{
|
|
|
|
|
|
font-family: PingFang SC, PingFang SC;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
font-size: 48rpx;
|
|
|
|
|
|
color: #FF2D46;
|
|
|
|
|
|
line-height: 67rpx;
|
|
|
|
|
|
&::before{
|
|
|
|
|
|
content: '¥';
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
margin-right: 6rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.bottom-btn{
|
|
|
|
|
|
width: 346rpx;
|
|
|
|
|
|
height: 92rpx;
|
|
|
|
|
|
background: linear-gradient( 91deg, #43A1FF 0%, #2F80F9 100%), #FFFFFF;
|
|
|
|
|
|
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #FFFFFF;
|
|
|
|
|
|
line-height: 39rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
padding-top: 26rpx;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.complete-popup{
|
|
|
|
|
|
width: 750rpx;
|
|
|
|
|
|
height: 89vh;
|
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
|
padding: 32rpx 36rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
//关闭图标
|
|
|
|
|
|
>image{
|
|
|
|
|
|
width: 48rpx;
|
|
|
|
|
|
height: 48rpx;
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
right: 36rpx;
|
|
|
|
|
|
top: 24rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
//标题
|
|
|
|
|
|
.popup-title{
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
color: #000000;
|
|
|
|
|
|
line-height: 45rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
//提示
|
|
|
|
|
|
.popup-tips{
|
|
|
|
|
|
width: 678rpx;
|
|
|
|
|
|
height: 60rpx;
|
|
|
|
|
|
background: #FFFAEE;
|
|
|
|
|
|
border-radius: 16rpx;
|
|
|
|
|
|
margin-top: 20rpx;
|
|
|
|
|
|
padding: 14rpx 24rpx;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
.popup-item{
|
|
|
|
|
|
.popup-item-title{
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #000000;
|
|
|
|
|
|
line-height: 39rpx;
|
|
|
|
|
|
margin-bottom: 20rpx;
|
|
|
|
|
|
margin-top: 24rpx;
|
|
|
|
|
|
&.img{
|
|
|
|
|
|
margin-top: 10rpx;
|
|
|
|
|
|
margin-bottom: 12rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.popup-item-box{
|
|
|
|
|
|
width: 678rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
.box-con{
|
|
|
|
|
|
width: 332rpx;
|
|
|
|
|
|
height: 120rpx;
|
|
|
|
|
|
background: #F8F8F8;
|
|
|
|
|
|
border-radius: 10rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
|
padding-top: 20rpx;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
.box-left{
|
|
|
|
|
|
width: 110rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
>image{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.box-right{
|
|
|
|
|
|
width: 184rpx;
|
|
|
|
|
|
height: 70rpx;
|
|
|
|
|
|
margin-top: 6rpx;
|
|
|
|
|
|
.name{
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #000000;
|
|
|
|
|
|
}
|
|
|
|
|
|
.type{
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 22rpx;
|
|
|
|
|
|
color: rgba(34,34,34,0.6);
|
|
|
|
|
|
line-height: 31rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
&.act{
|
|
|
|
|
|
z-index: 15;
|
|
|
|
|
|
background: rgba(35,136,255,0.1);
|
|
|
|
|
|
border: 2rpx solid #2388FF;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.type-item{
|
|
|
|
|
|
width: 332rpx;
|
|
|
|
|
|
height: 72rpx;
|
|
|
|
|
|
background: #F8F8F8;
|
|
|
|
|
|
border-radius: 8rpx;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #000000;
|
|
|
|
|
|
line-height: 39rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
padding-top: 16rpx;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
margin-bottom: 14rpx;
|
|
|
|
|
|
&.act{
|
|
|
|
|
|
z-index: 15;
|
|
|
|
|
|
background: rgba(35,136,255,0.1);
|
|
|
|
|
|
border: 2rpx solid #2388FF;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.item-addition{
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
color: #999999;
|
|
|
|
|
|
line-height: 34rpx;
|
|
|
|
|
|
text-align: left;
|
|
|
|
|
|
}
|
|
|
|
|
|
.image-box{
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
|
justify-content: left;
|
|
|
|
|
|
.image-item{
|
|
|
|
|
|
width: 226rpx;
|
|
|
|
|
|
height: 226rpx;
|
|
|
|
|
|
background: #F3F4F5;
|
|
|
|
|
|
border-radius: 10rpx;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
margin-top: 20rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
margin-right: 12rpx;
|
|
|
|
|
|
>image{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
z-index: 5;
|
|
|
|
|
|
}
|
|
|
|
|
|
.image-tip{
|
|
|
|
|
|
width: 100rpx;
|
|
|
|
|
|
height: 38rpx;
|
|
|
|
|
|
background: rgba(0,0,0,0.6);
|
|
|
|
|
|
border-radius: 0rpx 0rpx 8rpx 0rpx;
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 22rpx;
|
|
|
|
|
|
color: #FFFFFF;
|
|
|
|
|
|
line-height: 31rpx;
|
|
|
|
|
|
text-align: left;
|
|
|
|
|
|
padding: 4rpx 12rpx;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
.tip-icon{
|
|
|
|
|
|
width: 24rpx;
|
|
|
|
|
|
height: 24rpx;
|
|
|
|
|
|
margin-right: 8rpx;
|
|
|
|
|
|
margin-top: 4rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.image-bottom{
|
|
|
|
|
|
width: 226rpx;
|
|
|
|
|
|
height: 38rpx;
|
|
|
|
|
|
background: rgba(0,0,0,0.6);
|
|
|
|
|
|
border-radius: 0rpx 0rpx 8rpx 0rpx;
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
right: 0;
|
|
|
|
|
|
bottom: 0;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 22rpx;
|
|
|
|
|
|
color: #FFFFFF;
|
|
|
|
|
|
line-height: 31rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
.image-add{
|
|
|
|
|
|
margin-top: 90rpx;
|
|
|
|
|
|
width: 48rpx;
|
|
|
|
|
|
height: 48rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.popup-btn{
|
|
|
|
|
|
height:160rpx;
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
bottom: 0;
|
|
|
|
|
|
background-color: #FFF;
|
|
|
|
|
|
.input-btn{
|
|
|
|
|
|
width: 678rpx;
|
|
|
|
|
|
height: 92rpx;
|
|
|
|
|
|
background: linear-gradient( 91deg, #43A1FF 0%, #2F80F9 100%), #FFFFFF;
|
|
|
|
|
|
border-radius: 24rpx;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #FFFFFF;
|
|
|
|
|
|
line-height: 39rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
padding: 26rpx;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.tips-img{
|
|
|
|
|
|
width: 86rpx;
|
|
|
|
|
|
height: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
.tips-text{
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
color: #F0A941;
|
|
|
|
|
|
line-height: 34rpx;
|
|
|
|
|
|
margin-left: 12rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|
