微信小程序完整项目实战(前端+后端)

无语小咪 2024-08-19 15:03:04 阅读 51

基于微信小程序的在线商城点单系统

前言:闲来无事,制作一个微信小程序商城。系统采用Java语言作为后端实现与小程序的交互,给用来学习或者想自己开个小店的朋友当个参考。

目录

前言项目功能及技术效果图小程序管理端

APISpringBoot框架搭建实体映射创建Mapper接口封装整合Swagger常用字段类型

参考代码块

前言

项目功能及技术

<code>小程序主要有首页、商品详情、商品分类、商品评价、购物车、个人中心等模块。

管理端主要有人员管理、权限管理、商品管理、订单管理等模块。

html+css+js:微信小程序界面。

SpringBoot框架+Java程序语言:小程序及后台管理系统API的实现。

Layui前端框架:web后台管理界面样式及数据渲染框架。

MySQL数据库:数据支持。

效果图

小程序

管理端

API

SpringBoot框架搭建

1.创建maven project,先创建一个名为SpringBootDemo的项目,选择【New Project】

在这里插入图片描述

然后在弹出的下图窗口中,选择左侧菜单的【New Project】

在这里插入图片描述

在这里插入图片描述

在project下创建module,点击右键选择【new】—【Module…】

在这里插入图片描述

左侧选择【Spring initializr】,通过idea中集成的Spring initializr工具进行spring boot项目的快速创建。窗口右侧:name可根据自己喜好设置,group和artifact和上面一样的规则,其他选项保持默认值即可,【next】

在这里插入图片描述

Developer Tools模块勾选【Spring Boot DevTools】,web模块勾选【Spring Web】,此时,一个Springboot项目已经搭建完成,可开发后续功能

在这里插入图片描述

实体映射创建Mapper

创建一个entity实体类文件夹,并在该文件夹下创建项目用到的实体类

在这里插入图片描述

<code>package com.example.demo.entity;

import com.baomidou.mybatisplus.annotation.IdType;

import com.baomidou.mybatisplus.annotation.TableField;

import com.baomidou.mybatisplus.annotation.TableId;

import lombok.Data;

import java.time.LocalDateTime;

import java.util.ArrayList;

import java.util.List;

@Data

public class User { -- -->

@TableId(type = IdType.AUTO)

private Long id;

private String account;

private String pwd;

private String userDesc;

private String userHead;

private LocalDateTime createTime;

private Long role;

private String nickname;

private String email;

private String tags;

}

接口封装

由于我们使用mybatis-plus,所以简单的增删改查不用自己写,框架自带了,只需要实现或者继承他的Mapper、Service

在这里插入图片描述

创建控制器Controller

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

整合Swagger

添加依赖

先导入spring boot的web包

<code><!--swagger依赖-->

<dependency>

<groupId>io.springfox</groupId>

<artifactId>springfox-swagger2</artifactId>

<version>2.9.2</version>

</dependency>

<dependency>

<groupId>io.springfox</groupId>

<artifactId>springfox-swagger-ui</artifactId>

<version>2.9.2</version>

</dependency>

配置Swagger

创建一个swagger的配置类,命名为SwaggerConfig.java

/*

*用于定义API主界面的信息,比如可以声明所有的API的总标题、描述、版本

*/

private ApiInfo apiDemo() {

return new ApiInfoBuilder()

//用来自定义API的标题

.title("SpringBoot项目SwaggerAPIAPI标题测试")

//用来描述整体的API

.description("SpringBoot项目SwaggerAPI描述测试")

//创建人信息

.contact(new Contact("测试员张三","http://localhost:8080/springboot/swagger-ui.html","xxxxxxxx@163.com"))

//用于定义服务的域名

//.termsOfServiceUrl("")

.version("1.0") //可以用来定义版本

.build();

}

接口测试

运行Spring Boot项目,默认端口8080,通过地址栏访问url

在这里插入图片描述

接口组定义

根据不同的业务区分不同的接口组,使用@API来划分

<code>@Api(tags = "用户管理") // tags:组名称

@RestController

public class RoleController {

}

在这里插入图片描述

接口定义

使用@ApiModel来标注实体类,同时在接口中定义入参为实体类作为参数。

@ApiModel:用来标类

常用配置项:value:实体类简称;description:实体类说明

@ApiModelProperty:用来描述类的字段的含义。

