karlcarlo
a5c5d753b6
- 新增大量图片资源，包括图标、背景图、海报等，用于页面展示 - 添加字体文件及样式配置，支持自定义字体 - 引入 uni-ui 组件库，包括图标、弹窗、日期选择器等常用组件 - 添加网络状态监听、加密工具等基础工具函数 - 配置 Vuex 状态管理，包括购物车数量、热门搜索词等 - 增加页面组件，如用户协议、分销信息、提现状态等 - 配置项目构建和忽略文件，优化开发体验
75 lines
1.3 KiB
Vue
75 lines
1.3 KiB
Vue
<template>
|
||
<view class="gift-message-card">
|
||
<view class="message-header">
|
||
<image class="avatar" :src="avatar" mode="aspectFill"></image>
|
||
<text class="gift-text">{{ nickname }} 赠您一份礼物，请查收！</text>
|
||
</view>
|
||
<view class="divider"></view>
|
||
<view class="message-content">
|
||
<text class="message-text">{{
|
||
gift_mark || "天天开心，所得皆所愿~"
|
||
}}</text>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: "SendGiftMarkCard",
|
||
props: {
|
||
avatar: {
|
||
type: String,
|
||
default: "",
|
||
},
|
||
nickname: {
|
||
type: String,
|
||
default: "匿名",
|
||
},
|
||
gift_mark: {
|
||
type: String,
|
||
default: "",
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.gift-message-card {
|
||
background-color: #ffffff;
|
||
border-radius: 24rpx;
|
||
padding: 32rpx 24rpx;
|
||
.message-header {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 20rpx;
|
||
|
||
.avatar {
|
||
width: 36rpx;
|
||
height: 36rpx;
|
||
border-radius: 50%;
|
||
margin-right: 16rpx;
|
||
}
|
||
|
||
.gift-text {
|
||
font-size: 28rpx;
|
||
color: #ae5a2a;
|
||
font-weight: 400;
|
||
}
|
||
}
|
||
|
||
.divider {
|
||
height: 1rpx;
|
||
background-color: #f5f5f5;
|
||
margin: 20rpx 0;
|
||
}
|
||
|
||
.message-content {
|
||
.message-text {
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
line-height: 1.5;
|
||
}
|
||
}
|
||
}
|
||
</style>
|