|
@@ -2,49 +2,62 @@
|
|
<view class="exchangePrize">
|
|
<view class="exchangePrize">
|
|
<!-- 表单 -->
|
|
<!-- 表单 -->
|
|
<view class="form">
|
|
<view class="form">
|
|
- <uni-forms :modelValue="formData" >
|
|
|
|
- <uni-forms-item name="type" v-if="istype">
|
|
|
|
- <view class="selectType">
|
|
|
|
- <picker mode="selector" :value="formData.type" :range='typeSelect'
|
|
|
|
- @change="bindTypeChange">
|
|
|
|
- <view class="uni-input" >
|
|
|
|
|
|
+ <view class="">
|
|
|
|
+ <uni-forms :modelValue="formData">
|
|
|
|
+ <uni-forms-item name="type" v-if="istype">
|
|
|
|
+ <view class="selectType" @click="openSelect">
|
|
|
|
+ <view class="uni-input">
|
|
<text v-if="formData.type==''||formData.type==null"
|
|
<text v-if="formData.type==''||formData.type==null"
|
|
- style="color: #999999 ;">请选择配送方式</text>
|
|
|
|
- <text v-if="formData.type!=''">{{formData.type}}</text>
|
|
|
|
|
|
+ style="color: #999999 ;font-size: 30rpx;">请选择配送方式</text>
|
|
|
|
+ <text v-if="formData.type!=''" style="font-size: 30rpx;">{{formData.type}}</text>
|
|
</view>
|
|
</view>
|
|
<image src="/static/icon/right.png"
|
|
<image src="/static/icon/right.png"
|
|
- style="width: 14rpx;height: 24rpx;position: absolute;top:31rpx;right: 30rpx;"></image>
|
|
|
|
- </picker>
|
|
|
|
- </view>
|
|
|
|
- </uni-forms-item>
|
|
|
|
- <uni-forms-item name="name" v-if="formData.type!=''||isVerification==true">
|
|
|
|
- <uni-easyinput type="text" v-model="formData.name" placeholder="填写联系人" />
|
|
|
|
- </uni-forms-item>
|
|
|
|
- <uni-forms-item name="phone" v-if="formData.type!=''||isVerification==true">
|
|
|
|
- <uni-easyinput type="number" v-model="formData.phone" placeholder="填写联系电话" />
|
|
|
|
- </uni-forms-item>
|
|
|
|
- <uni-forms-item name="region" v-if="formData.type=='快递配送'">
|
|
|
|
- <uni-easyinput type="text" v-model="formData.region" placeholder="所在地区" />
|
|
|
|
- </uni-forms-item>
|
|
|
|
- <uni-forms-item name="region" v-if="formData.type=='快递配送'">
|
|
|
|
- <uni-easyinput type="text" v-model="formData.region" placeholder="详细地址" />
|
|
|
|
- </uni-forms-item>
|
|
|
|
- <uni-forms-item name="region" v-if="formData.type=='到店自提'||isVerification==true">
|
|
|
|
- <view class="selectType">
|
|
|
|
- <picker mode="selector" :value="formData.region" :range='regionSelect'
|
|
|
|
- @change="bindregionChange">
|
|
|
|
- <view class="uni-input" >
|
|
|
|
- <text v-if="formData.region==''||formData.region==null"
|
|
|
|
- style="color: #999999 ;">请选择门店</text>
|
|
|
|
- <text v-if="formData.region!=''">{{formData.region}}</text>
|
|
|
|
|
|
+ style="width: 14rpx;height: 24rpx;position: absolute;top:31rpx;right: 30rpx;">
|
|
|
|
+ </image>
|
|
|
|
+ </view>
|
|
|
|
+ </uni-forms-item>
|
|
|
|
+ <uni-forms-item name="name" v-if="formData.type!=''||isVerification==true">
|
|
|
|
+ <uni-easyinput type="text" v-model="formData.name" placeholder="填写联系人" />
|
|
|
|
+ </uni-forms-item>
|
|
|
|
+ <uni-forms-item name="phone" v-if="formData.type!=''||isVerification==true">
|
|
|
|
+ <uni-easyinput type="number" v-model="formData.phone" placeholder="填写联系电话" />
|
|
|
|
+ </uni-forms-item>
|
|
|
|
+ <uni-forms-item name="region" v-if="formData.type=='快递配送'">
|
|
|
|
+
|
|
|
|
+ <pickerAddress @change="change">
|
|
|
|
+ <!-- <uni-easyinput type="text" v-model="formData.region" placeholder="所在地区" /> -->
|
|
|
|
+ <view class="selectType">
|
|
|
|
+ <view class="uni-input">
|
|
|
|
+ <text v-if="formData.region==''||formData.region==null"
|
|
|
|
+ style="color: #999999 ; font-size: 30rpx; ">所在地区</text>
|
|
|
|
+ <text style="font-size: 30rpx;" v-if="formData.region!=''">{{formData.region}}</text>
|
|
|
|
+ </view>
|
|
|
|
+ <image src="/static/icon/right.png"
|
|
|
|
+ style="width: 14rpx;height: 24rpx;position: absolute;top:31rpx;right: 30rpx;">
|
|
|
|
+ </image>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ </pickerAddress>
|
|
|
|
+ </uni-forms-item>
|
|
|
|
+ <uni-forms-item name="region" v-if="formData.type=='快递配送'">
|
|
|
|
+ <!-- <uni-easyinput type="text" v-model="formData.region" placeholder="详细地址" /> -->
|
|
|
|
+ <textarea placeholder-style="#999" class="text-area" type="text" placeholder="详细地址" />
|
|
|
|
+
|
|
|
|
+ </uni-forms-item>
|
|
|
|
+ <uni-forms-item name="region" v-if="formData.type=='到店自提'||isVerification==true">
|
|
|
|
+ <view class="selectType" @click="openShop">
|
|
|
|
+ <view class="uni-input">
|
|
|
|
+ <text v-if="formData.shop==''||formData.shop==null"
|
|
|
|
+ style="color: #999999 ; font-size: 30rpx; ">请选择门店</text>
|
|
|
|
+ <text style="font-size: 30rpx;" v-if="formData.shop!=''">{{formData.shop}}</text>
|
|
</view>
|
|
</view>
|
|
<image src="/static/icon/right.png"
|
|
<image src="/static/icon/right.png"
|
|
- style="width: 14rpx;height: 24rpx;position: absolute;top:31rpx;right: 30rpx;"></image>
|
|
|
|
- </picker>
|
|
|
|
- </view>
|
|
|
|
- </uni-forms-item>
|
|
|
|
-
|
|
|
|
- </uni-forms>
|
|
|
|
|
|
+ style="width: 14rpx;height: 24rpx;position: absolute;top:31rpx;right: 30rpx;">
|
|
|
|
+ </image>
|
|
|
|
+ </view>
|
|
|
|
+ </uni-forms-item>
|
|
|
|
+ </uni-forms>
|
|
|
|
+ </view>
|
|
</view>
|
|
</view>
|
|
<!-- 产品信息 -->
|
|
<!-- 产品信息 -->
|
|
<view class="msg">
|
|
<view class="msg">
|
|
@@ -52,7 +65,7 @@
|
|
<text>产品信息</text>
|
|
<text>产品信息</text>
|
|
</view>
|
|
</view>
|
|
<view class="shopCard">
|
|
<view class="shopCard">
|
|
- <image src="/static/icon/Kudosbg.png"></image>
|
|
|
|
|
|
+ <image src="/static/icon/Kudosbg.png"></image>
|
|
<view style="margin-left: 24rpx;">
|
|
<view style="margin-left: 24rpx;">
|
|
<text class="name">端午佳节五香肉粽子,仅限前</text>
|
|
<text class="name">端午佳节五香肉粽子,仅限前</text>
|
|
<text class="tag">礼盒装 </text>
|
|
<text class="tag">礼盒装 </text>
|
|
@@ -72,54 +85,174 @@
|
|
<text>2000积分</text>
|
|
<text>2000积分</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
-
|
|
|
|
<!-- 兑换按钮 -->
|
|
<!-- 兑换按钮 -->
|
|
<view class="bottombtn" @click="goExDetail">
|
|
<view class="bottombtn" @click="goExDetail">
|
|
- <view class="btnitem" >
|
|
|
|
|
|
+ <view class="btnitem">
|
|
<text>确认兑换</text>
|
|
<text>确认兑换</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
-
|
|
|
|
|
|
+ <!-- 配送方式-->
|
|
|
|
+ <uni-popup ref="Recipient" type="bottom" mask-background-color=" rgba(0,0,0,0.7);">
|
|
|
|
+ <view class="pop">
|
|
|
|
+ <view class="popuptitle">
|
|
|
|
+ <view @click="cancelBtn" style="width: 68rpx;color: #999;font-size: 32rpx;">
|
|
|
|
+ <text>取消</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view>
|
|
|
|
+ <text style="font-weight: bold; font-size: 32rpx; color: #080F18; ">配送方式</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view @click="sureBtn" style="width: 68rpx;"><text
|
|
|
|
+ style="font-size: 32rpx; color: #FF6200;line-height: 34rpx">确定</text></view>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="chooselag">
|
|
|
|
+ <view @click="companyed(item.name,index)" class="language" v-for="(item,index) in typeSelect "
|
|
|
|
+ :sgActive='activeIndex==index'>
|
|
|
|
+ <text>{{item.name}}</text>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </uni-popup>
|
|
|
|
+ <!-- 门店选择-->
|
|
|
|
+ <uni-popup ref="shopSelected" type="bottom" mask-background-color=" rgba(0,0,0,0.7);">
|
|
|
|
+ <view class="pop">
|
|
|
|
+ <view class="popuptitle">
|
|
|
|
+ <view @click="cancelShopBtn" style="width: 68rpx;color: #999;font-size: 32rpx;">
|
|
|
|
+ <text>取消</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view>
|
|
|
|
+ <text style="font-weight: bold; font-size: 32rpx; color: #080F18; ">配送方式</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view @click="sureShopBtn" style="width: 68rpx;"><text
|
|
|
|
+ style="font-size: 32rpx; color: #FF6200;line-height: 34rpx">确定</text></view>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="chooselag">
|
|
|
|
+ <view @click="companyedShop(item.name,index)" class="language" v-for="(item,index) in regionSelect "
|
|
|
|
+ :sgActive='activeIndex==index'>
|
|
|
|
+ <text>{{item.name}}</text>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </uni-popup>
|
|
|
|
+
|
|
|
|
+
|
|
</view>
|
|
</view>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
|
+ import pickerAddress from '@/uni_modules/hu-pickerAddress/hu-pickerAddress.vue'
|
|
export default {
|
|
export default {
|
|
- data(){
|
|
|
|
- return{
|
|
|
|
|
|
+ components: {
|
|
|
|
+ pickerAddress
|
|
|
|
+ },
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ activeIndex: null,
|
|
// 是否核销
|
|
// 是否核销
|
|
- isVerification:false,
|
|
|
|
|
|
+ isVerification: false,
|
|
// 表单数据
|
|
// 表单数据
|
|
- formData:{
|
|
|
|
- type:'',
|
|
|
|
- phone:'',
|
|
|
|
- name:'',
|
|
|
|
- region:'',
|
|
|
|
- address:'',
|
|
|
|
|
|
+ formData: {
|
|
|
|
+ type: '',
|
|
|
|
+ phone: '',
|
|
|
|
+ name: '',
|
|
|
|
+ region: '',
|
|
|
|
+ shop: '',
|
|
|
|
+ address: '',
|
|
},
|
|
},
|
|
// 配送方式
|
|
// 配送方式
|
|
- typeSelect:['快递配送','到店自提'],
|
|
|
|
|
|
+ typeSelect: [{
|
|
|
|
+ name: '快递配送',
|
|
|
|
+ }, {
|
|
|
|
+ name: '到店自提',
|
|
|
|
+ }],
|
|
// 是否显示配送方式
|
|
// 是否显示配送方式
|
|
- istype:true,
|
|
|
|
|
|
+ istype: true,
|
|
// 选择门店
|
|
// 选择门店
|
|
- regionSelect:['第一门店','第二门店','第三门店','第四门店']
|
|
|
|
|
|
+ regionSelect: [{
|
|
|
|
+ name: '第一门店',
|
|
|
|
+ }, {
|
|
|
|
+ name: '第二门店',
|
|
|
|
+ }, {
|
|
|
|
+ name: '第三门店',
|
|
|
|
+ }, {
|
|
|
|
+ name: '第四门店',
|
|
|
|
+ }, {
|
|
|
|
+ name: '第五门店',
|
|
|
|
+ }, {
|
|
|
|
+ name: '第六门店',
|
|
|
|
+ }, {
|
|
|
|
+ name: '第七门店',
|
|
|
|
+ }]
|
|
}
|
|
}
|
|
},
|
|
},
|
|
- methods:{
|
|
|
|
- // 选择快递方式
|
|
|
|
- bindTypeChange:function(e){
|
|
|
|
- this.formData.type=this.typeSelect[e.detail.value]
|
|
|
|
|
|
+ methods: {
|
|
|
|
+ change(ret){
|
|
|
|
+
|
|
|
|
+ this.formData.region = ret.data.join('-')
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ //打开门店弹框
|
|
|
|
+ openShop() {
|
|
|
|
+ this.$refs.shopSelected.open('bottom')
|
|
},
|
|
},
|
|
|
|
+ companyedShop(i, index) {
|
|
|
|
+ this.typestatus2 = i
|
|
|
|
+ this.activeIndex = index
|
|
|
|
+ console.log(i, this.activeIndex)
|
|
|
|
+ },
|
|
|
|
+ //确定按钮
|
|
|
|
+ sureShopBtn() {
|
|
|
|
+ if (this.typestatus2 == undefined) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: "none",
|
|
|
|
+ title: '请选择门店'
|
|
|
|
+ })
|
|
|
|
+ } else {
|
|
|
|
+ this.formData.shop = this.typestatus2
|
|
|
|
+ this.$refs.shopSelected.close()
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ //取消按钮
|
|
|
|
+ cancelShopBtn() {
|
|
|
|
+ this.$refs.shopSelected.close()
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ // 打开配送弹框
|
|
|
|
+ openSelect() {
|
|
|
|
+ this.$refs.Recipient.open('bottom')
|
|
|
|
+ },
|
|
|
|
+ //选择配送方式
|
|
|
|
+ companyed(i, index) {
|
|
|
|
+ this.typestatus1 = i
|
|
|
|
+ this.activeIndex = index
|
|
|
|
+ console.log(i, this.activeIndex)
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ //确定按钮
|
|
|
|
+ sureBtn() {
|
|
|
|
+ if (this.typestatus1 == undefined) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: "none",
|
|
|
|
+ title: '请选择配送方式'
|
|
|
|
+ })
|
|
|
|
+ } else {
|
|
|
|
+ this.formData.type = this.typestatus1
|
|
|
|
+ this.$refs.Recipient.close()
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ //取消按钮
|
|
|
|
+ cancelBtn() {
|
|
|
|
+ this.$refs.Recipient.close()
|
|
|
|
+ },
|
|
|
|
+
|
|
// 跳转积分兑换详情
|
|
// 跳转积分兑换详情
|
|
- goExDetail(){
|
|
|
|
|
|
+ goExDetail() {
|
|
uni.navigateTo({
|
|
uni.navigateTo({
|
|
- url:'/pages/my/integral/integralExchange'
|
|
|
|
|
|
+ url: '/pages/my/integral/integralExchange'
|
|
})
|
|
})
|
|
},
|
|
},
|
|
// 选择门店
|
|
// 选择门店
|
|
- bindregionChange:function(e){
|
|
|
|
- this.formData.region=this.regionSelect[e.detail.value]
|
|
|
|
- },
|
|
|
|
|
|
+
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|
|
@@ -127,50 +260,176 @@
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
$pageColor:#F9F9F9;
|
|
$pageColor:#F9F9F9;
|
|
$bgColor:#FFFFFF;
|
|
$bgColor:#FFFFFF;
|
|
|
|
+
|
|
@mixin flexlayout {
|
|
@mixin flexlayout {
|
|
display: flex;
|
|
display: flex;
|
|
align-items: center;
|
|
align-items: center;
|
|
justify-content: center;
|
|
justify-content: center;
|
|
}
|
|
}
|
|
- .exchangePrize{
|
|
|
|
|
|
+
|
|
|
|
+ .exchangePrize {
|
|
height: 100%;
|
|
height: 100%;
|
|
- background:$bgColor ;
|
|
|
|
|
|
+ // background: #f9f9f9;
|
|
}
|
|
}
|
|
|
|
|
|
- .form{
|
|
|
|
- background:$pageColor ;
|
|
|
|
|
|
+ .uni-input-area{
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 98rpx;
|
|
|
|
+ padding: 34rpx 20rpx;
|
|
|
|
+ background: #FFFFFF;
|
|
|
|
+ border-radius: 8rpx;
|
|
|
|
+ border: 2rpx solid #EAEAEA;
|
|
|
|
+ font-size: 30rpx;
|
|
|
|
+ color: #000;
|
|
|
|
+ line-height: 30rpx;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ //底部弹框样式
|
|
|
|
+ .pop {
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 620rpx;
|
|
|
|
+ background: #FFFFFF;
|
|
|
|
+ border-radius: 16rpx 16rpx 0 0;
|
|
|
|
+ overflow: scroll;
|
|
|
|
+
|
|
|
|
+ .popuptitle {
|
|
|
|
+ position: fixed;
|
|
|
|
+ top: 0;
|
|
|
|
+ display: flex;
|
|
|
|
+ width: 100%;
|
|
|
|
+ padding: 0 30rpx;
|
|
|
|
+ height: 122rpx;
|
|
|
|
+ background: #fff;
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ justify-content: space-between;
|
|
|
|
+
|
|
|
|
+ image {
|
|
|
|
+ display: inline-block;
|
|
|
|
+ width: 33rpx;
|
|
|
|
+ height: 33rpx;
|
|
|
|
+ border-radius: 1rpx;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .chooselag {
|
|
|
|
+
|
|
|
|
+ flex-direction: column;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ align-items: center;
|
|
|
|
+ background: #FFFFFF;
|
|
|
|
+ padding: 0 30rpx;
|
|
|
|
+ overflow-y: scroll;
|
|
|
|
+ margin-top: 122rpx;
|
|
|
|
+
|
|
|
|
+ .language {
|
|
|
|
+ width: 100%;
|
|
|
|
+ font-size: 32rpx;
|
|
|
|
+ font-weight: 400;
|
|
|
|
+ color: #777777;
|
|
|
|
+ border-bottom: 1rpx #E2E4EA solid;
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ padding-top: 40rpx;
|
|
|
|
+ padding-bottom: 40rpx;
|
|
|
|
+
|
|
|
|
+ &[sgActive] {
|
|
|
|
+ color: #405E49 !important;
|
|
|
|
+ font-weight: bold !important;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ .text-area {
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 130rpx;
|
|
|
|
+ padding: 34rpx 20rpx;
|
|
|
|
+ background: #FFFFFF;
|
|
|
|
+ border-radius: 8rpx;
|
|
|
|
+ border: 2rpx solid #EAEAEA;
|
|
|
|
+ font-size: 30rpx;
|
|
|
|
+ color: #000;
|
|
|
|
+ line-height: 30rpx;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ ::v-deep .uni-forms-item {
|
|
|
|
+ // height: 98rpx;
|
|
|
|
+ margin-bottom: 0;
|
|
|
|
+ margin-top: 24rpx;
|
|
|
|
+ font-size: 30rpx !important;
|
|
|
|
+
|
|
|
|
+ &:first-child {
|
|
|
|
+ margin-top: 0;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ ::v-deep .is-input-border {
|
|
|
|
+ background-color: #ffffff !important;
|
|
|
|
+ border: 2rpx solid #EAEAEA !important;
|
|
|
|
+ height: 98rpx;
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ ::v-deep .uni-icons {
|
|
|
|
+ color: #c0c4cc !important;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ ::v-deep .uni-easyinput__placeholder-class {
|
|
|
|
+ font-size: 30rpx !important;
|
|
|
|
+ color: #999 !important;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ ::v-deep .uni-easyinput__content-input {
|
|
|
|
+ font-size: 30rpx !important;
|
|
|
|
+ color: #000 !important;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ .form {
|
|
|
|
+ background: $pageColor;
|
|
width: 750rpx;
|
|
width: 750rpx;
|
|
- padding:24rpx 30rpx;
|
|
|
|
|
|
+ padding: 24rpx 30rpx;
|
|
box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
- .selectType{
|
|
|
|
|
|
+
|
|
|
|
+ .selectType {
|
|
width: 690rpx;
|
|
width: 690rpx;
|
|
height: 98rpx;
|
|
height: 98rpx;
|
|
background: #FFFFFF;
|
|
background: #FFFFFF;
|
|
border-radius: 8rpx;
|
|
border-radius: 8rpx;
|
|
- border: 2px solid #EAEAEA;
|
|
|
|
|
|
+ border: 2rpx solid #EAEAEA;
|
|
display: flex;
|
|
display: flex;
|
|
- align-items:center;
|
|
|
|
- padding-left: 20rpx;
|
|
|
|
|
|
+ align-items: center;
|
|
|
|
+ padding-left: 20rpx;
|
|
box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
position: relative;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
- .msg{
|
|
|
|
|
|
+
|
|
|
|
+ .msg {
|
|
width: 750rpx;
|
|
width: 750rpx;
|
|
height: 700rpx;
|
|
height: 700rpx;
|
|
- background:$bgColor;
|
|
|
|
|
|
+ background: $bgColor;
|
|
border-radius: 12rpx 12rpx 0px 0px;
|
|
border-radius: 12rpx 12rpx 0px 0px;
|
|
- padding:32rpx 30rpx;
|
|
|
|
- .title{
|
|
|
|
|
|
+ padding: 32rpx 30rpx;
|
|
|
|
+
|
|
|
|
+ .title {
|
|
margin-bottom: 24rpx;
|
|
margin-bottom: 24rpx;
|
|
- text{
|
|
|
|
|
|
+
|
|
|
|
+ text {
|
|
font-size: 32rpx;
|
|
font-size: 32rpx;
|
|
font-family: PingFang-SC-Bold, PingFang-SC;
|
|
font-family: PingFang-SC-Bold, PingFang-SC;
|
|
font-weight: bold;
|
|
font-weight: bold;
|
|
color: #080F18;
|
|
color: #080F18;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
- .shopCard{
|
|
|
|
|
|
+
|
|
|
|
+ .shopCard {
|
|
margin-top: 28rpx;
|
|
margin-top: 28rpx;
|
|
width: 694rpx;
|
|
width: 694rpx;
|
|
height: 164rpx;
|
|
height: 164rpx;
|
|
@@ -178,33 +437,38 @@
|
|
border-radius: 10rpx;
|
|
border-radius: 10rpx;
|
|
display: flex;
|
|
display: flex;
|
|
align-items: center;
|
|
align-items: center;
|
|
- image{
|
|
|
|
|
|
+
|
|
|
|
+ image {
|
|
width: 132rpx;
|
|
width: 132rpx;
|
|
- height: 132rpx;
|
|
|
|
|
|
+ height: 132rpx;
|
|
margin-left: 16rpx;
|
|
margin-left: 16rpx;
|
|
display: inline-block;
|
|
display: inline-block;
|
|
border-radius: 10rpx;
|
|
border-radius: 10rpx;
|
|
}
|
|
}
|
|
- .name{
|
|
|
|
|
|
+
|
|
|
|
+ .name {
|
|
font-size: 28rpx;
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC-Medium, PingFang SC;
|
|
font-family: PingFangSC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
font-weight: 500;
|
|
color: #080F18;
|
|
color: #080F18;
|
|
display: block;
|
|
display: block;
|
|
}
|
|
}
|
|
- .tag{
|
|
|
|
|
|
+
|
|
|
|
+ .tag {
|
|
font-size: 24rpx;
|
|
font-size: 24rpx;
|
|
font-family: PingFang-SC-Medium, PingFang-SC;
|
|
font-family: PingFang-SC-Medium, PingFang-SC;
|
|
font-weight: 500;
|
|
font-weight: 500;
|
|
color: #666666;
|
|
color: #666666;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
- .shopNumber{
|
|
|
|
|
|
+
|
|
|
|
+ .shopNumber {
|
|
display: flex;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
align-items: center;
|
|
margin-top: 25rpx;
|
|
margin-top: 25rpx;
|
|
- text{
|
|
|
|
|
|
+
|
|
|
|
+ text {
|
|
font-size: 26rpx;
|
|
font-size: 26rpx;
|
|
font-family: PingFang-SC-Medium, PingFang-SC;
|
|
font-family: PingFang-SC-Medium, PingFang-SC;
|
|
font-weight: 500;
|
|
font-weight: 500;
|
|
@@ -212,18 +476,18 @@
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
- .bottombtn{
|
|
|
|
|
|
+
|
|
|
|
+ .bottombtn {
|
|
width: 690rpx;
|
|
width: 690rpx;
|
|
height: 92rpx;
|
|
height: 92rpx;
|
|
- background: linear-gradient(270deg, #FF6200 0%, #FF9342 100%);
|
|
|
|
|
|
+ background: linear-gradient(270deg, #FF6200 0%, #FF9342 100%);
|
|
border-radius: 12rpx;
|
|
border-radius: 12rpx;
|
|
margin-left: 30rpx;
|
|
margin-left: 30rpx;
|
|
position: fixed;
|
|
position: fixed;
|
|
bottom: 72rpx;
|
|
bottom: 72rpx;
|
|
- @include flexlayout()
|
|
|
|
- .btnitem{
|
|
|
|
- @include flexlayout()
|
|
|
|
- text{
|
|
|
|
|
|
+
|
|
|
|
+ @include flexlayout() .btnitem {
|
|
|
|
+ @include flexlayout() text {
|
|
font-size: 30rpx;
|
|
font-size: 30rpx;
|
|
font-family: PingFang-SC-Bold, PingFang-SC;
|
|
font-family: PingFang-SC-Bold, PingFang-SC;
|
|
font-weight: bold;
|
|
font-weight: bold;
|
|
@@ -231,4 +495,4 @@
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
-</style>
|
|
|
|
|
|
+</style>
|