feat: 添加静态资源文件及基础组件

- 新增大量图片资源,包括图标、背景图、海报等,用于页面展示
- 添加字体文件及样式配置,支持自定义字体
- 引入 uni-ui 组件库,包括图标、弹窗、日期选择器等常用组件
- 添加网络状态监听、加密工具等基础工具函数
- 配置 Vuex 状态管理,包括购物车数量、热门搜索词等
- 增加页面组件,如用户协议、分销信息、提现状态等
- 配置项目构建和忽略文件,优化开发体验
This commit is contained in:
2026-02-26 17:59:51 +08:00
commit a5c5d753b6
720 changed files with 178840 additions and 0 deletions

View File

@@ -0,0 +1,385 @@
<template>
<scroll-view class="scroll-view" scroll-y="true" @scroll="scrollView">
<!-- #ifdef MP -->
<NavBar titleText="会员码" :iconColor="iconColor" :textColor="iconColor" showBack :isScrolling="isScrolling"></NavBar>
<!-- #endif -->
<view class="wrapper">
<view class="wrapper-content">
<view class="header" :style="[headerStyle]" v-if="currentLevel">
<view class="title" :style="{ color: currentLevel.color }">嗨,{{userInfo.nickname || '尊贵会员'}}</view>
</view>
<view class="content">
<!-- <view class="acea-row row-center-wrapper">
<w-barcode :options="config.bar"></w-barcode>
</view> -->
<view class="acea-row row-center-wrapper" style="margin-top: 56rpx;">
<!-- #ifdef MP -->
<image :src="qrc" class="qrcode"></image>
<!-- #endif -->
<!-- #ifdef H5 -->
<image v-if="$wechat.isWeixin()" :src="qrc" class="qrcode"></image>
<w-qrcode v-else :options="config.qrc"></w-qrcode>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<w-qrcode :options="config.qrc"></w-qrcode>
<!-- #endif -->
</view>
<view class="codeNum acea-row row-center-wrapper">{{config.bar.code}}</view>
<view class="balance-wrapper">
<view class="balance acea-row row-column row-center-wrapper">
<view class="">当前余额<text class="iconfont" :class="[isEye?'icon-ic_Eyes':'icon-ic_eye']" @click="toggleEye"></text></view>
<view class="number" v-if="isEye">{{userInfo.now_money}}</view>
<view class="number" v-else style="font-weight: 500;font-size: 48rpx;">******</view>
</view>
<view class="attribute acea-row row-center-wrapper">
<view class="item" @click="goDetail(1)">
<view class="iconfont icon-ic_coupon"></view>
<view class="">{{userInfo.couponCount}}张券</view>
</view>
<view class="item" @click="goDetail(2)">
<view class="iconfont icon-ic_gold1"></view>
<view class="">{{userInfo.integral}}积分</view>
</view>
<view class="item" @click="goDetail(3)" v-if="VipList.length && levelInfo.exp">
<view class="iconfont icon-ic_sale"></view>
<view class="">{{userInfo.vip_discount}}折</view>
</view>
</view>
</view>
</view>
</view>
</view>
</scroll-view>
</template>
<script>
// #ifdef MP
import NavBar from '@/components/NavBar.vue'
// #endif
import {
getUserInfo,
getlevelInfo,
getRandCode,
} from '@/api/user.js';
import {
activityCodeApi
} from '@/api/activity.js';
export default {
components: {
// #ifdef MP
NavBar,
// #endif
},
data() {
return {
iconColor: '#FFFFFF',
isScrolling: false,
userInfo: {},
VipList: [],
currentLevel: {},
nextLevel: null,
nowLevel: {
name:'',
exp:'',
exp_num:0,
},
isEye: true,
config: {
bar: {
code: '',
color: ['#000'],
bgColor: '#FFFFFF', // 背景色
width: 480, // 宽度
height: 110 // 高度
},
qrc: {
code: '',
size: 380, // 二维码大小
level: 3, //等级 0~4
bgColor: '#FFFFFF', //二维码背景色 默认白色
border: {
color: ['#eee', '#eee'], //边框颜色支持渐变色
lineWidth: 3, //边框宽度
},
// img: '/static/logo.png', //图片
// iconSize: 40, //二维码图标的大小
color: ['#333', '#333'], //边框颜色支持渐变色
}
},
qrc: ''
}
},
computed: {
headerStyle() {
let styleObject = {};
if (this.nextLevel) {
styleObject['background'] =
`linear-gradient(91deg, ${this.colorToRgba(this.currentLevel.color||'', 0.05)} 0%, ${this.colorToRgba(this.currentLevel.color||'', 0.4)} 100%)`;
}
return styleObject;
}
},
onLoad() {
this.getCode();
this.getUserInfo();
this.getlevelInfo();
this.activityCodeApi();
},
methods: {
activityCodeApi() {
activityCodeApi(90, 0).then(res => {
const {
routineUrl,
wechatUrl
} = res.data;
// #ifdef MP
this.qrc = routineUrl;
// #endif
// #ifdef H5
if (this.$wechat.isWeixin()) {
this.qrc = wechatUrl;
}
// #endif
});
},
goDetail(val) {
if (val == 1) {
uni.navigateTo({
url: '/pages/users/user_coupon/index'
})
} else if (val == 2) {
uni.navigateTo({
url: '/pages/users/user_integral/index'
})
} else if (val == 3) {
uni.navigateTo({
url: '/pages/users/user_vip/index'
})
}
},
scrollView(e) {
if (e.detail.scrollTop > 50) {
this.isScrolling = true;
this.iconColor = '#333333';
} else if (e.detail.scrollTop < 50) {
this.isScrolling = false;
this.iconColor = '#FFFFFF';
}
},
getCode() {
getRandCode().then(res => {
let code = res.data.code;
this.config.bar.code = code;
this.config.qrc.code = code;
}).catch(err => {
return this.$util.Tips(err);
})
},
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
that.userInfo = res.data
that.config.bar.code = that.userInfo.bar_code;
that.config.qrc.code = that.userInfo.bar_code;
});
},
getlevelInfo: function() {
getlevelInfo().then(res => {
const {
level_info,
level_list,
task,
user
} = res.data;
this.levelInfo = level_info;
level_list.forEach(item => {
switch (item.grade) {
case 1:
item.background = ['#091D2B', '#000F18'];
break;
case 2:
item.background = ['#131A1D', '#040809'];
break;
case 3:
item.background = ['#4B351C', '#14100C'];
break;
case 4:
item.background = ['#1D172B', '#17151E'];
break;
case 5:
item.background = ['#0F0D07', '#0F0D07'];
break;
default:
break;
}
})
this.VipList = level_list;
const index = level_list.findIndex(item => item.grade == level_info.grade);
this.currentLevel = level_list[index];
this.nextLevel = level_list[index + 1];
this.nowLevel = level_info;
});
},
toggleEye() {
this.isEye = !this.isEye;
},
colorToRgba(str, n) {
// 十六进制颜色值的正则表达式
const reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
let sColor = str.toLowerCase();
// 十六进制颜色转换为RGB格式
if (sColor && reg.test(sColor)) {
if (sColor.length === 4) {
let sColorNew = '#';
for (let i = 1; i < 4; i += 1) {
sColorNew += sColor.slice(i, i + 1).concat(sColor.slice(i, i + 1));
}
sColor = sColorNew;
}
// 处理六位颜色值
const sColorChange = [];
for (let k = 1; k < 7; k += 2) {
sColorChange.push(parseInt(`0x${sColor.slice(k, k + 2)}`, 16));
}
return `rgba(${sColorChange.join(',')}, ${n})`;
}
return sColor;
}
},
}
</script>
<style lang="scss" scoped>
.scroll-view {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: linear-gradient(180deg, #1B1A17 0%, #141414 100%);
.wrapper {
padding: 94rpx 32rpx;
}
.wrapper-content {
border-radius: 32rpx;
background: #FFFFFF;
overflow: hidden;
}
.header {
padding: 42rpx 0 40rpx;
border-radius: 32rpx 32rpx 0 0;
background: linear-gradient(91deg, rgba(26, 25, 23, 0.9) 0%, #1A1917 100%);
.title {
text-align: center;
font-weight: 600;
font-size: 44rpx;
line-height: 62rpx;
color: #804400;
}
.progress-wrap {
margin-top: 14rpx;
font-size: 22rpx;
line-height: 30rpx;
color: rgba(126, 75, 6, 0.8);
}
.progress {
width: 360rpx;
height: 8rpx;
border-radius: 4rpx;
margin: 0 16rpx;
background: rgba(255, 255, 255, 0.4);
}
.inner {
height: 8rpx;
border-radius: 4rpx;
background: rgba(126, 75, 6, 0.8);
}
.info {
margin-top: 24rpx;
font-size: 24rpx;
line-height: 34rpx;
color: #7E4B06;
}
.number {
margin: 0 4rpx;
font-family: SemiBold;
font-size: 28rpx;
color: rgba(126, 75, 6, 0.8);
}
}
.content {
padding: 28rpx 0 0;
}
.codeNum {
margin-top: 12rpx;
letter-spacing: 3px;
font-weight: 500;
font-size: 28rpx;
line-height: 40rpx;
color: #333333;
}
.balance-wrapper {
margin-top: 40rpx;
background: #F9F9F9;
}
.balance {
padding: 54rpx 0 76rpx;
font-size: 24rpx;
line-height: 34rpx;
color: #999999;
.iconfont {
margin-left: 8rpx;
font-size: 28rpx;
}
.number {
margin-top: 20rpx;
font-family: SemiBold;
font-size: 56rpx;
line-height: 56rpx;
color: #333333;
}
}
.attribute {
padding-bottom: 48rpx;
text-align: center;
font-size: 24rpx;
line-height: 34rpx;
color: #666666;
.item {
margin-right: 123rpx;
&:last-child {
margin-right: 0;
}
}
.iconfont {
margin-bottom: 16rpx;
font-size: 48rpx;
color: #444444;
}
}
}
.qrcode {
width: 380rpx;
height: 380rpx;
}
</style>