sws
/
carInsightSystem_wxapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

no message

Browse Source
dev
liuyongli 3 years ago
parent 93ece12e28
commit d55b98bbe0
6 changed files with 118 additions and 107 deletions
Show Stats Download Patch File Download Diff File

3
app.json
Unescape View File

@ -54,7 +54,8 @@
"van-button": "@vant/weapp/button/index",
"van-tabbar": "@vant/weapp/tabbar/index",
"van-tabbar-item": "@vant/weapp/tabbar-item/index",
"tabbar": "/custom-tab-bar/index"
"tabbar": "/custom-tab-bar/index",
"van-icon": "@vant/weapp/icon/index"
}
}

2
app.wxss
Unescape View File

@ -5,6 +5,6 @@
flex-direction: column;
align-items: center;
justify-content: space-between;
padding: 200rpx 0;
padding: 100rpx 0;
box-sizing: border-box;
}

BIN
pages/images/ic_zhuanfa@3x.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.7 KiB

11
pages/index/index.js
Unescape View File

@ -62,7 +62,16 @@ Page({
text: '晴雨表'
},
{
text: '租晴雨表房子'
text: '尾盘洞察'
},
{
text: '热议图谱'
},
{
text: '用户画像'
},
{
text: '热销排行'
},
],
currentTab: 0,

46
pages/index/index.wxml
Unescape View File

@ -1,35 +1,33 @@
<!--index.wxml-->
<view class="container">
<scroll-view scroll-x="true" class="nav" scroll-left="{{navScrollLeft}}" scroll-with-animation="{{true}}">
<block wx:for="{{navData}}" wx:for-index="idx" wx:for-item="navItem" wx:key="idx">
<!-- 判断是否选中，选中设置样式 -->
<!-- switchNav -->
<view class="nav-item {{currentTab == idx ?'active':''}}" data-current="{{idx}}" bindtap="switchNav">
{{navItem.text}}</view>
</block>
</scroll-view>
<block wx:for="{{navData}}" wx:for-index="idx" wx:for-item="navItem" wx:key="idx">
<!-- 判断是否选中，选中设置样式 -->
<!-- switchNav -->
<view class="nav-item {{currentTab == idx ?'active':''}}" data-current="{{idx}}" bindtap="switchNav">
{{navItem.text}}</view>
</block>
</scroll-view>
<scroll-view class="scrollList" scroll-x="true" enable-flex="true">
<text wx:for="{{condition}}" class="{{index === 0 ? 'actived' : ''}}" wx:key="index">{{item}}</text>
</scroll-view>
<!-- 页面内容 -->
<!-- duration="300"：滑动动画时长 -->
<!-- switchTab -->
<swiper class="tab-box" current="{{currentTab}}" duration="300" bindchange="switchTab">
<swiper-item wx:for="{{[0,1,2,3,4,5,6]}}" wx:for-item="tabItem" wx:for-index="idx" wx:key="idx"
class="tab-content">
{{tabItem}}
</swiper-item>
</swiper>
<view class="top">
<view wx:for="{{toplist}}" wx:key="url" class="top_box">
<!-- <view class="box_image">
<image style="width: 100%;height: 100%;" src="{{item.url}}"></image>
</view> -->
<view class="box_bot">
<image style="width: 100%;height: 100%;" src="{{item.url}}"></image>
<view class="box_title">{{item.title}}</view>
<view class="box_num">{{item.num}}</view>
<!-- switchTab -->
<!-- <swiper class="tab-box" current="{{currentTab}}" duration="300" bindchange="switchTab">
<swiper-item wx:for="{{[0,1,2,3,4,5,6]}}" wx:for-item="tabItem" wx:for-index="idx" wx:key="idx" class="tab-content">
{{tabItem}}
</swiper-item>
</swiper> -->
<view class="mat">
<view class="mat_card" wx:for="{{toplist}}" wx:key="index" data-id="{{item.id}}" data-name="{{item.name}}" data-url="/pages/material/subpage/newest/newest" bindtap="to">
<view class="mat_top">
<image class="mat_image" src="/pages/images/ic_zhuanfa@3x.png"></image>
<view><van-icon name="arrow" />
</view>
</view>
<view class="mat_title">{{item.title}}</view>
<view class="mat_num">{{item.num}}</view>
</view>
</view>
<tabbar />

