@ -1,8 +1,15 @@
|
||||
Component({
|
||||
data: {
|
||||
active:0,
|
||||
timelist: ['二十四小时', '最近七天', '最近三十天', '自定义'],
|
||||
|
||||
},
|
||||
methods: {
|
||||
priceSel(e){
|
||||
this.setData({
|
||||
intervalSel: e.currentTarget.dataset.index
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
})
|
@ -1,3 +1,27 @@
|
||||
<view>
|
||||
2222
|
||||
<view class="timelist">
|
||||
<view wx:for="{{timelist}}" class="{{index === intervalSel?'active':''}}" wx:key="index" data-index="{{index}}" bindtap="priceSel">{{item}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="trend">
|
||||
<view class="text">入库数据趋势</view>
|
||||
</view>
|
||||
<view class="data">
|
||||
<view class="text">入库数据量</view>
|
||||
<view class="Cumulative">
|
||||
<view class="box">
|
||||
<view class="box_num">12233</view>
|
||||
<view class="box_text">历史累计入库</view>
|
||||
</view>
|
||||
<view class="box">
|
||||
<view class="box_num">12233</view>
|
||||
<view class="box_text">一年累计入库</view>
|
||||
</view>
|
||||
<view class="box">
|
||||
<view class="box_num">12233</view>
|
||||
<view class="box_text">半年累计入库</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
@ -0,0 +1,68 @@
|
||||
.timelist {
|
||||
width: 686rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
margin: 32rpx;
|
||||
border-radius: 4rpx;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4,1fr);
|
||||
grid-gap: 16rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.timelist view {
|
||||
text-align: center;
|
||||
color: #999999;
|
||||
font-size: 24rpx;
|
||||
margin: 8rpx;
|
||||
}
|
||||
|
||||
.timelist .active {
|
||||
color: #027AFF;
|
||||
background-color: #f9f9f9;
|
||||
border-radius: 4rpx;
|
||||
line-height: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
/* 入库数据趋势 */
|
||||
.trend{
|
||||
width: 686rpx;
|
||||
height: 486rpx;
|
||||
background-color: #ffffff;
|
||||
margin: 32rpx;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
.text{
|
||||
font-size: 36rpx;
|
||||
padding: 32rpx;
|
||||
}
|
||||
/* 入库数据量 */
|
||||
.data{
|
||||
width: 686rpx;
|
||||
height: 1232rpx;
|
||||
background-color: #ffffff;
|
||||
margin: 32rpx;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
.Cumulative{
|
||||
width: 622rpx;
|
||||
height: 108rpx;
|
||||
background-color: #ebf5ff;
|
||||
margin: 0rpx 32rpx;
|
||||
display: flex;
|
||||
text-align: center;
|
||||
justify-content : space-between;
|
||||
}
|
||||
.box{
|
||||
}
|
||||
.box_num{
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
color: #0084ff;
|
||||
|
||||
}
|
||||
.box_text{
|
||||
font-size: 20rpx;
|
||||
font-weight: 400;
|
||||
color: #67b3ff;
|
||||
}
|
@ -0,0 +1,41 @@
|
||||
Component({
|
||||
data: {
|
||||
active:0,
|
||||
timelist: ['二十四小时', '最近七天', '最近三十天', '自定义'],
|
||||
ranking: [
|
||||
{
|
||||
volume: '12345',
|
||||
media: '媒体',
|
||||
},
|
||||
{
|
||||
volume: '12345',
|
||||
media: '媒测评',
|
||||
},
|
||||
{
|
||||
volume: '12345',
|
||||
media: '媒体测评',
|
||||
},
|
||||
{
|
||||
volume: '12345',
|
||||
media: '媒体探测测评',
|
||||
},
|
||||
{
|
||||
volume: '712345',
|
||||
media: '媒体测评',
|
||||
},
|
||||
{
|
||||
volume: '1234533',
|
||||
media: '媒体测评',
|
||||
}
|
||||
],
|
||||
|
||||
},
|
||||
methods: {
|
||||
priceSel(e){
|
||||
this.setData({
|
||||
intervalSel: e.currentTarget.dataset.index
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
})
|
@ -0,0 +1,3 @@
|
||||
{
|
||||
"component": true
|
||||
}
|
@ -0,0 +1,26 @@
|
||||
<view style="height: 100vh;">
|
||||
<view class="timelist">
|
||||
<view wx:for="{{timelist}}" class="{{index === intervalSel?'active':''}}" wx:key="index" data-index="{{index}}" bindtap="priceSel">{{item}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="list_event">
|
||||
<view class="event_title">传播重点媒体排行</view>
|
||||
<view class="ranking">
|
||||
<view class="title">排名</view>
|
||||
<view class="title">媒体</view>
|
||||
<view class="title2">传播量</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="rank" wx:for="{{ranking}}" wx:key="index" data-ranking='{{item}}'>
|
||||
<view class="dis_image">
|
||||
<image class="rank_num" wx:if="{{index === 0}}" src="/images/img_diyi.png"></image>
|
||||
<image class="rank_num" wx:if="{{index === 1}}" src="/images/img_dier.png"></image>
|
||||
<image class="rank_num" wx:if="{{index === 2}}" src="/images/img_disan.png"></image>
|
||||
<view class="num" wx:if="{{index !== 0 &&index !== 1 &&index !== 2 }}">{{index >= 9 ? index + 1 : '0' + (index + 1)}}</view>
|
||||
</view>
|
||||
<view class="media">{{item.media}}</view>
|
||||
<view class="volume">{{item.volume}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
@ -0,0 +1,95 @@
|
||||
.timelist {
|
||||
width: 686rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
margin: 32rpx;
|
||||
border-radius: 4rpx;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4,1fr);
|
||||
grid-gap: 16rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.timelist view {
|
||||
text-align: center;
|
||||
color: #999999;
|
||||
font-size: 24rpx;
|
||||
margin: 8rpx;
|
||||
}
|
||||
|
||||
.timelist .active {
|
||||
color: #027AFF;
|
||||
background-color: #f9f9f9;
|
||||
border-radius: 4rpx;
|
||||
line-height: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
/* 排行榜 */
|
||||
.list_event{
|
||||
margin: 0 32rpx;
|
||||
background-size: cover;
|
||||
width: 686rpx;
|
||||
border-radius: 8rpx;
|
||||
background-color: #ffffff;
|
||||
|
||||
}
|
||||
.event_title{
|
||||
font-size: 36rpx;
|
||||
padding: 32rpx;
|
||||
}
|
||||
.ranking{
|
||||
width: 686rpx;
|
||||
display: flex;
|
||||
padding: 0 32rpx;
|
||||
}
|
||||
.rank{
|
||||
width: 686rpx;
|
||||
height: 104rpx;
|
||||
line-height: 104rpx;
|
||||
display: flex;
|
||||
padding: 0 32rpx;
|
||||
}
|
||||
.title{
|
||||
width: 30%;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
.title2{
|
||||
width: 30%;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
display: flex;
|
||||
flex-direction:row-reverse
|
||||
}
|
||||
.dis_image {
|
||||
width: 30%;
|
||||
font-size: 28rpx;
|
||||
height: 104rpx;
|
||||
color: #999999;
|
||||
line-height: 104rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.rank_num {
|
||||
width: 53rpx;
|
||||
height: 48rpx;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
.num{
|
||||
height: 104rpx;
|
||||
color: #999999;
|
||||
line-height: 104rpx;
|
||||
|
||||
}
|
||||
.media{
|
||||
width: 30%;
|
||||
font-size: 28rpx;
|
||||
|
||||
}
|
||||
.volume{
|
||||
width: 30%;
|
||||
font-size: 28rpx;
|
||||
color: #0084FF;
|
||||
display: flex;
|
||||
flex-direction:row-reverse
|
||||
}
|
@ -0,0 +1,15 @@
|
||||
Component({
|
||||
data: {
|
||||
active:0,
|
||||
timelist: ['二十四小时', '最近七天', '最近三十天', '自定义'],
|
||||
|
||||
},
|
||||
methods: {
|
||||
priceSel(e){
|
||||
this.setData({
|
||||
intervalSel: e.currentTarget.dataset.index
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
})
|
@ -0,0 +1,3 @@
|
||||
{
|
||||
"component": true
|
||||
}
|
@ -0,0 +1,6 @@
|
||||
<view>
|
||||
<view class="timelist">
|
||||
<view wx:for="{{timelist}}" class="{{index === intervalSel?'active':''}}" wx:key="index" data-index="{{index}}" bindtap="priceSel">{{item}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
@ -0,0 +1,26 @@
|
||||
.timelist {
|
||||
width: 686rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
margin: 32rpx;
|
||||
border-radius: 4rpx;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4,1fr);
|
||||
grid-gap: 16rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.timelist view {
|
||||
text-align: center;
|
||||
color: #999999;
|
||||
font-size: 24rpx;
|
||||
margin: 8rpx;
|
||||
}
|
||||
|
||||
.timelist .active {
|
||||
color: #027AFF;
|
||||
background-color: #f9f9f9;
|
||||
border-radius: 4rpx;
|
||||
line-height: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
After Width: | Height: | Size: 2.5 KiB |
After Width: | Height: | Size: 5.5 KiB |
After Width: | Height: | Size: 5.4 KiB |
After Width: | Height: | Size: 5.0 KiB |
After Width: | Height: | Size: 2.3 KiB |
After Width: | Height: | Size: 2.3 KiB |
After Width: | Height: | Size: 2.2 KiB |
After Width: | Height: | Size: 3.0 KiB |
After Width: | Height: | Size: 4.2 KiB |
After Width: | Height: | Size: 4.6 KiB |
After Width: | Height: | Size: 2.7 KiB |
@ -1,66 +0,0 @@
|
||||
// pages/index/event/event.js
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage() {
|
||||
|
||||
}
|
||||
})
|
@ -1,3 +0,0 @@
|
||||
{
|
||||
"usingComponents": {}
|
||||
}
|
@ -1,2 +0,0 @@
|
||||
<!--pages/index/event/event.wxml-->
|
||||
<text>pages/index/event/event.wxml</text>
|
@ -1 +0,0 @@
|
||||
/* pages/index/event/event.wxss */
|
@ -1,6 +1,8 @@
|
||||
{
|
||||
"usingComponents": {
|
||||
"data-child": "../../components/indexCom/dataChild/index",
|
||||
"event-child":"../../components/indexCom/eventChild/index"
|
||||
"event-child":"../../components/indexCom/eventChild/index",
|
||||
"media-child":"../../components/indexCom/mediaChild/index",
|
||||
"sound-child":"../../components/indexCom/soundChild/index"
|
||||
}
|
||||
}
|
@ -1,9 +1,12 @@
|
||||
<!--index.wxml-->
|
||||
<view class="container">
|
||||
<van-tabs class="menu-tabs" active="{{ active }}" ellipsis="{{false}}" animated="{{true}}">
|
||||
<van-tab wx:for="{{navData}}" title="{{item.text}}">
|
||||
<van-tab wx:for="{{navData}}" title="{{item.text}}" wx:key="index">
|
||||
<data-child wx:if="{{item.component === 'data-child'}}"></data-child>
|
||||
<event-child wx:if="{{item.component === 'event-child'}}"></event-child>
|
||||
<media-child wx:if="{{item.component === 'media-child'}}"></media-child>
|
||||
<sound-child wx:if="{{item.component === 'sound-child'}}"></sound-child>
|
||||
|
||||
</van-tab>
|
||||
</van-tabs>
|
||||
<tabbar />
|
||||
|