From e3ea0e28f408948923bea035a4c0de57dd8823b9 Mon Sep 17 00:00:00 2001
From: liudan <18634735655@163.com>
Date: Wed, 12 Apr 2023 01:11:11 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
App.vue | 14 ++
env.js | 2 +-
pages.json | 67 +++++----
pages/home/home.vue | 2 +-
pages/index/cart.vue | 14 +-
pages/index/category.vue | 15 +-
pages/index/category/three-catgory.vue | 194 +++++++++++++++++++++++--
pages/index/user.vue | 2 +-
pages/index/user/userinfo-card.vue | 74 ++++++----
uview-ui/theme.scss | 4 +-
10 files changed, 303 insertions(+), 85 deletions(-)
diff --git a/App.vue b/App.vue
index 8af619b..268d426 100644
--- a/App.vue
+++ b/App.vue
@@ -4,6 +4,11 @@
init
} from "@/shopro";
export default {
+ data(){
+ return{
+
+ }
+ },
onLaunch(options) {
init(options);
}
@@ -12,4 +17,13 @@
diff --git a/env.js b/env.js
index 4da5efd..bca6c9d 100644
--- a/env.js
+++ b/env.js
@@ -3,7 +3,7 @@
*/
// 接口根域名 https://demo.shopro.top
-export const BASE_URL = 'https://demo.shopro.top'
+export const BASE_URL = 'https://fx.njrenzhou.cn'
// 接口路径
export const API_URL = `${BASE_URL}/addons/shopro/`
diff --git a/pages.json b/pages.json
index 7ed6361..83e09d9 100644
--- a/pages.json
+++ b/pages.json
@@ -27,41 +27,24 @@
// }
// },
{
- "path": "pages/home/home",
- "aliasPath": "/", //对于h5端你必须在首页加上aliasPath并设置为/
+ "path": "pages/index/user",
"style": {
- "navigationBarTitleText": "首页",
- "navigationBarTextStyle": "light",
- "enablePullDownRefresh": false,
+ "navigationBarTitleText": "我的",
"navigationStyle": "custom",
- "mp-alipay": {
- "transparentTitle": "always",
- "titlePenetrate": "YES",
- "allowsBounceVertical": "NO"
- }
- },
- "meta": {
- "auth": false, //需要登录
- "async": true, //是否同步
- "title": "首页", //标题
- "group": "商城" //分组
- }
- },
- {
- "path": "pages/index/category",
- "style": {
- "navigationBarTitleText": "分类"
+ "navigationBarTextStyle": "white",
+ "enablePullDownRefresh": true
},
"meta": {
"auth": false,
"async": true,
- "title": "分类",
+ "title": "我的",
"group": "商城"
}
},
{
"path": "pages/index/cart",
"style": {
+ "navigationStyle": "custom",
"navigationBarTitleText": "购物车"
},
"meta": {
@@ -72,20 +55,42 @@
}
},
{
- "path": "pages/index/user",
+ "path": "pages/index/category",
"style": {
- "navigationBarTitleText": "我的",
"navigationStyle": "custom",
- "navigationBarTextStyle": "white",
- "enablePullDownRefresh": true
+ "navigationBarTitleText": "分类"
},
"meta": {
"auth": false,
"async": true,
- "title": "我的",
+ "title": "分类",
"group": "商城"
}
},
+ {
+ "path": "pages/home/home",
+ "aliasPath": "/", //对于h5端你必须在首页加上aliasPath并设置为/
+ "style": {
+ "navigationBarTitleText": "首页",
+ "navigationBarTextStyle": "light",
+ "enablePullDownRefresh": false,
+ "navigationStyle": "custom",
+ "mp-alipay": {
+ "transparentTitle": "always",
+ "titlePenetrate": "YES",
+ "allowsBounceVertical": "NO"
+ }
+ },
+ "meta": {
+ "auth": false, //需要登录
+ "async": true, //是否同步
+ "title": "首页", //标题
+ "group": "商城" //分组
+ }
+ },
+
+
+
{
"path": "pages/index/view",
"name": "view",
@@ -912,9 +917,9 @@
"backgroundColor": "#FFFFFF"
},
"tabBar": {
- "color": "#333",
- "selectedColor": "#a8700d",
- "backgroundColor": "#ffffff",
+ "color": "#65676B",
+ "selectedColor": "#F0D2A0",
+ "backgroundColor": "#0F1014",
"borderStyle": "black",
"list": [
// {
diff --git a/pages/home/home.vue b/pages/home/home.vue
index 6deebe2..30b490a 100644
--- a/pages/home/home.vue
+++ b/pages/home/home.vue
@@ -1,6 +1,6 @@
- 首页
+ 首页
diff --git a/pages/index/cart.vue b/pages/index/cart.vue
index fed6e4e..98415a5 100644
--- a/pages/index/cart.vue
+++ b/pages/index/cart.vue
@@ -1,6 +1,7 @@
+ 首页
@@ -13,7 +14,7 @@
-
+
@@ -80,7 +81,9 @@
data() {
return {
maxStep: 999,
- isTool: false
+ isTool: false,
+ navBarTop:0,
+ navBarHeight:0
};
},
computed: {
@@ -89,6 +92,13 @@
return !this.cartList.length;
}
},
+ onLoad() {
+ let statuBar = uni.getSystemInfoSync().statusBarHeight;
+ let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
+
+ this.navBarTop = menuButtonInfo.top;
+ this.navBarHeight = menuButtonInfo.height;
+ },
onShow() {
this.isLogin && this.getCartList();
},
diff --git a/pages/index/category.vue b/pages/index/category.vue
index 019790d..dbcb7ad 100644
--- a/pages/index/category.vue
+++ b/pages/index/category.vue
@@ -1,6 +1,7 @@
+ 分类
@@ -11,7 +12,7 @@
-
+
@@ -31,15 +32,23 @@ export default {
data() {
return {
categoryType: 0, //1:快速购买,2:一级分类，3:二级分类，4:三级分类
- categoryStyleId: 0 //分类Id
+ categoryStyleId: 0, //分类Id
+ navBarTop:0,
+ navBarHeight:0
};
},
computed: {
...mapGetters(['authType'])
},
onLoad() {
- this.getCategory();
+ let statuBar = uni.getSystemInfoSync().statusBarHeight;
+ let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
+
+ this.navBarTop = menuButtonInfo.top;
+ this.navBarHeight = menuButtonInfo.height;
+ this.getCategory();
},
+
methods: {
/**
* 获取分类数据
diff --git a/pages/index/category/three-catgory.vue b/pages/index/category/three-catgory.vue
index e3bad78..0543d12 100644
--- a/pages/index/category/three-catgory.vue
+++ b/pages/index/category/three-catgory.vue
@@ -1,18 +1,21 @@
-
+
-
-
+
+
{{ item.name }}
-
+
+
+ {{item.name}}
+
-
+
+
+ -->
+
+
+
+
+
+
+
+
+ {{item.title}}
+
+
+
+ 已售{{item.num}}套
+
+
+
+ ￥{{item.mainprice}}
+ ￥{{item.subprice}}
+
+ 去抢购
+
+
+
@@ -52,7 +82,40 @@ export default {
data() {
return {
listId: 0,
- categoryData: {}
+ categoryData: {},
+ navBarTop:0,
+ navBarHeight:0,
+ shopList:[
+ {
+ img:'/static/images/shopdesc.png',
+ title:'SK-II 熬夜肌肤“重启”秘籍 熬夜肌SK-II 熬夜肌肤“重启”秘籍 熬夜肌',
+ num:288,
+ mainprice:389.00,
+ subprice:999.00
+ },
+ {
+ img:'/static/images/shopdesc.png',
+ title:'SK-II 熬夜肌肤“重启”秘籍 熬夜肌SK-II 熬夜肌肤“重启”秘籍 熬夜肌',
+ num:288,
+ mainprice:389.00,
+ subprice:999.00
+ },
+ {
+ img:'/static/images/shopdesc.png',
+ title:'SK-II 熬夜肌肤“重启”秘籍 熬夜肌SK-II 熬夜肌肤“重启”秘籍 熬夜肌',
+ num:288,
+ mainprice:389.00,
+ subprice:999.00
+ },
+ {
+ img:'/static/images/shopdesc.png',
+ title:'SK-II 熬夜肌肤“重启”秘籍 熬夜肌SK-II 熬夜肌肤“重启”秘籍 熬夜肌',
+ num:288,
+ mainprice:389.00,
+ subprice:999.00
+ }
+ ],
+ item:{}
};
},
computed: {},
@@ -63,9 +126,15 @@ export default {
}
},
async created() {
+ let statuBar = uni.getSystemInfoSync().statusBarHeight;
+ let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
+
+ this.navBarTop = menuButtonInfo.top;
+ this.navBarHeight = menuButtonInfo.height;
console.log('%c当前分类：三级分类', 'color:green;background:yellow');
await this.getCategory();
},
+
methods: {
getCategory() {
this.$http('category.detail', {
@@ -73,10 +142,12 @@ export default {
}).then(res => {
if (res.code === 1) {
this.categoryData = res.data.children;
+ this.item = this.categoryData[0]
}
});
},
- onType(id) {
+ onType(id,item) {
+ this.item=item
this.listId = id;
},
// 路由跳转
@@ -100,7 +171,8 @@ export default {
display: flex;
flex-direction: column;
overflow: hidden;
- height: 100%;
+ height: calc(100% - 88upx);
+
}
.wrapper-box {
@@ -112,18 +184,18 @@ export default {
.scroll-box {
height: 100%;
flex: 1;
- background: #fff;
+ background: #21222B;
}
.left {
width: 200upx;
height: 100%;
flex: 1;
-
+ background: #1A1A22;
.list-active {
- background: #fff;
- color: #333333 !important;
- font-weight: bold !important;
+ background: #21222B;
+ color: #FFFFFF !important;
+ // font-weight: bold !important;
}
.line-active {
@@ -134,11 +206,12 @@ export default {
height: 84upx;
position: relative;
width: 200rpx;
- padding-left: 16rpx;
+ padding-left: 25rpx;
line-height: 84rpx;
font-size: 28upx;
font-weight: 400;
- color: rgba(102, 102, 102, 1);
+ color:#808292;
+ // color: rgba(102, 102, 102, 1);
.line {
width: 10upx;
@@ -206,4 +279,93 @@ export default {
}
}
}
+.subtitle{
+ font-size: 30upx;
+ font-family: Alibaba PuHuiTi;
+ font-weight: 400;
+ color: #FFFFFF;
+ margin:20upx;
+}
+.shopList{
+ padding-bottom: 35rpx;
+
+ .shopItem{
+ // height: 650px;
+ margin:0 22upx;
+ margin-bottom: 24upx;
+ background: #FFFFFF;
+ box-shadow: 0upx 6upx 16upx 0upx rgba(25,25,25,0.05);
+ border-radius: 20upx;
+ overflow: hidden;
+ .shopImg{
+ width:100%;
+ background: #D3D3D3;
+ box-shadow: 0upx 6upx 16upx 0upx rgba(25,25,25,0.05);
+ border-radius: 20upx 20upx 0upx 0upx;
+ image{
+ height:auto;
+
+ width:100%;
+ }
+ }
+ .infoBox{
+ margin-top: 20upx;
+ .shopTitle{
+ display: flex;
+ align-items: center;
+
+ image{
+ width:180upx;
+ height:auto
+ }
+ text{
+ font-size: 34upx;
+ color: #333333;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
+ margin-left: 22upx;
+ }
+ }
+ .progress{
+ display: flex;
+ align-items: center;
+ padding:0 20upx;
+ margin: 25upx 0;
+ text{
+ margin-left: 24upx;
+ font-size: 24upx;
+ color: #333333;
+ }
+ }
+ .price{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding:0 30upx;
+ margin-bottom: 30upx;
+ .mainPrice{
+ font-size: 34upx;
+ color: #111111;
+ font-weight: bold;
+ }
+ .subPrice{
+ font-size: 24upx;
+ text-decoration: line-through;
+ color: #C4BFBC;
+ margin-left:20upx;
+ }
+ .btn{
+ padding:20upx 45upx;
+ background: #111111;
+ border: 1px solid #EAEAEA;
+ border-radius: 33px;
+ font-size: 30upx;
+ color: #FFFFFF;
+ }
+ }
+ }
+ }
+
+ }
diff --git a/pages/index/user.vue b/pages/index/user.vue
index e18f843..164cfba 100644
--- a/pages/index/user.vue
+++ b/pages/index/user.vue
@@ -4,7 +4,7 @@
-
+
-
+
-
+ }" :background="navBackground"> -->
+ 个人中心
-
+
@@ -49,9 +49,9 @@
-
-
+
+
点击绑定手机号，确保账户安全
@@ -89,10 +89,18 @@ export default {
isFixed: false,
navBackground: {
background: 'none'
- }
+ },
+ navBarTop:0,
+ navBarHeight:0
};
},
- mounted() { },
+ mounted() {
+ let statuBar = uni.getSystemInfoSync().statusBarHeight;
+ let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
+
+ this.navBarTop = menuButtonInfo.top;
+ this.navBarHeight = menuButtonInfo.height;
+ },
props: {
detail: {},
scrollTop: {
@@ -213,7 +221,7 @@ export default {
.sh-userinfo-box {
position: relative;
- height: calc(var(--status-bar-height) + 300rpx);
+ height: calc(var(--status-bar-height) + 250rpx);
.head-wrap {
powidth: 100%;
@@ -237,7 +245,7 @@ export default {
.info-box {
padding-left: 30rpx;
-
+ margin-top: 50upx;
.head-img-wrap {
position: relative;
@@ -315,28 +323,36 @@ export default {
// 绑定微信公众号
.notice-box {
- width: 750rpx;
- height: 70rpx;
- background: rgba(253, 239, 216, 1);
- padding: 0 35rpx;
-
+ // width: 750rpx;
+ // height: 70rpx;
+ background: #FFFFFF;
+ border-radius: 20upx;
+
+ padding: 15upx 25rpx;
+ margin:0 25upx;
+ margin-bottom:20upx;
.notice-detail {
- font-size: 24rpx;
-
- font-weight: 400;
- color: rgba(204, 149, 59, 1);
+
+ font-size: 28upx;
+ font-family: PingFang SC;
+ font-weight: 500;
+ color: #21222B;
}
.bindPhone {
- width: 135rpx;
- line-height: 52rpx;
- background: linear-gradient(90deg, rgba(233, 180, 97, 1), rgba(238, 204, 137, 1));
- border-radius: 26rpx;
- padding: 0;
- font-size: 26rpx;
-
+ width: 160upx;
+ height: 60upx;
+ background: #F0D2A0;
+ border-radius: 30upx;
+
+ font-size: 24upx;
+ font-family: PingFang SC;
font-weight: 500;
- color: rgba(255, 255, 255, 1);
+ color: #111111;
+ line-height: 60upx;
+ text-align: center;
+
+
}
}
diff --git a/uview-ui/theme.scss b/uview-ui/theme.scss
index f3bb36d..1f28ba0 100644
--- a/uview-ui/theme.scss
+++ b/uview-ui/theme.scss
@@ -7,7 +7,9 @@ $u-content-color: #606266;
$u-tips-color: #909399;
$u-light-color: #c0c4cc;
$u-border-color: #e4e7ed;
-$u-bg-color: #f3f4f6;
+// $u-bg-color: #f3f4f6;
+$u-bg-color: #21222B;
+
$u-type-primary: #2979ff;
$u-type-primary-light: #ecf5ff;