Skip to content

7
7-Eleven
Commit c90280fb by 谢中龙
Options

add new pages

parent 48b5d7a1
Showing with 484 additions and 42 deletions
src/project.config.json
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
"list": [] "list": []
}, },
"miniprogram": { "miniprogram": {
"current": 58, "current": 55,
"list": [ "list": [
{ {
"id": -1, "id": -1,
...@@ -406,7 +406,7 @@ ...@@ -406,7 +406,7 @@
"query": "" "query": ""
}, },
{ {
"id": -1, "id": 55,
"name": "会员详情", "name": "会员详情",
"pathName": "shoppingGuid/page/pages/userInfo/userInfo", "pathName": "shoppingGuid/page/pages/userInfo/userInfo",
"query": "" "query": ""
......
src/shoppingGuid/page/pages/enlistInfo/enlistInfo.wxml
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
<view class='list'> <view class='list'>
<view class='item'> <view class='item'>
<view class='u-info'> <view class='u-info'>
<image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/default_logo_icon.png' mode='aspectFit'></image> <image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/biaka_default_u_logo.png' mode='aspectFit'></image>
<text>139xxxx2453</text> <text>139xxxx2453</text>
</view> </view>
<view class='item-btn'>立即回访</view> <view class='item-btn'>立即回访</view>
...@@ -55,7 +55,7 @@ ...@@ -55,7 +55,7 @@
<view class='item'> <view class='item'>
<view class='u-info'> <view class='u-info'>
<image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/default_logo_icon.png' mode='aspectFit'></image> <image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/biaka_default_u_logo.png' mode='aspectFit'></image>
<text>139xxxx2453</text> <text>139xxxx2453</text>
</view> </view>
<view class='item-btn'>立即回访</view> <view class='item-btn'>立即回访</view>
...@@ -63,7 +63,7 @@ ...@@ -63,7 +63,7 @@
<view class='item'> <view class='item'>
<view class='u-info'> <view class='u-info'>
<image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/default_logo_icon.png' mode='aspectFit'></image> <image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/biaka_default_u_logo.png' mode='aspectFit'></image>
<text>139xxxx2453</text> <text>139xxxx2453</text>
</view> </view>
<view class='item-btn'>立即回访</view> <view class='item-btn'>立即回访</view>
......
src/shoppingGuid/page/pages/selectUsers/selectUsers.js
// shoppingGuid/page/pages/selectUsers/selectUsers.js // shoppingGuid/page/pages/selectUsers/selectUsers.js
Page({ const wxService = require('../../../../utils/wxService')
wxService.page({
/** /**
* 页面的初始数据 * 页面的初始数据
*/ */
data: { data: {
isOpen : false,
}, },
/** /**
...@@ -15,12 +16,6 @@ Page({ ...@@ -15,12 +16,6 @@ Page({
}, },
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/** /**
* 生命周期函数--监听页面显示 * 生命周期函数--监听页面显示
...@@ -36,11 +31,18 @@ Page({ ...@@ -36,11 +31,18 @@ Page({
}, },
/** //点击事件
* 生命周期函数--监听页面卸载 onTapExpandOrInpand(e){
*/ this.setData({
onUnload: function () { isOpen: !this.data.isOpen
})
},
//跳转到标签下用户列表
onTapToTagUserList(e){
let id = 11;
wx.navigateTo({
url: '/shoppingGuid/page/pages/userList/userList?id=' + id,
});
}, },
/** /**
......
src/shoppingGuid/page/pages/selectUsers/selectUsers.wxml
<!--shoppingGuid/page/pages/selectUsers/selectUsers.wxml--> <!--shoppingGuid/page/pages/selectUsers/selectUsers.wxml-->
<text>shoppingGuid/page/pages/selectUsers/selectUsers.wxml</text> <view class='top-tags'>
<view class='search-box'>
<view class='search'>
<image src='/assets/imgs/shoppingGuide/search.png' mode='aspectFit'></image>
<input maxlength='20' placeholder='请输入标签名称搜索'></input>
</view>
</view>
<!-- tags -->
<view class='tags-types'>
<view class='tag-items active'>自动标签</view>
<view class='tag-items'>手动标签</view>
<view class='tag-items'>临时标签</view>
</view>
<!-- 标签s -->
<view class='tags'>
<view class='flex'>
<view class='lf'>
<view class='tag-item active'>消费行为</view>
<view class='tag-item'>访问行为</view>
<view class='tag-item'>核销行为</view>
</view>
<view class='rg' bindtap='onTapExpandOrInpand'>展开></view>
</view>
</view>
</view>
<!-- -->
<!-- 浮层 -->
<view class='tag-hover {{isOpen ? "show" : ""}}'>
<view class='hover-items avtive'>最近7天生日会员</view>
<view class='hover-items'>常联系</view>
<view class='hover-items'>新会员</view>
<view class='hover-items'>高价值</view>
<view class='hover-items'>会员更中意别家</view>
</view>
<!-- 具体的数据 -->
<view class='list'>
<view class='list-item' bindtap='onTapToTagUserList'>
<view class='lf-icon'>
<image src='/assets/imgs/shoppingGuide/icon_tag.png' mode='aspectFit'></image>
</view>
<view class='rg-info'>
<view class='info-top'>
<label>新会员</label>
<view>
<text>7</text>人
</view>
</view>
<view class='info-desc'>
<label>注册未消费会员</label>
</view>
</view>
</view>
<view class='list-item' bindtap='onTapToTagUserList'>
<view class='lf-icon'>
<image src='/assets/imgs/shoppingGuide/icon_tag.png' mode='aspectFit'></image>
</view>
<view class='rg-info'>
<view class='info-top'>
<label>新会员</label>
<view>
<text>7</text>人
</view>
</view>
<view class='info-desc'>
<label>注册未消费会员</label>
</view>
</view>
</view>
<view class='list-item' bindtap='onTapToTagUserList'>
<view class='lf-icon'>
<image src='/assets/imgs/shoppingGuide/icon_tag.png' mode='aspectFit'></image>
</view>
<view class='rg-info'>
<view class='info-top'>
<label>新会员</label>
<view>
<text>7</text>人
</view>
</view>
<view class='info-desc'>
<label>注册未消费会员</label>
</view>
</view>
</view>
</view>
src/shoppingGuid/page/pages/selectUsers/selectUsers.wxss
/* shoppingGuid/page/pages/selectUsers/selectUsers.wxss */ /* shoppingGuid/page/pages/selectUsers/selectUsers.wxss */
page{
background: #f2f2f2;
padding-top: 300rpx;
box-sizing: border-box;
-webkit-box-sizing: border-box;
font-size: 28rpx;
color: #333333;
}
/* *,*::after,*::before{
box-sizing: border-box;
} */
view{
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.top-tags{
position: fixed;
width: 100%;
height: auto;
z-index: 2;
top: 0;
left: 0;
background: #ffffff;
}
.top-tags .search-box{
width: 100%;
height: auto;
padding: 20rpx 30rpx;
}
.top-tags .search-box .search{
width: 100%;
height: 70rpx;
display: flex;
padding: 0 20rpx;
align-items: center;
border-radius: 35rpx;
background-color: rgba(255, 255, 255, 1);
box-shadow: 0px 0px 16px 0px rgba(0, 145, 255, 0.16), 0px 0px 6px 0px rgba(0, 145, 255, 0.26);
}
.top-tags .search-box .search image{
width: 50rpx;
height: 50rpx;
}
.top-tags .search-box .search input{
flex: 1;
padding-left: 8rpx;
}
/* 标签分组 */
.tags-types{
width: 100%;
padding: 20px 30rpx;
display: flex;
align-items: center;
justify-content: center;
}
.tags-types .tag-items{
padding: 0 20rpx;
border-right: solid 4rpx #ddd;
}
.tags-types .tag-items:last-child{
border-right: none;
}
.tags-types .tag-items.active{
color: #0091FF;
}
/* 标签s */
.tags{
width: 100%;
height: 80rpx;
box-shadow: 0 0 10rpx 4rpx rgba(0, 0, 0, 0.1);
position: relative;
}
.tags .flex{
display: flex;
width: 100%;
height: 100%;
align-items: center;
}
.tags .flex .rg{
flex: 0;
min-width: 160rpx;
max-width: 160rpx;
height: 100%;
border-left: 6rpx solid rgba(0,0,0,0.1);
display: flex;
align-items: center;
justify-content: center;
}
.tags .flex .lf{
flex: 1;
padding: 0 20rpx;
display: flex;
align-items: center;
overflow-x: auto;
}
.tags .flex .lf .tag-item{
height: 40rpx;
font-size: 24rpx;
padding: 4rpx 20rpx;
background: #f2f2f2;
color: #333;
border-radius: 20rpx;
margin-right: 20rpx;
}
.tags .flex .lf .tag-item:last-child{
margin-right: 0;
}
.tags .flex .lf .tag-item.active{
color: #0091FF ;
background-color: rgba(0, 145, 255, 0.1);
}
.tag-hover{
position: fixed;
width: 100%;
max-height: 400rpx;
background: #ffffff;
top: 298rpx;
border-top: solid 2rpx #ddd;
border-bottom: solid 2rpx #ddd;
transition: all 0.3s;
transform: translateY(-100%);
z-index: 1;
left: 0;
padding: 30rpx;
display: flex;
flex-wrap: wrap;
overflow-y: auto;
box-shadow: 0 4rpx 10rpx 4rpx rgba(0,0,0,0.1);
}
.tag-hover.show{
transform: translateY(0);
}
.tag-hover .hover-items{
height: 40rpx;
font-size: 24rpx;
padding: 4rpx 20rpx;
background: #f2f2f2;
color: #333;
border-radius: 20rpx;
margin-right: 20rpx;
margin-bottom: 20rpx;
}
.tag-hover .hover-items.avtive{
color: #0091FF ;
background-color: rgba(0, 145, 255, 0.1);
}
/* list */
.list{
padding: 20rpx 30rpx;
}
.list .list-item{
width: 100%;
height: auto;
padding: 20rpx;
background: #ffffff;
display: flex;
align-items: center;
box-shadow: 0 0 10rpx 4rpx rgba(0,0,0,0.1);
margin-bottom: 20rpx;
}
.list .list-item:active{
background: #f2f2f2;
}
.list .list-item .lf-icon{
flex: 0;
min-width: 100rpx;
max-width: 100rpx;
height: auto;
display: flex;
align-items: center;
justify-content: center;
}
.list .list-item .lf-icon image{
width: 70rpx;
height: 70rpx;
}
.list .list-item .rg-info{
flex: 1;
padding-left: 20rpx;
}
.list .list-item .rg-info .info-top{
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 10rpx;
}
.list .list-item .rg-info .info-top label{
color: #333333;
}
.list .list-item .rg-info .info-top view text{
color: #0091FF;
font-weight: bold;
}
.list .list-item .rg-info .info-desc{
color: #999999;
font-size: 24rpx;
}
\ No newline at end of file
src/shoppingGuid/page/pages/userInfo/userInfo.js
// shoppingGuid/page/pages/userInfo/userInfo.js // shoppingGuid/page/pages/userInfo/userInfo.js
Page({ const wxService = require('../../../../utils/wxService')
wxService.page({
/** /**
* 页面的初始数据 * 页面的初始数据
...@@ -15,12 +16,6 @@ Page({ ...@@ -15,12 +16,6 @@ Page({
}, },
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/** /**
* 生命周期函数--监听页面显示 * 生命周期函数--监听页面显示
...@@ -29,18 +24,12 @@ Page({ ...@@ -29,18 +24,12 @@ Page({
}, },
/** //点击事件
* 生命周期函数--监听页面隐藏 onTapToMemberInfo(e){
*/ let id = 11;
onHide: function () { wx.navigateTo({
url: 'shoppingGuid/page/pages/userInfo/userInfo?id=' + id,
}, });
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
}, },
/** /**
......
src/shoppingGuid/page/pages/userList/userList.json
{ {
"navigationBarTitleText": "会员列表",
"usingComponents": {} "usingComponents": {}
} }
\ No newline at end of file
src/shoppingGuid/page/pages/userList/userList.wxml
<!--shoppingGuid/page/pages/userList/userList.wxml--> <!--shoppingGuid/page/pages/saleTaskInfo/saleTaskInfo.wxml-->
<text>shoppingGuid/page/pages/userList/userList.wxml</text> <view class='tag-name'>
<image src='/assets/imgs/shoppingGuide/kpi_task_name.png' mode='widthFix'></image>
<label>标签名称</label>
<view class='tag'>7天内新消费2次</view>
</view>
<!-- 列表 -->
<view class='list'>
<view class='item' bindtap='onTapToMemberInfo'>
<view class='u-info'>
<image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/biaka_default_u_logo.png' mode='aspectFit'></image>
<text>139xxxx2453</text>
</view>
<view class='item-btn'>立即回访</view>
</view>
<view class='item' bindtap='onTapToMemberInfo'>
<view class='u-info'>
<image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/biaka_default_u_logo.png' mode='aspectFit'></image>
<text>139xxxx2453</text>
</view>
<view class='item-btn'>立即回访</view>
</view>
<view class='item' bindtap='onTapToMemberInfo'>
<view class='u-info'>
<image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/biaka_default_u_logo.png' mode='aspectFit'></image>
<text>139xxxx2453</text>
</view>
<view class='item-btn'>立即回访</view>
</view>
</view>
src/shoppingGuid/page/pages/userList/userList.wxss
/* shoppingGuid/page/pages/userList/userList.wxss */ /* shoppingGuid/page/pages/enlistInfo/enlistInfo.wxss */
\ No newline at end of file /* shoppingGuid/page/pages/saleTaskInfo/saleTaskInfo.wxss */
page{
background: #f2f2f2;
box-sizing: border-box;
-webkit-box-sizing: border-box;
font-size: 28rpx;
color: #333333;
}
view{
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
/* tag-name */
.tag-name{
width: 100%;
height: 80rpx;
background: #ffffff;
display: flex;
align-items: center;
padding: 0 30rpx;
}
.tag-name image{
width: 20rpx;
margin-right: 10rpx;
}
.tag-name label{
font-weight: bold;
color: #333333;
margin-right: 30rpx;
}
.tag-name .tag{
height: 40rpx;
font-size: 24rpx;
padding: 4rpx 20rpx;
border-radius: 20rpx;
margin-right: 20rpx;
color: #0091FF ;
background-color: rgba(0, 145, 255, 0.1);
}
/* list */
.list{
padding: 20rpx 30rpx;
width: 100%;
height: auto;
}
.list .item{
background: #ffffff;
padding: 20rpx 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20rpx;
/* border: solid 2rpx #ddd; */
border-radius: 10rpx;
box-shadow: 0 0 10rpx 4rpx rgba(0,0,0,0.1);
}
.list .item .u-info{
flex: 1;
display: flex;
align-items: center;
}
.list .item .u-info image{
width: 80rpx;
height: 80rpx;
border-radius: 50%;
margin-right: 10rpx;
}
.list .item .item-btn{
flex: 0;
min-width: 160rpx;
max-width: 160rpx;
height: 46rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 24rpx;
color: #333;
border: solid 2rpx #ddd;
border-radius: 23rpx;
}
.list .item .item-btn:active{
color: #0091FF;
border: solid 2rpx #0091FF;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment