511 lines
14 KiB
Vue
511 lines
14 KiB
Vue
|
<template>
|
|||
|
|
<div>
|
|||
|
|
<view style="position: sticky; top: 0;">
|
|||
|
|
<view class="positionShow" :style="{paddingTop: statusBarHeight + 'px'}" v-if="!isOpenPosition" @click="goSet">
|
|||
|
|
<view class="positionShow-item">
|
|||
|
|
<icon type="info" class="positionShow-icon"></icon>
|
|||
|
|
<text class="positionShow-txt">您未开启位置服务，距离计算不准确，请点击前往开启位置服务</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="top" :style="{paddingTop: ((isOpenPosition ? statusBarHeight : 0) + 'px')}">
|
|||
|
|
<!-- #ifdef MP-WEIXIN -->
|
|||
|
|
<view :style="{height: wxBtnHeight + 'px'}"></view>
|
|||
|
|
<!-- #endif -->
|
|||
|
|
<view class="header">
|
|||
|
|
<scroll-view scroll-x class="nav-area">
|
|||
|
|
<view class="flex">
|
|||
|
|
<view class="nav-area-item" v-for="(item, index) in navList" :key="index" @tap="tapNav(index)">
|
|||
|
|
<text class="nav-area-item-name" :class="{ 'nav-area-item-active': index === current }">{{ item }}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</scroll-view>
|
|||
|
|
<view class="search" v-if="isSearch && (current === 1 || current === 2)">
|
|||
|
|
<input type="text" v-model="wordKey" class="search-input" :maxlength="15" placeholder="用户昵称" @input="searchInput">
|
|||
|
|
<text class="search-btn" @click="onSearch(current)">搜索</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="nav-right">
|
|||
|
|
<image :src="staticUrl + 'video/search.png'" class="nav-right-icon" @click="showSearch"></image>
|
|||
|
|
<view class="nav-right-message" @tap="jumpTo('/pages/interaction/message')">
|
|||
|
|
<image :src="staticUrl + 'video/message.png'" class="nav-right-icon"></image>
|
|||
|
|
<text class="nav-right-message-dian" :style="{top: statusBarHeight + 5 + 'px'}" v-if="unReadTotal">{{unReadTotal>99?'99+':unReadTotal}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<swiper class="swiper" :style="{height: swiperHeight + 'px'}" :current="current" @change="swiperChange">
|
|||
|
|
<swiper-item>
|
|||
|
|
<dynamic ref="dynamic" :myAddressData="myAddressData" :swiperHeight="swiperHeight"></dynamic>
|
|||
|
|
</swiper-item>
|
|||
|
|
<swiper-item>
|
|||
|
|
<nearby ref="nearby" :myAddressData="myAddressData" :swiperHeight="swiperHeight" :wordKey="nearbyWordKey"></nearby>
|
|||
|
|
</swiper-item>
|
|||
|
|
<!-- <swiper-item>
|
|||
|
|
<angel ref="angel" :myAddressData="myAddressData" :swiperHeight="swiperHeight" :wordKey="angelWordKey"></angel>
|
|||
|
|
</swiper-item> -->
|
|||
|
|
<swiper-item>
|
|||
|
|
<publish ref="publish"></publish>
|
|||
|
|
</swiper-item>
|
|||
|
|
<swiper-item>
|
|||
|
|
<my ref="my"></my>
|
|||
|
|
</swiper-item>
|
|||
|
|
<swiper-item>
|
|||
|
|
<comment ref="comment" :swiperHeight="swiperHeight"></comment>
|
|||
|
|
</swiper-item>
|
|||
|
|
</swiper>
|
|||
|
|
|
|||
|
|
<!-- 弹框 -->
|
|||
|
|
<modal v-if="advertDataOne.showModal && current===0">
|
|||
|
|
<image :src="advertDataOne.ossUrl" mode="widthFix" @click="imgJump('advertDataOne')"></image>
|
|||
|
|
<view class="img-wrap" @click="advertDataOne.showModal = false">
|
|||
|
|
<image :src="staticUrl + 'video/video_close.png'" class="img-wrap-icon"></image>
|
|||
|
|
</view>
|
|||
|
|
</modal>
|
|||
|
|
<modal v-if="advertDataTwo.showModal && current===1">
|
|||
|
|
<image :src="advertDataTwo.ossUrl" mode="widthFix" @click="imgJump('advertDataTwo')"></image>
|
|||
|
|
<view class="img-wrap" @click="advertDataTwo.showModal = false">
|
|||
|
|
<image :src="staticUrl + 'video/video_close.png'" class="img-wrap-icon"></image>
|
|||
|
|
</view>
|
|||
|
|
</modal>
|
|||
|
|
<modal v-if="advertDataThree.showModal && current===2">
|
|||
|
|
<image :src="advertDataThree.ossUrl" mode="widthFix" @click="imgJump('advertDataThree')"></image>
|
|||
|
|
<view class="img-wrap" @click="advertDataThree.showModal = false">
|
|||
|
|
<image :src="staticUrl + 'video/video_close.png'" class="img-wrap-icon"></image>
|
|||
|
|
</view>
|
|||
|
|
</modal>
|
|||
|
|
|
|||
|
|
<!-- 福利红包 -->
|
|||
|
|
<red-envelopes v-for="(item, i) in redList" :key="i" :data="item" :type="2" :bottom="i === 0 ? 100 : i*80+100"></red-envelopes>
|
|||
|
|
|
|||
|
|
<!-- <tabbar></tabbar> -->
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import { mapState, mapMutations } from "vuex"
|
|||
|
|
import { sendRequest } from "@/common/http/api.js"
|
|||
|
|
import { checkOpenGPSService } from "@/common/utils/index.js"
|
|||
|
|
import url from "@/common/http/url.js"
|
|||
|
|
import publics from "@/common/utils/public.js"
|
|||
|
|
import dynamic from "./modules/dynamic.vue"
|
|||
|
|
import nearby from "./modules/nearby.vue"
|
|||
|
|
import angel from "./modules/angel.vue"
|
|||
|
|
import publish from "./modules/publish.vue"
|
|||
|
|
import my from "./modules/my.vue"
|
|||
|
|
import comment from "./modules/comment.vue"
|
|||
|
|
import modal from "@/components/modal.vue"
|
|||
|
|
import redEnvelopes from "@/components/red-envelopes.vue"
|
|||
|
|
import tabbar from "@/components/tabbar.vue"
|
|||
|
|
// import redEnvelopes from "@/components/red-envelopes-n.nvue"
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
components: {
|
|||
|
|
dynamic, nearby, angel, publish, my, comment, modal, redEnvelopes, tabbar
|
|||
|
|
},
|
|||
|
|
data(){
|
|||
|
|
return {
|
|||
|
|
staticUrl: this.$staticUrl,
|
|||
|
|
swiperHeight: 0,
|
|||
|
|
statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
|
|||
|
|
navList: ["动态", "附近", "发布", "我的", "评论"],
|
|||
|
|
current: 0,
|
|||
|
|
isSearch: false,
|
|||
|
|
wordKey: "",
|
|||
|
|
nearbyWordKey: "", // 附近的人检索key
|
|||
|
|
angelWordKey: "", // 配送员检索key
|
|||
|
|
unReadTotal: 0, // 未读消息数量
|
|||
|
|
myAddressData: {longitude:0,latitude:0},
|
|||
|
|
redList: [],
|
|||
|
|
advertDataOne: {},
|
|||
|
|
advertDataTwo: {},
|
|||
|
|
advertDataThree: {},
|
|||
|
|
isOpenPosition: true,
|
|||
|
|
// #ifdef MP-WEIXIN
|
|||
|
|
wxBtnHeight: 0,
|
|||
|
|
// #endif
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
computed: {
|
|||
|
|
...mapState(["unReadNum"])
|
|||
|
|
},
|
|||
|
|
watch:{
|
|||
|
|
unReadNum(val){
|
|||
|
|
if (val){
|
|||
|
|
this.setBadge(true, val)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
mounted() {
|
|||
|
|
// #ifdef MP-WEIXIN
|
|||
|
|
this.wxBtnHeight = wx.getMenuButtonBoundingClientRect().height
|
|||
|
|
// #endif
|
|||
|
|
this.swiperHeight = uni.getSystemInfoSync().screenHeight - 94
|
|||
|
|
this.getLocation()
|
|||
|
|
let _this = this
|
|||
|
|
let interactionCurrent = uni.getStorageSync("interactionCurrent")
|
|||
|
|
if (interactionCurrent) {
|
|||
|
|
this.current = interactionCurrent
|
|||
|
|
this.switchIndex = interactionCurrent
|
|||
|
|
uni.removeStorageSync("interactionCurrent")
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// #ifdef APP-PLUS
|
|||
|
|
//是否开启位置权限
|
|||
|
|
if (!uni.getStorageSync('refuse')) {
|
|||
|
|
checkOpenGPSService(result=>{
|
|||
|
|
console.log("checkOpenGPSService,,", result)
|
|||
|
|
_this.isOpenPosition = result
|
|||
|
|
if (result) {
|
|||
|
|
_this.swiperHeight = uni.getSystemInfoSync().screenHeight - 144
|
|||
|
|
}
|
|||
|
|
if (result) {
|
|||
|
|
uni.getLocation({
|
|||
|
|
type: 'wgs84',
|
|||
|
|
geocode: true,
|
|||
|
|
success: function (res) {
|
|||
|
|
_this.myAddressData = res
|
|||
|
|
publics.setMyaddressLngLat(JSON.stringify(res));
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
// #endif
|
|||
|
|
|
|||
|
|
this.setBadge(false)
|
|||
|
|
this.getRedBagList()
|
|||
|
|
this.getAdvert('advertDataOne', 5)
|
|||
|
|
this.getAdvert('advertDataTwo', 6)
|
|||
|
|
this.getAdvert('advertDataThree', 7)
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
methods:{
|
|||
|
|
backPress(){
|
|||
|
|
//隐藏到后台，不退出app
|
|||
|
|
let main = plus.android.runtimeMainActivity();
|
|||
|
|
main.moveTaskToBack(false);
|
|||
|
|
return true;
|
|||
|
|
},
|
|||
|
|
// 设置消息未读数量
|
|||
|
|
async setBadge(type, val){
|
|||
|
|
let unReadTotal = 0
|
|||
|
|
if (type) {
|
|||
|
|
unReadTotal = val
|
|||
|
|
} else {
|
|||
|
|
unReadTotal = publics.getCUnReadTotal()
|
|||
|
|
}
|
|||
|
|
this.unReadTotal = unReadTotal
|
|||
|
|
this.$forceUpdate()
|
|||
|
|
if (unReadTotal > 0) {
|
|||
|
|
uni.setTabBarBadge({
|
|||
|
|
index: 2,
|
|||
|
|
text: unReadTotal + ""
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
uni.removeTabBarBadge({
|
|||
|
|
index: 2
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
// #ifdef APP-PLUS
|
|||
|
|
plus.runtime.setBadgeNumber(unReadTotal)
|
|||
|
|
// #endif
|
|||
|
|
getApp().localUnReadNum = unReadTotal
|
|||
|
|
},
|
|||
|
|
// 红包福利
|
|||
|
|
getRedBagList(){
|
|||
|
|
sendRequest("GET", url.cms.redEnvelopesList).then(res =>{
|
|||
|
|
if (res.data && res.data.length > 0) {
|
|||
|
|
let data = res.data
|
|||
|
|
data.map(v =>{
|
|||
|
|
v.show = true
|
|||
|
|
})
|
|||
|
|
this.redList = data
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 获取公告
|
|||
|
|
async getAdvert(name, position){
|
|||
|
|
let res = await sendRequest("GET", url.cms.advertisingMap, {position: position})
|
|||
|
|
if (res.data && res.data.length > 0) {
|
|||
|
|
this[name] = res.data[0]
|
|||
|
|
if (this[name].popupMode === 2) {
|
|||
|
|
if (!publics.advertShowToStorage(this[name].id)) {
|
|||
|
|
this[name].showModal = true
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
this[name].showModal = true
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
getLocation(){
|
|||
|
|
let _this = this;
|
|||
|
|
let addrRes = publics.getMyaddressLngLat()
|
|||
|
|
if (addrRes) {
|
|||
|
|
addrRes = JSON.parse(addrRes)
|
|||
|
|
this.setAddress(addrRes)
|
|||
|
|
} else {
|
|||
|
|
this.openMap()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
openMap(){
|
|||
|
|
let _this = this;
|
|||
|
|
|
|||
|
|
/* H5浏览器不执行，所以H5的时候直接加载数据 */
|
|||
|
|
uni.getLocation({
|
|||
|
|
type: 'wgs84',
|
|||
|
|
geocode: true,
|
|||
|
|
success: async function(res) {
|
|||
|
|
//设置地址
|
|||
|
|
publics.setMyaddressLngLat(JSON.stringify(res));
|
|||
|
|
_this.setAddress(res)
|
|||
|
|
},
|
|||
|
|
fail: function(err) {
|
|||
|
|
console.log(".....这是是互动的获取位置失败....", err)
|
|||
|
|
_this.$refs.dynamic.loadData()
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
// #ifdef H5
|
|||
|
|
setTimeout(()=>{
|
|||
|
|
// 请求附近动态数据
|
|||
|
|
_this.$refs.dynamic.loadData()
|
|||
|
|
}, 300)
|
|||
|
|
// #endif
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
setAddress(res){
|
|||
|
|
let _this = this
|
|||
|
|
this.myAddressData = res;
|
|||
|
|
setTimeout(()=>{
|
|||
|
|
// 请求附近动态数据
|
|||
|
|
_this.$refs.dynamic.loadData()
|
|||
|
|
}, 300)
|
|||
|
|
},
|
|||
|
|
showSearch(){
|
|||
|
|
if (this.current !== 1 && this.current !== 2) {
|
|||
|
|
return this.showToast("搜索仅限附近和配送员～")
|
|||
|
|
}
|
|||
|
|
this.isSearch = !this.isSearch
|
|||
|
|
this.wordKey = ""
|
|||
|
|
},
|
|||
|
|
searchInput(e){
|
|||
|
|
if (this.current === 1) {
|
|||
|
|
this.nearbyWordKey = e.detail.value
|
|||
|
|
} else if(this.current === 2) {
|
|||
|
|
this.angelWordKey = e.detail.value
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onSearch(current){
|
|||
|
|
uni.hideKeyboard()
|
|||
|
|
if (current === 1) { // 附近的人
|
|||
|
|
this.nearbyWordKey = this.wordKey
|
|||
|
|
this.$refs.nearby.penpleNearbyList = []
|
|||
|
|
setTimeout(()=>{
|
|||
|
|
this.$refs.nearby.loadData()
|
|||
|
|
}, 200)
|
|||
|
|
} else if (current === 2) { // 附近的配送员
|
|||
|
|
this.angelWordKey = this.wordKey
|
|||
|
|
this.$refs.angel.proxyList = []
|
|||
|
|
setTimeout(()=>{
|
|||
|
|
this.$refs.angel.loadData()
|
|||
|
|
}, 200)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
tapNav(index) {
|
|||
|
|
uni.hideKeyboard()
|
|||
|
|
this.current = index
|
|||
|
|
},
|
|||
|
|
swiperChange(e){
|
|||
|
|
this.current = e.detail.current
|
|||
|
|
this.wordKey = ""
|
|||
|
|
this.nearbyWordKey = ""
|
|||
|
|
this.angelWordKey = ""
|
|||
|
|
this.isSearch = false
|
|||
|
|
if (this.current === 0) {
|
|||
|
|
this.$refs.dynamic.loadData()
|
|||
|
|
} else if (this.current === 1) {
|
|||
|
|
this.$refs.nearby.loadData()
|
|||
|
|
}
|
|||
|
|
// else if (this.current === 2) {
|
|||
|
|
// this.$refs.angel.loadData()
|
|||
|
|
// }
|
|||
|
|
else if (this.current === 4) {
|
|||
|
|
this.$refs.my.getInfo()
|
|||
|
|
} else if (this.current === 5) {
|
|||
|
|
this.$refs.comment.loadData()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
jumpTo(path){
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: path
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
showToast(msg){
|
|||
|
|
uni.showToast({
|
|||
|
|
title: msg,
|
|||
|
|
icon: "none"
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
imgJump(name){
|
|||
|
|
this[name].showModal = false
|
|||
|
|
sendRequest("POST", url.cms.clickAdvertisingMap, {id: this[name].id})
|
|||
|
|
publics.advertOption(this[name].operationCode, this[name].operationValue)
|
|||
|
|
},
|
|||
|
|
goSet(){
|
|||
|
|
let system = uni.getSystemInfoSync();// 获取系统信息
|
|||
|
|
if (system.platform === 'android') { // 判断平台
|
|||
|
|
var Intent = plus.android.importClass('android.content.Intent');
|
|||
|
|
var Settings = plus.android.importClass('android.provider.Settings');
|
|||
|
|
var intent = new Intent(Settings.ACTION_LOCATION_SOURCE_SETTINGS);
|
|||
|
|
main.startActivity(intent); // 打开系统设置GPS服务页面
|
|||
|
|
|
|||
|
|
} else if (system.platform === 'ios') {
|
|||
|
|
var UIApplication = plus.ios.importClass("UIApplication");
|
|||
|
|
var application2 = UIApplication.sharedApplication();
|
|||
|
|
var NSURL2 = plus.ios.importClass("NSURL");
|
|||
|
|
var setting2 = NSURL2.URLWithString("app-settings:"); // 打开应用权限
|
|||
|
|
application2.openURL(setting2);
|
|||
|
|
plus.ios.deleteObject(setting2);
|
|||
|
|
plus.ios.deleteObject(NSURL2);
|
|||
|
|
plus.ios.deleteObject(application2);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped>
|
|||
|
|
.positionShow{
|
|||
|
|
height: 100rpx;
|
|||
|
|
/* padding-bottom: 10rpx; */
|
|||
|
|
width: 750rpx;
|
|||
|
|
background-color: #fceeed;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
.positionShow-item{
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
padding: 0 30rpx;
|
|||
|
|
}
|
|||
|
|
.positionShow-txt{
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #666666;
|
|||
|
|
width: 640rpx;
|
|||
|
|
}
|
|||
|
|
.positionShow-icon{
|
|||
|
|
color: #f55556;
|
|||
|
|
font-size: 40rpx;
|
|||
|
|
margin-right: 20rpx;
|
|||
|
|
}
|
|||
|
|
.top{
|
|||
|
|
width: 100%;
|
|||
|
|
background-color: rgb(248, 210, 71);
|
|||
|
|
}
|
|||
|
|
.header{
|
|||
|
|
width: 750rpx;
|
|||
|
|
padding: 0 20rpx;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
.nav-area{
|
|||
|
|
height: 100rpx;
|
|||
|
|
width: 600rpx;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
}
|
|||
|
|
.nav-area-item{
|
|||
|
|
height: 90rpx;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
.nav-area-item-name{
|
|||
|
|
width: 100rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
color: #fff;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
}
|
|||
|
|
.nav-area-item-active{
|
|||
|
|
color: #000;
|
|||
|
|
font-size: 40rpx;
|
|||
|
|
}
|
|||
|
|
.search{
|
|||
|
|
background-color: #F0F0F0;
|
|||
|
|
width: 600rpx;
|
|||
|
|
height: 80rpx;
|
|||
|
|
border-radius: 50rpx;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
position: absolute;
|
|||
|
|
left: 10rpx;
|
|||
|
|
}
|
|||
|
|
.search-input{
|
|||
|
|
width: 420rpx;
|
|||
|
|
flex-grow: 1;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
margin-left: 20rpx;
|
|||
|
|
}
|
|||
|
|
.search-btn{
|
|||
|
|
display: inline-block;
|
|||
|
|
height: 70rpx;
|
|||
|
|
line-height: 70rpx;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: white;
|
|||
|
|
margin: 0 10rpx;
|
|||
|
|
border-radius: 50rpx;
|
|||
|
|
width: 120rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
background-image: linear-gradient(to bottom, #F8D247, #865afd);
|
|||
|
|
}
|
|||
|
|
.nav-right{
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
margin-bottom: 10rpx;
|
|||
|
|
}
|
|||
|
|
.nav-right-icon{
|
|||
|
|
width: 50rpx;
|
|||
|
|
height: 50rpx;
|
|||
|
|
}
|
|||
|
|
.nav-right-message{
|
|||
|
|
/* position: relative; */
|
|||
|
|
/* z-index: 1; */
|
|||
|
|
margin-left: 20rpx;
|
|||
|
|
}
|
|||
|
|
.nav-right-message-dian{
|
|||
|
|
position: fixed;
|
|||
|
|
z-index: 999;
|
|||
|
|
right: 0rpx;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
border-radius: 30rpx;
|
|||
|
|
padding: 0rpx 14rpx 0 14rpx;
|
|||
|
|
background-color: #ff0833;
|
|||
|
|
color: white;
|
|||
|
|
}
|
|||
|
|
.swiper{
|
|||
|
|
width: 750rpx;
|
|||
|
|
background-color: #F8F8F8;
|
|||
|
|
}
|
|||
|
|
.img-wrap{
|
|||
|
|
margin-top: 30rpx;
|
|||
|
|
width: 50rpx;
|
|||
|
|
height: 50rpx;
|
|||
|
|
border-color: #fff;
|
|||
|
|
border-width: 4rpx;
|
|||
|
|
border-radius: 50rpx;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
.img-wrap-icon{
|
|||
|
|
width: 26rpx;
|
|||
|
|
height: 26rpx;
|
|||
|
|
}
|
|||
|
|
</style>
|