From d37bcf2111e02b806f961614c5a87deba4283aba Mon Sep 17 00:00:00 2001
From: flowstocktrading <tsm1258011@proton.me>
Date: Wed, 02 Nov 2022 20:14:01 +0800
Subject: [PATCH] 111
---
src/page/list/list.vue | 122 ++++++++++++++++++++++++++++++++++++----
1 files changed, 110 insertions(+), 12 deletions(-)
diff --git a/src/page/list/list.vue b/src/page/list/list.vue
index aa70d4b..24d948f 100644
--- a/src/page/list/list.vue
+++ b/src/page/list/list.vue
@@ -1,21 +1,22 @@
<template>
- <div :class="`wrapper ${$state.theme === 'red' ? 'red-theme' : 'black-theme'}`">
+ <div :class="`wrapper ${$state.theme === 'red' ? 'red-theme' : 'black-theme'}`" style="background-color: #21212b;">
+ <div>
+ <div @click="list_type=!list_type">1</div>
+ </div>
<!-- <mt-header v-if="selected == '2'" fixed title="">
<router-link to="/" slot="left">
</router-link>
<mt-button slot="right" icon="search" @click="toSearch"></mt-button>
</mt-header> -->
- <mt-navbar class="top-navbar" v-model="selected" :style="selected != '2'?'':''" :fixed="selected != '2'?true:false">
- <!-- <mt-tab-item id="0">全部</mt-tab-item> -->
+
+ <!-- <mt-navbar class="top-navbar" v-model="selected" :style="selected != '2'?'':''" :fixed="selected != '2'?true:false">
+
<mt-tab-item v-if="this.$store.state.settingForm.indexDisplay" id="1">指数</mt-tab-item>
<mt-tab-item v-if="this.$store.state.settingForm.stockDisplay" id="2">沪深</mt-tab-item>
<mt-tab-item v-if="this.$store.state.settingForm.kcStockDisplay" id="3">科创</mt-tab-item>
<mt-tab-item v-if="this.$store.state.settingForm.futuresDisplay" id="4">期货</mt-tab-item>
- </mt-navbar>
- <mt-tab-container class="order-list" v-model="selected">
- <!-- <mt-tab-container-item id="0">
- <List0 :changeNavOptions='changeNavOptions'/>
- </mt-tab-container-item> -->
+ </mt-navbar> -->
+ <!-- <mt-tab-container class="order-list" v-model="selected">
<mt-tab-container-item v-if="this.$store.state.settingForm.indexDisplay" id="1">
<List1 :selectedNumber='selected'/>
</mt-tab-container-item>
@@ -28,8 +29,31 @@
<mt-tab-container-item v-if="this.$store.state.settingForm.futuresDisplay" id="4">
<List4 :selectedNumber='selected'/>
</mt-tab-container-item>
- </mt-tab-container>
- <foot></foot>
+ </mt-tab-container> -->
+ <!-- <foot></foot> -->
+ <div style="background-color: #21212b;">
+ <div class="list-title">
+ <div class="list-left">代码</div>
+ <div class="list-conter">最in假</div>
+ <div class="list-right">涨跌幅</div>
+ </div>
+ <div class="list-content" v-for="item in 20">
+ <div class="list-left">
+ <div class="taini">
+ <span class="circular">●</span>
+ 太腻<span v-show="list_type" class="minCaption">(太腻)</span>
+ </div>
+ <div v-show="!list_type" class="list-code">1101</div>
+ </div>
+ <div class="list-conter">
+ <div class="down">30.25</div>
+ <div v-show="!list_type" class="list-code">最低:30.25</div>
+ </div>
+ <div class="list-right">
+ <div class="chgTextRed">-0.82%</div>
+ </div>
+ </div>
+ </div>
</div>
</template>
@@ -51,12 +75,15 @@
List1,
List2,
List3,
- List4
+ List4,
},
props: {},
data () {
return {
- selected: '' // 选中
+ selected: '', // 选中
+ count: 1000,
+ loading: false,
+ list_type:false,
}
},
watch: {},
@@ -259,4 +286,75 @@
}
}
}
+ .list-title{
+ display: flex;
+ width: calc(100vw - 32px);
+ margin-left: 0;
+ margin-right: 0;
+ margin: 0 auto;
+ color: #8b8896;
+ border-bottom: #000 0.01rem solid;
+ align-items: center;
+ padding-top: 0.28rem;
+ padding-bottom: 0.28rem;
+ }
+ .taini{
+ color: #f1f0f5;
+ font-size: 0.38rem;
+ }
+ .circular{
+ color: rgb(169,169,169);
+ font-size: 0.4rem;
+ }
+ .list-left{
+ width: 39.44986%;
+ }
+ .down{
+ font-size: 0.38rem;
+ color: #ef534f;
+ }
+ .list-code{
+ padding-left: 0.35rem;
+ margin-top: 0.2rem;
+ transition: all 0.2s;
+ }
+ .list-content{
+ display: flex;
+ width: calc(100vw - 32px);
+ margin-left: 0;
+ margin-right: 0;
+ margin: 0 auto;
+ color: #8b8896;
+ border-bottom: #000 0.01rem solid;
+ align-items: center;
+ padding-top: 0.28rem;
+ padding-bottom: 0.28rem;
+ transition: all 0.2s;
+ background-color: #21212b;
+ }
+
+ .list-conter{
+ width: 21.90556%;
+ text-align: right;
+ }
+ .list-right{
+ width: 38.64456%;
+ text-align: right;
+ }
+ .chgTextRed{
+ float: right;
+ font-size: 0.38rem;
+ width: 50%;
+ border-radius: 2px;
+ color: #fff!important;
+ text-align: center;
+ height: 0.65rem;
+ line-height: 0.65rem;
+ background-color: #ef534f;
+ }
+ .minCaption{
+ color: #8b8896;
+ font-size: 0.16rem;
+ transition: all 0.2s;
+ }
</style>
--
Gitblit v1.9.3