163
pages/index/index.wxss
Unescape View File

@ -1,5 +1,9 @@
/**index.wxss**/
.scrollList{
.container {
width: 100%;
height: 100%;
}
.scrollList {
width: calc(100% - 48rpx);
display: flex;
text-align: center;
@ -7,106 +11,43 @@
height: 80rpx;
background: #fff;
}
.scrollList text{
.scrollList text {
background: #F6F6F6;
border-radius: 2px;
font-size: 28rpx;
color: #999999;
margin:0 8rpx;
margin: 0 8rpx;
padding: 18rpx 24rpx;
height: min-content;
flex-shrink: 0;
}
.scrollList .actived{
font-size: 12px;
font-weight: bold;
color: #027AFF;
background: #F0F5FF;
}
.top {
/* background-color: #006BFF; */
height: 556rpx;
width: 100%;
border-bottom-left-radius: 56rpx;
/* display: flex; */
/* overflow: scroll; */
/* padding-left: 1rem;
padding-right: 1rem; */
/* position: sticky; */
top: 0rpx;
z-index: 5;
}
::-webkit-scrollbar {
/*隐藏滚轮*/
display: none;
}
.top_box {
background-color: white;
/* padding-top: 0.4rem; */
flex-shrink: 0;
width: 300rpx;
height: 350rpx;
border-radius: 10%;
text-align: center;
/* display: flex; */
justify-content: center;
padding-left: 36rpx;
}
.box_image {
width: 70rpx;
height: 70rpx;
border-radius: 6rem;
box-shadow: #FFDEC5 0rem 0.5rem 1rem;
}
.box_title {
color: #999999;
font-size: 24rpx;
margin-bottom: 16rpx;
}
.box_num {
font-weight: 900;
font-size: 28rpx;
.scrollList .actived {
font-size: 12px;
font-weight: bold;
color: #027AFF;
background: #F0F5FF;
}
/**index.wxss**/
page {
width: 100%;
height: 100%;
}
.container {
width: 100%;
height: 100%;
}
.nav {
/* 设置tab-nav宽高度 */
height: 80rpx;
width: 100%;
/* 假如您需要并排放置两个带边框的框，
可通过将 box-sizing 设置为 "border-box"。 */
box-sizing: border-box;
overflow: hidden;
/* 居中 */
line-height: 80rpx;
background:
#f7f7f7;
font-size: 16px;
background: #006BFF;
font-size: 28rpx;
color: rgba(250, 242, 242, 0.973);
/* 规定段落中的文本不进行换行： */
white-space: nowrap;
position: fixed;
top: 0;
left: 0;
@ -120,14 +61,13 @@ page {
}
.nav-item.active {
color:
green;
color: rgb(255, 255, 255);
font-size: 38rpx;
}
.tab-box {
background:
rgb(31, 201, 96);
/* 这里设置成nav的高度 */
background: rgb(255, 255, 255);
/* 这里设置成nav的高度 */
padding-top: 80rpx;
height: 100%;
box-sizing: border-box;
@ -138,3 +78,66 @@ page {
overflow-y: scroll;
}
.main {
background-color: #F9F9F9;
min-height: 100vh;
}
.mat_title {
color: #999999;
font-size: 24rpx;
margin-bottom: 16rpx;
}
.mat_num {
font-weight: 900;
font-size: 28rpx;
}
.mat_image {
width: 100rpx;
height: 100rpx;
/* background: linear-gradient(180deg, #FFB17C 0%, #FFDBC3 100%); */
border-radius: 8rpx;
}
.mat_top {
padding: 16rpx;
display: flex;
justify-content: space-between;
}
.mat_bottom {
width: 328rpx;
height: 76rpx;
border-radius: 0rpx 0rpx 10rpx 10rpx;
font-size: 28rpx;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #333333;
line-height: 28rpx;
display: flex;
align-items: center;
justify-content: center;
}
.mat_card {
background-color: white;
width: 328rpx;
height: 404rpx;
border-radius: 16rpx;
margin-bottom: 32rpx;
}
.mat{
width: 686rpx;
padding-top: 24rpx;
margin-left: 32rpx;
margin-right: 32rpx;
/* min-height: 100vh; */
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
Write Preview
Loading…
Cancel
Save