forked from dg/dabao_wap
src/page/user/Warehouse.vue
@@ -15,7 +15,7 @@ </div> <div class="overflow_box item" @click="SetTitleIndex(0)"> <div class="left_titles"> <span>{{ '沪深京账户' }}</span> <span>{{ $t('hj114') }}</span> </div> <div class="right_price"> <span>{{ '' }}</span> @@ -23,7 +23,7 @@ </div> <div class="overflow_box item" @click="SetTitleIndex(1)"> <div class="left_titles"> <span>{{ '指数账户' }}</span> <span>{{ $t('hj115') }}</span> </div> <div class="right_price"> <span>{{ '' }}</span> @@ -31,7 +31,7 @@ </div> <div class="overflow_box item" @click="SetTitleIndex(2)"> <div class="left_titles"> <span>{{ '期货账户' }}</span> <span>{{ $t('hj116') }}</span> </div> <div class="right_price"> <span>{{ '' }}</span> @@ -42,7 +42,7 @@ <div class="top_card"> <div class="card_content"> <div class="t_title"> <span>{{ '总资产' }}</span> <span>{{ $t('hj49') }}</span> </div> <div class="t_price"> <!-- <span class="price">{{ '49,619.05' }}</span> @@ -67,10 +67,10 @@ </div> <div class="balance"> <div class="left_titles"> {{ '强平线' }} {{ $t('hj50') }} </div> <div class="right_titles"> {{ '可用资金' }} {{ $t('hj54') }} </div> </div> <div class="num"> @@ -98,10 +98,10 @@ </div> <div class="margin"> <div class="left_titles"> {{ '冻结保证金' }} {{ $t('hj55') }} </div> <div class="right_titles"> {{ '持仓总盈亏' }} {{ $t('hj56') }} </div> </div> <div class="prices"> @@ -113,7 +113,7 @@ $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"> @@ -131,7 +131,8 @@ <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> @@ -141,26 +142,26 @@ <div class="tabs_card"> <div class="tabs_card_content"> <div class="tabs_top_title"> <div class="title_items" v-for="(item, index) in tabsArr" :key="index" <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 + ')' : '(' + totals + ')' }}</span> <span :class="tabsCurrentIndex === index ? 'active' : ''"> {{ item }}{{ index == 0 ? '(' + total + ')' : index == 1 ? '(' + totalss + ')' : index == 2 ? '(' + totals + ')' : '(' + xgTotal + ')' }}</span> </div> </div> <!-- 持仓 currentIndex: 0 --> <div class="over"> <van-list v-model="loading" :finished="finished" finished-text="没有更多了" <van-list v-model="loading" :finished="finished" :finished-text="$t('hj43')" v-show="tabsCurrentIndex === 0 && total != 0" @load="onLoad" :immediate-check="immediate"> <div class="tabs_o"> <div class="tabs_o_items" v-for="(item, index) in tabsPositionNumArr" :key="item.buyOrderId"> <div class="tabs_o_title"> <span class="title">{{ item.stockName }}</span> <span class="buy_to_sell" :class="item.orderDirection == '买跌' ? 'maichu' : 'mairu'">{{ item.orderDirection == "买跌" ? '卖出' : '买入' }}</span> <span class="title">{{ item.stockName ? item.stockName : item.indexName }}</span> <span class="buy_to_sell" :class="item.orderDirection == '买跌' ? 'maichu' : 'mairu'"> {{ item.orderDirection == "买跌" ? $t('hj84') : $t('hj85') }}</span> <span class="multiple">{{ item.allProfitAndLose }}</span> <span class="nums">{{ item.orderNum / 100 + '手' }}</span> <span class="nums">{{ item.orderNum / 100 + $t('hj117') }}</span> </div> <div class="center_price"> <div class="profit"> @@ -175,17 +176,17 @@ </div> <div class="bottom_price_title"> <div class="profit_title"> <span>{{ '浮动净盈亏' }}</span> <span>{{ $t('hj118') }}</span> </div> <div class="start_price"> <span>{{ '开仓价格' }}</span> <span>{{ $t('hj119') }}</span> </div> <div class="new_price"> <span>{{ '当前价格' }}</span> <span>{{ $t('hj120') }}</span> </div> </div> <div class="right_btn"> <span>{{ '平仓' }}</span> <div class="right_btn pingbtn" @click="getpingcang(item.positionSn)"> <span>{{ $t('hj121') }}</span> </div> </div> </div> @@ -194,9 +195,9 @@ <div class="waiting_box"> <div class="img_cont"> <img src="../../assets/img/zhaobudao.png" alt /> <span class="gd">{{ '当前无挂单' }}</span> <span class="gd">{{ $t('hj122') }}</span> <div class="trading" @click="$router.push('/trading-list')"> <span>{{ '开始交易' }}</span> <span>{{ $t('hj123') }}</span> </div> </div> </div> @@ -204,32 +205,32 @@ <!-- 挂单 --> <div class="waiting" v-if="totalss == 0 && tabsCurrentIndex === 1"> <div class="waiting_box"> <div class="img_cont"> <img src="../../assets/img/zhaobudao.png" alt /> <span class="gd">{{ '当前无挂单' }}</span> <span class="gd">{{ $t('hj124') }}</span> <div class="trading" @click="$router.push('/trading-list')"> <span>{{ '开始交易' }}</span> <span>{{ $t('hj123') }}</span> </div> </div> </div> </div> <van-list v-model="loadingss" :finished="finishedss" finished-text="没有更多了" <van-list v-model="loadingss" :finished="finishedss" :finished-text="$t('hj43')" v-show="tabsCurrentIndex === 1 && totalss != 0" @load="onLoad" :immediate-check="immediate"> <div class="tabs_o"> <div class="tabs_o_items" v-for="(item, index) in tabsOrderList" :key="item.id"> <div class="tabs_o_title"> <span class="title">{{ item.stockName }}</span> <span class="title">{{ item.stockName ? item.stockName : item.indexName }}</span> <span class="buy_to_sell" :class="item.buyType == 1 ? 'maichu' : 'mairu'">{{ item.buyType == 1 ? '卖出' : '买入' item.buyType == 1 ? $t('hj84') : $t('hj85') }}</span> <span class="multiple">{{ item.lever }}X</span> <span class="nums">{{ item.buyNum / 100 + '手' }}</span> <span class="multiple">{{ item.lever }}X</span> <span class="nums">{{ item.buyNum / 100 + $t('hj117') }}</span> </div> <div class="center_price"> <div class="start_price jiantou"> <span>{{ item.targetPrice }}</span> </div> @@ -238,16 +239,16 @@ </div> </div> <div class="bottom_price_title"> <div class="start_price"> <span>{{ '挂单价格' }}</span> <span>{{ $t('hj125') }}</span> </div> <div class="new_price"> <span>{{ '当前价格' }}</span> <span>{{ $t('hj120') }}</span> </div> </div> <div class="right_btn"> <span>{{ '撤销' }}</span> <div class="right_btn" @click="gdClose(item)"> <span>{{ $t('hj126') }}</span> </div> </div> </div> @@ -256,32 +257,35 @@ <!-- 平仓 --> <div class="waiting" v-if="totals == 0 && tabsCurrentIndex === 2"> <div class="waiting_box"> <div class="img_cont"> <img src="../../assets/img/zhaobudao.png" alt /> <span class="gd">{{ '当前无挂单' }}</span> <span class="gd">{{ $t('hj127') }}</span> <div class="trading" @click="$router.push('/trading-list')"> <span>{{ '开始交易' }}</span> <span>{{ $t('hj123') }}</span> </div> </div> </div> </div> <van-list v-model="loadings" :finished="finisheds" finished-text="没有更多了" @load="onLoads" <van-list v-model="loadings" :finished="finisheds" :finished-text="$t('hj43')" @load="onLoads" :immediate-check="immediate" v-show="tabsCurrentIndex === 2 && totals != 0"> <div class="tabs_o"> <div class="tabs_o_items oes" v-for="(item, index) in tabsPcArr" :key="index"> <div class="tabs_o_title"> <span class="title">{{ item.stockName }}</span> <span class="buy_to_sell">{{ item.orderDirection }}</span> <span class="title">{{ item.stockName ? item.stockName : item.indexName }}</span> <span class="buy_to_sell" :class="item.orderDirection == '买跌' ? 'maichu' : 'mairu'">{{ item.orderDirection == "买跌" ? $t('hj84') : $t('hj85') }}</span> <span class="multiple">{{ item.allProfitAndLose }}</span> <span class="nums">{{ item.orderNum / 100 + '手' }}</span> <span class="nums">{{ item.orderNum / 100 + $t('hj117') }}</span> </div> <div class="bottom_price_title"> <div class="profit_res"> <span>平仓时间: {{ item.buyOrderTime | gettime }}</span> <span>{{ $t('hj128') }}: {{ item.buyOrderTime | gettime }}</span> </div> </div> <div class="right_count" @@ -291,6 +295,62 @@ </div> </div> </van-list> <!-- 新股 --> <div class="waiting" v-if="xgTotal == 0 && tabsCurrentIndex === 3"> <div class="waiting_box"> <div class="img_cont"> <img src="../../assets/img/zhaobudao.png" alt /> <span class="gd">{{ $t('hj129') }}</span> <div class="trading" @click="$router.push({ path: '/trading-list', query: { listid: 3 } })"> <span>{{ $t('hj123') }}</span> </div> </div> </div> </div> <van-list v-model="loadingXg" :finished="finishedXg" :finished-text="$t('hj43')" v-show="tabsCurrentIndex === 3 && xgTotal != 0" @load="onLoadXg" :immediate-check="immediate"> <div class="tabs_o"> <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 == 1 ? 'mairu' : 'maichu'">{{ item.type == 1 ? $t('hj45') : $t('hj46') }}</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 class="new_price"> <span>{{ item.applyNums }}</span> </div> </div> <div class="bottom_price_title"> <div class="start_price"> <span>{{ $t('hj130') }}</span> </div> <div class="new_price"> <span>{{ $t('hj57') }}</span> </div> </div> <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 ? $t('hj131') : item.status == 2 ? $t('hj132') : item.status == 3 ? $t('hj133') : item.status == 4 ? $t('hj134') : item.status == 5 ? $t('hj135') : '' }}</span> </div> </div> </div> </van-list> </div> </div> @@ -302,13 +362,15 @@ </template> <script> import { Toast } from 'vant'; import { MessageBox } from 'mint-ui' import * as api from "@/axios/api"; export default { data() { return { tabsArr: ["持仓", "挂单", "已平仓"], tabsArr: [this.$t('hj2'), this.$t('hj109'), this.$t('hj136'), this.$t('hj3')], tabsCurrentIndex: 0, titleName: "沪深京账户", titleName: this.$t('hj114'), indexSettingInfo: {}, futuresSettingInfo: {}, tabsPositionNumArr: [], @@ -318,7 +380,7 @@ titleDialog: false, total: 0, totals: 0, totalss:0, totalss: 0, loading: false, finished: false, finisheds: false, @@ -328,8 +390,12 @@ pagess: 1, immediate: false, loadings: false, loadingss:false, tabsOrderList:[] loadingss: false, tabsOrderList: [], xgTotal: 0, tabsXgArr: [], loadingXg: false, finishedXg: false, }; }, mounted() { @@ -340,8 +406,68 @@ this.getFuturesSetting(); this.getListDetails(); this.getorderList(); this.getNewXg(); }, created() { if (this.$route.query.index) { this.tabsCurrentIndex = Number(this.$route.query.index) } }, methods: { getpingcang(val) { if (!this.$store.state.userInfo.idCard) { Toast(this.$t('hj138')) this.$router.push('/authentication') return } if (this.titleIndex == 0) { MessageBox.confirm(this.$t('hj139') + '?', this.$t('hj165'), { confirmButtonText: this.$t('hj161'), cancelButtonText: this.$t('hj106'), }).then(async () => { let opt = { positionSn: val } let data = await api.sell(opt) if (data.status === 0) { Toast(data.msg) this.getzhishuListDetail(); this.getzhishuListDetails(); this.getorderList(); } else if (data.msg.indexOf('不在交易时段内') > -1) { Toast(this.$t('hj140')) } else { Toast(data.msg) } }).catch(() => { }); } else { MessageBox.confirm(this.$t('hj139') + '?', this.$t('hj165'), { confirmButtonText: this.$t('hj161'), cancelButtonText: this.$t('hj106'), }).then(async () => { let opt = { positionSn: val } let data = await api.sellIndex(opt) if (data.status === 0) { Toast(data.msg) this.getzhishuListDetail(); this.getzhishuListDetails(); this.getorderList(); } else if (data.msg.indexOf('不在交易时段内') > -1) { Toast(this.$t('hj140')) } else { Toast(data.msg) } }).catch(() => { }); } }, onLoad() { this.page++; switch (this.titleIndex) { @@ -372,6 +498,51 @@ break; } }, onLoadXg() { this.getNewXg(); }, async gdClose(item) { let opts = { id: item.id } let data = await api.delGuaDan(opts) if (data.status == 1) { Toast(this.$t('hj137')) this.page = 1; this.pages = 1; this.finished = false; this.finisheds = false; this.tabsPositionNumArr = []; this.tabsPcArr = []; switch (this.titleIndex) { case 0: this.titleName = this.$t('hj114'); this.getListDetail(); this.getListDetails(); this.getorderList(); break; case 1: this.titleName = this.$t('hj115'); this.getzhishuListDetail(); this.getzhishuListDetails(); this.getorderList(); break; case 2: this.titleName = this.$t('hj116'); this.getQhListDetail(); this.getQhListDetails(); this.getorderList(); break; default: break; } } else { Toast(data.msg) } }, zcsg(item) { this.$router.push({ path: '/trading-list', query: { listid: 3 } }) }, SetTitleIndex(index) { //账户选项卡 this.titleIndex = index; @@ -383,38 +554,55 @@ this.tabsPcArr = []; switch (index) { case 0: this.titleName = "沪深京账户"; this.titleName = this.$t('hj114'); this.getListDetail(); this.getListDetails(); this.getorderList(); this.handleTabsClick('', 0) break; case 1: this.titleName = "指数账户"; this.titleName = this.$t('hj115'); this.getzhishuListDetail(); this.getzhishuListDetails(); this.getorderList(); this.handleTabsClick('', 0) break; case 2: this.titleName = "期货账户"; this.getQhListDetail(); this.getQhListDetails(); this.getorderList(); this.totalss = 0; this.totals = 0; this.total = 0; this.titleName = this.$t('hj116'); this.handleTabsClick('', 3) // this.getQhListDetail(); // this.getQhListDetails(); // this.getorderList(); break; default: break; } this.titleDialog = false; if (navigator.vibrate) { // 支持 navigator.vibrate([55]); } }, handleTabsClick(item, index) { //持仓已平仓选项卡 this.tabsCurrentIndex = index; 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) { @@ -614,6 +802,26 @@ Toast(data.msg) } }, async getNewXg() { //获取新股 this.loadingXg = true; let opt = { } let data = await api.getUserNewGuList(opt) this.loadingXg = false; if (data.data.length < 15) { this.finishedXg = true; } if (data.status === 0) { this.tabsXgArr = data.data // data.data.list.forEach(element => { // this.tabsXgArr.push(element) // }) this.xgTotal = data.data.length } else { Toast(data.msg) } }, }, filters: { gettime(time) { @@ -650,6 +858,49 @@ </script> <style scoped lang="less"> /deep/ .mint-msgbox-title { font-size: 0.4rem !important; } .pingbtn { width: auto !important; height: auto !important; background: rgb(45, 106, 233); color: rgb(255, 255, 255); padding: 0.2rem 0.4rem; border-radius: 0.2rem !important; } .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; @@ -885,7 +1136,8 @@ 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%; @@ -1065,13 +1317,13 @@ } .right_btn { width: 1.7949rem; height: 0.6667rem; width: 1.9949rem; height: 0.7667rem; position: absolute; right: 1%; top: 48%; background: #f7f7f7; color: #3773dd; top: 27%; // background: #f7f7f7; // color: #3773dd; display: flex; align-items: center; justify-content: center; @@ -1155,7 +1407,7 @@ .kuan { width: auto !important; padding-left: 0.5rem; // padding-left: 0.5rem; letter-spacing: 0.02rem; }
