| | |
| | | </div> |
| | | <div class="overflow_box item" @click="SetTitleIndex(2)"> |
| | | <div class="left_titles"> |
| | | <span>{{ '期货账户' }}</span> |
| | | <span>{{ '新股账户' }}</span> |
| | | </div> |
| | | <div class="right_price"> |
| | | <span>{{ '' }}</span> |
| | |
| | | $store.state.userInfo.allFreezAmt ? $store.state.userInfo.allFreezAmt : '0.00' |
| | | }}</span> |
| | | <span class="numDemo" v-show="titleIndex == 2">{{ '¥ ' + |
| | | $store.state.userInfo.allFuturesFreezAmt ? $store.state.userInfo.allFuturesFreezAmt : '0.00' |
| | | $store.state.userInfo.djzj ? $store.state.userInfo.djzj : '0.00' |
| | | }}</span> |
| | | </div> |
| | | <div class="right_titles"> |
| | |
| | | <span class="numDemo" |
| | | :class="$store.state.userInfo.allFuturesProfitAndLose > 0 ? 'red' : $store.state.userInfo.allFuturesProfitAndLose < 0 ? ' green' : ''" |
| | | v-show="titleIndex == 2">{{ |
| | | '¥' + $store.state.userInfo.allFuturesProfitAndLose ? Number($store.state.userInfo.allFuturesProfitAndLose).toFixed(2) : '0.00' |
| | | '¥' + $store.state.userInfo.allFuturesProfitAndLose ? |
| | | Number($store.state.userInfo.allFuturesProfitAndLose).toFixed(2) : '0.00' |
| | | }}</span> |
| | | |
| | | </div> |
| | |
| | | <div class="tabs_top_title"> |
| | | <div class="title_items" v-for="(item, index) in tabsArr" :key="index" |
| | | @click="handleTabsClick(item, index)" :class="index == 0 ? 'kuan' : 'kuan'"> |
| | | <span :class="tabsCurrentIndex === index ? 'active' : ''">{{ item }}{{ index == 0 ? '(' + total + ')' : index == 1 ? '(' + totalss + ')' : |
| | | index == 2 ? '(' + totals + ')' : '(' + xgTotal + ')' |
| | | <span :class="tabsCurrentIndex === index ? 'active' : ''">{{ item }}{{ index == 0 ? '(' + total + ')' : |
| | | index == 1 ? '(' + totalss + ')' : |
| | | index == 2 ? '(' + totals + ')' : '(' + xgTotal + ')' |
| | | }}</span> |
| | | </div> |
| | | </div> |
| | |
| | | <span class="buy_to_sell" :class="item.buyType == 1 ? 'maichu' : 'mairu'">{{ |
| | | item.buyType == 1 ? '卖出' : '买入' |
| | | }}</span> |
| | | <span class="multiple">{{ item.lever }}X</span> |
| | | <span class="multiple">{{ item.lever }}X</span> |
| | | <span class="nums">{{ item.buyNum / 100 + '手' }}</span> |
| | | </div> |
| | | <div class="center_price"> |
| | | |
| | | |
| | | <div class="start_price jiantou"> |
| | | <span>{{ item.targetPrice }}</span> |
| | | </div> |
| | |
| | | </div> |
| | | </div> |
| | | <div class="bottom_price_title"> |
| | | |
| | | |
| | | <div class="start_price"> |
| | | <span>{{ '挂单价格' }}</span> |
| | | </div> |
| | |
| | | <div class="img_cont"> |
| | | <img src="../../assets/img/zhaobudao.png" alt /> |
| | | <span class="gd">{{ '当前无申购' }}</span> |
| | | <div class="trading" @click="$router.push({path:'/trading-list',query:{listid:3}})"> |
| | | <div class="trading" @click="$router.push({ path: '/trading-list', query: { listid: 3 } })"> |
| | | <span>{{ '开始交易' }}</span> |
| | | </div> |
| | | </div> |
| | |
| | | <div class="tabs_o_items" v-for="(item, index) in tabsXgArr" :key="item.id"> |
| | | <div class="tabs_o_title"> |
| | | <span class="title">{{ item.newName }}</span> |
| | | <span class="buy_to_sell" :class="item.type == 0 ? 'maichu' : 'mairu'">{{ |
| | | item.type == 0 ? '线下配售' : '新股申购' |
| | | <span class="buy_to_sell" :class="item.type == 1 ? 'mairu' : 'maichu'">{{ |
| | | item.type == 1 ? '新股申购' : '线下配售' |
| | | }}</span> |
| | | <!-- <span class="multiple">{{ item.lever }}X</span> |
| | | <span class="nums">{{ item.buyNum / 100 + '手' }}</span> --> |
| | | </div> |
| | | <div class="center_price"> |
| | | |
| | | |
| | | <div class="start_price jiantou"> |
| | | <span>{{ item.buyPrice }}</span> |
| | | </div> |
| | |
| | | </div> |
| | | </div> |
| | | <div class="bottom_price_title"> |
| | | |
| | | |
| | | <div class="start_price"> |
| | | <span>{{ '申购价格' }}</span> |
| | | </div> |
| | |
| | | <span>{{ '申购数量' }}</span> |
| | | </div> |
| | | </div> |
| | | <div class="right_btn" @click="zcsg(item)"> |
| | | <span>{{ '新股申购' }}</span> |
| | | <div class="right_btn" @click="zcsg(item)" :class="item.status == 1 ? 'pink' : item.status == 2 ? 'red' |
| | | : item.status == 3 ? 'greeen' : item.status == 4 ? 'blue' : item.status == 5 ? 'purple' : ''"> |
| | | <span>{{ item.status == 1 ? |
| | | '已认购' : item.status == 2 ? '未中签' |
| | | : item.status == 3 ? '已中签' : item.status == 4 ? '已缴纳' : item.status == 5 ? '已转持仓' |
| | | : '' |
| | | }}</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { Toast } from 'vant'; |
| | | import { Toast } from 'vant'; |
| | | import * as api from "@/axios/api"; |
| | | export default { |
| | | data() { |
| | | return { |
| | | tabsArr: ["持仓", "挂单", "已平仓","新股"], |
| | | tabsArr: ["持仓", "挂单", "已平仓", "新股"], |
| | | tabsCurrentIndex: 0, |
| | | titleName: "沪深京账户", |
| | | indexSettingInfo: {}, |
| | |
| | | titleDialog: false, |
| | | total: 0, |
| | | totals: 0, |
| | | totalss:0, |
| | | totalss: 0, |
| | | loading: false, |
| | | finished: false, |
| | | finisheds: false, |
| | |
| | | pagess: 1, |
| | | immediate: false, |
| | | loadings: false, |
| | | loadingss:false, |
| | | tabsOrderList:[], |
| | | xgTotal:0, |
| | | tabsXgArr:[], |
| | | loadingXg:false, |
| | | finishedXg:false, |
| | | loadingss: false, |
| | | tabsOrderList: [], |
| | | xgTotal: 0, |
| | | tabsXgArr: [], |
| | | loadingXg: false, |
| | | finishedXg: false, |
| | | }; |
| | | }, |
| | | mounted() { |
| | |
| | | this.getNewXg(); |
| | | }, |
| | | created() { |
| | | if(this.$route.query.index){ |
| | | if (this.$route.query.index) { |
| | | this.tabsCurrentIndex = Number(this.$route.query.index) |
| | | } |
| | | |
| | | |
| | | |
| | | }, |
| | | methods: { |
| | | onLoad() { |
| | |
| | | onLoadXg() { |
| | | this.getNewXg(); |
| | | }, |
| | | async gdClose(item){ |
| | | async gdClose(item) { |
| | | let opts = { |
| | | id:item.id |
| | | id: item.id |
| | | } |
| | | let data = await api.delGuaDan(opts) |
| | | if(data.status == 1){ |
| | | if (data.status == 1) { |
| | | Toast('撤单成功') |
| | | this.page = 1; |
| | | this.pages = 1; |
| | | this.finished = false; |
| | | this.finisheds = false; |
| | | this.tabsPositionNumArr = []; |
| | | this.tabsPcArr = []; |
| | | this.pages = 1; |
| | | this.finished = false; |
| | | this.finisheds = false; |
| | | this.tabsPositionNumArr = []; |
| | | this.tabsPcArr = []; |
| | | switch (this.titleIndex) { |
| | | case 0: |
| | | this.titleName = "沪深京账户"; |
| | | this.getListDetail(); |
| | | this.getListDetails(); |
| | | this.getorderList(); |
| | | break; |
| | | case 1: |
| | | this.titleName = "指数账户"; |
| | | this.getzhishuListDetail(); |
| | | this.getzhishuListDetails(); |
| | | this.getorderList(); |
| | | break; |
| | | case 2: |
| | | this.titleName = "期货账户"; |
| | | this.getQhListDetail(); |
| | | this.getQhListDetails(); |
| | | this.getorderList(); |
| | | break; |
| | | default: |
| | | break; |
| | | } |
| | | }else{ |
| | | case 0: |
| | | this.titleName = "沪深京账户"; |
| | | this.getListDetail(); |
| | | this.getListDetails(); |
| | | this.getorderList(); |
| | | break; |
| | | case 1: |
| | | this.titleName = "指数账户"; |
| | | this.getzhishuListDetail(); |
| | | this.getzhishuListDetails(); |
| | | this.getorderList(); |
| | | break; |
| | | case 2: |
| | | this.titleName = "新股账户"; |
| | | this.getQhListDetail(); |
| | | this.getQhListDetails(); |
| | | this.getorderList(); |
| | | break; |
| | | default: |
| | | break; |
| | | } |
| | | } else { |
| | | Toast(data.msg) |
| | | } |
| | | }, |
| | | zcsg(item){ |
| | | this.$router.push({path:'/trading-list',query:{listid:3}}) |
| | | zcsg(item) { |
| | | this.$router.push({ path: '/trading-list', query: { listid: 3 } }) |
| | | }, |
| | | SetTitleIndex(index) { |
| | | //账户选项卡 |
| | |
| | | this.getorderList(); |
| | | break; |
| | | case 2: |
| | | this.titleName = "期货账户"; |
| | | this.titleName = "新股账户"; |
| | | this.getQhListDetail(); |
| | | this.getQhListDetails(); |
| | | this.getorderList(); |
| | |
| | | break; |
| | | } |
| | | this.titleDialog = false; |
| | | if (navigator.vibrate) { |
| | | // 支持 |
| | | navigator.vibrate([55]); |
| | | } |
| | | }, |
| | | handleTabsClick(item, index) { |
| | | //持仓已平仓选项卡 |
| | | this.tabsCurrentIndex = index; |
| | | if(index==3){ |
| | | this.getNewXg(); |
| | | if (index == 3) { |
| | | this.getNewXg(); |
| | | } |
| | | if (navigator.vibrate) { |
| | | // 支持 |
| | | navigator.vibrate([55]); |
| | | } |
| | | }, |
| | | handleOpenDialog() { |
| | | this.titleDialog = !this.titleDialog; |
| | | }, |
| | | //挂单 |
| | | async getorderList(){ |
| | | let opts={} |
| | | async getorderList() { |
| | | let opts = {} |
| | | let data = await api.getorderList(opts); |
| | | this.loadingss = false; |
| | | if (data.status === 0) { |
| | |
| | | </script> |
| | | |
| | | <style scoped lang="less"> |
| | | .pink{ |
| | | color: #eb2f96; |
| | | background: #fff0f6; |
| | | border-color: #ffadd2; |
| | | } |
| | | .red{ |
| | | color: #f5222d; |
| | | background: #fff1f0; |
| | | border-color: #ffa39e; |
| | | } |
| | | .blue{ |
| | | color: #1890ff; |
| | | background: #e6f7ff; |
| | | border-color: #91d5ff; |
| | | } |
| | | .green{ |
| | | color: #52c41a; |
| | | background: #f6ffed; |
| | | border-color: #b7eb8f; |
| | | } |
| | | .purple{ |
| | | color: #722ed1; |
| | | background: #f9f0ff; |
| | | border-color: #d3adf7; |
| | | } |
| | | @boxCenter: { |
| | | display: flex; |
| | | justify-content: center; |
| | |
| | | display: flex; |
| | | align-items: center; |
| | | font-size: 0.4103rem; |
| | | padding-top: 0.2rem; |
| | | padding: 0.2rem 0.3rem 0; |
| | | justify-content: space-between; |
| | | |
| | | >div { |
| | | width: 20%; |
| | |
| | | position: absolute; |
| | | right: 1%; |
| | | top: 48%; |
| | | background: #f7f7f7; |
| | | color: #3773dd; |
| | | // background: #f7f7f7; |
| | | // color: #3773dd; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | |
| | | |
| | | .kuan { |
| | | width: auto !important; |
| | | padding-left: 0.5rem; |
| | | // padding-left: 0.5rem; |
| | | letter-spacing: 0.02rem; |
| | | } |
| | | |