171 lines
3.9 KiB
Vue
171 lines
3.9 KiB
Vue
<template>
|
|
<view class=" goods">
|
|
<view class="u-flex">
|
|
<view class="u-flex u-col-top">
|
|
<image v-if="data.headImg" :src="data.headImg" class="img"></image>
|
|
<view class="img" v-else></view>
|
|
</view>
|
|
<view class="u-p-l-30 u-flex-1" style="position: relative;">
|
|
<view class="u-flex">
|
|
<view class="color-000 font-bold" style="margin-right: 10rpx;">{{data.nickName}}</view>
|
|
<image style="width: 24rpx;height: 24rpx;" v-if="data.sex==1" src="./men.png" mode=""></image>
|
|
<image style="width: 24rpx;height: 24rpx;" v-if="data.sex==0" src="./women.png" mode=""></image>
|
|
</view>
|
|
<view class="u-m-t-30 color-666 ">
|
|
{{data.phone||''}}
|
|
</view>
|
|
<view style="position: absolute;right: 0;top: 0;border-radius: 4rpx 4rpx 4rpx 4rpx;background: #EAF4FD;font-weight: 400;font-size: 20rpx;color: #318AFE;">
|
|
会员等级{{data.isVip}}
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="info u-m-t-20 u-flex">
|
|
<view class="u-flex-1 u-text-center" >
|
|
<view class="font-bold color-000 pr-16" >{{data.amount||0.00}}</view>
|
|
<view class="u-flex u-row-center" >
|
|
<view class="color-999">余额</view>
|
|
<view class="u-flex">
|
|
<uni-icons type="right" color="#999"></uni-icons>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="u-flex-1 u-text-center" >
|
|
<view class="font-bold color-000 pr-16" >{{data.accountPoints||0}}</view>
|
|
<view class="u-flex u-row-center" >
|
|
<view class="color-999">积分</view>
|
|
<view class="u-flex">
|
|
<uni-icons type="right" color="#999"></uni-icons>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="u-flex-1 u-text-center" >
|
|
<view class="font-bold color-000 pr-16" >{{data.couponNum||0}}</view>
|
|
<view class="u-flex u-row-center" >
|
|
<view class="color-999">优惠券</view>
|
|
<view class="u-flex">
|
|
<uni-icons type="right" color="#999"></uni-icons>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="u-m-t-24 u-flex u-row-between">
|
|
<view></view>
|
|
<view class="u-flex">
|
|
<view class="btn-default btn" @click="toOrder">查看订单</view>
|
|
<view class="btn-primary btn u-m-l-38" @click="moreOperate">更多操作</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from 'vue';
|
|
import go from '@/commons/utils/go.js';
|
|
const emits=defineEmits(['moreOperate'])
|
|
const props = defineProps({
|
|
index:{
|
|
type:Number
|
|
},
|
|
data:{
|
|
type:Object,
|
|
default:()=>{
|
|
return{}
|
|
}
|
|
},
|
|
showDetail:{
|
|
type:Boolean,
|
|
default:false
|
|
}
|
|
})
|
|
|
|
function toOrder(){
|
|
go.to('PAGES_ORDER_INDEX',{
|
|
userId: props.data.userId||'',
|
|
type:'user'
|
|
})
|
|
}
|
|
|
|
function moreOperate(){
|
|
emits('moreOperate',props.index)
|
|
}
|
|
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
$imgSize: 126rpx;
|
|
|
|
.pr-16{
|
|
padding-right: 16px;
|
|
}
|
|
.info{
|
|
background-color: rgb(250, 250, 250);
|
|
padding: 20rpx;
|
|
}
|
|
.btn{
|
|
padding: 10rpx 20rpx;
|
|
border-radius: 100rpx;
|
|
border: 2rpx solid transparent;
|
|
}
|
|
.btn-primary{
|
|
border-color: $my-main-color;;
|
|
color: $my-main-color;
|
|
}
|
|
.btn-default{
|
|
border-color: #F4F4F4;
|
|
color: #666;
|
|
}
|
|
|
|
.img {
|
|
width: $imgSize;
|
|
height: $imgSize;
|
|
background-color: #eee;
|
|
border-radius: 16rpx;
|
|
}
|
|
|
|
.goods {
|
|
border-radius: 10rpx 10rpx 10rpx 10rpx;
|
|
background-color: #fff;
|
|
padding: 24rpx 28rpx 16rpx 28rpx;
|
|
font-size: 28rpx;
|
|
.skus{
|
|
background: #F9F9F9;
|
|
border-radius: 14rpx 14rpx 14rpx 14rpx;
|
|
padding: 28rpx 42rpx;
|
|
.sku{
|
|
color: #000;
|
|
font-weight: 700;
|
|
padding: 6rpx 40rpx;
|
|
}
|
|
.skds{
|
|
gap: 10rpx 50rpx;
|
|
}
|
|
.skd{
|
|
padding: 14rpx 40rpx;
|
|
background: #F0F2F5;
|
|
border-radius: 4rpx;
|
|
position: relative;
|
|
color: #666;
|
|
overflow: hidden;
|
|
.tag{
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
font-size: 12rpx;
|
|
right: 0;
|
|
padding: 2rpx 4rpx;
|
|
border-radius: 0rpx 4rpx 4rpx 4rpx;
|
|
}
|
|
.tag-primary{
|
|
background-color: $my-main-color;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
</style> |