常用字段类型

字段类型 所占字节 存储范围 最大存储值 使用场景
TINYINT 1 -128~127 127 存储小整数
INT 4 -2147483648~2147483647 2147483647 存储大整数
BIGINT 8 -9223372036854775808~9223372036854775807 9223372036854775807 存储极大整数
DECIMAL 可变长度 存储精度要求高的数值
CHAR 固定长度 最多255字节 255个字符 存储长度固定的字符串
VARCHAR 可变长度 最多65535字节 65535个字符 存储长度不固定的字符串
DATETIME 8 ‘1000-01-01 00:00:00’~‘9999-12-31 23:59:59’ ‘9999-12-31 23:59:59’ 存储日期和时间

参考代码块

<code><!-- 自定义顶部 start -->

<view class="yx-custom" style="padding-top:{ { statusBarHeight}}px;background-image: linear-gradient(43deg, #12C206,#00C90F);">code>

<view class="headerBox">code>

<view class="leftAddress">code>

<image class="leftAddressIcon" src="{ {imgUrl}}/upload/20220608/addressIcon.png" lazy-load="true"></image>code>

<view class="leftAddressText little">橘猫餐厅</view>code>

<image class="rightJtIcon" src="{ {imgUrl}}/upload/20220608/jtBottom.png" lazy-load="true"></image>code>

</view>

<view class="appletsTitle"></view>code>

</view>

</view>

<!-- 自定义顶部 占位标签 -->

<view class="yx-empty_custom" style="padding-top:{ { statusBarHeight}}px;"></view>code>

<!-- banner图 -->

<view style="background: url({ {imgUrl}}/upload/20220608/topBackImg.png);background-size: 100% 100%;width:750rpx;height:324rpx;">code>

<view class="bannerBottom"></view>code>

</view>

<!-- 分类及商品 -->

<view class="containerBox" style="height:{ { nowEquipmentHeight-((statusBarHeight*2)+162)}}px;">code>

<scroll-view class="menu-left" scroll-y="true" style="height:{ { nowEquipmentHeight-((statusBarHeight*2)+162)}}px;">code>

<view wx:for="{ {menuList}}" class="little { {menuIndex==index?'menu-item-check':'menu-item'}} { {item.prevClass}} { {item.nextClass}}" code>

bindtap="clickMenu" data-index="{ {index}}">{ -- -->{item.title}}</view>code>

<view class="bottomHeightBox"></view>code>

</scroll-view>

<scroll-view class="menu-right" scroll-y="true" style="height:{ { nowEquipmentHeight-((statusBarHeight*2)+162)}}px;">code>

<view class="menuTitleBox">code>

<text>热门推荐</text>

</view>

<view class="productContainer">code>

<view class="productItem" wx:for="{ {20}}" bindtap="goDetail">code>

<view class="productImage" style="background: url({ {imgUrl}}/upload/20220608/ky.jpg);background-size: 100% 100%;"></view>code>

<view class="productName little">超级无敌好吃美味烤鸭</view>code>

<view class="productPriceBox">code>

<view class="salePrice">code>

<text style="font-size:22rpx;">¥</text>code>

<text>58.88</text>

<text style="font-weight:400;">/g</text>code>

</view>

<view class="oldPrice middleLine">¥98</view>code>

</view>

</view>

</view>

<view class="bottomHeightBox"></view>code>

</scroll-view>

</view>

<!-- <image class="scanIcon" src="{ {imgUrl}}/Areas/dfapi/Content/images/cp.png" lazy-load="true"></image> -->code>

<image class="scanIcon" src="{ {imgUrl}}{ {scanUrl}}" lazy-load="true" bindtap="scanTableCode"></image>code>

<!--pages/productDetail/index.wxml-->

<!-- 商品轮播图 -->

<view class="product-banner">code>

<swiper class="product-banner" bindchange='onSlideChange' indicator-dots="{ {indicatorDots}}" autoplay="{ {autoplay}}"code>

interval="{ {interval}}" duration="{ {duration}}" circular="{ {circular}}">code>

<block wx:for="{ {productBanner}}" wx:key="id">code>

<swiper-item>

<view>

<image src="{ {item}}" class="product-banner" alt="" lazy-load="true" />code>

</view>

</swiper-item>

</block>

</swiper>

</view>

<!-- 秒杀商品展示 -->

