|
|
@ -57,24 +57,33 @@ |
|
|
<!-- 目标--> |
|
|
<!-- 目标--> |
|
|
<view class="right1"> |
|
|
<view class="right1"> |
|
|
<view style="text-align: center;">{{infoData.date}}</view> |
|
|
<view style="text-align: center;">{{infoData.date}}</view> |
|
|
<view style="width: 100%;height: 80%;padding: 12rpx;"> |
|
|
<view class="statistics_box"> |
|
|
<view style="padding: 10rpx;">目标 {{infoData.goal_percent}}%</view> |
|
|
<!--目标--> |
|
|
<fui-progress :percent="100" background="#ddd" activeColor="#FFB703" height="20"></fui-progress> |
|
|
<view class="item"> |
|
|
|
|
|
<view class="box"> |
|
|
|
|
|
<view class="progress-bar" :style="{ height: `${infoData.goal_percent}%`, background: '#f59a23' }"></view> |
|
|
|
|
|
<view class="ratio" :style="{ color: infoData.goal_percent <= 0 ? '#333333' : '#fff' }">{{ infoData.goal_percent }}%</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class="title">目标</view> |
|
|
</view> |
|
|
</view> |
|
|
<!--预测--> |
|
|
<!--预测--> |
|
|
<view style="width: 100%;height: 80%;padding: 12rpx;"> |
|
|
<view class="item"> |
|
|
<view style="padding: 10rpx;">目标 {{infoData.yc_yj_percent}}%</view> |
|
|
<view class="box"> |
|
|
<fui-progress :percent="1" background="#ddd" activeColor="#039f64" height="20"></fui-progress> |
|
|
<view class="progress-bar" :style="{ height: `${infoData.yc_yj_percent}%`, background: '#039f64' }"></view> |
|
|
|
|
|
<view class="ratio" :style="{ color: infoData.yc_yj_percent <= 0 ? '#333333' : '#fff' }">{{ infoData.yc_yj_percent }}%</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class="title">预测</view> |
|
|
</view> |
|
|
</view> |
|
|
<!--成交--> |
|
|
<!--成交--> |
|
|
<view style="width: 100%;height: 80%;padding: 12rpx;"> |
|
|
<view class="item"> |
|
|
<view style="padding: 10rpx;">目标 {{infoData.cj_yj_percent}}%</view> |
|
|
<view class="box"> |
|
|
<fui-progress :percent="20" background="#ddd" activeColor="#4066f2" height="20"></fui-progress> |
|
|
<view class="progress-bar" :style="{ height: `${infoData.cj_yj_percent}%`, background: '#4066f2' }"></view> |
|
|
|
|
|
<view class="ratio" :style="{ color: infoData.cj_yj_percent <= 0 ? '#333333' : '#fff' }">{{ infoData.cj_yj_percent }}%</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class="title">成交</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
</view> |
|
|
</view> |
|
|
<!-- <view style="width: 100%;height: 80%;padding: 12rpx;">--> |
|
|
|
|
|
<!-- <view style="padding: 10rpx;">目标 8%</view>--> |
|
|
|
|
|
<!-- <fui-progress :percent="8" background="#ddd" activeColor="#3b8bd1" height="20"></fui-progress>--> |
|
|
|
|
|
<!-- </view>--> |
|
|
|
|
|
</view> |
|
|
</view> |
|
|
|
|
|
|
|
|
</view> |
|
|
</view> |
|
|
@ -266,6 +275,47 @@ export default { |
|
|
width: 48%; |
|
|
width: 48%; |
|
|
height: 95%; |
|
|
height: 95%; |
|
|
margin: auto; |
|
|
margin: auto; |
|
|
|
|
|
.statistics_box { |
|
|
|
|
|
margin: auto; |
|
|
|
|
|
margin-top: 10rpx; |
|
|
|
|
|
display: flex; |
|
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
.item { |
|
|
|
|
|
width: 90rpx; |
|
|
|
|
|
display: flex; |
|
|
|
|
|
flex-direction: column; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
.box { |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
height: 328rpx; |
|
|
|
|
|
border: 1px solid #ddd; |
|
|
|
|
|
border-radius: 6rpx; |
|
|
|
|
|
background: #f5f5f5; |
|
|
|
|
|
position: relative; |
|
|
|
|
|
.progress-bar { |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
height: 0; |
|
|
|
|
|
transition: height 0.3s ease; |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
bottom: 0; |
|
|
|
|
|
} |
|
|
|
|
|
.ratio { |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
bottom: -0rpx; |
|
|
|
|
|
font-size: 26rpx; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
.title { |
|
|
|
|
|
margin-top: 5rpx; |
|
|
|
|
|
padding: 0; |
|
|
|
|
|
font-size: 26rpx; |
|
|
|
|
|
color: #999999;; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.this_month { |
|
|
.this_month { |
|
|
|