<template>
|
<div class="tr_list_page">
|
<div class="content">
|
<!-- 搜索框 -->
|
<!-- <div class="search">
|
<div class="search_content">
|
<div class="left_search">
|
<div class="search_img">
|
<img src="../../assets/img/searchs.png" alt />
|
</div>
|
<div class="search_input">
|
<input type="text" class="searchs" :placeholder="$t('hj37')" ref="search" id="sousuo" v-model="gpcode"
|
@input="gpinput" />
|
</div>
|
</div>
|
</div>
|
</div> -->
|
<div class="tabs">
|
<div class="bottom_content" v-if="tabsIndex === 1">
|
<!-- <div class="tab_class">
|
<div class="scroll_tab">
|
<div class="tab_items" v-for="(item, index) in tabsClassArr" :key="index" :class="index == 0 ? 'mrt' : ''"
|
@click="handleTabsItem(item, index)">
|
<span :class="tabsItemIndex === index ? 'active' : ''">{{ item.name }}</span>
|
</div>
|
</div>
|
</div> -->
|
<div
|
class="kai_mess"
|
v-show="isToken == ''"
|
@click="$router.push('/login')"
|
>
|
<div class="left_identity_img">
|
<img src="../../assets/img/shenfen2.png" alt />
|
</div>
|
<div class="text">
|
<span>{{ $t("hj38") }}</span>
|
</div>
|
<div class="right_go">
|
<img src="../../assets/img/yuoujiantou.png" alt />
|
</div>
|
</div>
|
<div class="list_title">
|
<div class="item_title varieties">
|
<span>{{ $t("hj52") }}</span>
|
</div>
|
<div class="item_title latest_price">
|
<span>{{ $t("hj40") }}</span>
|
</div>
|
<div class="item_title applies">
|
<span v-show="tabsItemIndex != 5">{{ $t("hj41") }}</span>
|
<span
|
v-show="tabsItemIndex == 5"
|
style="width: 100%; text-align: center"
|
>{{ $t("hj42") }}</span
|
>
|
</div>
|
</div>
|
<!-- 市场列表 -->
|
<div
|
class="list"
|
v-if="tabsIndex001 == 0"
|
:class="isToken == '' ? 'listHeight' : 'listHeights'"
|
>
|
<van-list
|
v-model="loading"
|
:finished="finished"
|
:loading-text="$t('hj430')"
|
:finished-text="$t('hj43')"
|
@load="onLoad"
|
:immediate-check="false"
|
>
|
<div v-if="tabsItemIndex == 0" class="van-clearfix">
|
<div class="list_items">
|
<div
|
class="item"
|
v-for="(item, index) in listArr"
|
:key="index"
|
@click="handleGoToKlineDetail(item, index)"
|
>
|
<div class="item_box">
|
<div class="item_box_left">
|
<div class="item_box_left_top">{{ item.spell }}</div>
|
<p class="item_box_left_bottom">{{ item.name }}</p>
|
</div>
|
<div class="item_box_zj">{{ item.nowPrice }}</div>
|
<div
|
class="item_box_righta"
|
v-if="orderBy == 'asc' && tabsIndex0010 == 0"
|
>
|
{{ item.hcrate }}%
|
</div>
|
<div
|
class="item_box_right"
|
v-if="orderBy == 'desc' && tabsIndex0010 == 1"
|
>
|
{{ item.hcrate }}%
|
</div>
|
<div
|
:class="
|
item.color == '1'
|
? 'item_box_right'
|
: 'item_box_righta'
|
"
|
>
|
{{ item.hcrate }}%
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</van-list>
|
</div>
|
|
<!-- 市场列表 -->
|
<div
|
class="list"
|
v-if="tabsIndex001 == 1"
|
:class="isToken == '' ? 'listHeight' : 'listHeights'"
|
>
|
<van-list
|
v-model="loading"
|
:finished="finished"
|
:loading-text="$t('hj430')"
|
:finished-text="$t('hj43')"
|
@load="onLoad"
|
:immediate-check="false"
|
>
|
<div v-if="tabsItemIndex == 0" class="van-clearfix">
|
<div class="list_items">
|
<div
|
class="item"
|
v-for="(item, index) in listArr"
|
:key="index"
|
@click="handleGoToKlineDetail(item, index)"
|
>
|
<div class="item_box">
|
<div class="item_box_left">
|
<div class="item_box_left_top">{{ item.spell }}</div>
|
<p class="item_box_left_bottom">{{ item.name }}</p>
|
</div>
|
<div class="item_box_zj">{{ item.nowPrice }}</div>
|
<div
|
class="item_box_righta"
|
v-if="orderBy == 'asc' && tabsIndex0010 == 0"
|
>
|
{{ item.hcrate }}%
|
</div>
|
<div
|
class="item_box_right"
|
v-if="orderBy == 'desc' && tabsIndex0010 == 1"
|
>
|
{{ item.hcrate }}%
|
</div>
|
<div
|
:class="
|
item.color == '1'
|
? 'item_box_right'
|
: 'item_box_righta'
|
"
|
>
|
{{ item.hcrate }}%
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div v-if="tabsItemIndex == 1" class="van-clearfix">
|
<div class="list_items">
|
<div
|
class="item"
|
v-for="(item, index) in listArr1"
|
:key="index"
|
@click="handleGoToKlineDetail(item, index)"
|
>
|
<div
|
v-if="
|
(tabsItemIndex == 5 && item.zt == 0) ||
|
tabsItemIndex != 5
|
"
|
>
|
<div class="left_title">
|
<div class="tp">
|
<span class="collection" @click.stop="options(item)">
|
<span
|
v-show="tabsItemIndex != 5"
|
class="shu"
|
:class="item.isOption == '1' ? 'shublue' : ''"
|
></span>
|
<span
|
v-show="tabsItemIndex == 5"
|
class="shu hongse"
|
></span>
|
</span>
|
<span
|
class="title_color"
|
style="white-space: nowrap; overflow: hidden"
|
>
|
{{
|
tabsItemIndex == 5
|
? item.name
|
: tabsItemIndex == 2
|
? item.name
|
: tabsItemIndex == 0 ||
|
tabsItemIndex == 3 ||
|
tabsItemIndex == 4
|
? item.name
|
: item.indexName | getName
|
}}
|
</span>
|
</div>
|
<div class="bt">
|
<span>
|
{{
|
tabsItemIndex == 5
|
? item.stockType + item.code
|
: tabsItemIndex == 2
|
? item.gid
|
: tabsItemIndex == 0 ||
|
tabsItemIndex == 3 ||
|
tabsItemIndex == 4
|
? item.gid
|
: item.indexCode
|
}}
|
</span>
|
</div>
|
</div>
|
<div class="center_price">
|
<div class="tp">
|
<span
|
class="price_color"
|
v-if="
|
tabsItemIndex == 0 ||
|
tabsItemIndex == 2 ||
|
tabsItemIndex == 3 ||
|
tabsItemIndex == 4
|
"
|
:class="item.hcrate > 0 ? 'green' : 'red'"
|
>
|
{{ item.nowPrice }}
|
</span>
|
<span class="price_color" v-else>
|
{{
|
tabsItemIndex == 5
|
? Number(item.price).toFixed(2)
|
: item.currentPoint
|
}}
|
</span>
|
</div>
|
<div class="bt">
|
<span
|
v-if="tabsItemIndex == 5 || tabsItemIndex == 1"
|
>{{
|
tabsItemIndex == 5
|
? "Max:" + Number(item.orderNumber)
|
: $t("hj44") + ":" + Number(item.transFee)
|
}}</span
|
>
|
<span v-else>{{ item.today_min }}</span>
|
</div>
|
</div>
|
<div class="right_bs">
|
<div class="tp" style="justify-content: flex-end">
|
<span
|
class="price_color"
|
v-if="
|
tabsItemIndex == 0 ||
|
tabsItemIndex == 2 ||
|
tabsItemIndex == 3 ||
|
tabsItemIndex == 4
|
"
|
:class="item.hcrate > 0 ? 'green' : 'red'"
|
>{{ item.hcrate }}</span
|
>
|
<span
|
class="price_color"
|
v-if="tabsItemIndex == 1"
|
:class="item.floatRate > 0 ? 'green' : 'red'"
|
>
|
{{ item.floatRate + "%" }}
|
</span>
|
<!-- <span class="price_color" v-if="tabsItemIndex == 3"
|
:class="((item.nowPrice - item.lastClose) / item.lastClose * 100).toFixed(2) > 0 ? 'green' : 'red'">
|
{{
|
item.lastClose == "" ? 0.00 : ((Number(item.nowPrice) - Number(item.lastClose)) /
|
Number(item.lastClose) * 100).toFixed(2) + '%'
|
}}
|
</span> -->
|
<div
|
v-if="tabsItemIndex == 5"
|
:class="item.type == 1 ? 'xgsgType' : 'xgsgTypeRed'"
|
>
|
<!-- {{item.orderNumber}} -->
|
{{ item.type == 1 ? $t("hj45") : $t("hj46") }}
|
</div>
|
</div>
|
<div class="bt" style="justify-content: flex-end">
|
<div v-if="tabsItemIndex != 1 && tabsItemIndex != 5">
|
{{ item.preclose_px }}
|
</div>
|
<!-- class="codeIcon" item.stock_type.toUpperCase()-->
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</van-list>
|
</div>
|
</div>
|
<div class="bottom_content" v-if="tabsIndex === 0">
|
<!-- 搜索框 -->
|
<div class="search">
|
<div class="search_content">
|
<div class="left_search">
|
<div class="search_img">
|
<img src="../../assets/img/searchs.png" alt />
|
</div>
|
<div class="search_input">
|
<input
|
type="text"
|
class="searchs"
|
:placeholder="$t('hj37')"
|
onkeyup="value=value.replace(/[^a-zA-Z0-9]/g,'')"
|
v-model="gpcodes"
|
@input="gpinputs"
|
/>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="list_title">
|
<div class="item_title varieties">
|
<span>{{ $t("hj39") }}</span>
|
</div>
|
<div class="item_title latest_price">
|
<span>{{ $t("hj40") }}</span>
|
</div>
|
<div class="item_title applies">
|
<span>{{ $t("hj41") }}</span>
|
</div>
|
</div>
|
|
<!-- 自选列表 -->
|
<div class="list zxlist">
|
<van-list
|
v-model="loadings"
|
:finished="finisheds"
|
:finished-text="$t('hj43')"
|
@load="onLoads"
|
:immediate-check="false"
|
>
|
<div class="van-clearfix">
|
<div class="list_items">
|
<div
|
class="item"
|
@click="handleGoToKlineDetail1(item, index)"
|
v-for="(item, index) in listArrs"
|
:key="item.indexCode"
|
>
|
<div
|
class="left_title"
|
style="flex-direction: column; align-items: flex-start"
|
>
|
<div
|
class="tp"
|
style="
|
display: flex;
|
align-items: center;
|
line-height: 2;
|
"
|
>
|
<span class="collection" @click="optionszx(item)">
|
<span
|
class="shu"
|
:class="item.isOption == '1' ? 'shublue' : ''"
|
></span>
|
</span>
|
<span
|
class="title_color"
|
style="
|
overflow: hidden;
|
-webkit-line-clamp: 1;
|
text-overflow: ellipsis;
|
display: -webkit-box;
|
-webkit-box-orient: vertical;
|
"
|
>{{ item.stockName }}</span
|
>
|
</div>
|
<div class="bt">
|
<span>{{ item.stockGid }}</span>
|
</div>
|
</div>
|
<div class="center_price" style="align-items: center">
|
<div class="tp">
|
<span class="price_color">{{ item.nowPrice }}</span>
|
</div>
|
<div class="bt">
|
<span>{{ item.addTime }}</span>
|
</div>
|
</div>
|
<div
|
class="right_bs"
|
style="justify-content: flex-end; align-items: center"
|
>
|
<div class="tp">
|
<span
|
class="price_color"
|
:class="item.hcrate > 0 ? 'green' : 'red'"
|
>{{ item.hcrate }}</span
|
>
|
</div>
|
<div class="bt">
|
<!-- <div>{{ item.stock_type.toUpperCase() }}</div> -->
|
<!-- class="codeIcon" -->
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</van-list>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="shai" v-if="dialogFlag" @click="openDialog()"></div>
|
<div class="top_title" ref="topTitle" style="border-radius: 0">
|
<div>
|
<div class="tabs_title">
|
<!-- <div class="tb" v-for="(item, index) in tabsArr" :key="index" @click="handleTabsClick(item, index)">
|
<span :class="'active'">{{ item }}</span>
|
</div> -->
|
|
<div class="tb">
|
<div style="width: 50%; text-align: center">
|
<span
|
:class="tabsIndex001 == 0 ? 'active' : ''"
|
@click="handleTabsClick001(0)"
|
>{{ $t("yg") }}</span
|
>
|
</div>
|
<div style="width: 50%; text-align: center">
|
<span
|
:class="tabsIndex001 == 1 ? 'active' : ''"
|
@click="handleTabsClick001(1)"
|
>{{ $t("hj65") }}</span
|
>
|
</div>
|
<!-- <span :class="tabsIndex001 == 2 ? 'active' : ''" @click="handleTabsClick001(2)"
|
style="margin-left:0.25rem;">{{
|
$t('hj620') }}</span>
|
<span :class="tabsIndex001 == 3 ? 'active' : ''" @click="handleTabsClick001(3)"
|
style="margin-left:0.25rem;">{{
|
$t('hj621') }}</span> -->
|
</div>
|
</div>
|
|
<div
|
class="top_title"
|
style="top: 48px; padding: 0; border-radius: 0"
|
ref="topTitle"
|
>
|
<div>
|
<div class="tabs_title">
|
<!-- <div class="tb" v-for="(item, index) in tabsArr" :key="index" @click="handleTabsClick(item, index)">
|
<span :class="'active'">{{ item }}</span>
|
</div> -->
|
|
<div class="tb">
|
<div style="width: 33%; text-align: center">
|
<span
|
:class="tabsIndex0010 == 0 ? 'active' : ''"
|
@click="handleTabsClick0010(0)"
|
>{{ $t("TOPA") }}</span
|
>
|
</div>
|
<div style="width: 33%; text-align: center">
|
<span
|
:class="tabsIndex0010 == 1 ? 'active' : ''"
|
@click="handleTabsClick0010(1)"
|
>{{ $t("TOPB") }}</span
|
>
|
</div>
|
<div style="width: 33%; text-align: center">
|
<span
|
:class="tabsIndex0010 == 2 ? 'active' : ''"
|
@click="handleTabsClick0010(2)"
|
>{{ $t("TOPC") }}</span
|
>
|
</div>
|
<!-- <span :class="tabsIndex001 == 2 ? 'active' : ''" @click="handleTabsClick001(2)"
|
style="margin-left:0.25rem;">{{
|
$t('hj620') }}</span>
|
<span :class="tabsIndex001 == 3 ? 'active' : ''" @click="handleTabsClick001(3)"
|
style="margin-left:0.25rem;">{{
|
$t('hj621') }}</span> -->
|
</div>
|
</div>
|
</div>
|
</div>
|
<!-- <div class="right_money" @click="openDialog()">
|
<div class="content_money" v-if="tabsIndex === 1">
|
<div class="top_price">
|
<div class="left">
|
<span>{{ $t('hj47') }}</span>
|
</div>
|
<div class="right" v-if="userData.length == 0">円0.00</div>
|
<div class="right" v-if="userData.length != 0">
|
<span v-if="$store.state.userInfo.userAmt == undefined">円0.00</span>
|
<span v-if="$store.state.userInfo && tabsItemIndex == 1" style="white-space: nowarp;">
|
{{ '円' + $store.state.userInfo.userIndexAmt
|
}}
|
</span>
|
<span v-if="$store.state.userInfo.enableAmt != undefined && (tabsItemIndex == 0)"
|
style="white-space: nowarp;">
|
{{ '円 ' + $store.state.userInfo.enableAmt
|
}}
|
</span>
|
<span v-if="$store.state.userInfo.enableAmt != undefined && tabsItemIndex == 3"
|
style="white-space: nowarp;">
|
{{ '$ ' + (Number($store.state.userInfo.enableAmt) / 7.1).toFixed(2)
|
}}
|
</span>
|
<span v-if="$store.state.userInfo.enableAmt != undefined && tabsItemIndex == 4"
|
style="white-space: nowarp;">
|
{{ 'HK$ ' + (Number($store.state.userInfo.enableAmt) / 0.9).toFixed(2)
|
}}
|
</span>
|
<span v-if="$store.state.userInfo.enableAmt != undefined && tabsItemIndex == 2"
|
style="white-space: nowarp;">
|
{{ '円 ' + $store.state.userInfo.enableAmt
|
}}
|
</span>
|
<span v-if="$store.state.userInfo.enableAmt != undefined && tabsItemIndex == 5"
|
style="white-space: nowarp;">
|
{{ '円 ' + $store.state.userInfo.enableAmt
|
}}
|
</span>
|
|
</div>
|
<div class="sanjiao">
|
<img :class="dialogFlag ? 'xuanz' : ''" style="transition: all 0.5s;" src="../../assets/img/xiala.png"
|
alt />
|
</div>
|
</div>
|
<div class="bottom_balance">
|
<div>
|
<span>{{ $t('hj48') }}</span>
|
</div>
|
</div>
|
</div>
|
</div> -->
|
</div>
|
|
<div class="cards">
|
<div class="card_item">
|
<div class="tops_title">
|
<div>
|
<span>{{ $t("hj49") }}</span>
|
</div>
|
</div>
|
<div class="bottom_price">
|
<div v-if="tabsItemIndex != 3 && tabsItemIndex != 4">
|
<p
|
v-if="
|
this.$store.state.settingForm.indexDisplay &&
|
!this.$store.state.settingForm.futuresDisplay
|
"
|
class="account"
|
>
|
円{{
|
$store.state.hide
|
? "****"
|
: Number(
|
$store.state.userInfo.userAmt +
|
$store.state.userInfo.userIndexAmt
|
).toFixed(2)
|
}}
|
</p>
|
<p
|
v-else-if="
|
!this.$store.state.settingForm.indexDisplay &&
|
this.$store.state.settingForm.futuresDisplay
|
"
|
class="account"
|
>
|
円{{
|
$store.state.hide
|
? "****"
|
: Number(
|
$store.state.userInfo.userAmt +
|
$store.state.userInfo.userFuturesAmt
|
).toFixed(2)
|
}}
|
</p>
|
<p
|
v-else-if="
|
!this.$store.state.settingForm.indexDisplay &&
|
!this.$store.state.settingForm.futuresDisplay
|
"
|
class="account"
|
>
|
円{{
|
$store.state.hide
|
? "****"
|
: Number($store.state.userInfo.userAmt).toFixed(2)
|
}}
|
</p>
|
<!-- <p
|
v-else-if="this.$store.state.settingForm.indexDisplay && this.$store.state.settingForm.futuresDisplay"
|
class="account"
|
>
|
円{{ $store.state.hide ? '****' : Number($store.state.userInfo.userAmt +
|
$store.state.userInfo.userIndexAmt + $store.state.userInfo.userFuturesAmt).toFixed(2)
|
}}
|
</p> -->
|
</div>
|
<div v-if="tabsItemIndex == 3">
|
<p
|
v-if="
|
this.$store.state.settingForm.indexDisplay &&
|
!this.$store.state.settingForm.futuresDisplay
|
"
|
class="account"
|
>
|
$
|
{{
|
$store.state.hide
|
? "****"
|
: Number(
|
Number(
|
$store.state.userInfo.userAmt +
|
$store.state.userInfo.userIndexAmt
|
) / 7.1
|
).toFixed(2)
|
}}
|
</p>
|
<p
|
v-else-if="
|
!this.$store.state.settingForm.indexDisplay &&
|
this.$store.state.settingForm.futuresDisplay
|
"
|
class="account"
|
>
|
$
|
{{
|
$store.state.hide
|
? "****"
|
: Number(
|
Number(
|
$store.state.userInfo.userAmt +
|
$store.state.userInfo.userFuturesAmt
|
) / 7.1
|
).toFixed(2)
|
}}
|
</p>
|
<p
|
v-else-if="
|
!this.$store.state.settingForm.indexDisplay &&
|
!this.$store.state.settingForm.futuresDisplay
|
"
|
class="account"
|
>
|
$
|
{{
|
Number(
|
$store.state.hide
|
? "****"
|
: Number($store.state.userInfo.userAmt) / 7.1
|
).toFixed(2)
|
}}
|
</p>
|
<!-- <p
|
v-else-if="this.$store.state.settingForm.indexDisplay && this.$store.state.settingForm.futuresDisplay"
|
class="account"
|
>
|
円{{ $store.state.hide ? '****' : Number($store.state.userInfo.userAmt +
|
$store.state.userInfo.userIndexAmt + $store.state.userInfo.userFuturesAmt).toFixed(2)
|
}}
|
</p> -->
|
</div>
|
<div v-if="tabsItemIndex == 4">
|
<p
|
v-if="
|
this.$store.state.settingForm.indexDisplay &&
|
!this.$store.state.settingForm.futuresDisplay
|
"
|
class="account"
|
>
|
HK$
|
{{
|
$store.state.hide
|
? "****"
|
: Number(
|
Number(
|
$store.state.userInfo.userAmt +
|
$store.state.userInfo.userIndexAmt
|
) / 0.9
|
).toFixed(2)
|
}}
|
</p>
|
<p
|
v-else-if="
|
!this.$store.state.settingForm.indexDisplay &&
|
this.$store.state.settingForm.futuresDisplay
|
"
|
class="account"
|
>
|
HK$
|
{{
|
$store.state.hide
|
? "****"
|
: Number(
|
Number(
|
$store.state.userInfo.userAmt +
|
$store.state.userInfo.userFuturesAmt
|
) / 0.9
|
).toFixed(2)
|
}}
|
</p>
|
<p
|
v-else-if="
|
!this.$store.state.settingForm.indexDisplay &&
|
!this.$store.state.settingForm.futuresDisplay
|
"
|
class="account"
|
>
|
HK$
|
{{
|
$store.state.hide
|
? "****"
|
: Number(
|
Number($store.state.userInfo.userAmt) / 0.9
|
).toFixed(2)
|
}}
|
</p>
|
<!-- <p
|
v-else-if="this.$store.state.settingForm.indexDisplay && this.$store.state.settingForm.futuresDisplay"
|
class="account"
|
>
|
円{{ $store.state.hide ? '****' : Number($store.state.userInfo.userAmt +
|
$store.state.userInfo.userIndexAmt + $store.state.userInfo.userFuturesAmt).toFixed(2)
|
}}
|
</p> -->
|
</div>
|
</div>
|
</div>
|
|
<div class="card_item">
|
<div class="tops_title">
|
<div>
|
<span>{{ $t("hj50") }}</span>
|
</div>
|
</div>
|
<div class="bottom_price">
|
<div>
|
<span v-show="tabsItemIndex == 1">
|
{{
|
$store.state.hide
|
? "****"
|
: Number(
|
($store.state.userInfo.enableIndexAmt +
|
$store.state.userInfo.allIndexFreezAmt) *
|
indexSettingInfo.forceSellPercent
|
).toFixed(2)
|
}}
|
</span>
|
<span v-show="tabsItemIndex == 0 || tabsItemIndex == 5">
|
{{
|
$store.state.hide
|
? "****"
|
: Number(
|
($store.state.userInfo.enableAmt +
|
$store.state.userInfo.allFreezAmt) *
|
settingInfo.forceStopPercent
|
).toFixed(2)
|
}}
|
</span>
|
<span v-show="tabsItemIndex == 3">
|
{{
|
$store.state.hide
|
? "****"
|
: Number(
|
Number(
|
($store.state.userInfo.enableAmt +
|
$store.state.userInfo.allFreezAmt) *
|
Number(settingInfo.forceStopPercent)
|
) / 7.1
|
).toFixed(2)
|
}}
|
</span>
|
<span v-show="tabsItemIndex == 4">
|
{{
|
$store.state.hide
|
? "****"
|
: Number(
|
Number(
|
Number(
|
$store.state.userInfo.enableAmt +
|
$store.state.userInfo.allFreezAmt
|
) * Number(settingInfo.forceStopPercent)
|
) / 0.9
|
).toFixed(2)
|
}}
|
</span>
|
<span v-show="tabsItemIndex == 2">
|
{{
|
$store.state.hide
|
? "****"
|
: Number(
|
($store.state.userInfo.enableAmt +
|
$store.state.userInfo.allFreezAmt) *
|
settingInfo.forceStopPercent
|
).toFixed(2)
|
}}
|
</span>
|
<!-- <span v-show="tabsItemIndex == 3">
|
{{ $store.state.hide ? '****' :
|
Number(($store.state.userInfo.enableFuturesAmt +
|
$store.state.userInfo.allFuturesFreezAmt) * futuresSettingInfo.forceSellPercent).toFixed(2)
|
}}
|
</span> -->
|
</div>
|
</div>
|
</div>
|
<div class="card_item">
|
<div class="tops_title">
|
<div>
|
<span>
|
{{
|
tabsItemIndex == 1
|
? $t("hj51")
|
: tabsItemIndex == 0
|
? $t("hj52")
|
: tabsItemIndex == 2
|
? $t("hj52")
|
: tabsItemIndex == 5
|
? $t("hj52")
|
: ""
|
}}
|
</span>
|
<span>{{ $t("hj53") }}</span>
|
</div>
|
</div>
|
<div class="bottom_price">
|
<div>
|
<span v-show="tabsItemIndex == 1">{{
|
"円 " + $store.state.userInfo.userIndexAmt
|
}}</span>
|
<span v-show="tabsItemIndex == 0 || tabsItemIndex == 5">{{
|
"円 " + $store.state.userInfo.userAmt
|
}}</span>
|
<span v-show="tabsItemIndex == 3">{{
|
"$ " + (Number($store.state.userInfo.userAmt) / 7.1).toFixed(2)
|
}}</span>
|
<span v-show="tabsItemIndex == 4">{{
|
"HK$ " +
|
(Number($store.state.userInfo.userAmt) / 0.9).toFixed(2)
|
}}</span>
|
<span v-show="tabsItemIndex == 2">{{
|
"円 " + $store.state.userInfo.userAmt
|
}}</span>
|
<!-- <span v-show="tabsItemIndex == 3">{{ '円 ' + $store.state.userInfo.userFuturesAmt }}</span> -->
|
</div>
|
</div>
|
</div>
|
<div class="card_item">
|
<div class="tops_title">
|
<div>
|
<span>{{ $t("hj54") }}</span>
|
</div>
|
</div>
|
<div class="bottom_price">
|
<div>
|
<span v-show="tabsItemIndex == 1">{{
|
"円 " + $store.state.userInfo.enableIndexAmt
|
}}</span>
|
<span v-show="tabsItemIndex == 0 || tabsItemIndex == 5">{{
|
"円 " + $store.state.userInfo.enableAmt
|
}}</span>
|
<span v-show="tabsItemIndex == 3">{{
|
"$ " +
|
(Number($store.state.userInfo.enableAmt) / 7.1).toFixed(2)
|
}}</span>
|
<span v-show="tabsItemIndex == 4">{{
|
"HK$ " +
|
(Number($store.state.userInfo.enableAmt) / 0.9).toFixed(2)
|
}}</span>
|
<span v-show="tabsItemIndex == 2">{{
|
"円 " + $store.state.userInfo.enableAmt
|
}}</span>
|
<!-- <span v-show="tabsItemIndex == 3">{{ '円 ' + $store.state.userInfo.enableFuturesAmt }}</span> -->
|
</div>
|
</div>
|
</div>
|
<div class="card_item">
|
<div class="tops_title">
|
<div>
|
<span>{{ $t("hj55") }}</span>
|
</div>
|
</div>
|
<div class="bottom_price">
|
<div>
|
<span v-show="tabsItemIndex == 1">{{
|
"円 " + $store.state.userInfo.allIndexFreezAmt
|
}}</span>
|
<span v-show="tabsItemIndex == 0">{{
|
"円 " + $store.state.userInfo.allFreezAmt
|
}}</span>
|
<span v-show="tabsItemIndex == 5">{{
|
"円 " + $store.state.userInfo.djzj
|
}}</span>
|
<span v-show="tabsItemIndex == 3">{{
|
"$ " +
|
(Number($store.state.userInfo.allFreezAmt) / 7.1).toFixed(2)
|
}}</span>
|
<span v-show="tabsItemIndex == 4">{{
|
"HK$ " +
|
(Number($store.state.userInfo.allFreezAmt) / 0.9).toFixed(2)
|
}}</span>
|
<span v-show="tabsItemIndex == 2">{{
|
"円 " + $store.state.userInfo.allFreezAmt
|
}}</span>
|
<!-- <span v-show="tabsItemIndex == 3">{{ '円 ' + $store.state.userInfo.allFuturesFreezAmt }}</span> -->
|
</div>
|
</div>
|
</div>
|
<div class="card_item">
|
<div class="tops_title">
|
<div>
|
<span>{{ $t("hj56") }}</span>
|
</div>
|
</div>
|
<div class="bottom_price">
|
<div>
|
<span
|
:class="
|
$store.state.userInfo.allIndexProfitAndLose > 0
|
? ' red'
|
: $store.state.userInfo.allIndexProfitAndLose < 0
|
? ' green'
|
: ''
|
"
|
v-show="tabsItemIndex == 1"
|
>{{ "円 " + $store.state.userInfo.allIndexProfitAndLose }}</span
|
>
|
<span
|
:class="
|
$store.state.userInfo.allProfitAndLose > 0
|
? ' red'
|
: $store.state.userInfo.allProfitAndLose < 0
|
? ' green'
|
: ''
|
"
|
v-show="tabsItemIndex == 0 || tabsItemIndex == 5"
|
>{{ "円 " + $store.state.userInfo.allProfitAndLose }}</span
|
>
|
<span
|
:class="
|
$store.state.userInfo.allProfitAndLose > 0
|
? ' red'
|
: $store.state.userInfo.allProfitAndLose < 0
|
? ' green'
|
: ''
|
"
|
v-show="tabsItemIndex == 3"
|
>{{
|
"$ " +
|
(
|
Number($store.state.userInfo.allProfitAndLose) / 7.1
|
).toFixed(2)
|
}}</span
|
>
|
<span
|
:class="
|
$store.state.userInfo.allProfitAndLose > 0
|
? ' red'
|
: $store.state.userInfo.allProfitAndLose < 0
|
? ' green'
|
: ''
|
"
|
v-show="tabsItemIndex == 4"
|
>{{
|
"HK$ " +
|
(
|
Number($store.state.userInfo.allProfitAndLose) / 0.9
|
).toFixed(2)
|
}}</span
|
>
|
<span
|
:class="
|
$store.state.userInfo.allProfitAndLose > 0
|
? ' red'
|
: $store.state.userInfo.allProfitAndLose < 0
|
? ' green'
|
: ''
|
"
|
v-show="tabsItemIndex == 2"
|
>{{ "円 " + $store.state.userInfo.allProfitAndLose }}</span
|
>
|
<!-- <span
|
:class="$store.state.userInfo.allFuturesProfitAndLose > 0 ? 'red' : $store.state.userInfo.allFuturesProfitAndLose < 0 ? ' green' : ''"
|
v-show="tabsItemIndex == 3">{{ '円' +Number($store.state.userInfo.allFuturesProfitAndLose).toFixed(2)}}</span> -->
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<!-- 新股弹窗 -->
|
<van-popup
|
v-model="settingDialog"
|
position="bottom"
|
:style="{ height: '35%' }"
|
@close="popClose"
|
>
|
<div class="setting_content">
|
<div class="old_password">
|
<div class="left_titles">
|
<span>{{ $t("hj57") }}:</span>
|
</div>
|
<div class="right_password_input">
|
<input type="number" v-model="sgNum" />
|
</div>
|
</div>
|
<div class="btn_setting" @click="changeSg()">
|
<span>{{ $t("hj58") }}</span>
|
</div>
|
<div class="shijian">
|
<div class="xgsj">
|
<div class="sjtlt">{{ $t("hj59") }}:</div>
|
<div class="xgTime" v-if="this.sgsj">
|
{{ this.sgsj | getTimeYear }}
|
</div>
|
</div>
|
<div class="xgsj">
|
<div class="sjtlt">{{ $t("hj60") }}:</div>
|
<div class="xgTime" v-if="this.rjsj">
|
{{ this.rjsj | getTimeYear }}
|
</div>
|
</div>
|
</div>
|
<!-- <div class="old_password">
|
<div class="left_titles">
|
<span>{{ '新密码:' }}</span>
|
</div>
|
<div class="right_password_input">
|
<input type="password" v-model="newPassword" />
|
</div>
|
</div>
|
<div class="old_password">
|
<div class="left_titles">
|
<span>{{ '确认新密码:' }}</span>
|
</div>
|
<div class="right_password_input">
|
<input type="password" v-model="cirNewPassword" />
|
</div>
|
</div> -->
|
</div>
|
</van-popup>
|
</div>
|
</template>
|
|
<script>
|
// Toast
|
import { Toast } from "vant";
|
import * as api from "@/axios/api";
|
import handleDt from "@/utils/deTh";
|
export default {
|
name: "trading",
|
components: {},
|
data() {
|
return {
|
tabsIndex001: 0,
|
tabsIndex0010: 0,
|
tabsIndex: 1,
|
tabsArr: [this.$t("hj62")],
|
// this.$t('hj61')
|
tabClassActive: 1,
|
dialogFlag: false,
|
pageNum: 1,
|
pageNums: 1,
|
stockPlate: "",
|
alertShow: false,
|
isToken: "",
|
elType: "warning",
|
indexSettingInfo: {},
|
futuresSettingInfo: {},
|
settingInfo: {},
|
loading: false,
|
orderBy: "desc",
|
loadings: false,
|
finished: false,
|
finisheds: false,
|
settingDialog: false,
|
xinguprice: "",
|
sgNum: 1,
|
sgCode: "",
|
gpcode: "",
|
gpcodes: "",
|
texts: "",
|
sgsj: "",
|
rjsj: "",
|
orderNumber: "",
|
elAlertShow: false,
|
userData: [],
|
elAlertText: "",
|
stockType: "",
|
tabsClassArr: [
|
{
|
name: this.$t("hj63"),
|
type: 0,
|
},
|
{
|
name: this.$t("hj51"),
|
type: 1,
|
},
|
|
{
|
name: this.$t("hj64"),
|
type: 2,
|
},
|
// {
|
// name: "期货",
|
// type: 3
|
// }
|
{
|
name: this.$t("hj65"),
|
type: 3,
|
},
|
{
|
name: this.$t("hj66"),
|
type: 4,
|
},
|
{
|
name: this.$t("hj3"),
|
type: 5,
|
},
|
],
|
tabsItemIndex: 0,
|
listArr: [],
|
listArr1: [],
|
listArr2: [],
|
listArr3: [],
|
listArr4: [],
|
listArr5: [],
|
listArrs: [],
|
};
|
},
|
props: ["typety"],
|
|
created() {
|
if (this.$route.query.type === 1) {
|
// 选中sousuo输入框
|
this.$nextTick(() => {
|
this.$refs.search.focus();
|
});
|
}
|
if (this.$route.query.listid) {
|
this.tabsItemIndex = Number(this.$route.query.listid);
|
if (this.tabsItemIndex === 5) {
|
this.loading = true;
|
this.getFutures();
|
}
|
}
|
},
|
|
mounted() {
|
// this.loading = true
|
if (this.$route.query.indexid === 3) {
|
this.tabsIndex001 = 2;
|
this.getStock002();
|
} else {
|
this.getStock();
|
}
|
this.isToken = window.localStorage.getItem("USERTOKEN");
|
this.getUserInfo();
|
this.getIndexSettingInfo();
|
this.getSettingInfo();
|
this.getFuturesSetting();
|
},
|
methods: {
|
onLoad() {
|
// 异步更新数据
|
// setTimeout 仅做示例，真实场景中一般为 ajax 请求
|
switch (this.tabsItemIndex) {
|
case 1:
|
this.loading = true;
|
this.getListMarket();
|
break;
|
case 0:
|
this.stockPlate = "";
|
this.stockType = "";
|
this.loading = true;
|
|
if (this.tabsIndex001 === 0) {
|
this.getStock(true);
|
} else if (this.tabsIndex001 === 1) {
|
this.getStock009(true);
|
} else if (this.tabsIndex001 === 2) {
|
} else if (this.tabsIndex001 === 3) {
|
this.getStock002(true);
|
}
|
|
break;
|
case 2:
|
this.stockPlate = "科创";
|
this.stockType = "";
|
this.loading = true;
|
this.getStocks();
|
break;
|
case 3:
|
this.stockPlate = "";
|
this.stockType = "us";
|
this.loading = true;
|
this.getStockUs();
|
break;
|
case 4:
|
this.stockPlate = "";
|
this.stockType = "hk";
|
this.loading = true;
|
this.getStockHk();
|
break;
|
case 5:
|
this.loading = true;
|
this.getFutures();
|
break;
|
}
|
|
// 加载状态结束
|
// this.loading = false;
|
|
// 数据全部加载完成
|
// if (this.list.length >= 40) {
|
// this.finished = true;
|
// }
|
},
|
gpinput: handleDt.debounce(function () {
|
this.pageNum = 1;
|
this.listArr = [];
|
this.listArr1 = [];
|
this.listArr2 = [];
|
this.listArr3 = [];
|
this.listArr4 = [];
|
this.listArr5 = [];
|
this.loading = true;
|
this.finished = false;
|
this.stockType = "";
|
switch (this.tabsItemIndex) {
|
case 1:
|
this.getListMarket();
|
break;
|
case 0:
|
this.stockPlate = "";
|
this.stockType = "";
|
this.getStock();
|
|
break;
|
case 2:
|
this.stockPlate = "科创";
|
this.stockType = "";
|
this.getStocks();
|
break;
|
case 3:
|
this.stockPlate = "";
|
this.stockType = "us";
|
this.getStockUs();
|
break;
|
case 4:
|
this.stockPlate = "";
|
this.stockType = "hk";
|
this.getStockHk();
|
break;
|
case 5:
|
this.getFutures();
|
break;
|
}
|
}, 1000),
|
gpinputs() {
|
this.pageNums = 1;
|
this.listArrs = [];
|
this.loadings = true;
|
this.finisheds = false;
|
this.getMyList();
|
},
|
onLoads() {
|
this.pageNums++;
|
this.loadings = true;
|
this.getMyList();
|
},
|
closeAlert() {
|
this.alertShow = false;
|
},
|
async getUserInfo() {
|
// 获取用户信息
|
// let showcookie = this.getCookie('USER_TOKEN');
|
let data = await api.getUserInfo();
|
if (data.status === 0) {
|
// this.getProductSetting()
|
|
this.$store.state.userInfo = data.data;
|
this.userData = data.data;
|
} else {
|
}
|
this.$store.state.user = this.user;
|
},
|
async getIndexSettingInfo() {
|
// 网站设置信息 指数
|
let data = await api.getIndexSetting();
|
if (data.status === 0) {
|
// 成功
|
this.indexSettingInfo = data.data;
|
} else {
|
this.$store.commit("elAlertShow", {
|
elAlertShow: true,
|
elAlertText: data.msg,
|
});
|
}
|
},
|
async getFuturesSetting() {
|
// 网站设置信息 期货
|
let data = await api.getFuturesSetting();
|
if (data.status === 0) {
|
// 成功
|
this.futuresSettingInfo = data.data;
|
} else {
|
this.$store.commit("elAlertShow", {
|
elAlertShow: true,
|
elAlertText: data.msg,
|
});
|
}
|
},
|
async getSettingInfo() {
|
let data = await api.getSetting();
|
if (data.status === 0) {
|
// 成功
|
this.settingInfo = data.data;
|
} else {
|
// `this.$store.commit('elAlertShow',{'elAlertShow':true,'elAlertText': data.msg});`
|
this.$store.commit("elAlertShow", {
|
elAlertShow: true,
|
elAlertText: data.msg,
|
});
|
}
|
},
|
getListMarket: handleDt.debounce(async function () {
|
let val = {
|
pageNum: this.pageNum,
|
pageSize: 15,
|
};
|
// 获取指数列表
|
let result = await api.getListMarket(val);
|
this.loading = false;
|
if (result.status === 0) {
|
if (this.tabsItemIndex === 1) {
|
this.listArr1 = result.data;
|
this.finished = true;
|
}
|
} else {
|
this.texts = result.msg;
|
this.alertShow = true;
|
}
|
}, 500),
|
getStock: handleDt.debounce(async function (pageNum) {
|
// let stockType = this.tabsIndex001 == 0 ? "IN" : "US";JP
|
let stockType = "JP";
|
let pageNumVal = pageNum ? this.pageNum++ : 1;
|
|
// 沪深
|
let opt = {
|
pageNum: pageNumVal,
|
pageSize: 15,
|
stockPlate: this.stockPlate,
|
keyWords: this.gpcode,
|
stockType: stockType,
|
orderBy: this.orderBy,
|
};
|
// let data = await api.getStock(opt)
|
let data = await api.getStockByType(opt);
|
this.loading = false;
|
// this.listArr =[];
|
|
// console.log(this.typety+"*************");
|
|
if (data.status === 0) {
|
if (data.data.list.length < 15) {
|
this.finished = true;
|
}
|
if (this.tabsIndex001 === 0 && this.pageNum === 1) {
|
this.listArr = data.data.list;
|
} else if (this.tabsIndex001 === 0) {
|
if (this.tabsItemIndex === 0) {
|
if (this.gpcode) {
|
this.listArr = data.data.list;
|
} else {
|
data.data.list.forEach((element) => {
|
this.listArr.push(element);
|
});
|
}
|
}
|
} else {
|
this.listArr = data.data.list;
|
}
|
} else {
|
this.texts = data.msg;
|
this.alertShow = true;
|
}
|
}, 500),
|
|
getStock009: handleDt.debounce(async function (pageNum) {
|
let pageNumVal = pageNum ? this.pageNum++ : 1;
|
|
// 沪深
|
let opt = {
|
pageNum: pageNumVal,
|
pageSize: 15,
|
stockPlate: this.stockPlate,
|
keyWords: this.gpcode,
|
stockType: "US",
|
};
|
let data = await api.getStock(opt);
|
this.loading = false;
|
if (data.status === 0) {
|
if (data.data.list.length < 15) {
|
this.finished = true;
|
}
|
if (this.tabsIndex001 === 1) {
|
if (this.pageNum === 1) {
|
this.listArr = data.data.list;
|
} else {
|
data.data.list.forEach((element) => {
|
this.listArr.push(element);
|
});
|
}
|
}
|
} else {
|
this.texts = data.msg;
|
this.alertShow = true;
|
}
|
}, 500),
|
|
getStockUs: handleDt.debounce(async function () {
|
// 美股
|
let opt = {
|
pageNum: this.pageNum,
|
pageSize: 15,
|
stockPlate: this.stockPlate,
|
keyWords: this.gpcode,
|
stockType: this.stockType,
|
};
|
let data = await api.getStock(opt);
|
this.loading = false;
|
if (data.status === 0) {
|
if (data.data.list.length < 15) {
|
this.finished = true;
|
}
|
if (this.tabsItemIndex === 3) {
|
if (this.gpcode) {
|
this.listArr3 = data.data.list;
|
} else {
|
data.data.list.forEach((element) => {
|
this.listArr3.push(element);
|
});
|
}
|
}
|
} else {
|
this.texts = data.msg;
|
this.alertShow = true;
|
}
|
}, 500),
|
getStockHk: handleDt.debounce(async function () {
|
// 港股
|
let opt = {
|
pageNum: this.pageNum,
|
pageSize: 15,
|
stockPlate: this.stockPlate,
|
keyWords: this.gpcode,
|
stockType: this.stockType,
|
};
|
let data = await api.getStock(opt);
|
this.loading = false;
|
if (data.status === 0) {
|
if (data.data.list.length < 15) {
|
this.finished = true;
|
}
|
if (this.tabsItemIndex === 4) {
|
if (this.gpcode) {
|
this.listArr4 = data.data.list;
|
} else {
|
data.data.list.forEach((element) => {
|
this.listArr4.push(element);
|
});
|
}
|
}
|
} else {
|
this.texts = data.msg;
|
this.alertShow = true;
|
}
|
}, 500),
|
getStocks: handleDt.debounce(async function () {
|
// 科创
|
let opt = {
|
pageNum: this.pageNum,
|
pageSize: 15,
|
stockPlate: this.stockPlate,
|
keyWords: this.gpcode,
|
};
|
let data = await api.getStock(opt);
|
this.loading = false;
|
if (data.status === 0) {
|
if (data.data.list.length < 15) {
|
this.finished = true;
|
}
|
if (this.tabsItemIndex === 2) {
|
if (this.gpcode) {
|
this.listArr2 = data.data.list;
|
} else {
|
data.data.list.forEach((element) => {
|
this.listArr2.push(element);
|
});
|
}
|
}
|
} else {
|
this.texts = data.msg;
|
this.alertShow = true;
|
}
|
}, 500),
|
|
popClose() {
|
this.sgCode = "";
|
this.sgsj = "";
|
this.rjsj = "";
|
this.orderNumber = "";
|
},
|
async changeSg() {
|
if (!this.sgNum) {
|
Toast(this.$t("hj67"));
|
return;
|
}
|
// this.sgNum必须是数字并且不能小于1
|
if (this.sgNum < 1) {
|
Toast(this.$t("hj68"));
|
return;
|
}
|
if (this.sgNum > this.orderNumber) {
|
Toast(this.$t("hj69") + this.orderNumber);
|
return;
|
}
|
|
let opt = {
|
newCode: this.sgCode,
|
applyNums: this.sgNum,
|
phone: this.$store.state.userInfo.phone,
|
};
|
let data = await api.getNewAdd(opt);
|
if (data.status === 0) {
|
this.sgShow = false;
|
this.sgCode = "";
|
this.sgsj = "";
|
this.rjsj = "";
|
this.orderNumber = "";
|
Toast(this.$t("hj70"));
|
this.$router.push({ path: "/warehouse?index=3" });
|
} else {
|
Toast(data.msg);
|
}
|
if (navigator.vibrate) {
|
// 支持
|
navigator.vibrate([55]);
|
}
|
},
|
handleGoToKlineDetail1(item) {
|
var codes = item.stockCode;
|
var names = item.stockName;
|
var ifZhishu = "0";
|
var ifUs =
|
item.stock_type === "us" ? "1" : item.stock_type === "hk" ? "2" : "";
|
this.$router.push({
|
path: "/kline",
|
query: {
|
name: names,
|
code: codes,
|
if_us: ifUs,
|
if_zhishu: ifZhishu,
|
sok: item.type ? item.type : this.filterSH(item.stock_type),
|
type: item.stock_type,
|
},
|
});
|
},
|
// 进入详情
|
handleGoToKlineDetail(item) {
|
if (
|
this.userData.length === 0 &&
|
Object.keys(this.$store.state.userInfo).length < 1
|
) {
|
this.$store.commit("dialogVisible", true);
|
return;
|
}
|
const obj = {
|
pid: item.code || "",
|
type: item.stock_type || "",
|
};
|
window.localStorage.setItem("kLine", JSON.stringify(obj));
|
var codes = "";
|
var names = "";
|
var stockType = "";
|
var soks = "";
|
var ifZhishu = "0";
|
var ifUs = "";
|
switch (this.tabsItemIndex) {
|
case 0:
|
codes = item.code;
|
names = item.name;
|
stockType =
|
item.stock_type === "us" ? item.stock_type + "a" : item.stock_type;
|
soks = item.type ? item.type : this.filterSH(item.stock_type);
|
ifZhishu = "0";
|
ifUs = item.stock_type === "us" ? "1" : "";
|
break;
|
case 3:
|
codes = item.code;
|
names = item.name;
|
stockType = item.stock_type + "a";
|
ifUs = "1";
|
soks = item.type;
|
ifZhishu = "0";
|
break;
|
case 4:
|
codes = item.code;
|
names = item.name;
|
stockType = item.stock_type;
|
soks = item.type;
|
ifZhishu = "0";
|
ifUs = "2";
|
break;
|
case 1:
|
codes = item.indexGid;
|
names = item.indexName;
|
stockType = "sh";
|
ifZhishu = item.indexCode;
|
soks = item.type ? item.type : 0;
|
break;
|
case 2:
|
codes = item.code;
|
names = item.name;
|
stockType = item.stock_type;
|
soks = this.filterSH(item.stock_type);
|
ifZhishu = "0";
|
break;
|
case 5:
|
this.sgCode = item.code;
|
this.xinguprice = item.price;
|
this.sgsj = item.subscribeTime;
|
this.rjsj = item.subscriptionTime;
|
this.orderNumber = item.orderNumber;
|
this.sgNum = Math.floor(
|
this.$store.state.userInfo.enableAmt / this.xinguprice
|
);
|
this.settingDialog = true;
|
|
// return
|
codes = item.futuresGid;
|
names = item.futuresName;
|
soks = 0;
|
stockType = "qh";
|
ifZhishu = item.indexGid;
|
break;
|
default:
|
break;
|
}
|
console.log(this.tabsItemIndex);
|
if (this.tabsItemIndex !== 5) {
|
this.$router.push({
|
path: "/kline",
|
query: {
|
name: names,
|
stockplate: item.stock_plate,
|
code: codes,
|
type: stockType,
|
sok: soks,
|
if_us: ifUs,
|
usType: item.type,
|
if_zhishu: ifZhishu,
|
},
|
});
|
}
|
},
|
filterSH(val) {
|
if (val === "sh") {
|
return 1;
|
} else if (val === "bj" || val === "sz") {
|
return 0;
|
}
|
},
|
|
getFutures: handleDt.debounce(async function () {
|
// 获取期货列表
|
let opt = {};
|
let data = await api.getNewGu(opt);
|
this.loading = false;
|
if (data.status === 0) {
|
if (this.tabsItemIndex === 5) {
|
for (let index = 0; index < data.data.list.length; index++) {
|
if (data.data.list[index].zt === 0) {
|
this.listArr5.push(data.data.list[index]);
|
}
|
}
|
}
|
this.finished = true;
|
} else {
|
this.texts = data.msg;
|
this.alertShow = true;
|
}
|
}, 500),
|
// async getFutures() {
|
// // 获取期货列表
|
// let opt = {
|
// homeShow: 1,
|
// pageNum: this.pageNum,
|
// pageSize: 15
|
// };
|
// let data = await api.getListFutures(opt);
|
// this.loading = false;
|
// if (data.data.length < 15) {
|
// this.finished = true;
|
// }
|
// if (data.status === 0) {
|
// if (this.tabsItemIndex == 3) {
|
// data.data.forEach(element => {
|
// this.listArr.push(element);
|
// });
|
// }
|
// } else {
|
// this.texts = data.msg;
|
// this.alertShow = true;
|
// }
|
// },
|
async getMyList() {
|
this.loadings = true;
|
// 获取自选列表
|
let opt = {
|
pageNum: this.pageNums,
|
pageSize: 15,
|
keyWords: this.gpcodes,
|
};
|
let data = await api.getMyList(opt);
|
this.loadings = false;
|
if (data.status === 0) {
|
data.data.list.forEach((element) => {
|
this.listArrs.push(element);
|
});
|
}
|
if (data.data.list.length < 15) {
|
this.finisheds = true;
|
}
|
},
|
handleTabsClick0010(ind) {
|
this.tabsIndex0010 = ind;
|
console.log(2112, this.$route.path);
|
// this.$router.replace({ path: this.$route.path, query: {} })
|
this.pageNum = 1;
|
this.listArr = [];
|
this.listArr1 = [];
|
this.listArr2 = [];
|
this.listArr3 = [];
|
this.listArr4 = [];
|
this.listArr5 = [];
|
if (ind === 0) {
|
this.listArr = [];
|
this.pageNum = 1;
|
this.loading = false;
|
this.finished = false;
|
this.orderBy = "desc";
|
this.getStock();
|
} else if (ind === 1) {
|
this.listArr = [];
|
this.pageNum = 1;
|
this.loading = false;
|
this.finished = false;
|
this.orderBy = "asc";
|
this.getStock();
|
} else if (ind === 2) {
|
this.listArr = [];
|
this.pageNum = 1;
|
this.loading = false;
|
this.finished = false;
|
this.orderBy = "voloume";
|
this.getStock();
|
} else if (ind === 3) {
|
this.listArr = [];
|
this.pageNum = 1;
|
this.loading = false;
|
this.finished = false;
|
this.getStock002();
|
}
|
},
|
handleTabsClick001(ind) {
|
this.tabsIndex001 = ind;
|
console.log(2112, this.$route.path);
|
// this.$router.replace({ path: this.$route.path, query: {} })
|
this.pageNum = 1;
|
this.listArr = [];
|
this.listArr1 = [];
|
this.listArr2 = [];
|
this.listArr3 = [];
|
this.listArr4 = [];
|
this.listArr5 = [];
|
if (ind === 0) {
|
this.listArr = [];
|
this.pageNum = 1;
|
this.loading = false;
|
this.finished = false;
|
this.getStock();
|
} else if (ind === 1) {
|
this.listArr = [];
|
this.pageNum = 1;
|
this.loading = false;
|
this.finished = false;
|
this.getStock();
|
} else if (ind === 2) {
|
this.listArr = [];
|
this.pageNum = 1;
|
this.loading = false;
|
this.finished = false;
|
this.getStock();
|
}
|
},
|
handleTabsItem(item, index) {
|
this.tabsItemIndex = index;
|
this.pageNum = 1;
|
this.finished = false;
|
this.loading = true;
|
switch (item.type) {
|
case 1:
|
this.listArr1 = [];
|
this.getListMarket();
|
break;
|
case 0:
|
this.stockPlate = "";
|
this.listArr = [];
|
this.stockType = "";
|
this.getStock();
|
break;
|
case 2:
|
this.stockPlate = "科创";
|
this.stockType = "";
|
this.listArr2 = [];
|
this.getStocks();
|
break;
|
case 3:
|
this.stockPlate = "";
|
this.stockType = "us";
|
this.listArr3 = [];
|
this.getStockUs();
|
break;
|
case 4:
|
this.stockPlate = "";
|
this.stockType = "hk";
|
this.listArr4 = [];
|
this.getStockHk();
|
break;
|
case 5:
|
this.listArr5 = [];
|
this.getFutures();
|
break;
|
}
|
if (navigator.vibrate) {
|
// 支持
|
navigator.vibrate([55]);
|
}
|
},
|
async options(val) {
|
if (this.tabsItemIndex === 1) {
|
this.$message({
|
message: this.$t("hj71"),
|
type: "warning",
|
});
|
return;
|
}
|
var codes = "";
|
switch (this.tabsItemIndex) {
|
case 0:
|
codes = val.code;
|
break;
|
case 1:
|
codes = val.indexGid;
|
break;
|
case 2:
|
codes = val.code;
|
break;
|
case 3:
|
codes = val.code;
|
break;
|
case 4:
|
codes = val.code;
|
break;
|
case 5:
|
codes = val.futuresGid;
|
break;
|
default:
|
break;
|
}
|
if (val.isOption === "1") {
|
let data = await api.delOption({ code: codes });
|
if (data.status === 0) {
|
switch (this.tabsItemIndex) {
|
case 1:
|
this.pageNum = 1;
|
this.listArr1 = [];
|
this.loading = true;
|
this.finished = false;
|
this.getListMarket();
|
break;
|
case 0:
|
this.stockPlate = "";
|
this.pageNum = 1;
|
this.stockType = "";
|
this.loading = true;
|
this.listArr = [];
|
this.finished = false;
|
this.getStock();
|
break;
|
case 2:
|
this.stockPlate = "科创";
|
this.pageNum = 1;
|
this.stockType = "";
|
this.loading = true;
|
this.listArr2 = [];
|
this.finished = false;
|
this.getStocks();
|
break;
|
case 3:
|
this.stockPlate = "";
|
this.stockType = "us";
|
this.pageNum = 1;
|
this.loading = true;
|
this.listArr3 = [];
|
this.finished = false;
|
this.getStockUs();
|
break;
|
case 4:
|
this.stockPlate = "";
|
this.stockType = "hk";
|
this.pageNum = 1;
|
this.loading = true;
|
this.listArr4 = [];
|
this.finished = false;
|
this.getStockHk();
|
break;
|
case 5:
|
this.listArr5 = [];
|
this.loading = true;
|
this.pageNum = 1;
|
this.finished = false;
|
this.getFutures();
|
break;
|
}
|
this.refreshList();
|
} else {
|
console.log(data.msg);
|
}
|
} else {
|
let data = await api.addOption({ code: codes });
|
if (data.status === 0) {
|
switch (this.tabsItemIndex) {
|
case 1:
|
this.listArr1 = [];
|
this.pageNum = 1;
|
this.finished = false;
|
this.getListMarket();
|
break;
|
case 0:
|
this.stockPlate = "";
|
this.stockType = "";
|
this.pageNum = 1;
|
this.finished = false;
|
this.listArr = [];
|
this.getStock();
|
break;
|
case 2:
|
this.stockPlate = "科创";
|
this.stockType = "";
|
this.pageNum = 1;
|
this.finished = false;
|
this.listArr2 = [];
|
this.getStocks();
|
break;
|
case 3:
|
this.stockPlate = "";
|
this.pageNum = 1;
|
this.finished = false;
|
this.stockType = "us";
|
this.listArr3 = [];
|
this.getStockUs();
|
break;
|
case 4:
|
this.stockPlate = "";
|
this.stockType = "hk";
|
this.pageNum = 1;
|
this.finished = false;
|
this.listArr4 = [];
|
this.getStockHk();
|
break;
|
case 5:
|
this.listArr5 = [];
|
this.pageNum = 1;
|
this.finished = false;
|
this.getFutures();
|
break;
|
}
|
} else {
|
console.log(data.msg);
|
}
|
}
|
if (navigator.vibrate) {
|
// 支持
|
navigator.vibrate([55]);
|
}
|
},
|
async optionszx(val) {
|
let data = await api.delOption({ code: val.stockGid });
|
if (data.status === 0) {
|
this.listArrs = [];
|
this.pageNums = 1;
|
this.finisheds = false;
|
this.getMyList();
|
} else {
|
console.log(data.msg);
|
}
|
if (navigator.vibrate) {
|
// 支持
|
navigator.vibrate([55]);
|
}
|
},
|
async refreshList() {
|
// 刷新指数
|
if (this.loading) {
|
return;
|
}
|
let opt = {
|
pageNum: 1,
|
pageSize: this.currentNum,
|
};
|
let data = await api.getListMarket(opt);
|
this.list = data.data;
|
},
|
handleCollectionClick(item) {
|
item.collection = !item.collection;
|
},
|
openDialog() {
|
if (this.userData.length === 0) {
|
this.$store.commit("dialogVisible", true);
|
return;
|
}
|
if (!this.dialogFlag) {
|
this.$refs["topTitle"].style.height = "6.9rem";
|
} else {
|
this.$refs["topTitle"].style.height = "1.2821rem";
|
}
|
this.dialogFlag = !this.dialogFlag;
|
},
|
},
|
filters: {
|
getName(spell) {
|
// if (spell.length > 15) {
|
// return spell.substring(0, 14)
|
// } else {
|
return spell;
|
// }
|
},
|
gettime(time) {
|
if (!time) {
|
return "";
|
}
|
var nd = new Date(time);
|
// var y = nd.getFullYear()
|
var mm = nd.getMonth() + 1;
|
var d = nd.getDate();
|
var h = nd.getHours();
|
var m = nd.getMinutes();
|
var c = nd.getSeconds();
|
if (mm < 10) {
|
mm = "0" + mm;
|
}
|
if (d < 10) {
|
d = "0" + d;
|
}
|
if (h < 10) {
|
h = "0" + h;
|
}
|
if (m < 10) {
|
m = "0" + m;
|
}
|
if (c < 10) {
|
c = "0" + c;
|
}
|
// 17:35:2922-06-2022
|
return h + ":" + m + ":" + c;
|
},
|
getTimeYear(time) {
|
if (!time) {
|
return "";
|
}
|
var nd = new Date(time);
|
var y = nd.getFullYear();
|
var mm = nd.getMonth() + 1;
|
var d = nd.getDate();
|
var h = nd.getHours();
|
var m = nd.getMinutes();
|
var c = nd.getSeconds();
|
if (mm < 10) {
|
mm = "0" + mm;
|
}
|
if (d < 10) {
|
d = "0" + d;
|
}
|
if (h < 10) {
|
h = "0" + h;
|
}
|
if (m < 10) {
|
m = "0" + m;
|
}
|
if (c < 10) {
|
c = "0" + c;
|
}
|
// 17:35:2922-06-2022
|
return y + "-" + mm + "-" + d + " " + h + ":" + m + ":" + c;
|
},
|
},
|
};
|
</script>
|
|
<style scoped lang="less">
|
.item_box_left_top {
|
font-size: 25px;
|
}
|
.item_box_zj {
|
width: 33%;
|
display: flex;
|
flex-direction: column;
|
justify-content: center;
|
align-items: center;
|
font-size: 25px;
|
}
|
.tr_list_page {
|
width: 100%;
|
height: calc(100% - 1.3rem);
|
background: #fff;
|
|
> .content {
|
width: 100%;
|
height: 100%;
|
|
.search {
|
width: 100%;
|
height: 1rem;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
padding: 0 0.3rem;
|
position: relative;
|
top: 10px;
|
z-index: 99;
|
|
.search_content {
|
width: 100%;
|
height: 90%;
|
display: flex;
|
align-items: center;
|
}
|
|
.left_search {
|
width: 100%;
|
height: 100%;
|
background: #f6f6f6;
|
border-radius: 0.15rem;
|
display: flex;
|
|
.search_img {
|
width: 1rem;
|
height: 100%;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
|
img {
|
width: 0.5rem;
|
height: 0.5rem;
|
}
|
}
|
|
.search_input {
|
width: 100%;
|
overflow: hidden;
|
height: 100%;
|
display: flex;
|
}
|
}
|
|
.right_search_class {
|
width: 13%;
|
height: 100%;
|
display: flex;
|
justify-content: flex-end;
|
align-items: center;
|
|
img {
|
width: 0.6rem;
|
height: 0.6rem;
|
}
|
}
|
}
|
}
|
}
|
.item_box_left {
|
width: 33%;
|
display: flex;
|
flex-direction: column;
|
justify-content: center;
|
overflow: hidden;
|
// align-items: center;
|
}
|
.item_box_right {
|
width: 33%;
|
display: flex;
|
font-size: 25px;
|
align-items: center;
|
justify-content: flex-end;
|
color: #03ad8f;
|
}
|
.item_box_righta {
|
width: 33%;
|
display: flex;
|
align-items: center;
|
justify-content: flex-end;
|
color: #d04b64;
|
}
|
.tabs {
|
width: 100%;
|
height: 100%;
|
position: relative;
|
}
|
|
.top_title {
|
width: 100%;
|
height: 1.2821rem;
|
// padding: 0 0.3rem;
|
position: fixed;
|
background: #f5f5f5;
|
// top: 60px;
|
top: 0px;
|
z-index: 2000;
|
transition: all 0.5s;
|
overflow: hidden;
|
border-radius: 0 0 0.2rem 0.2rem;
|
|
> div {
|
width: 100%;
|
height: 1.2821rem;
|
display: flex;
|
// align-items: center;
|
justify-content: space-between;
|
}
|
|
.tabs_title {
|
width: 100%;
|
height: 100%;
|
display: flex;
|
}
|
|
.tb {
|
width: 100%;
|
padding: 0 0.2rem;
|
height: 100%;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
font-size: 25px;
|
span {
|
// width: 50%;
|
}
|
}
|
|
.active {
|
width: 50px;
|
color: rgb(2, 99, 226);
|
border-bottom: 0.06rem solid rgb(2, 99, 226);
|
padding-bottom: 10px;
|
font-weight: 800;
|
transition: all 0.5s;
|
}
|
}
|
|
.bottom_content {
|
width: 100%;
|
height: calc(100% - 1.2821rem);
|
position: relative;
|
top: 7%;
|
}
|
|
.scroll_tab {
|
width: 100%;
|
overflow-x: scroll;
|
-webkit-overflow-scrolling: touch;
|
display: -webkit-box;
|
white-space: nowrap;
|
|
> div {
|
display: inline-block;
|
// width: 15%;
|
height: 100%;
|
display: flex;
|
font-size: 0.4rem;
|
align-items: center;
|
padding: 0 0.3rem;
|
|
span {
|
display: inline-block;
|
min-width: 40%;
|
height: 100%;
|
text-align: center;
|
line-height: 1.1538rem;
|
}
|
}
|
|
span.active {
|
color: rgb(2, 99, 226);
|
border-bottom: 0.07rem solid rgb(2, 99, 226);
|
font-weight: 800;
|
transition: all 0.5s;
|
}
|
}
|
|
.scroll_tab::-webkit-scrollbar {
|
display: none;
|
}
|
|
.kai_mess {
|
width: 100%;
|
height: 1.2821rem;
|
background: #f5f9fe;
|
display: flex;
|
justify-content: space-between;
|
position: absolute;
|
|
.left_identity_img {
|
width: 0.9744rem;
|
height: 100%;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
margin-left: 0.2rem;
|
|
img {
|
width: 0.6rem;
|
height: 0.6rem;
|
}
|
}
|
|
.text {
|
width: 80%;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
color: rgb(2, 99, 226);
|
font-weight: 800;
|
font-size: 0.35rem;
|
padding-left: 0.35rem;
|
}
|
|
.right_go {
|
width: 10%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
|
img {
|
width: 0.6rem;
|
height: 0.6rem;
|
}
|
}
|
}
|
|
.list::-webkit-scrollbar {
|
display: none;
|
}
|
.item_box {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
}
|
.list {
|
width: 100%;
|
|
overflow-x: auto;
|
padding-bottom: 1.2821rem;
|
padding: 0 0.3rem;
|
|
.list_items {
|
// margin-top: -0.5rem;
|
width: 100%;
|
|
> div {
|
width: 100%;
|
height: 1.5rem;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
border-bottom: 1px solid #f2f6fc;
|
// padding: 0.5rem 0;
|
|
> div {
|
width: 100%;
|
height: 1.0256rem;
|
display: flex;
|
// margin: 18px 0;
|
> div {
|
> div {
|
display: flex;
|
align-items: center;
|
}
|
|
.tp {
|
width: 100%;
|
height: 70%;
|
}
|
|
.bt {
|
width: 100%;
|
height: 30%;
|
font-size: 12px;
|
}
|
}
|
}
|
}
|
|
.left_title {
|
width: 45%;
|
height: 100%;
|
}
|
|
.center_price {
|
width: 35%;
|
height: 100%;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
}
|
|
.right_bs {
|
width: 20%;
|
height: 100%;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
}
|
}
|
}
|
|
.list_title {
|
width: 100%;
|
height: 1rem;
|
margin-top: 1.29rem;
|
padding: 0 0.3rem;
|
color: #a1a2a4;
|
display: flex;
|
border-bottom: 1px solid #f2f6fc;
|
font-size: 25px;
|
> div {
|
display: flex;
|
align-items: center;
|
}
|
|
.varieties {
|
width: 33%;
|
align-items: center;
|
// justify-content: center;
|
}
|
|
.latest_price {
|
width: 33%;
|
align-items: center;
|
justify-content: center;
|
}
|
|
.applies {
|
width: 33%;
|
align-items: center;
|
justify-content: flex-end;
|
}
|
}
|
|
.price_color {
|
//color: rgb(39, 171, 99);
|
font-size: 0.4rem;
|
font-weight: 600;
|
}
|
|
.title_color {
|
color: rgb(2, 2, 2);
|
font-size: 0.4rem;
|
font-weight: 600;
|
}
|
|
.tab_items {
|
font-size: 0.2rem;
|
}
|
|
.tab_class {
|
padding: 0 0.3rem;
|
}
|
|
.searchs::placeholder {
|
color: #8e8f92;
|
}
|
|
.searchs {
|
width: 100%;
|
}
|
|
.collection {
|
display: inline-block;
|
width: 0.1rem;
|
height: 50%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
margin-right: 0.1rem;
|
|
.shu {
|
width: 60%;
|
height: 100%;
|
background: #919191;
|
}
|
}
|
.item_box {
|
}
|
.item_box_left_bottom {
|
margin-top: 10px;
|
// width: 80px;
|
width: 100%;
|
color: #8c9fad;
|
// color: #ad0606;
|
font-size: 22px;
|
text-overflow: ellipsis;
|
overflow: hidden;
|
white-space: nowrap;
|
}
|
.right_money {
|
width: 44%;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: flex-end;
|
|
.content_money {
|
// width: 80%;
|
height: 80%;
|
}
|
|
.top_price {
|
width: 100%;
|
height: 70%;
|
display: flex;
|
align-items: center;
|
|
.left {
|
// width: 0.8rem;
|
height: 0.4103rem;
|
border-radius: 0.1rem;
|
background: #4d73b1;
|
color: #fff;
|
font-size: 0.3077rem;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
|
span {
|
display: inline-block;
|
transform: scale(0.8);
|
font-weight: 600;
|
}
|
}
|
|
.right {
|
width: auto;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: flex-end;
|
white-space: nowrap;
|
margin-left: 0.1rem;
|
margin-right: 0.1rem;
|
min-width: 1.9rem;
|
|
// padding-left: 0.2rem;
|
span {
|
font-weight: 600;
|
text-align: right;
|
}
|
}
|
}
|
|
.bottom_balance {
|
width: 100%;
|
height: 30%;
|
display: flex;
|
justify-content: flex-end;
|
font-size: 0.3077rem;
|
color: #acaeaf;
|
transform: scale(0.9);
|
margin-left: 0.2rem;
|
padding-right: 0.68rem;
|
}
|
}
|
|
.sanjiao {
|
width: 0.4rem;
|
height: 0.4rem;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
|
img {
|
width: 0.4rem;
|
height: 0.4rem;
|
}
|
}
|
|
.dialog {
|
position: absolute;
|
width: 100%;
|
height: 100%;
|
background: rgba(0, 0, 0, 0.4);
|
top: 7%;
|
z-index: 9;
|
transition: all 0.5s;
|
}
|
|
.dialog.open {
|
top: 7%;
|
}
|
|
.shai {
|
position: absolute;
|
width: 100%;
|
height: 100%;
|
background: rgba(0, 0, 0, 0.4);
|
top: 0%;
|
z-index: 10;
|
transition: all 0.5s;
|
}
|
|
.shai.open {
|
top: 4%;
|
}
|
|
.cards {
|
width: 100%;
|
display: flex;
|
flex-wrap: wrap;
|
}
|
|
.card_item {
|
width: 48%;
|
// height: 1.5385rem;
|
background: #f6f6f7;
|
border-radius: 0.2rem;
|
margin-top: 0.2rem;
|
padding: 0.4rem 0;
|
|
.tops_title {
|
width: 100%;
|
// height: 40%;
|
display: flex;
|
align-items: flex-end;
|
padding-left: 0.5rem;
|
}
|
|
.bottom_price {
|
width: 100%;
|
height: 60%;
|
display: flex;
|
align-items: center;
|
padding-left: 0.5rem;
|
padding-top: 0.1rem;
|
|
p {
|
font-weight: 600;
|
}
|
|
span {
|
font-weight: 600;
|
}
|
}
|
}
|
|
.shublue {
|
background: #0263e2 !important;
|
}
|
|
.xuanz {
|
//旋转
|
transform: rotate(180deg);
|
transition: all 0.5s;
|
}
|
|
.red {
|
color: #ff0000;
|
}
|
|
.green {
|
color: #27ab63;
|
}
|
|
.mrt {
|
// margin-right: 0.35rem;
|
}
|
|
.codeIcon {
|
width: 0.6rem;
|
height: 0.6rem;
|
background-color: #0263e2;
|
color: #fff;
|
|
border-radius: 0.05rem;
|
margin-left: 0.1rem;
|
//缩放
|
transform: scale(0.8);
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
}
|
|
.listHeight {
|
height: calc(100% - 1.2821rem - 0.15rem - 1.1538rem - 1.3333rem);
|
}
|
|
.listHeights {
|
height: calc(100% - 0.15rem - 1.1538rem);
|
}
|
|
.zxlist {
|
height: calc(100% - 1rem - 1rem);
|
padding-bottom: 0.2rem;
|
}
|
|
/deep/.van-list__loading {
|
margin-top: 0.2rem;
|
}
|
|
.hongse {
|
background-color: #4d73b1 !important;
|
}
|
|
.xgsgType {
|
position: relative;
|
top: 30%;
|
left: 0;
|
right: 0;
|
margin: auto;
|
width: 85%;
|
height: 80%;
|
text-align: center;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
border-radius: 0.1rem;
|
background-color: rgba(102, 204, 153, 0.1);
|
border: 0.04rem solid #5ce398;
|
color: #5ce398;
|
}
|
|
.xgsgTypeRed {
|
position: relative;
|
top: 30%;
|
left: 0;
|
right: 0;
|
margin: auto;
|
width: 85%;
|
height: 80%;
|
text-align: center;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
border-radius: 0.1rem;
|
background-color: rgba(223, 59, 59, 0.062);
|
border: 0.04rem solid rgb(231, 61, 61);
|
color: rgb(231, 61, 61);
|
}
|
|
.setting_content {
|
width: 100%;
|
height: 5rem;
|
padding: 0.3rem;
|
|
.old_password {
|
width: 100%;
|
height: 1.6rem;
|
background: rgb(243, 243, 243);
|
border-radius: 0.15rem;
|
display: flex;
|
margin-top: 0.8rem;
|
|
.left_titles {
|
margin-left: 0.2rem;
|
width: 25%;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
padding-left: 0.2rem;
|
font-size: 0.3975rem;
|
|
// justify-content: flex-end;
|
span {
|
font-weight: 600;
|
letter-spacing: 0.04rem;
|
}
|
}
|
|
.right_password_input {
|
width: 75%;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
|
input {
|
width: 100%;
|
height: 100%;
|
padding-left: 0.2rem;
|
border-radius: 0 0.2rem 0.2rem 0;
|
font-size: 0.3975rem;
|
font-weight: 600;
|
//文字间距
|
letter-spacing: 0.04rem;
|
}
|
}
|
}
|
|
.btn_setting {
|
width: 100%;
|
height: 1.3rem;
|
border-radius: 0.15rem;
|
background: #2d6ae9;
|
color: #fff;
|
font-size: 0.4615rem;
|
margin-top: 0.5rem;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
|
span {
|
font-weight: 600;
|
}
|
}
|
}
|
|
.shijian {
|
width: 100%;
|
height: 1.6rem;
|
margin-top: 0.5rem;
|
margin-bottom: 0.5rem;
|
}
|
|
.xgsj {
|
font-size: 0.3875rem;
|
font-weight: 600;
|
display: flex;
|
height: 50%;
|
align-items: center;
|
}
|
|
.sjtlt {
|
width: 25%;
|
margin-left: 0.4rem;
|
}
|
|
.xgTime() {
|
width: 75%;
|
}
|
|
/deep/.van-popup {
|
border-radius: 0.2rem 0.2rem 0 0;
|
}
|
</style>
|