<view wx:if="{ {productActiviType==0}}" class="activeBox"code>

style="background: url({ {imgUrl}}/upload/20220608/kill-pro-back.png);background-size: 100% 100%;">code>

<view class="kill-leftBox">code>

<view class="product-priceBox">code>

<view style="height:35rpx;line-height: 35rpx;">code>

<text class="symbol-kill">¥</text>code>

<text class="price-kill">58.8</text>code>

<text class="throuth-kill">¥98</text>code>

</view>

<view class="num-kill displayBox">限量200份</view>code>

</view>

<view class="justNum-kill">code>

<text>已售198份</text><text

class="just-rightText">每人限购1份</text>code>

</view>

</view>

<view class="kill-rightBox">code>

<view class="just-text">距秒杀结束仅剩</view>code>

<view class="kill-timeBox">code>

<view class="clockBox margin-one displayBox">{ -- -->{hour}}</view>code>

<view class="littleClock">:</view>code>

<view class="clockBox displayBox">{ -- -->{min}}</view>code>

<view class="littleClock">:</view>code>

<view class="clockBox displayBox">{ -- -->{second}}</view>code>

</view>

</view>

</view>

<!-- 商品名称 -->

<view class="productName-box littleTwo">code>

超级无敌好吃美味烤鸭

</view>

<!-- 商品描述 -->

<view class="productDesc-box littleTwo">code>

色泽红艳,肉质细嫩,味道醇厚,肥而不腻

</view>

<!-- 分享奖励 -->

<view class="productShare-money" bindtap="shareProduct">code>

<view class="left-Share">code>

<text>该商品分享可得奖励¥10</text>

</view>

<view class="right-Share">code>

<image src="{ {imgUrl}}/upload/20220608/share.png" lazy-load="true"></image>code>

<text>立即分享</text>

</view>

</view>

<!-- 商品配置规格 -->

<!-- <view class="productInfoBox">code>

<view class="heightInfo"></view>code>

<view class="Distribution" bindtap="chouseAddress">code>

<view class="title-info">配送</view>code>

<view class="chouseSpe">请选择收货地址</view>code>

<image src="{ {imgUrl}}/upload/20220608/rightJt.png" lazy-load="true"></image>code>

</view>

</view> -->

<!-- 服务 -->

<view class="services-box">code>

<view class="services-left">服务</view>code>

<view class="services-right">新鲜品质 配送到家 售后无忧</view>code>

</view>

<!-- 商品评价 -->

<view class="product-reply" >code>

<view class="reply-title">code>

<view class="leftReolyCount">code>

评价(2824)

</view>

<view class="middleSeeMore">code>

<view>查看全部评价</view>

</view>

<image class="grayRight" src="{ {imgUrl}}/upload/20220608/rightJt.png" lazy-load="true"></image>code>

</view>

<view class="replyUserInfo">code>

<image class="replyUserHead" src="{ {imgUrl}}/upload/20220608/jocker.jpg" lazy-load="true"></image>code>

<view class="rightUserName">code>

<view class="userName little">橘猫大侠</view>code>

<view class="starBox">code>

<image src="{ {imgUrl}}/upload/20220608/star5.png" class="starImg">code>

</image>

</view>

</view>

</view>

<view class="replyContet littleTwo">code>

味道好,配送快,值得信赖!

</view>

</view>

<!-- 商品详情 -->

<image class="proImgDetail" src="{ {imgUrl}}/upload/20220608/prodetailImg.png" lazy-load="true"></image>code>

<view style="height:56rpx;"></view>code>

<view class="productDetailTable" wx:if="{ {spuList.length>0}}">code>

<view wx:if="{ {!isShowDetail}}">code>

<view class="productTableTr">code>

<view class="leftTr">code>

<view class="little leftTrText">{ -- -->{spuList[0].name}}</view>code>

</view>

<view class="rightTr little">{ -- -->{spuList[0].content}}</view>code>

</view>

</view>

<view wx:if="{ {isShowDetail}}" class="productTableTr" wx:for="{ {spuList}}">code>

<view class="leftTr">code>

<view class="little leftTrText">{ -- -->{item.name}}</view>code>

</view>

<view class="rightTr little">{ -- -->{item.content}}</view>code>

</view>

</view>

<view class="DetailArrow displayBox" wx:if="{ {spuList.length>0}}">code>

