100 lines
2.0 KiB
Vue
100 lines
2.0 KiB
Vue
<template>
|
|
<up-popup
|
|
:show="show"
|
|
:round="24"
|
|
:closeOnClickOverlay="false"
|
|
mode="center"
|
|
>
|
|
<view class="home-popup-view" v-if="dataObj">
|
|
<view class="home-popup-head">
|
|
<image src="https://cex-pub.s3.ap-southeast-1.amazonaws.com/static/new/logo.png" class="logo-img"></image>
|
|
<text class="text-28 text-zu" style="margin-left:14rpx">信任桥</text>
|
|
<text class="text-28 text-fu" style="margin-left:14rpx">分享商品</text>
|
|
</view>
|
|
<view class="home-popup-mid">
|
|
<image :src="dataObj.goodsGraph.split(',')[0]"></image>
|
|
</view>
|
|
<text class="text-32 text-zi text-bold" style="margin-top:16rpx">￥<text class="text-44">{{dataObj.minPrice}}</text>
|
|
</text>
|
|
<text class="text-32 text-zu1 text-overflow1" style="margin-top:16rpx">{{dataObj.name}}</text>
|
|
<MyBtn text="查看详情" wd="100%" br="44rpx" @ok="onOk" style="margin-top:24rpx"></MyBtn>
|
|
</view>
|
|
</up-popup>
|
|
</template>
|
|
|
|
<script>
|
|
import Func from '/utils/func'
|
|
import MyBtn from '@/components/common/my-btn.vue'
|
|
export default {
|
|
components:{MyBtn},
|
|
data() {
|
|
return {
|
|
}
|
|
},
|
|
props:{
|
|
show:{
|
|
type:Boolean,
|
|
default:false
|
|
},
|
|
dataObj:{
|
|
type:Object,
|
|
default:()=>{}
|
|
}
|
|
|
|
},
|
|
|
|
methods: {
|
|
onOk(){
|
|
this.$emit('jumpShop');
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.home-popup-view{
|
|
width:620rpx;
|
|
height:1000rpx;
|
|
min-height:1000rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
background-color: #fff;
|
|
border-radius: 24rpx;
|
|
position: relative;
|
|
padding: 32rpx;
|
|
box-sizing: border-box;
|
|
.home-popup-mid{
|
|
width:100%;
|
|
height:540rpx;
|
|
min-height:540rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
border-radius: 16rpx;
|
|
box-sizing: border-box;
|
|
overflow: hidden;
|
|
margin-top:28rpx;
|
|
image{
|
|
width:100%;
|
|
height:100%
|
|
}
|
|
}
|
|
.home-popup-head{
|
|
width:100%;
|
|
height:64rpx;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
min-height:64rpx;
|
|
.logo-img{
|
|
width:64rpx;
|
|
height:64rpx;
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|