当前位置 : 主页 > 网络编程 > 其它编程 >

【愚公系列】2022年11月uniapp专题优购电商个人中心页面

来源:互联网 收集:自由互联 发布时间:2023-07-02
文章目录前言一、个人中心页面前言个人中心的信息复杂度与产品本身有关。体系越庞大的产品对应个人中心页面需要承载的内容越多结构势必复杂。一般平台型电 文章目录 前言 一、
文章目录前言一、个人中心页面前言个人中心的信息复杂度与产品本身有关。体系越庞大的产品对应个人中心页面需要承载的内容越多结构势必复杂。一般平台型电

文章目录

  • 前言
  • 一、个人中心页面

前言

个人中心的信息复杂度与产品本身有关。体系越庞大的产品对应个人中心页面需要承载的内容越多结构势必复杂。

一般平台型电商的个人中心页面必须涵盖用户基础信息、全局性操作设置、关键数据记录、购买激励会员、红包、核心业务订单信息、工具集合工具箱等。

一、个人中心页面

page,.my-container {height: 100%;}

一键登录登录后尽享更多权益.login-container {height: 750rpx;background-color: #F8F8F8;display: flex;flex-direction: column;justify-content: center;align-items: center;position: relative;overflow: hidden; ;display: block;width: 100%;height: 40px;background-color: white;position: absolute;bottom: 0;left: 0;border-radius: 100%;transform: translateY(50%);}.btn-login {width: 90%;border-radius: 100px;margin: 15px 0;background-color: #C00000;}.tips-text {font-size: 12px;color: gray;}}

{{userinfo.nickName}}8收藏的店铺14收藏的商品18关注的商品84足迹我的订单待付款待收货退款/退货全部订单收货地址联系客服退出登录.my-userinfo-container {height: 100%;background-color: #F4F4F4;.top-box {height: 400rpx;background-color: #C00000;display: flex;justify-content: center;align-items: center;flex-direction: column;.avatar {width: 90px;height: 90px;border-radius: 45px;border: 2px solid #FFF;box-shadow: 0 1px 5px black;}.nickname {font-size: 16px;color: #FFF;font-weight: bold;margin-top: 10px;}}}.panel-list {padding: 0 10px;position: relative;top: -10px;.panel {background-color: white;border-radius: 3px;margin-bottom: 8px;.panel-title {line-height: 45px;padding-left: 10px;font-size: 15px;border-bottom: 1px solid #F4F4F4;}.panel-body {display: flex;justify-content: space-around;.panel-item {display: flex;flex-direction: column;align-items: center;justify-content: space-around;padding: 10px 0;font-size: 13px;.icon {width: 35px;height: 35px;}}}}}.panel-list-item {display: flex;justify-content: space-between;align-items: center;font-size: 15px;padding: 0 10px;line-height: 45px;}

在这里插入图片描述

上一篇:[Database]MongoDB(2)高级查询条件操作符
下一篇:没有了
网友评论