<image wx:if="{ {!isShowDetail}}" bindtap="clickArrow" class="arrowImg"code>

src="{ {imgUrl}}/upload/20220608/nextJt.png" lazy-load="true"></image>code>

<text wx:if="{ {!isShowDetail}}" bindtap="clickArrow" style="margin-left:10rpx;">展开</text>code>

<image wx:if="{ {isShowDetail}}" bindtap="clickArrow" class="arrowImg"code>

src="{ {imgUrl}}/upload/20220608/topJt.png" lazy-load="true"></image>code>

<text wx:if="{ {isShowDetail}}" bindtap="clickArrow" style="margin-left:10rpx;">收起</text>code>

</view>

<view style="height:56rpx;"></view>code>

<image src="{ {imgUrl}}/upload/20220608/explain.png" class="explain"></image>code>

<!-- 你可能还喜欢 -->

<view class="maybeLike">code>

<image src="{ {imgUrl}}/upload/20220608/2323-2.png" class="maybeLikePng"></image>code>

<!-- 配置商品 -->

<view class="indexProductList">code>

<view class="productItemBottom" wx:for="{ {4}}">code>

<view style="background: url({ {imgUrl}}/upload/20220608/ky.jpg);background-size: 100% 100%;" class="productImgBottom"></view>code>

<view class="bottom-productName little">北京烤鸭</view>code>

<view class="iconBox little">code>

干净又卫生

</view>

<view class="buyBox-bottom">code>

<view class="leftPrice-bottom">code>

<text class="priceFh">¥</text>code>

<text class="bottom-price">58</text>code>

<text class="bottom-oldPrice">¥98</text>code>

</view>

<view class="rightAdd-bottom" data-index="{ {index}}" >code>

<image class="rightAdd-bottom" src="{ {imgUrl}}/upload/20220608/addcart.png" lazy-load="true">code>

</image>

</view>

</view>

</view>

</view>

</view>

<view style="height:162rpx;"></view>code>

<view class="footer">code>

<view class="leftFooter">code>

<view bindtap="GoHome">code>

<view style="background: url({ {imgUrl}}/upload/20220608/6-1.png);background-size: 100% 100%;"code>

class="footImg"></view>code>

<view class="footText">首页</view>code>

</view>

<view bindtap="GoShopping">code>

<view style="background: url({ {imgUrl}}/upload/20220608/6-5.png);background-size: 100% 100%;"code>

class="footImg2"></view>code>

<view class="footText2">购物车</view>code>

</view>

</view>

<view class="rightFooter">code>

<view class="displayShow" >code>

<view class="addCart-btn displayBox" catchtap="btnAddCart_footer">加入购物车</view>code>

<view class="purchase-btn displayBox" bindtap="rightNowBuy">立即购买</view>code>

</view>

</view>

</view>

<!--pages/shoppingCart/index.wxml-->

<!--pages/login/index.wxml-->

<view class="yx-custom" style="padding-top:{ { statusBarHeight}}px;background-image: linear-gradient(43deg, #12C206,#00C90F);">code>

<view class="headerBox">code>

<view class="leftAddress">code>

</view>

<view class="appletsTitle">购物车</view>code>

</view>

</view>

<!-- 自定义顶部 占位标签 -->

<view class="yx-empty_custom" style="padding-top:{ { statusBarHeight}}px;"></view>code>

<!-- 可下单的购物车商品 -->

<view class="go-product">code>

<view class="product-num">code>

<view class="left-productNum">共有5件商品</view>code>

<view class="right-delProduct" bindtap="deleteProduct">code>

<text>删除</text>

</view>

</view>

<view wx:for="{ {2}}" wx:for-index="idx" wx:for-item="item">code>

<view class="discount">code>

<view class="left-discount little">热门推荐</view>code>

<view class="discount-jt">code>

<image src="{ {imgUrl}}/upload/20220608/cartJt.png" lazy-load="true"></image>code>

</view>

</view>

<view wx:for="2" wx:for-index="indexProduct" wx:for-item="ProItem">code>

<view class="list">code>

<view class="product-item height{ {indexProduct}}">code>

<movable-area>

<movable-view out-of-bounds="true" direction="horizontal" x="{ {item.xmove}}" inertia="true" data-productIndex="{ {indexProduct}}" bindtouchstart="handleTouchStart" bindtouchend="handleTouchEnd" bindchange="handleMovableChange">code>

