| | |
| | | <img src="../../assets/img/zuojiantou.png" alt /> |
| | | </div> |
| | | <div class="right_title"> |
| | | <div class="t_t" style="white-space: nowrap"> |
| | | <div class="t_t line-one" style="white-space: nowrap"> |
| | | <span>{{ singDetails.name }}</span> |
| | | </div> |
| | | <!-- <div class="t_t" style="white-space: nowrap"> |
| | | <span>{{ singDetails.name }}({{ singDetails.gid }})</span> |
| | | </div> |
| | | <div class="b_t"> |
| | | <span>{{ singDetails.spell }}</span> |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | </div> |
| | | <!-- 隐藏右侧金额显示 --> |
| | |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | <div class="flex-start" style="font-size: .4rem;"> |
| | | <span class="i_icon">{{ bayType }}</span> |
| | | <span class="i_hint" style="color:#777">{{ singDetails.spell }}</span> |
| | | </div> |
| | | <div class="detail_title_a">{{ singDetails.name }}({{ singDetails.gid }})</div> |
| | | <div class="real_time_detail"> |
| | | <div class="left_now_price"> |
| | | <div class="top_now"> |
| | | <!-- <span :class="singDetails.nowPrice - singDetails.preclose_px > 0 ? 'price green' : 'price red'">{{ |
| | | singDetails.nowPrice |
| | | }}</span> --> |
| | | <span |
| | | :class="singDetails.hcrate > 0 ? 'price green' : 'price red'" |
| | | >{{ singDetails.nowPrice }}</span |
| | | > |
| | | <span :class="singDetails.hcrate > 0 ? 'price green' : 'price red'">{{ singDetails.nowPrice }}</span> |
| | | </div> |
| | | <div class="bottom_now"> |
| | | <div> |
| | |
| | | <span v-else> |
| | | {{ |
| | | (singDetails.nowPrice - singDetails.preclose_px).toFixed(2) |
| | | }}</span |
| | | > |
| | | }}</span> |
| | | </div> |
| | | <div |
| | | class="tew" |
| | | :class="singDetails.hcrate > 0 ? 'number green' : 'number red'" |
| | | > |
| | | <div class="tew" :class="singDetails.hcrate > 0 ? 'number green' : 'number red'"> |
| | | <span v-if="singDetails.nowPrice === 0">-</span> |
| | | <!-- <span v-else>({{ singDetails.nowPrice - singDetails.preclose_px > 0 ? '+' : '' }} |
| | | {{ singDetails.hcrate ? singDetails.hcrate : '0' }}%)</span> --> |
| | | <span v-else> |
| | | ({{ singDetails.hcrate ? singDetails.hcrate : "0" }}%)</span |
| | | > |
| | | ({{ singDetails.hcrate ? singDetails.hcrate : "0" }}%)</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | <!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{ |
| | | singDetails.open_px |
| | | }}</span> --> |
| | | <span |
| | | :class=" |
| | | singDetails.hcrate > 0 ? 'number green' : 'number red' |
| | | " |
| | | >{{ singDetails.open_px }}</span |
| | | > |
| | | <span :class="singDetails.hcrate > 0 ? 'number green' : 'number red' |
| | | ">{{ singDetails.open_px }}</span> |
| | | </div> |
| | | <div class="rights topes"> |
| | | <span class="titles">{{ $t("hj73") }}</span> |
| | | <!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{ |
| | | singDetails.today_max |
| | | }}</span> --> |
| | | <span |
| | | :class=" |
| | | singDetails.hcrate > 0 ? 'number green' : 'number red' |
| | | " |
| | | >{{ singDetails.today_max }}</span |
| | | > |
| | | <span :class="singDetails.hcrate > 0 ? 'number green' : 'number red' |
| | | ">{{ singDetails.today_max }}</span> |
| | | </div> |
| | | </div> |
| | | <div class="bottoms"> |
| | |
| | | <!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{ |
| | | singDetails.preclose_px |
| | | }}</span> --> |
| | | <span |
| | | :class=" |
| | | singDetails.hcrate > 0 ? 'number green' : 'number red' |
| | | " |
| | | >{{ singDetails.preclose_px }}</span |
| | | > |
| | | <span :class="singDetails.hcrate > 0 ? 'number green' : 'number red' |
| | | ">{{ singDetails.preclose_px }}</span> |
| | | </div> |
| | | <div class="rights bots"> |
| | | <span class="titles">{{ $t("hj75") }}</span> |
| | | <!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{ |
| | | singDetails.today_min |
| | | }}</span> --> |
| | | <span |
| | | :class=" |
| | | singDetails.hcrate > 0 ? 'number green' : 'number red' |
| | | " |
| | | >{{ singDetails.today_min }}</span |
| | | > |
| | | <span :class="singDetails.hcrate > 0 ? 'number green' : 'number red' |
| | | ">{{ singDetails.today_min }}</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | <div class="k_line_detail"> |
| | | <Kline :key="key" :type="singDetails.type" /> |
| | | </div> |
| | | <div |
| | | class="priect_top_bottom" |
| | | style="display: none" |
| | | v-if=" |
| | | <div class="priect_top_bottom" style="display: none" v-if=" |
| | | kLineDetails.if_us != 1 && |
| | | kLineDetails.type != 'hk' && |
| | | kLineDetails.type != 'hk' && |
| | | kLineDetails.if_zhishu == 0 |
| | | " |
| | | > |
| | | "> |
| | | <div class="t_title"> |
| | | <span>{{ $t("hj76") }}</span> |
| | | </div> |
| | |
| | | <div class="t_ma"> |
| | | <span>{{ $t("hj80") }}</span> |
| | | </div> |
| | | <div |
| | | class="ets" |
| | | v-for="(item, i) in timedata.data.details" |
| | | :key="i" |
| | | > |
| | | <div class="ets" v-for="(item, i) in timedata.data.details" :key="i"> |
| | | <div class="left_sell1"> |
| | | <span>{{ item.split(",")[0] }}</span> |
| | | </div> |
| | |
| | | <div class="t_ma"> |
| | | <span>{{ $t("hj81") }}</span> |
| | | </div> |
| | | <div |
| | | class="ets" |
| | | v-for="(item, i) in timedata.data.details" |
| | | :key="i" |
| | | > |
| | | <div class="ets" v-for="(item, i) in timedata.data.details" :key="i"> |
| | | <div class="left_sell1"> |
| | | <span>{{ item.split(",")[1] }}</span> |
| | | </div> |
| | |
| | | <div class="t_ma"> |
| | | <span>{{ $t("hj82") }}</span> |
| | | </div> |
| | | <div |
| | | class="ets" |
| | | v-for="(item, i) in timedata.data.details" |
| | | :key="i" |
| | | > |
| | | <div class="ets" v-for="(item, i) in timedata.data.details" :key="i"> |
| | | <div class="left_sell1"> |
| | | <span>{{ item.split(",")[2] }}</span> |
| | | </div> |
| | |
| | | <div class="btns"> |
| | | <div class="lefts"> |
| | | <div class="left_ca" @click="option()"> |
| | | <img |
| | | src="../../assets/img/meishoucang.png" |
| | | alt |
| | | v-if="isOptionOpt === false" |
| | | /> |
| | | <img src="../../assets/img/meishoucang.png" alt v-if="isOptionOpt === false" /> |
| | | <img src="../../assets/img/shoucangle.png" alt v-else /> |
| | | </div> |
| | | <div class="right_xx" @click="handleJj()"> |
| | | <!-- <div class="right_xx" @click="handleJj()"> |
| | | <a href="#"><img src="../../assets/img/xiaoxi.png" alt/></a> |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | <div class="rights"> |
| | | <div class="buy_btn"> |
| | |
| | | padding: 0 0.3rem; |
| | | background: #fff; |
| | | |
| | | .detail_title_a { |
| | | font-size: .45rem; |
| | | font-weight: 500; |
| | | margin-top: .2rem; |
| | | line-height: .45rem; |
| | | } |
| | | |
| | | .i_icon { |
| | | border-radius: 0 26em 26em 0; |
| | | background: #07c160; |
| | | color: #fff; |
| | | padding: 0.1em 0.5em 0.1em 0.4em; |
| | | margin-right: 0.3em; |
| | | font-size: 0.8em; |
| | | } |
| | | |
| | | .top_back { |
| | | width: 50%; |
| | | width: 90%; |
| | | height: 1.2rem; |
| | | display: flex; |
| | | align-items: center; |
| | |
| | | height: 80%; |
| | | display: flex; |
| | | align-items: center; |
| | | margin-right: 10vw; |
| | | |
| | | > img { |
| | | margin-top: 0.2rem; |
| | | // margin-top: 0.2rem; |
| | | width: 0.6rem; |
| | | height: 0.6rem; |
| | | } |
| | | } |
| | | |
| | | .right_title { |
| | | width: 3rem; |
| | | height: 80%; |
| | | width: 70%; |
| | | // height: 80%; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | |
| | | .t_t { |
| | | width: 100%; |
| | | height: 70%; |
| | | display: flex; |
| | | height: 100%; |
| | | line-height: 1.2rem; |
| | | align-items: center; |
| | | font-size: 0.4615rem; |
| | | |
| | |
| | | |
| | | .k_line_detail { |
| | | width: 100%; |
| | | height: calc(100vh - 300px); |
| | | height: 100vw; |
| | | background: #fff; |
| | | border-radius: 0 0 0.3rem 0.3rem; |
| | | } |
| | |
| | | display: flex; |
| | | align-items: center; |
| | | font-weight: bold; |
| | | |
| | | span { |
| | | font-weight: 500; |
| | | } |
| | |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | padding: 0 0.1rem; |
| | | |
| | | .titles { |
| | | padding-right: 0.1rem; |
| | | } |
| | |
| | | height: 70%; |
| | | display: flex; |
| | | align-items: center; |
| | | padding-left: .3rem; |
| | | |
| | | > div { |
| | | width: 50%; |
| | |
| | | } |
| | | |
| | | .rights { |
| | | width: 70%; |
| | | width: 80%; |
| | | height: 70%; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-around; |
| | | justify-content: center; |
| | | padding-right: .2rem; |
| | | |
| | | > div { |
| | | border-radius: 0.15rem; |
| | | } |
| | | |
| | | .buy_btn { |
| | | width: 45%; |
| | | height: 100%; |
| | | width: 50%; |
| | | height: 80%; |
| | | background: rgb(225, 59, 69); |
| | | color: #fff; |
| | | border-radius: 3rem 0 0 3rem !important; |
| | | |
| | | .top_buy { |
| | | width: 100%; |
| | |
| | | } |
| | | |
| | | .sell_btn { |
| | | width: 45%; |
| | | height: 100%; |
| | | background: rgb(68, 155, 84); |
| | | width: 50%; |
| | | height: 80%; |
| | | background: #c4d600; |
| | | color: #fff; |
| | | border-radius: 0 3rem 3rem 0 !important; |
| | | |
| | | .top_sell { |
| | | width: 100%; |