|
| xqd
@@ -0,0 +1,754 @@
|
|
|
+<template>
|
|
|
+ <view class="exchangePrize">
|
|
|
+ <!-- 表单 -->
|
|
|
+ <view class="form">
|
|
|
+ <view class="">
|
|
|
+ <uni-forms :modelValue="formData">
|
|
|
+ <uni-forms-item name="type" v-if="is_virtual == 0 ">
|
|
|
+ <view class="selectType" @click="openSelect">
|
|
|
+ <view class="uni-input">
|
|
|
+ <text v-if="formData.type==''||formData.type==null"
|
|
|
+ style="color: #999999 ;font-size: 30rpx;">请选择配送方式</text>
|
|
|
+ <text v-if="formData.type!=''" style="font-size: 30rpx;">{{formData.type}}</text>
|
|
|
+ </view>
|
|
|
+ <image src="/static/icon/right.png"
|
|
|
+ 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="Data.receiver" placeholder="填写联系人" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item name="phone" v-if="formData.type!=''||isVerification==true">
|
|
|
+ <uni-easyinput type="number" v-model="Data.phone" placeholder="填写联系电话" maxlength=11 />
|
|
|
+ </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=='快递配送'">
|
|
|
+ <textarea placeholder-style="#999" class="text-area" type="text" placeholder="详细地址"
|
|
|
+ v-model="Data.address" />
|
|
|
+
|
|
|
+ </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>
|
|
|
+ <text class="distance" v-if="formData.shop!=''">{{formData.distanceToMe}}km</text>
|
|
|
+ </view>
|
|
|
+ <image src="/static/icon/right.png"
|
|
|
+ style="width: 14rpx;height: 24rpx;position: absolute;top:31rpx;right: 30rpx;">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ </uni-forms-item>
|
|
|
+ </uni-forms>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 产品信息 -->
|
|
|
+ <view class="msg">
|
|
|
+ <view class="title">
|
|
|
+ <text>产品信息</text>
|
|
|
+ </view>
|
|
|
+ <view class="shopCard">
|
|
|
+ <image :src="productDetail.cover_img">
|
|
|
+ </image>
|
|
|
+ <view style="margin-left: 24rpx;">
|
|
|
+ <text class="name">{{productDetail.name}}</text>
|
|
|
+ <text class="tag" v-if="attrArry[0]">{{attrArry[0].attr_group_name == '包装'?attrArry[1].attr_group_name.slice(0,2)+'装':'' }} {{integral}}积分</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="shopNumber">
|
|
|
+ <text>件数</text>
|
|
|
+ <text>1件</text>
|
|
|
+ </view>
|
|
|
+ <view class="shopNumber">
|
|
|
+ <text>积分</text>
|
|
|
+ <text>{{integral}}积分</text>
|
|
|
+ </view>
|
|
|
+ <view style="width: 694rpx;height: 4rpx;border: 2rpx dashed #F2F2F2;margin-top: 38rpx;"></view>
|
|
|
+ <view class="shopNumber" style="margin-top: 38rpx;">
|
|
|
+ <text>合计</text>
|
|
|
+ <text>{{integral}}积分</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 兑换按钮 -->
|
|
|
+ <view class="bottombtn" @click="goExchange">
|
|
|
+ <view class="btnitem">
|
|
|
+ <text>确认兑换</text>
|
|
|
+ </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 "
|
|
|
+ :key="index" :class="[activeIndex === index?'sgActive': ''] ">
|
|
|
+ <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,item.id,item.distanceToMe,index)" class="language"
|
|
|
+ v-for="(item,index) in hotelList" :key="index"
|
|
|
+ :class="[activeIndex2 === index?'sgActive': ''] ">
|
|
|
+ <text>{{item.name}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </uni-popup>
|
|
|
+
|
|
|
+
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import pickerAddress from '@/uni_modules/hu-pickerAddress/hu-pickerAddress.vue'
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ pickerAddress
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ //产品规格数组
|
|
|
+ attrArry:[],
|
|
|
+ //产品规格
|
|
|
+ attrName:'',
|
|
|
+ //积分
|
|
|
+ integral: '',
|
|
|
+ //选中激活样式
|
|
|
+ activeIndex: '',
|
|
|
+ activeIndex2: '',
|
|
|
+ //经纬度
|
|
|
+ latitude: '',
|
|
|
+ longitude: '',
|
|
|
+ //实物奖品0,虚拟奖品1
|
|
|
+ is_virtual: '',
|
|
|
+ // activeIndex: null,
|
|
|
+ // 是否核销
|
|
|
+ isVerification: false,
|
|
|
+ // 产品信息
|
|
|
+ productDetail: '',
|
|
|
+ // 表单数据
|
|
|
+ formData: {
|
|
|
+ // 表单数据
|
|
|
+ type: '',
|
|
|
+ region: '',
|
|
|
+ shop: '',
|
|
|
+ distanceToMe: ''
|
|
|
+ },
|
|
|
+ Data: {
|
|
|
+ // 快递类型(1.快递发货 2.到店自提也是线下核销)
|
|
|
+ express_type: '',
|
|
|
+ // 收货人
|
|
|
+ receiver: "",
|
|
|
+ // 联系电话
|
|
|
+ phone: '',
|
|
|
+ // 地址ID，最小行政单位地区ID，express_type=1时必传
|
|
|
+ area_id: '',
|
|
|
+ // 详细地址，express_type=1时必传
|
|
|
+ address: '',
|
|
|
+ //门店ID，express_type=2时必传
|
|
|
+ hotel_id: 0,
|
|
|
+ // 产品ID
|
|
|
+ product_id: '',
|
|
|
+ // 产品规格ID
|
|
|
+ attr: '',
|
|
|
+ },
|
|
|
+ // 配送方式
|
|
|
+ typeSelect: [{
|
|
|
+ name: '快递配送',
|
|
|
+ }, {
|
|
|
+ name: '到店自提',
|
|
|
+ }],
|
|
|
+ // 是否显示配送方式
|
|
|
+ istype: true,
|
|
|
+ // 选择门店
|
|
|
+ hotelList: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(op) {
|
|
|
+ console.log(op, "产品id")
|
|
|
+ this.Data.product_id = op.product_id
|
|
|
+ this.Data.attr = op.attr
|
|
|
+ this.integral = op.integral
|
|
|
+ this.attrName= op.attrName
|
|
|
+ this.attrArry= this.attrName.split("-").map(item=>{
|
|
|
+ return {
|
|
|
+ attr_group_name: item
|
|
|
+ }
|
|
|
+ })
|
|
|
+ console.log(this.attrArry[1].attr_group_name.split(','),1111111111111)
|
|
|
+ this.getProductDetail(op.product_id)
|
|
|
+ this.init()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ //初始化
|
|
|
+ async init() {
|
|
|
+ await this.goLocation();
|
|
|
+ await this.getHotel();
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ space(lat1, lng1, lat2, lng2) {
|
|
|
+ var radLat1 = lat1 * Math.PI / 180.0;
|
|
|
+ var radLat2 = lat2 * Math.PI / 180.0;
|
|
|
+ var a = radLat1 - radLat2;
|
|
|
+ var b = lng1 * Math.PI / 180.0 - lng2 * Math.PI / 180.0;
|
|
|
+ var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) +
|
|
|
+ Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(b / 2), 2)));
|
|
|
+ s = s * 6378.137;
|
|
|
+ s = Math.round(s * 10000) / 10000;
|
|
|
+ return s // 单位千米
|
|
|
+ },
|
|
|
+ //门店列表
|
|
|
+ getHotel(id) {
|
|
|
+ this.$api.hotel.getHotelList({
|
|
|
+ page: 1,
|
|
|
+ type: 2,
|
|
|
+ latitude: this.latitude,
|
|
|
+ longitude: this.longitude,
|
|
|
+ product_id: id
|
|
|
+ }).then(res => {
|
|
|
+ this.hotelList = res.data.data
|
|
|
+ this.hotelList.map(item => {
|
|
|
+ item.distanceToMe = this.space(this.latitude, this.longitude, item.latitude, item
|
|
|
+ .longitude).toFixed(1);
|
|
|
+ return item;
|
|
|
+ })
|
|
|
+ console.log(this.hotelList, '-------->this.hotelList');
|
|
|
+ //最近的酒店
|
|
|
+ this.formData.shop = this.hotelList[0].name
|
|
|
+ this.formData.distanceToMe = this.hotelList[0].distanceToMe
|
|
|
+ this.Data.hotel_id = this.hotelList[0].id
|
|
|
+
|
|
|
+
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //获取定位
|
|
|
+ goLocation() {
|
|
|
+ let _this = this
|
|
|
+ uni.getLocation({
|
|
|
+ type: "gcj02", //返回可以用于wx.openLocation的经纬度
|
|
|
+ success: function(res) {
|
|
|
+ _this.latitude = res.latitude
|
|
|
+ _this.longitude = res.longitude
|
|
|
+ },
|
|
|
+ fail: function(res) {
|
|
|
+ console.log(res)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 获取产品信息
|
|
|
+ getProductDetail(id) {
|
|
|
+ this.$loading()
|
|
|
+ this.$api.product.getProductDetail({
|
|
|
+ product_id: id
|
|
|
+ }).then(res => {
|
|
|
+ console.log(res, "产品信息")
|
|
|
+ this.$hideLoading()
|
|
|
+ if (res.code == 0) {
|
|
|
+ this.productDetail = res.data
|
|
|
+ this.is_virtual = res.data.is_virtual
|
|
|
+ if (this.is_virtual == 1) {
|
|
|
+ this.isVerification = true
|
|
|
+ this.Data.express_type = 2
|
|
|
+ this.goLocation()
|
|
|
+ setTimeout(() => {
|
|
|
+ this.getHotel(id)
|
|
|
+ }, 1000)
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ title: res.msg,
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ //订单兑换
|
|
|
+ goExchange() {
|
|
|
+ if (this.formData.type == '' && this.is_virtual == 0) {
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: '请选择配送方式'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (this.Data.receiver == '') {
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: '请填写联系人'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (this.Data.phone == '') {
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: '请填写联系电话'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (this.formData.region == '' && this.Data.express_type == 1) {
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: '请填写所在地区'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (this.Data.address == '' && this.Data.express_type == 1) {
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: '请填写详细地址'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (this.Data.hotel_id == '' && this.Data.express_type == 2) {
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: '请选择门店'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (this.is_virtual == 0) {
|
|
|
+ let _this = this
|
|
|
+ uni.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: '确认使用积分兑换',
|
|
|
+ success: function(res) {
|
|
|
+ if (res.confirm) {
|
|
|
+ if (_this.Data.express_type == 1) {
|
|
|
+ _this.$api.product.integralExchange({
|
|
|
+ ..._this.Data
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code == 0) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/my/prize/exchangeDetail?productType=1&integral=${_this.integral}`
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: res.msg
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ let obj = {}
|
|
|
+ obj.express_type = _this.Data.express_type
|
|
|
+ obj.product_id = _this.Data.product_id
|
|
|
+ obj.receiver = _this.Data.receiver
|
|
|
+ obj.phone = _this.Data.phone
|
|
|
+ obj.hotel_id = _this.Data.hotel_id
|
|
|
+ obj.attr = _this.Data.attr
|
|
|
+ _this.$api.product.integralExchange({
|
|
|
+ ...obj
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code == 0) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/my/prize/exchangeDetail?productType=1&integral=${_this.integral}`
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: res.msg
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ } else if (res.cancel) {
|
|
|
+ console.log('用户点击取消');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ let _this = this
|
|
|
+ uni.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: '确认使用积分兑换',
|
|
|
+ success: function(res) {
|
|
|
+ if (res.confirm) {
|
|
|
+ let obj = {}
|
|
|
+ obj.express_type = _this.Data.express_type
|
|
|
+ obj.product_id = _this.Data.product_id
|
|
|
+ obj.receiver = _this.Data.receiver
|
|
|
+ obj.phone = _this.Data.phone
|
|
|
+ obj.hotel_id = _this.Data.hotel_id
|
|
|
+ obj.attr = _this.Data.attr
|
|
|
+ _this.$api.product.integralExchange({
|
|
|
+ ...obj
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code == 0) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/my/prize/exchangeDetail?productType=1&integral=${_this.integral}`
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: res.msg
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else if (res.cancel) {
|
|
|
+ console.log('用户点击取消');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ change(ret) {
|
|
|
+ this.formData.region = ret.data.join('-')
|
|
|
+ this.Data.area_id = ret.code[2]
|
|
|
+ },
|
|
|
+ //打开门店弹框
|
|
|
+ openShop() {
|
|
|
+ this.$refs.shopSelected.open('bottom')
|
|
|
+ },
|
|
|
+ companyedShop(i, id, distance, index) {
|
|
|
+ this.typestatus2 = i
|
|
|
+ this.distanceToMe1 = distance
|
|
|
+ this.activeIndex2 = index
|
|
|
+ this.Data.hotel_id = id
|
|
|
+ },
|
|
|
+ //确定按钮
|
|
|
+ sureShopBtn() {
|
|
|
+ if (this.typestatus2 == undefined) {
|
|
|
+ uni.showToast({
|
|
|
+ icon: "none",
|
|
|
+ title: '请选择门店'
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.formData.shop = this.typestatus2
|
|
|
+ this.formData.distanceToMe = this.distanceToMe1
|
|
|
+ this.$refs.shopSelected.close()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //取消按钮
|
|
|
+ cancelShopBtn() {
|
|
|
+ this.$refs.shopSelected.close()
|
|
|
+ },
|
|
|
+
|
|
|
+ // 打开配送弹框
|
|
|
+ openSelect() {
|
|
|
+ this.$refs.Recipient.open('bottom')
|
|
|
+ },
|
|
|
+ //选择配送方式
|
|
|
+ companyed(i, index) {
|
|
|
+ this.typestatus1 = i
|
|
|
+ this.activeIndex = index
|
|
|
+ if (index == 0) {
|
|
|
+ this.Data.express_type = 1
|
|
|
+ } else if (index == 1) {
|
|
|
+ this.Data.express_type = 2
|
|
|
+ this.goLocation()
|
|
|
+ setTimeout(() => {
|
|
|
+ this.getHotel(this.Data.product_id)
|
|
|
+ }, 1000)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //确定按钮
|
|
|
+ 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()
|
|
|
+ },
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ $pageColor:#F9F9F9;
|
|
|
+ $bgColor:#FFFFFF;
|
|
|
+
|
|
|
+ @mixin flexlayout {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .exchangePrize {
|
|
|
+ height: 100%;
|
|
|
+ // background: #f9f9f9;
|
|
|
+ }
|
|
|
+
|
|
|
+ .distance {
|
|
|
+ position: absolute;
|
|
|
+ right: 60rpx;
|
|
|
+ top: 23rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .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: 616rpx;
|
|
|
+ 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: #FF6200 !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;
|
|
|
+ padding: 24rpx 30rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+
|
|
|
+ .selectType {
|
|
|
+ width: 690rpx;
|
|
|
+ height: 98rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ border: 2rpx solid #EAEAEA;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding-left: 20rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .msg {
|
|
|
+ width: 750rpx;
|
|
|
+ height: 700rpx;
|
|
|
+ background: $bgColor;
|
|
|
+ border-radius: 12rpx 12rpx 0px 0px;
|
|
|
+ padding: 32rpx 30rpx;
|
|
|
+
|
|
|
+ .title {
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+
|
|
|
+ text {
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-family: PingFang-SC-Bold, PingFang-SC;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #080F18;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .shopCard {
|
|
|
+ margin-top: 28rpx;
|
|
|
+ width: 694rpx;
|
|
|
+ height: 164rpx;
|
|
|
+ background: #F4F5F6;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 132rpx;
|
|
|
+ height: 132rpx;
|
|
|
+ margin-left: 16rpx;
|
|
|
+ display: inline-block;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .name {
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-family: PingFangSC-Medium, PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #080F18;
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tag {
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-family: PingFang-SC-Medium, PingFang-SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .shopNumber {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ margin-top: 25rpx;
|
|
|
+
|
|
|
+ text {
|
|
|
+ font-size: 26rpx;
|
|
|
+ font-family: PingFang-SC-Medium, PingFang-SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #000000;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottombtn {
|
|
|
+ width: 690rpx;
|
|
|
+ height: 92rpx;
|
|
|
+ background: linear-gradient(270deg, #FF6200 0%, #FF9342 100%);
|
|
|
+ border-radius: 12rpx;
|
|
|
+ margin-left: 30rpx;
|
|
|
+ position: fixed;
|
|
|
+ bottom: 72rpx;
|
|
|
+
|
|
|
+ @include flexlayout() .btnitem {
|
|
|
+ @include flexlayout() text {
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-family: PingFang-SC-Bold, PingFang-SC;
|
|
|
+ font-weight: bold;
|
|
|
+ color: $bgColor;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
gubai