<view class="productItem_new ">code>

<view class="checkedIconBox">code>

<view class="cart-con-item-icon">code>

<icon wx:if="{ {ProItem.selected}}" type="success" color="#FFBD20" bindtap="selectList_yx" data-other="{ {idx}}" data-index="{ {indexProduct}}" data-cartid="{ {ProItem.cartId}}" />code>

<icon wx:else type="circle" bindtap="selectList_yx" data-other="{ {idx}}" data-index="{ {indexProduct}}" data-cartid="{ {ProItem.cartId}}" />code>

</view>

</view>

<view class="rightProductInfo">code>

<image src="{ {imgUrl}}/upload/20220608/ky.jpg" class="cart-productImg"></image>code>

<view class="productInfoBox">code>

<view class="cart-productName littleTwo">超级无敌好吃美味烤鸭</view>code>

<view class="cart-productSku little">500g</view>code>

<view class="cart-productPrice">code>

<text class="priceSymbol">¥</text>code>

<text class="cart-price">58.8</text>code>

<text class="cart-oldPrice">¥98</text>code>

</view>

</view>

<view class="cart-rightNumBox">code>

<view class="cart-con-item-num">code>

<text class="cart-con-item-num-left" catchtap="bindMinus" data-other="{ {idx}}" data-index="{ {indexProduct}}" data-cartid="{ {ProItem.cartId}}">-</text>code>

<input type="cart-con-item-num-mid" bindinput="bindIptCartNum" data-index='{ {indexProduct}}' value="1" disabled="{ {true}}" />code>

<text class="cart-con-item-num-right" data-other="{ {idx}}" data-index="{ {indexProduct}}" data-cartid="{ {ProItem.cartId}}" catchtap="bindPlus">+</text>code>

</view>

</view>

</view>

</view>

</movable-view>

</movable-area>

<view class="delete-btn" data-id="{ {item.id}}" bindtap="handleDeleteProduct" data-other="{ {idx}}" data-index="{ {indexProduct}}" data-cartid="{ {ProItem.cartId}}">删除</view>code>

</view>

</view>

</view>

</view>

</view>

<view class="cant-product">code>

<view class="cantTitle displayBox">因配送范围,库存原因等导致失效的商品</view>code>

<view class="productItem_new height{ {index}}" wx:for="{ {2}}">code>

<view class="cantProductLeft displayBox">code>

失效

</view>

<view class="rightProductInfo">code>

<view class="cart-productImg" style="background: url({ {imgUrl}}/upload/20220608/ky.jpg);background-size: 100% 100%;">code>

<image src="{ {imgUrl}}/upload/20220608/yyyy.png" class="cart-productImg" lazy-load="true"></image>code>

</view>

<view class="productInfoBox">code>

<view class="cart-productNameYY littleTwo">曾经好吃的烤鸭</view>code>

<view class="cart-productYyy little">抱歉,该商品已售罄或下架</view>code>

<view class="cart-productPrice">code>

<text class="priceSymbolYY">¥</text>code>

<text class="cart-priceYY">0</text>code>

</view>

</view>

<view class="cart-rightNumBox">code>

</view>

</view>

</view>

<view class="clearBox">code>

<view class="clear displayBox" bindtap="clearProduct">清空失效宝贝</view>code>

<view class="switchAddress displayBox" bindtap="switchAdd">切换地址</view>code>

</view>

</view>

<view class="maybeLike" wx:if="{ {recommendProduct.length>0}}">code>

<image src="{ {imgUrl}}/upload/20220608/2323-2.png" class="maybeLikePng"></image>code>

<view class="indexProductList">code>

<view class="productItemBottom" wx:for="{ {recommendProduct}}">code>

<view style="background: url({ {item.productPic}});background-size: 100% 100%;" class="productImgBottom"></view>code>

<view class="bottom-productName little">{ -- -->{item.productName}}</view>code>

<view class="iconBox little">code>

{ -- -->{item.remark}}

</view>

<view class="buyBox-bottom">code>

<view class="leftPrice-bottom">code>

<text class="priceFh">¥</text>code>

<text class="bottom-price">{ -- -->{item.price}}</text>code>

<text class="bottom-oldPrice">¥{ -- -->{item.proSalePrice}}</text>code>

</view>

