Big-Data-Lab
/
WxApp
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化映入tDesign

This commit is contained in:
Xubx 2024-08-31 17:33:35 +08:00
parent 296f5e6562
commit e6ee7505e5
16 changed files with 267 additions and 120 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app.js
View File

@ -1,5 +1,6 @@
const baseUrl = "http://localhost:8080"
App({
onLaunch: function () {
console.log("App Launch")

2
page/component/address/address.js
View File

@ -16,7 +16,7 @@ Page({
url: baseUrl + "/user/getById",
method: "GET",
data: {
id: 1,
id: 3,
},
success(res) {
self.setData({

8
page/component/details/details.js
View File

@ -3,10 +3,10 @@ Page({
onLoad: function (options) {
const goods = {
id: options.id,
title: options.title,
price: options.price,
detail: options.detail,
image: decodeURIComponent(options.image).split(','),
goodName: options.goodName,
goodPrice: options.goodPrice,
goodDetail: options.goodDetail,
goodImage: decodeURIComponent(options.goodImage).split(','),
};
this.setData({ goods });
},

8
page/component/details/details.json
View File

@ -1 +1,7 @@
{}
{
"usingComponents": {
"t-button": "tdesign-miniprogram/button/button",
"t-tag": "tdesign-miniprogram/tag/tag",
"t-icon": "tdesign-miniprogram/icon/icon"
}
}

50
page/component/details/details.wxml
View File

@ -2,7 +2,7 @@
<view class="goods-box">
<!-- <image src="{{goods.image}}" class="goods-thumb"></image> -->
<swiper class="banner" indicator-dots="true" autoplay="true" interval="{{interval}}" duration="{{duration}}" circular="true">
<block wx:for="{{goods.goodImage}}" wx:key="{{index}}">
<block wx:for="{{goods.goodImage}}" wx:key="index">
<swiper-item>
<image src="{{item}}" class="slide-image" width="100%" />
</swiper-item>
@ -15,22 +15,44 @@
</view>
</navigator> -->
<view class="goods-operation">
<text class="goods-operation-add" bindtap="reduceCount">-</text>
<text class="goods-operation-num">数量 {{num}}</text>
<text class="goods-operation-add" bindtap="addCount">+</text>
<navigator url="javascript:void(0);" open-type="false">
<button class="goods-to-buy" bindtap="onBuyClick">购买</button>
</navigator>
<!-- <text class="goods-to-cart" bindtap="addToBuy">购买</text> -->
<!-- <image src="/image/cart1.png" class="goods-cart-img" bindtap="addToCart"></image> -->
<!-- <view class="goods-operation"> -->
<view class="goods-info">
<view class="left-section">
<view class="goods-price">￥ {{goods.goodPrice}}</view>
<view class="goods-title">{{goods.goodName}}</view>
</view>
<view class="right-section">
<t-button open-type="share" t-class="shareBtn" variant="text">
<view class="btn-icon">
<t-icon name="share" size="40rpx" color="#000" />
</view>
<view class="share-text">分享</view>
</t-button>
</view>
</view>
<view class="goods-buy">
<navigator>
<t-icon class="left-return" name="home"></t-icon>
<view>首页</view>
</navigator>
<t-button class="right-buy" theme="light" variant="outline" size="large" shape="round">立即购买</t-button>
</view>
<!-- <text class="goods-operation-add" bindtap="reduceCount">-</text>
<text class="goods-operation-num">数量 {{num}}</text>
<text class="goods-operation-add" bindtap="addCount">+</text> -->
<!-- <navigator url="javascript:void(0);" open-type="false">
<button class="goods-to-buy" bindtap="onBuyClick">购买</button>
</navigator> -->
<!-- <text class="goods-to-cart" bindtap="addToBuy">购买</text> -->
<!-- <image src="/image/cart1.png" class="goods-cart-img" bindtap="addToCart"></image> -->
<!-- </view> -->
<image wx:if="{{show}}" src="/image/cart1.png" class="to-carts-icon"></image>
<!-- <view class="goods-stock">{{goods.stock}}</view> -->
<view class="goods-title">{{goods.goodName}}</view>
<view class="goods-price">￥ {{goods.goodPrice}}</view>
</view>
<view class="goods-tab-box">
<!-- <view class="goods-tab-box">
<view class="goods-tab-nav {{curIndex === 0 ?'on':''}}" bindtap="bindTap" data-index="0">商品详情</view>
<view class="goods-tab-nav {{curIndex === 1 ?'on':''}}" bindtap="bindTap" data-index="1">产品参数</view>
<view class="goods-tab-nav {{curIndex === 2 ?'on':''}}" bindtap="bindTap" data-index="2">售后保障</view>
@ -39,5 +61,5 @@
<view wx:if="{{curIndex === 1}}">{{goods.parameter}}</view>
<view wx:if="{{curIndex === 2}}">{{goods.service}}</view>
</view>
</view>
</view> -->
</view>

61
page/component/details/details.wxss
View File

@ -3,9 +3,8 @@
.goods-box {
position: relative;
padding: 40rpx 45rpx;
text-align: center;
color: #454552;
border-bottom: 30rpx solid #ededed;
/* border-bottom: 30rpx solid #ededed; */
}
.goods-box .goods-thumb {
@ -125,10 +124,13 @@
.goods-operation-num {
width: 160rpx;
}
.banner{
.banner {
height: 240px;
padding-bottom: 20px;
text-align: center;
}
.goods-operation-add {
font-weight: bold;
width: 80rpx;
@ -156,14 +158,61 @@
margin-top: 50px;
}
.goods-info {
display: flex;
justify-content: space-between;
align-items: center;
}
.left-section {
display: flex;
flex-direction: column;
}
.goods-title {
font-size: 40rpx;
margin-bottom: 30rpx;
margin-top: 50px;
}
.goods-price {
font-size: 40rpx;
font-size: 50rpx;
font-weight: bold;
color: red;
}
.right-section {
display: flex;
align-items: center;
}
.btn-icon {
font-size: 20rpx;
}
.share-text {
padding-left: 8rpx;
padding-top: 8rpx;
font-size: 20rpx;
line-height: 24rpx;
}
.goods-buy {
position: fixed; /* 固定在页面底部 */
bottom: 0; /* 距离底部为0 */
left: 0; /* 左侧对齐 */
width: 100%; /* 宽度占满屏幕 */
display: flex;
justify-content: space-between;
padding: 10rpx 20rpx; /* 添加一些内边距 */
background-color: #fff; /* 设置背景颜色 */
box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1); /* 添加一个阴影 */
}
.left-return {
font-size: 32px;
flex-grow: 0; /* 防止按钮拉伸 */
}
.right-buy {
flex-grow: 0; /* 防止按钮拉伸 */
}
.goods-tab-nav {

9
page/component/index.js
View File

@ -6,13 +6,7 @@ Page({
autoplay: false,
interval: 3000,
duration: 800,
goods: {
id: 1,
image: ["/image/beizi1.jpg", "/image/beizi1.jpg"],
title: "床上用品六件套",
price: 220,
detail: "被子、褥子、枕头、三件套",
},
goods: {},
},
onLoad() {
var self = this
@ -26,7 +20,6 @@ Page({
self.setData({
goods: res.data.data,
})
console.log(res, "res", res.data.data)
},
})
},

15
page/component/index.wxml
View File

@ -38,16 +38,15 @@
<view class="newest-title"><text>大雄出品</text></view>
<view class="newest-box">
<view class="newest-list">
<navigator url="details/details?id={{goods.id}}&image={{goods.goodImage}}&title={{goods.goodName}}&price={{goods.goodPrice}}&detail={{goods.goodDetail}}">
<view class="list">
<view class="item" wx:for="{{goods}}" wx:key="id">
<view class="item" wx:for="{{goods}}" wx:key="id">
<navigator url="details/details?id={{item.id}}&goodImage={{item.goodImage}}&goodName={{item.goodName}}&goodPrice={{item.goodPrice}}&goodDetail={{item.goodDetail}}">
<view class="list">
<image src="{{item.goodImage}}"></image>
<view class="newest-text"><text>{{item.goodName}} {{item.goodPrice}}￥</text></view>
<view class="newest-text"><text>{{item.goodName}}</text></view>
</view>
</view>
<!-- <view class="newest-text"><text></text></view> -->
</navigator>
<!-- <view class="newest-text"><text></text></view> -->
</navigator>
</view>
</view>
<!-- <view class="newest-list">
<navigator url="details/details">

3
page/component/index.wxss
View File

@ -51,7 +51,7 @@ swiper-item image {
.newest-box .newest-list{
display: inline-block;
width: 700rpx;
height: 500rpx;
height: 470rpx;
/* margin:0 0 20rpx 0; */
padding-top: 10px;
border-radius: 10px;
@ -67,5 +67,6 @@ swiper-item image {
margin: 20rpx 0 10rpx;
}
.newest-box .newest-list .newest-text{
color: red;
font-size: 32rpx;
}

14
page/component/myOrders/myOrder.js
View File

@ -11,16 +11,7 @@ Page({
address: {},
hasAddress: false,
total: 0,
orders: [
{
id: 1,
title: "新鲜芹菜 半斤",
image: "/image/s5.png",
num: 4,
price: 0.01,
},
// {id:2,title:'素米 500g',image:'/image/s6.png',num:1,price:0.03}
],
orders: [],
},
onLoad() {
var self = this
@ -33,8 +24,9 @@ Page({
},
success(res) {
self.setData({
orders: res.data,
orders: res.data.data,
})
console.log('orders',self.data.orders)
},
})
},

2
page/component/myOrders/myOrder.wxml
View File

@ -6,7 +6,7 @@
<view class="orders-box">
<view wx:for="{{orders}}" wx:key="index" class="orders-list">
<view wx:for="{{orders}}" wx:key="id" class="orders-list">
<image class="orders-thumb" src="{{item.image}}"></image>
<view class="orders-pro-name">{{item.title}}</view>
<view class="orders-pro-price">￥{{item.price}}</view>

2
page/component/refund/refund.json
View File

@ -1,3 +1,3 @@
{
"navigationBarTitleText": "订单详情"
"navigationBarTitleText": "退款/售后"
}

189
page/component/user/user.js
View File

@ -1,85 +1,156 @@
const app = getApp()
const baseUrl = app.globalData.baseUrl
// page/component/new-pages/user/user.js
const app = getApp();
const baseUrl = app.globalData.baseUrl;
Page({
data: {
thumb: "",
nickname: "",
orders: [],
hasAddress: false,
address: {},
thumb: "", // 用户头像
nickname: "", // 用户昵称
orders: [], // 订单列表
hasAddress: false, // 是否有地址信息
address: {}, // 地址信息
},
onLoad() {
var self = this
wx.getUserProfile({
desc: "用于完善会员资料", // 这里必须声明用途
success: function (res) {
self.setData({
thumb: res.userInfo.avatarUrl,
nickname: res.userInfo.nickName,
})
// 你可以将用户信息发送到后端或缓存到本地
},
fail: function (err) {
wx.showToast({
title: "用户拒绝了授权",
icon: "none",
})
},
})
this.checkUserProfile(); // 检查并获取用户信息
/**
* 发起请求获取订单列表信息
*/
wx.request({
url: baseUrl + "/order/loadData",
method: "POST",
data: {
userId: 1,
},
success(res) {
self.setData({
orders: res.data,
})
},
})
this.loadOrders(); // 加载订单列表
},
/**
* 检查本地缓存中是否有用户信息
*/
checkUserProfile() {
const userInfo = wx.getStorageSync('userInfo');
if (userInfo) {
// 如果有用户信息，直接设置数据
this.setData({
thumb: userInfo.userInfo.avatarUrl,
nickname: userInfo.userInfo.nickName,
});
} else {
// 没有用户信息，提示用户登录授权
wx.showModal({
title: '温馨提示',
content: '请先登录！',
showCancel: false,
success: (res) => {
if (res.confirm) {
this.getUserProfile();
}
}
});
}
},
/**
* 获取用户信息
*/
getUserProfile() {
var self = this
wx.getUserProfile({
desc: "用于完善会员资料", // 这里必须声明用途
success: function (res) {
self.setData({
thumb: res.userInfo.avatarUrl,
nickname: res.userInfo.nickName,
})
// 你可以将用户信息发送到后端或缓存到本地
success: (userInfo) => {
// 存储用户信息到本地缓存中
wx.setStorageSync('userInfo', userInfo);
// 在页面中展示用户信息
this.setData({
thumb: userInfo.userInfo.avatarUrl,
nickname: userInfo.userInfo.nickName,
});
console.log('用户信息', userInfo);
},
fail: function (err) {
fail: (err) => {
wx.showToast({
title: "用户拒绝了授权",
icon: "none",
})
},
})
});
console.log(err);
}
});
},
/**
* 微信登录
*/
wxLogin() {
wx.login({
success: (res) => {
if (res.code) {
console.log('微信登录成功，code:', res.code);
// 可以将code发送到服务器进行登录验证
} else {
console.log('登录失败！' + res.errMsg);
}
}
});
},
/**
* 登录到服务器（可选，基于需求）
*/
loginToServer(code, userInfo) {
wx.request({
url: `${baseUrl}/login`, // 替换为你的服务器登录接口
method: 'POST',
data: {
code: code, // 微信登录凭证
avatar: userInfo.avatarUrl,
nickname: userInfo.nickName,
gender: userInfo.gender
},
success: (res) => {
if (res.data.code === 1) {
// 登录成功，保存服务器返回的 token
wx.setStorageSync('token', res.data.token);
// 其他登录后的初始化操作
}
},
fail: (err) => {
console.log('服务器登录失败', err);
}
});
},
/**
* 加载订单列表
*/
loadOrders() {
wx.request({
url: `${baseUrl}/order/loadData`,
method: "POST",
data: {
userId: 1, // 示例用户ID
},
success: (res) => {
this.setData({
orders: res.data,
});
},
fail: (err) => {
console.log('获取订单失败', err);
}
});
},
onShow() {
var self = this
/**
* 获取本地缓存 地址信息
*/
wx.getStorage({
key: "address",
success: function (res) {
self.setData({
success: (res) => {
this.setData({
hasAddress: true,
address: res.data,
})
});
},
})
});
},
/**
* 发起支付请求
*/
@ -90,16 +161,16 @@ Page({
package: "String3",
signType: "MD5",
paySign: "String4",
success: function (res) {
console.log(res)
success: (res) => {
console.log(res);
},
fail: function (res) {
fail: (res) => {
wx.showModal({
title: "支付提示",
content: "<text>",
showCancel: false,
})
});
},
})
});
},
})
});

9
page/component/user/user.wxml
View File

@ -1,8 +1,11 @@
<view class="main">
<view class="header" bindtap="getUserProfile">
<image src="{{thumb}}" class="thumb"></image>
<text class="nickname">{{nickname}}</text>
<text class="about">关于我们</text>
<view wx:if="{{nickname}}">
<image src="{{thumb}}" class="thumb"></image>
<text class="nickname">{{nickname}}</text>
<text class="about">关于我们</text>
</view>
<view wx:else="">请登录</view>
</view>
<view class="address-box">
<view class="address-manage">

9
project.config.json
View File

@ -14,7 +14,14 @@
"ignore": [],
"disablePlugins": [],
"outputPath": ""
}
},
"packNpmManually": true,
"packNpmRelationList": [
{
"packageJsonPath": "./package.json",
"miniprogramNpmDistDir": "./"
}
]
},
"compileType": "miniprogram",
"libVersion": "3.5.5",

5
project.private.config.json
View File

@ -1,4 +1,7 @@
{
"description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
"projectname": "wxapp-mall"
"projectname": "wxapp-mall",
"setting": {
"urlCheck": false
}
}