tab1,tab2.1

This commit is contained in:
2025-01-11 05:34:31 +08:00
parent d83c28db52
commit 2436775d39
28 changed files with 492 additions and 141 deletions

View File

@ -10,7 +10,8 @@
"pages/help/package/index",
"pages/help/success/index",
"pages/help/community/index",
"pages/help/address/index"
"pages/help/address/index/index",
"pages/help/address/edit/index"
],
"window": {
"navigationBarTextStyle": "black",

View File

@ -6,6 +6,10 @@ page{
color: #222222;
}
button{
border-radius: 24rpx;
box-sizing: border-box;
}
button label{
display: inline-block;
margin-left: 10rpx;
@ -38,18 +42,67 @@ button[type=default]{
button[type=primary][plain]{
border-color: #1A4DEB;
color:#1A4DEB;
padding:28rpx 25rpx;
}
button[type=primary][plain]:hover{
border-color: #1A4DEB;
color:#1A4DEB;
}
radio-group label,radio-group radio{
radio-group{
line-height: 34rpx;
}
radio-group radio{
display: inline-block;
vertical-align: middle;
overflow: hidden;
}
radio-group label{
margin-left:14rpx;
display: inline-block;
vertical-align: middle;
}
radio-group radio+label{
margin-left:10rpx;
}
radio-group label+label{
margin-left:20rpx;
}
radio{
width: 34rpx;
height: 34rpx;
position: relative;
}
radio .wx-radio-input{
border-radius: 50%;
border-color: #1A4DEB;
box-sizing: border-box;
width: 100%;
height: 100%;
line-height: 20px;
position: absolute;
top: 0;left:0;
}
radio .wx-radio-input.wx-radio-input-checked{
background-color:transparent;
border-color: #1A4DEB;
}
radio .wx-radio-input.wx-radio-input-checked::before{
content: '';
position: absolute;
width: 22rpx;
height:22rpx;
left:4rpx;top:4rpx;
border-radius: 50%;
background: #1A4DEB;
transform: none;
-webkit-transform:none
}
checkbox .wx-checkbox-input{
width: 40rpx;
height: 40rpx;
border-radius: 50%;
}
.page-container{
@ -57,4 +110,7 @@ radio-group label{
border-radius: 20rpx;
padding:30rpx;
margin:20rpx;
}
.page-container.shadow{
box-shadow: 0px 6px 6px 1px rgba(0, 0, 0, 0.05);
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
assets/imgs/for_test/jd.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB

View File

@ -0,0 +1,36 @@
// components/address/index.js
Component({
/**
* 组件的属性列表
*/
properties: {
saveText:{
type:String,
value:"保存"
},
deleteText:{
type:String,
value:''
}
},
/**
* 组件的初始数据
*/
data: {
building:['一栋','二栋','三栋','四栋','五栋'],
},
/**
* 组件的方法列表
*/
methods: {
save(){
this.triggerEvent('save')
},
del(){
this.triggerEvent('delete')
}
}
})

View File

@ -0,0 +1,5 @@
{
"component": true,
"usingComponents": {},
"styleIsolation": "shared"
}

View File

@ -0,0 +1,38 @@
<view class="page-container shadow editor">
<view class="item">
<label class="key">绑定小区</label>
<label class="value">朝阳时代西锦</label>
</view>
<view class="item">
<label class="key">用户姓名</label>
<input class="value" placeholder="请输入用户名"/>
<radio-group class="radio-group">
<label>
<radio class="radio" checked></radio>
<label>先生</label>
</label>
<label>
<radio class="radio"></radio>
<label>女士</label>
</label>
</radio-group>
</view>
<view class="item">
<label class="key">手机号码</label>
<input class="value" placeholder="请输入手机号码"/>
</view>
<picker range="{{building}}">
<view class="item">
<label class="key">选择楼栋</label>
<input class="value" placeholder="请选择" disabled/>
<image class="right-icon" src="/assets/icon/help/arrow-right@2x.png"/>
</view>
</picker>
<view class="item no-border">
<label class="key">详细地址</label>
<input class="value" placeholder="例1 单元1301"/>
</view>
<button type="primary" bind:tap="save">{{saveText}}</button>
<button wx:if="{{deleteText}}" type="primary" plain bind:tap="del">{{deleteText}}</button>
</view>

View File

@ -0,0 +1,42 @@
.page-container.editor{
padding-top:0;
font-size: 30rpx;
}
.editor .item{
display: flex;
align-items: center;
border-bottom: 1rpx solid rgba(153, 153, 153, 0.2);
min-height: 130rpx;
}
.editor .item.no-border{
border:none;
}
.editor .item .key{
}
.editor .item .key::before{
content: '*';
color: #EB0000;
}
.editor .item label.value{
line-height: 1.5;
height: auto;
align-self: center;
}
.editor .item .value{
flex:1;
margin-left: 30rpx;
height: 100%;
padding:15rpx 0;
box-sizing: border-box;
}
.editor .item .right-icon{
width:34rpx;height:34rpx;
}
.editor .radio-group{
font-size: 24rpx;
}
.editor button+button{
margin-top:30rpx;
}

View File

@ -1,5 +1,5 @@
<view class="nav-bar" style="padding-top:{{statusBarHeight}}px;">
<view class="nav-bar-content" style="height:{{navBarHeight}}px;">
<image class="logo" src="/assets/icon/navbar/lanfeng@2x.png"/>
<slot/>
</view>
</view>

View File

@ -6,8 +6,4 @@
display: flex;
align-items: center;
justify-content: center;
}
.nav-bar .logo{
width:168rpx;
height:42rpx;
}

View File

@ -0,0 +1,83 @@
// pages/help/address/edit/index.js
Page({
/**
* 页面的初始数据
*/
data: {
},
deleteAddress(){
console.log('delete');
wx.showModal({
title: '确定删除此地址吗',
content: '',
complete: (res) => {
if (res.cancel) {
}
if (res.confirm) {
}
}
})
},
saveAddress(){
console.log('save');
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})

View File

@ -0,0 +1,5 @@
{
"usingComponents": {
"address-editor":"/components/address"
}
}

View File

@ -0,0 +1 @@
<address-editor saveText="保存" deleteText="删除" bind:save="saveAddress" bind:delete="deleteAddress"/>

View File

@ -0,0 +1 @@
/* pages/help/address/edit/index.wxss */

View File

@ -1,3 +0,0 @@
{
"usingComponents": {}
}

View File

@ -1,87 +0,0 @@
<view class="page-container editor">
<!-- <view class="item">
<label class="key">绑定小区</label>
<label class="value">朝阳时代西锦</label>
</view>
<view class="item">
<label class="key">用户姓名</label>
<input class="value" placeholder="请输入用户名"/>
<radio-group class="radio-group">
<label>
<radio></radio>
<label>先生</label>
</label>
<label>
<radio></radio>
<label>女士</label>
</label>
</radio-group>
</view>
<view class="item">
<label class="key">手机号码</label>
<input class="value" placeholder="请输入手机号码"/>
</view> -->
<view class="weui-form">
<view class="weui-cells weui-cells_form">
<view class="weui-cell weui-cell_active ">
<view class="weui-cell__hd">
<label class="weui-label">金额</label>
</view>
<view class="weui-cell__bd weui-flex">
<input class="weui-input"/>
<view wx:if="{{true}}" aria-role="button" class="weui-btn_reset weui-btn_icon weui-btn_input-clear" bindtap="onClear">
<i class="weui-icon-clear"></i>
</view>
</view>
</view>
<view class="weui-cell weui-cell_active ">
<view class="weui-cell__hd">
<label class="weui-label">用户姓名</label>
</view>
<view class="weui-cell__bd weui-flex">
<input class="weui-input"/>
<view wx:if="{{true}}" aria-role="button" class="weui-btn_reset weui-btn_icon weui-btn_input-clear" bindtap="onClear">
<i class="weui-icon-clear"></i>
</view>
</view>
</view>
<view class="weui-cell weui-cell_active ">
<view class="weui-cell__hd">
<label class="weui-label">手机号码</label>
</view>
<view class="weui-cell__bd weui-flex">
<input class="weui-input"/>
<view wx:if="{{true}}" aria-role="button" class="weui-btn_reset weui-btn_icon weui-btn_input-clear" bindtap="onClear">
<i class="weui-icon-clear"></i>
</view>
</view>
</view>
<view class="weui-cell weui-cell_active ">
<view class="weui-cell__hd">
<label class="weui-label">选择楼栋</label>
</view>
<view class="weui-cell__bd weui-flex">
<input class="weui-input"/>
<view wx:if="{{true}}" aria-role="button" class="weui-btn_reset weui-btn_icon weui-btn_input-clear" bindtap="onClear">
<i class="weui-icon-clear"></i>
</view>
</view>
</view>
<view class="weui-cell weui-cell_active ">
<view class="weui-cell__hd">
<label class="weui-label">想起地址</label>
</view>
<view class="weui-cell__bd weui-flex">
<input class="weui-input"/>
<view wx:if="{{true}}" aria-role="button" class="weui-btn_reset weui-btn_icon weui-btn_input-clear" bindtap="onClear">
<i class="weui-icon-clear"></i>
</view>
</view>
</view>
</view>
</view>
</view>

View File

@ -1,33 +0,0 @@
.editor{
font-size: 30rpx;
}
.editor .item{
display: flex;
align-items: center;
border-bottom: 1rpx solid rgba(153, 153, 153, 0.2);
}
.editor .item:last-child{
border:none;
}
.editor .item .key{
}
.editor .item .key::before{
content: '*';
color: #EB0000;
}
.editor .item .value{
flex:1;
margin-left: 30rpx;
padding: 50rpx 0;
}
.weui-form{padding:0;}
.weui-label{
width: auto;
}

View File

@ -5,7 +5,10 @@ Page({
* 页面的初始数据
*/
data: {
items: [
{ name: '1', value: 'cell standard' },
{ name: '2', value: 'cell standard', checked: 'true' },
],
},
/**
@ -62,5 +65,11 @@ Page({
*/
onShareAppMessage() {
},
goToAddressEditor(){
wx.navigateTo({
url: '/pages/help/address/edit/index',
})
}
})

View File

@ -0,0 +1,5 @@
{
"usingComponents": {
"address-editor":"/components/address"
}
}

View File

@ -0,0 +1,26 @@
<address-editor saveText="保存并使用"/>
<view class="page-container address-list">
<view class="head">常用地址</view>
<view class="item">
<view class="text">
<view class="title">朝阳时代西锦 3栋2单元1802</view>
<view class="sub-title">何灵 13486745777</view>
</view>
<image class="icon" src="/assets/icon/help/edit@2x.png" bind:tap="goToAddressEditor"/>
</view>
<view class="item">
<view class="text">
<view class="title">朝阳时代西锦 3栋2单元1802</view>
<view class="sub-title">何灵 13486745777</view>
</view>
<image class="icon" src="/assets/icon/help/edit@2x.png" bind:tap="goToAddressEditor"/>
</view>
<view class="item">
<view class="text">
<view class="title">朝阳时代西锦 3栋2单元1802</view>
<view class="sub-title">何灵 13486745777</view>
</view>
<image class="icon" src="/assets/icon/help/edit@2x.png" bind:tap="goToAddressEditor"/>
</view>
</view>

View File

@ -0,0 +1,29 @@
.address-list{
padding-top:36rpx
}
.address-list .head{
font-size:34rpx;
font-weight:500;
}
.address-list .item{
display: flex;
margin-top:60rpx;
}
.address-list .item .text{
flex:1;
}
.address-list .item .title{
font-size:30rpx;
}
.address-list .item .sub-title{
margin-top: 24rpx;
font-size:26rpx;
color: #7C7C7C;
}
.address-list .item .icon{
width:36rpx;height:36rpx;
padding:10rpx;
}

View File

@ -75,7 +75,7 @@ Page({
},
goToAddress(){
wx.navigateTo({
url: '/pages/help/address/index',
url: '/pages/help/address/index/index',
})
}
})

View File

@ -1,6 +1,8 @@
<view>
<view class="bg"></view>
<nav-bar/>
<nav-bar class="nav-bar">
<image class="logo" src="/assets/icon/navbar/lanfeng@2x.png"/>
</nav-bar>
<view class="choose-community" bind:tap="goToCommunity">
<view class="text">选择小区</view>
<image class="arrow" src="/assets/icon/help/arrow-down@2x.png"/>

View File

@ -5,6 +5,10 @@
position:absolute;
z-index:-1;
}
.nav-bar .logo{
width:168rpx;
height:42rpx;
}
.choose-community{
padding:90rpx 40rpx 70rpx;
position: relative;

View File

@ -5,9 +5,14 @@ Page({
* 页面的初始数据
*/
data: {
tabIndex:0,
tabItems:["全部","养车用车","美容剪发","洗衣洗鞋"]
},
changeTab(event){
const tabIndex = event.currentTarget.dataset.index;
this.setData({tabIndex})
},
/**
* 生命周期函数--监听页面加载
*/

View File

@ -1,3 +1,6 @@
{
"usingComponents": {}
"usingComponents": {
"nav-bar":"/components/navbar"
},
"navigationStyle": "custom"
}

View File

@ -1,2 +1,33 @@
<!--pages/savemoney/index/index.wxml-->
<text>pages/savemoney/index/index.wxml</text>
<nav-bar/>
<view class="consume">
<view class="title">消费金 (元)</view>
<view class="money">3.3</view>
<view class="tips">买券自动抵扣</view>
</view>
<view class="btns">
<button wx:for="{{tabItems}}" wx:key="index" class="item" size="mini"
bind:tap="changeTab" data-index="{{index}}" type="{{tabIndex==index?'primary':''}}">
{{item}}
</button>
</view>
<view class="shop-list">
<view class="page-container item" wx:for="{{3}}">
<image class="logo" src="/assets/imgs/for_test/jd.png"/>
<view class="content">
<view class="line1">京东养车</view>
<view class="line2">
<view class="line2-1">燎原路228号御景湾</view>
<view class="line2-2">100m</view>
</view>
<view class="line-coupon">
<label class="money">¥22.9</label>
<label class="money-disable">¥22.9</label>【5座】标准洗车
</view>
<view class="line-coupon">
<label class="money">¥22.9</label>
<label class="money-disable">¥22.9</label>【5座】标准洗车
</view>
</view>
</view>
</view>

View File

@ -1 +1,97 @@
/* pages/savemoney/index/index.wxss */
.consume{
border-radius: 18rpx;
background: linear-gradient(270deg, #3566FF 0%, #1A4DEB 60%);
box-shadow: 0 10rpx 10rpx 0 rgba(54, 98, 236, 0.2);
margin:20rpx;
padding:40rpx 30rpx;
color:#fff;
position:relative;
}
.consume .title{
font-size: 32rpx;
}
.consume .money{
font-size: 70rpx;
font-weight: 600;
margin-top:40rpx;
}
.consume .tips{
position:absolute;
right:0;top:32rpx;
border-radius: 60rpx 0 0 60rpx;
background-color: #1A4DEB;
line-height: 40rpx;
font-size: 22rpx;
padding:0 16rpx;
}
.btns{
display: flex;
justify-content: space-between;
margin:24rpx;
}
.btns .item{
font-weight: normal;
border-radius: 12rpx;
font-size: 26rpx;
margin:0;
padding:18rpx 34rpx;
line-height: 1;
}
.btns .item:not([type=primary]){
background-color: #fff;
}
.shop-list .item{
display: flex;
}
.shop-list .item .logo{
width:180rpx;height:180rpx;
}
.shop-list .item .content{
flex:1;
margin-left:18rpx;
}
.shop-list .item .line1{
font-size:34rpx;
font-weight: 600;
}
.shop-list .item .line2{
font-size: 26rpx;
display: flex;
color:#888888;
margin-top:26rpx;
padding-bottom:16rpx;
}
.shop-list .item .line2-1{
flex:1;
}
.shop-list .item .line-coupon{
font-size: 26rpx;
margin-top: 20rpx;
position: relative;
}
.shop-list .item .line-coupon::before{
content: '惠';
width:34rpx;height:34rpx;
font-size:22rpx;
border-radius: 8rpx;
background-color: #FF8400;
color: #fff;
display: inline-block;
text-align: center;
line-height: 34rpx;
vertical-align: top;
margin-right: 8rpx;
}
.shop-list .item .money{
font-size: 32rpx;
color:#EB0000;
font-weight:500
}
.shop-list .item .money-disable{
font-size: 28rpx;
color: #888888;
text-decoration: line-through;
}