<view class="rightAdd-bottom" catchtap="btnAddCart" data-index="{ {index}}" data-goodsid="{ {item.productId}}">code>

<image class="rightAdd-bottom" src="{ {imgUrl}}/Areas/dfapi/Content/images/addcart.png" lazy-load="true">code>

</image>

</view>

</view>

</view>

</view>

</view>

<view class="seeDetailPriceBox" wx:if="{ {isShowDetailPrice}}" catchtap="btnHideDetail">code>

<view class="shareb2">code>

<view class="shareb2-con">code>

<viwe class="detailTitle displayBox">优惠明细</viwe>code>

<view class="orderAllPrice">code>

<view class="leftTitle">code>

<text>商品总额</text>

</view>

<view class="rightTitle">code>

<text>¥{ -- -->{totalPrice}}</text>

</view>

</view>

<view class="orderAllPrice">code>

<view class="leftTitle">code>

<text>运费</text>

</view>

<view class="rightTitle">code>

<text>+¥{ -- -->{freight}}</text>

</view>

</view>

<view class="orderAllPrice">code>

<view class="leftTitle">code>

<text>优惠券</text>

</view>

<view class="rightTitle">code>

<text style="color:#FF4C0E;">-¥{ -- -->{couponAmount}}</text>code>

</view>

</view>

<view class="orderAllPrice">code>

<view class="leftTitle">code>

<text>折扣</text>

</view>

<view class="rightTitle">code>

<text style="color:#FF4C0E;">-¥{ -- -->{discountMoney}}</text>code>

</view>

</view>

<view class="orderAllPriceFinal">code>

<view class="leftTitle">code>

<text>合计</text>

</view>

<view class="rightTitle">code>

<text>¥{ -- -->{amountPayable}}</text>

</view>

</view>

</view>

</view>

</view>

<view class="cart-foter">code>

<view class="allChecked">code>

<image wx:if="{ {!isCheckAll}}" src="{ {imgUrl}}/upload/20220608/uncheck.png" bindtap="selectAll" lazy-load="true" class="checkImg"></image>code>

<image wx:else src="{ {imgUrl}}/upload/20220608/checked.png" lazy-load="true" bindtap="selectAll" class="checkImg"></image>code>

<view class="allCheckText">全选</view>code>

</view>

<view class="middlePrice">code>

<view class="priceBox">code>

<text class="hjTitle">合计:</text>code>

<text class="symbol">¥</text>code>

<text class="priceAll">¥198</text>code>

</view>

<view class="coupon">code>

<text>优惠:</text>

<text>¥</text>

<text>{ -- -->{finalCou}}</text>

<text class="seeDetail">查看明细</text>code>

<image wx:if="{ {isShowDetailPrice}}" src="{ {imgUrl}}/upload/20220608/orangeOn.png" lazy-load="true" class="orangeJt" bindtap="seeDetailPrice"></image>code>

<image wx:else src="{ {imgUrl}}/upload/20220608/orangeBo.png" lazy-load="true" class="orangeJt" bindtap="seeDetailPrice"></image>code>

</view>

</view>

<view class="right-btnJs">code>

<view class="addOrder displayBox" bindtap="goBuy">结算</view>code>

</view>

</view>

<view class="bottomHeightBox"></view>code>

<!--pages/myCenter/index.wxml-->

<!-- 头部背景 收益容器 -->

<view class="center-Top">code>

<view class="center-TopBack">code>

<view class="userInfo-box">code>

<view class="leftInfo">code>

<view class="cnter-user">code>

<image src="{ {imgUrl}}/upload/20220608/noUser.png" class="cnter-user" lazy-load="true">code>

</image>

</view>

<view class="userNameBox">code>

<view class="uNameText">code>

<!-- <open-data type="userNickName"></open-data> -->code>

<!-- <view wx:else bindtap="login">注册/登录</view> -->code>

<view >

<text>摔跤猫子</text>

<!-- <button class="kefu-btn" type="primary" open-type="getUserInfo" bindgetuserinfo="getUserInfo"code>

style="width:100%"></button> -->code>

<button class="kefu-btn" style="width:100%"></button>code>

</view>

</view>

<view class="shop">code>

<text>用户</text>

</view>

</view>

</view>

</view>

<!-- 我的订单入口 -->

<view class="myOrder-menu">code>

<view class="order-title">code>

<view class="leftTitle">我的订单</view>code>

