Lxy
/
gupiao_web_vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: 完成综合趋势数据展示（排序等未完成)

Browse Source
dev
laixingyu 3 years ago
parent 314a9aa134
commit a409f3145a
1 changed files with 325 additions and 8 deletions
Show Stats Download Patch File Download Diff File

333
src/views/trend/index.vue
Unescape View File

@ -679,36 +679,338 @@
{{ item.securityName }} {{ item.securityName }}
</div> </div>
<div class="list_plate_box"> <div class="list_plate_box">
<div>{{ item.sort }}</div> <div>{{ item.sort5 }}
<div> <div>
<div v-if="item.sortChange > 0" class="plate_box_right"> <div v-if="item.sort5Change > 0" class="plate_box_right">
<div style="color: #d9001b">{{ item.sort5Change }}</div>
<img
src="../../static/home_paiming_shangsheng.png"
class="liate_box_icon"
/>
</div>
<div v-if="item.sort5Change == 0" class="plate_box_right">
<div>-</div>
</div>
<div v-if="item.sort5Change < 0" class="plate_box_right">
<div style="color: #8fc320">
{{ Math.abs(item.sort5Change) }}
</div>
<img
src="../../static/home_paiming_xiajiang.png"
class="liate_box_icon"
/>
</div>
</div>
</div>
</div>
<div class="list_plate_box">
<div>{{ item.sort10 }}
<div>
<div v-if="item.sort10Change > 0" class="plate_box_right">
<div style="color: #d9001b">{{ item.sort10Change }}</div>
<img <img
src="../../static/home_paiming_shangsheng.png" src="../../static/home_paiming_shangsheng.png"
class="liate_box_icon" class="liate_box_icon"
/> />
</div>
<div v-if="item.sort10Change == 0" class="plate_box_right">
<div>-</div>
</div>
<div v-if="item.sort10Change < 0" class="plate_box_right">
<div style="color: #8fc320">
{{ Math.abs(item.sort10Change) }}
</div>
<img
src="../../static/home_paiming_xiajiang.png"
class="liate_box_icon"
/>
</div>
</div>
</div>
</div>
<div class="list_plate_box">
<div>{{ item.sort20 }}
<div>
<div v-if="item.sort20Change > 0" class="plate_box_right">
<div style="color: #d9001b">{{ item.sort20Change }}</div>
<img
src="../../static/home_paiming_shangsheng.png"
class="liate_box_icon"
/>
</div>
<div v-if="item.sort20Change == 0" class="plate_box_right">
<div>-</div>
</div>
<div v-if="item.sort20Change < 0" class="plate_box_right">
<div style="color: #8fc320">
{{ Math.abs(item.sort20Change) }}
</div>
<img
src="../../static/home_paiming_xiajiang.png"
class="liate_box_icon"
/>
</div>
</div>
</div>
</div>
<div class="list_plate_box">
<div>{{ item.sort }}
<div>
<div v-if="item.sortChange > 0" class="plate_box_right">
<div style="color: #d9001b">{{ item.sortChange }}</div> <div style="color: #d9001b">{{ item.sortChange }}</div>
<img
src="../../static/home_paiming_shangsheng.png"
class="liate_box_icon"
/>
</div> </div>
<div v-if="item.sortChange == 0" class="plate_box_right"> <div v-if="item.sortChange == 0" class="plate_box_right">
<div>-</div> <div>-</div>
</div> </div>
<div v-if="item.sortChange < 0" class="plate_box_right"> <div v-if="item.sortChange < 0" class="plate_box_right">
<div style="color: #8fc320">
{{ Math.abs(item.sortChange) }}
</div>
<img <img
src="../../static/home_paiming_xiajiang.png" src="../../static/home_paiming_xiajiang.png"
class="liate_box_icon" class="liate_box_icon"
/> />
</div>
</div>
</div>
</div>
<div class="list_plate_box_turnover">
<div>{{ (item.turnover/100).toFixed(2) }}
<div>
<div v-if="item.turnoverChange > 0" class="plate_box_right">
<div style="color: #d9001b">{{ (item.turnoverChange/100).toFixed(2) }}</div>
<img
src="../../static/home_paiming_shangsheng.png"
class="liate_box_icon"
/>
</div>
<div v-if="item.turnoverChange == 0" class="plate_box_right">
<div>-</div>
</div>
<div v-if="item.turnoverChange < 0" class="plate_box_right">
<div style="color: #8fc320"> <div style="color: #8fc320">
{{ Math.abs(item.sortChange) }} {{ Math.abs((item.turnoverChange/100).toFixed(2)) }}
</div> </div>
<img
src="../../static/home_paiming_xiajiang.png"
class="liate_box_icon"
/>
</div> </div>
</div> </div>
</div>
</div>
<div class="list_plate_box">
<div>{{ item.turnoverRatio.toFixed(2) }}
<div>
<div v-if="item.turnoverRatioChange > 0" class="plate_box_right">
<div style="color: #d9001b">{{ item.turnoverRatioChange.toFixed(2) }}</div>
<img
src="../../static/home_paiming_shangsheng.png"
class="liate_box_icon"
/>
</div>
<div v-if="item.turnoverRatioChange == 0" class="plate_box_right">
<div>-</div>
</div>
<div v-if="item.turnoverRatioChange < 0" class="plate_box_right">
<div style="color: #8fc320">
{{ Math.abs(item.turnoverRatioChange.toFixed(2)) }}
</div>
<img
src="../../static/home_paiming_xiajiang.png"
class="liate_box_icon"
/>
</div>
</div>
</div>
</div> </div>
<div class="all__list_breakeven">{{ item.turnover.toFixed(2) }}</div>
<div class="all__list_breakeven">{{ item.sort/10 }}</div> <div class="list_plate_box_turnover">
<div>{{ (item.turnover5/100).toFixed(2) }}
<div>
<div v-if="item.turnover5Change > 0" class="plate_box_right">
<div style="color: #d9001b">{{ (item.turnover5Change/100).toFixed(2) }}</div>
<img
src="../../static/home_paiming_shangsheng.png"
class="liate_box_icon"
/>
</div>
<div v-if="item.turnover5Change == 0" class="plate_box_right">
<div>-</div>
</div>
<div v-if="item.turnover5Change < 0" class="plate_box_right">
<div style="color: #8fc320">
{{ Math.abs((item.turnover5Change/100).toFixed(2)) }}
</div>
<img
src="../../static/home_paiming_xiajiang.png"
class="liate_box_icon"
/>
</div>
</div>
</div>
</div>
<div class="list_plate_box">
<div>{{ item.turnover5Ratio.toFixed(2) }}
<div>
<div v-if="item.turnover5RatioChange > 0" class="plate_box_right">
<div style="color: #d9001b">{{ item.turnover5RatioChange.toFixed(2) }}</div>
<img
src="../../static/home_paiming_shangsheng.png"
class="liate_box_icon"
/>
</div>
<div v-if="item.turnover5RatioChange == 0" class="plate_box_right">
<div>-</div>
</div>
<div v-if="item.turnover5RatioChange < 0" class="plate_box_right">
<div style="color: #8fc320">
{{ Math.abs(item.turnover5RatioChange.toFixed(2)) }}
</div>
<img
src="../../static/home_paiming_xiajiang.png"
class="liate_box_icon"
/>
</div>
</div>
</div>
</div>
<div class="list_plate_box_turnover">
<div>{{ (item.turnover10/100).toFixed(2) }}
<div>
<div v-if="item.turnover10Change > 0" class="plate_box_right">
<div style="color: #d9001b">{{ (item.turnover10Change/100).toFixed(2) }}</div>
<img
src="../../static/home_paiming_shangsheng.png"
class="liate_box_icon"
/>
</div>
<div v-if="item.turnover10Change == 0" class="plate_box_right">
<div>-</div>
</div>
<div v-if="item.turnover10Change < 0" class="plate_box_right">
<div style="color: #8fc320">
{{ Math.abs((item.turnover10Change/100).toFixed(2)) }}
</div>
<img
src="../../static/home_paiming_xiajiang.png"
class="liate_box_icon"
/>
</div>
</div>
</div>
</div>
<div class="list_plate_box">
<div>{{ item.turnover10Ratio.toFixed(2) }}
<div>
<div v-if="item.turnover10RatioChange > 0" class="plate_box_right">
<div style="color: #d9001b">{{ item.turnover10RatioChange.toFixed(2) }}</div>
<img
src="../../static/home_paiming_shangsheng.png"
class="liate_box_icon"
/>
</div>
<div v-if="item.turnover10RatioChange == 0" class="plate_box_right">
<div>-</div>
</div>
<div v-if="item.turnover10RatioChange < 0" class="plate_box_right">
<div style="color: #8fc320">
{{ Math.abs(item.turnover10RatioChange.toFixed(2)) }}
</div>
<img
src="../../static/home_paiming_xiajiang.png"
class="liate_box_icon"
/>
</div>
</div>
</div>
</div>
<div class="list_plate_box">
<div>{{ Math.trunc(item.riseNumber) }}
<div>
<div v-if="item.riseNumberChange > 0" class="plate_box_right">
<div style="color: #d9001b">{{ Math.trunc(item.riseNumberChange) }}</div>
<img
src="../../static/home_paiming_shangsheng.png"
class="liate_box_icon"
/>
</div>
<div v-if="item.riseNumberChange == 0" class="plate_box_right">
<div>-</div>
</div>
<div v-if="item.riseNumberChange < 0" class="plate_box_right">
<div style="color: #8fc320">
{{ Math.abs(Math.trunc(item.riseNumberChange)) }}
</div>
<img
src="../../static/home_paiming_xiajiang.png"
class="liate_box_icon"
/>
</div>
</div></div>
</div>
<div class="list_plate_box">
<div>{{ Math.trunc(item.flatNumber) }}
<div>
<div v-if="item.flatNumberChange > 0" class="plate_box_right">
<div style="color: #d9001b">{{ Math.trunc(item.flatNumberChange) }}</div>
<img
src="../../static/home_paiming_shangsheng.png"
class="liate_box_icon"
/>
</div>
<div v-if="item.flatNumberChange == 0" class="plate_box_right">
<div>-</div>
</div>
<div v-if="item.flatNumberChange < 0" class="plate_box_right">
<div style="color: #8fc320">
{{ Math.abs(Math.trunc(item.flatNumberChange)) }}
</div>
<img
src="../../static/home_paiming_xiajiang.png"
class="liate_box_icon"
/>
</div>
</div></div>
</div>
<div class="list_plate_box">
<div>{{ Math.trunc(item.lossesNumber) }}
<div>
<div v-if="item.lossesNumberChange > 0" class="plate_box_right">
<div style="color: #d9001b">{{ Math.trunc(item.lossesNumberChange) }}</div>
<img
src="../../static/home_paiming_shangsheng.png"
class="liate_box_icon"
/>
</div>
<div v-if="item.lossesNumberChange == 0" class="plate_box_right">
<div>-</div>
</div>
<div v-if="item.lossesNumberChange < 0" class="plate_box_right">
<div style="color: #8fc320">
{{ Math.abs(Math.trunc(item.lossesNumberChange)) }}
</div>
<img
src="../../static/home_paiming_xiajiang.png"
class="liate_box_icon"
/>
</div>
</div></div>
</div>
<!-- <div class="all__list_breakeven">{{ item.sort/10 }}</div>
<div class="all__list_breakeven">{{ item.sort }}</div> <div class="all__list_breakeven">{{ item.sort }}</div>
<div class="all__list_breakeven">{{ Math.trunc(item.riseNumber) }}</div> <div class="all__list_breakeven">{{ Math.trunc(item.riseNumber) }}</div>
<div class="all__list_breakeven">{{ Math.trunc(item.lossesNumber) }}</div> <div class="all__list_breakeven">{{ Math.trunc(item.lossesNumber) }}</div>
<div class="all__list_breakeven">{{ Math.trunc(item.flatNumber) }}</div> <div class="all__list_breakeven">{{ Math.trunc(item.flatNumber) }}</div> -->
</div> </div>
</div> </div>
</div> </div>
@ -2617,7 +2919,22 @@ export default {
} }
.list_plate_box { .list_plate_box {
text-align: center; text-align: center;
width: 90px; width: 80px;
display: flex;
justify-content: center;
.plate_box_right {
display: flex;
align-items: center;
margin-left: 10px;
}
.liate_box_icon {
width: 9px;
height: 5px;
}
}
.list_plate_box_turnover{
text-align: center;
width: 80px;
display: flex; display: flex;
justify-content: center; justify-content: center;
.plate_box_right { .plate_box_right {

Write Preview
Loading…
Cancel
Save