Commit ecd5913f by liangyuhang

首页样式修改2

parent 6583c0ed
......@@ -12,3 +12,6 @@ $RECYCLE.BIN/
# Node.js
node_modules/
project.config.json
project.private.config.json
project.config.json
......@@ -7,7 +7,7 @@ page{
position: relative;
width: 700rpx;
height: 300rpx;
margin: -100rpx auto 0;
margin: 100rpx auto 0;
background-color: #fff;
border-radius: 5px;
box-shadow: 0px 5px 5px #e8e8e8;
......
......@@ -40,6 +40,7 @@
padding: 20rpx;
margin-bottom: 15rpx;
background: #f6f6f6;
letter-spacing: 1px;
/* display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
......
......@@ -32,7 +32,14 @@ Page({
text: '危机报告',
img: 'https://d1icd6shlvmxi6.cloudfront.net/gsc/L5VHPP/e9/83/b8/e983b88902ca4085bcbc34d714ac6904/images/首页/u10.svg?pageId=794f4729-ba77-4770-92d6-71dfe84a18c1'
},
]
],
timeTypeList:[
{name:'近1月',type:'month'},
{name:'近2月',type:'twoMonth'},
{name:'近1年',type:'year'},
],
timeType:'year',
timeIndex:2
},
onLoad() {
this.setCrisisDynamicData();
......@@ -50,7 +57,8 @@ Page({
})
},
setCrisisFieldData(){
http.getRequest('/mobile/index/focusIndustry?timeType=halfYear').then(res=>{
http.getRequest('/mobile/index/focusIndustry?timeType='+this.data.timeType).then(res=>{
console.log(res)
if(res){
this.setData({
crisisField:res.data.data
......@@ -90,14 +98,12 @@ Page({
},
refreshFieldData(e){
var _type = e.currentTarget.dataset.type;
// console.log(_type)
http.getRequest('/mobile/index/focusIndustry?timeType='+_type).then(res=>{
if(res){
this.setData({
crisisField:res.data.data
})
}
var _index = e.currentTarget.dataset.index;
this.setData({
timeType:_type,
timeIndex:_index
})
this.setCrisisFieldData()
},
// 跳转搜索页
toSearchPage: function () {
......@@ -111,5 +117,13 @@ Page({
wx.navigateTo({
url: '/pages/event-detail/event-detail?eventId='+ _eventId,
})
},
//跳转文章链接
toArticleUrl(e){
var _url=e.currentTarget.dataset.url
console.log(_url)
wx.navigateTo({
url: '/components/out/out?url='+_url
})
}
})
......@@ -64,34 +64,25 @@
<navigator url="/pages/index/index" open-type="switchTab" class="more">查看全部</navigator>
</view>
<view class="field-content">
<view class="time-type">
<text bindtap="refreshFieldData" data-type="month" class="active">近1月</text>
<text bindtap="refreshFieldData" data-type="halfYear">近2月</text>
<text bindtap="refreshFieldData" data-type="year">近1年</text>
<view class="time-type" wx:for="{{timeTypeList}}" wx:key="index">
<text bindtap="refreshFieldData" data-type="{{item.type}}" data-index="{{index}}" class="{{timeIndex==index? 'active' : ''}}">{{item.name}}</text>
</view>
<block wx:for="{{crisisField}}" wx:key="index">
<!-- <view class="field-list">
<view class="field-tag">
<text>{{item.tag}}</text>
<text style="display:block;color: red;font-size: 24rpx;">↑10%</text>
</view>
<view class="field-proportion">{{util.toPercent(item.proportion)}}</view>
<view class="field-brand">
<text>{{item.brand}}</text>
</view>
<text class="unfold" bindtap="closeBanner">展开↓</text>
</view> -->
<view class="field">
<view class="field-right">
<view class="field-tag">{{item.tag}}</view>
<view class="field-brand">涉及品牌:{{item.brand}}</view>
</view>
<view class="field-left">
<view class="field-proportion">{{util.toPercent(item.proportion)}}</view>
<text style="display:block;color: red;font-size: 24rpx;">↑10%</text>
</view>
<view class="one">
<view class="tag">{{item.tag}}</view>
<view wx:if="{{index==0}}" class="tag-right">危机占比</view>
</view>
<view class="two">
<progress percent="{{item.proportion*100}}" color="#ADC9F3" active stroke-width="10" border-radius="5"/>
<view class="proportion">{{util.toPercent(item.proportion,1)}}</view>
</view>
<view class="three">
<view class="brand">涉及品牌:{{item.brand}}</view>
<view class="change" style="color: #FF630F;" wx:if="{{item.change}}>0" >▲{{util.toPercent(item.change,1)}}</view>
<view class="change" style="color: green;" wx:else >▼{{util.toPercent(item.change,1)}}</view>
</view>
</view>
</block>
......@@ -106,7 +97,7 @@
</view>
<view class="article-content">
<block wx:for="{{crisisArticle}}" wx:key="index">
<view class="article">
<view class="article" bindtap="toArticleUrl" data-url="{{item.url}}">
<view class="imgBox">
<image src="https://crisis.zhiweidata.com/app/{{item.img}}" mode="aspectFill"></image>
</view>
......
......@@ -158,64 +158,84 @@
/* 聚焦领域 */
.field-content{
padding: 30rpx;
padding: 0 30rpx;
}
.time-type{
display: inline-block;
text-align: center;
font-size: 26rpx;
color: #999;
margin-bottom: 30rpx;
margin-top: 30rpx;
background-color: #fff;
}
.time-type text{
padding: 5rpx 25rpx;
padding: 5rpx 20rpx;
border: 1px solid #EFF3F6;
}
.time-type .active{
background-color: #EFF3F6;
}
.field{
display: flex;
height: 80rpx;
}
.field field-right{
display: flex;
flex-direction:column;
width: 600rpx;
margin-right: 10rpx;
}
.field .field-tag{
font-size: 24rpx;
color: #fff;
background-color: #488CF0;
padding: 5rpx;
}
.field .field-brand{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 24rpx;
color: #ccc;
}
.field .field-proportion{
width: 30%;
line-height: 80rpx;
color: #00a2ff;
text-align: center;
font-weight: bold;
}
.field .field-brand text{
font-size: 26rpx;
color: #333333;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
display: flex;
flex-direction: column;
margin-top: 30rpx;
}
.one{
display: flex;
justify-content: space-between;
}
.one .tag{
font-size: 24rpx;
width: 80rpx;
color: #fff;
background-color: #488CF0;
border-radius: 5rpx;
padding: 5rpx 20rpx;
text-align: center;
}
.one .tag-right{
font-size:24rpx;
color: #747474;
border-radius: 5rpx;
text-align: center;
padding: 5rpx 0;
}
.two{
display: flex;
justify-content: space-between;
margin-top:10rpx;
}
.two progress{
width: 520rpx;
margin-right: 20rpx;
}
.two .proportion{
font-size: 30rpx;
font-weight: bold;
color: #747474;
text-align: center;
}
.three{
display: flex;
justify-content: space-between;
margin-top:10rpx;
}
.three .brand{
width: 520rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 24rpx;
color: #999;
margin-right: 20rpx;
}
.three .change{
display: inline;
font-size: 24rpx;
}
/* 危机复盘 */
.article-content{
padding: 0 30rpx;
......
{
"description": "项目配置文件",
"description": "项目配置文件,详见文档:https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
"packOptions": {
"ignore": []
"ignore": [],
"include": []
},
"setting": {
"urlCheck": false,
......@@ -36,21 +37,16 @@
"packNpmManually": false,
"packNpmRelationList": [],
"minifyWXSS": true,
"showES6CompileOption": false
"showES6CompileOption": false,
"useStaticServer": true,
"disableUseStrict": false,
"useCompilerPlugins": false,
"minifyWXML": true
},
"compileType": "miniprogram",
"libVersion": "2.24.6",
"appid": "wx70d8f2455f2152c2",
"projectname": "危机汇",
"debugOptions": {
"hidedInDevtools": []
},
"scripts": {},
"staticServerOptions": {
"baseURL": "",
"servePath": ""
},
"isGameTourist": false,
"condition": {
"search": {
"list": []
......@@ -70,5 +66,9 @@
"miniprogram": {
"list": []
}
},
"editorSetting": {
"tabIndent": "insertSpaces",
"tabSize": 4
}
}
\ No newline at end of file
{
"setting": {},
"setting": {
"compileHotReLoad": true
},
"condition": {
"plugin": {
"list": []
},
"game": {
"list": []
},
"gamePlugin": {
"list": []
},
"miniprogram": {
"list": [
{
......@@ -62,5 +55,8 @@
}
]
}
}
},
"projectname": "%E5%8D%B1%E6%9C%BA%E6%B1%87",
"description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档:https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
"libVersion": "2.25.0"
}
\ No newline at end of file
var toPercent = function(point){
var percent = (point*100).toFixed(0);
var toPercent = function(point,place){
var percent = (point*100).toFixed(place);
percent += "%";
return percent;
}
......
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