<view class="rightSeeMore" bindtap="goToOrder" data-id="0">code>

<image src="{ {imgUrl}}/upload/20220608/black-jt.png" lazy-load="true"></image>code>

<text style="float:right;padding-right:10rpx;">查看更多</text>code>

</view>

</view>

<view class="orderMenu-img">code>

<view class="ordermenu-detail" bindtap="goToOrder" data-id="1">code>

<image src="{ {imgUrl}}/upload/20220608/dfk.png" lazy-load="true"></image>code>

<view class="num-mark" wx:if="{ {toBePaid>0}}">{ -- -->{toBePaid}}</view>code>

<view class="order-text-staus">待付款</view>code>

</view>

<view class="ordermenu-detail" bindtap="goToOrder" data-id="2">code>

<image src="{ {imgUrl}}/upload/20220608/dfh.png" lazy-load="true"></image>code>

<view class="num-mark" wx:if="{ {toBeDelivered>0}}">{ -- -->{toBeDelivered}}</view>code>

<view class="order-text-staus">待发货</view>code>

</view>

<view class="ordermenu-detail" bindtap="goToOrder" data-id="3">code>

<image src="{ {imgUrl}}/upload/20220608/dsh.png" lazy-load="true"></image>code>

<view class="num-mark" wx:if="{ {toBeReceived>0}}">{ -- -->{toBeReceived}}</view>code>

<view class="order-text-staus">待收货</view>code>

</view>

<view class="ordermenu-detail" bindtap="goReplyList">code>

<image src="{ {imgUrl}}/upload/20220608/dpj.png" lazy-load="true"></image>code>

<view class="num-mark" wx:if="{ {toBeReply>0}}">{ -- -->{toBeReply}}</view>code>

<view class="order-text-staus">评价</view>code>

</view>

<view class="ordermenu-detail" bindtap="afterSale">code>

<image src="{ {imgUrl}}/upload/20220608/dtk.png" lazy-load="true"></image>code>

<view class="num-mark" wx:if="{ {cancel>0}}">{ -- -->{cancel}}</view>code>

<view class="order-text-staus">售后/退款</view>code>

</view>

</view>

</view>

</view>

</view>

<!-- 常用工具入口 -->

<view class="tool-box">code>

<view class="often-tool-title">常用工具</view>code>

<view class="tool-menu-one" >code>

<view class="tool-menu-detail" bindtap="GotomyEarnings">code>

<view style="background: url({ {imgUrl}}/upload/20220608/profit.png);background-size: 100% 100%;"code>

class="toolImgBack"></view>code>

<view class="tool-title">我的收益</view>code>

</view>

<view class="tool-menu-detail" bindtap="GotoMyTeam">code>

<view style="background: url({ {imgUrl}}/upload/20220608/myteam.png);background-size: 100% 100%;"code>

class="toolImgBack"></view>code>

<view class="tool-title">我的团队</view>code>

</view>

<view class="tool-menu-detail" bindtap="goCouponList">code>

<view style="background: url({ {imgUrl}}/upload/20220608/myCou.png);background-size: 100% 100%;"code>

class="toolImgBack"></view>code>

<view class="tool-title">我的优惠券</view>code>

</view>

<view class="tool-menu-detail" bindtap="goAddressList">code>

<view style="background: url({ {imgUrl}}/upload/20220608/myAdd.png);background-size: 100% 100%;"code>

class="toolImgBack"></view>code>

<view class="tool-title">收货地址</view>code>

</view>

</view>

<view class="tool-menu-two">code>

<view class="tool-menu-detail" style="position: relative;">code>

<view style="background: url({ {imgUrl}}/upload/20220608/customService.png);background-size: 100% 100%;"code>

class="toolImgBack"></view>code>

<view class="tool-title">联系客服</view>code>

<button class="kefu-btn" open-type="contact" style="width:100%"></button>code>

</view>

<view class="tool-menu-detail" bindtap="setUp">code>

<view style="background: url({ {imgUrl}}/upload/20220608/set.png);background-size: 100% 100%;"code>

class="toolImgBack"></view>code>

<view class="tool-title">设置</view>code>

</view>

</view>

</view>



声明

本文内容仅代表作者观点,或转载于其他网站,本站不以此文作为商业用途
如有涉及侵权,请联系本站进行删除
转载本站原创文章,请注明来源及作者。