| | |
| | | <div class="cot"> |
| | | <div class="lefts"> |
| | | <div class="top_new"> |
| | | <span>{{ nowPrice | _toLocaleString }}</span> |
| | | <span> |
| | | {{ bayType | currencySymbol }} |
| | | {{ nowPrice | _toLocaleString }} |
| | | </span> |
| | | </div> |
| | | <div class="bottom_es"> |
| | | <span>{{ $t("hj98") }}</span> |
| | |
| | | @click="handleTradingClick(0)" |
| | | :class="tabsCurrentIndex === 0 ? 'actives' : ''" |
| | | > |
| | | <span>{{ $t("hj84") }}</span> |
| | | <span>Short</span> |
| | | </div> |
| | | |
| | | <div |
| | |
| | | @click="handleTradingClick(1)" |
| | | :class="tabsCurrentIndex === 1 ? 'active' : ''" |
| | | > |
| | | <span>{{ $t("hj85") }}</span> |
| | | <span>Long</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | type="number" |
| | | onkeyup="value=value.replace(/[^\d]/g,'')" |
| | | v-model="num" |
| | | @input="numInput" |
| | | /> |
| | | </div> |
| | | <div class="right_sw flexJy" style="width: auto"> |
| | |
| | | <img src="@/assets/img/ic_number_jian.png" /> |
| | | </div> |
| | | <div class="addorj"></div> |
| | | <div |
| | | class="addorj" |
| | | @click=" |
| | | typeof num == 'string' |
| | | ? (num = Number(Number(num) + 1)) |
| | | : (num = Number(Number(num) + 1)) |
| | | " |
| | | > |
| | | <div class="addorj" @click="jjjisua"> |
| | | <img src="@/assets/img/ic_number_add.png" /> |
| | | </div> |
| | | </div> |
| | |
| | | </div> |
| | | <div class="tr_rs"> |
| | | <div class="top_bzz" style="padding-bottom: 0.2rem"> |
| | | <span style="text-align: left"> |
| | | {{ $t("交易总额") }}({{ moneyData.symbol || "$" }}) |
| | | </span> |
| | | <span style="text-align: right"> |
| | | {{ $t("hj103") }}({{ moneyData.symbol || "$" }}) |
| | | </span> |
| | | <span style="text-align: left"> {{ $t("交易总额") }}() </span> |
| | | <span style="text-align: right"> {{ $t("hj103") }}() </span> |
| | | </div> |
| | | |
| | | <div class="bottom_bzz"> |
| | | <span>{{ ((nowPrice / selectCycle) * num) | _toLocaleString }}</span> |
| | | <span style="white-space: nowarp"> |
| | | <!-- moneyData.symbol + " " + --> |
| | | |
| | | {{ moneyData.availableBalance | _toLocaleString }} |
| | | <span> |
| | | {{ bayType | currencySymbol }} |
| | | {{ |
| | | (nowPrice * selectCycle.replace("X", "") * num) |
| | | | _toLocaleString |
| | | }} |
| | | <span v-if="bayType != 'US'"> |
| | | ≈ $ |
| | | {{ |
| | | (nowPrice * selectCycle.replace("X", "") * num * rate) |
| | | | _toLocaleString |
| | | }} |
| | | </span> |
| | | </span> |
| | | <span style="white-space: nowarp"> |
| | | $ {{ moneyData.availableBalance | _toLocaleString }} |
| | | </span> |
| | | </div> |
| | | </div> |
| | | <div class="tr_rs"> |
| | | <div class="top_bzz" style="padding-bottom: 0.2rem"> |
| | | <span style="text-align: left"> {{ $t("hj44") }}() </span> |
| | | <span style="text-align: right"> </span> |
| | | </div> |
| | | |
| | | <div class="bottom_bzz"> |
| | | <span> |
| | | {{ |
| | | (nowPrice * selectCycle.replace("X", "") * num * sxf).toFixed( |
| | | 2 |
| | | ) |
| | | }} |
| | | <span v-if="bayType != 'US'"> |
| | | ≈ $ |
| | | {{ |
| | | (nowPrice * |
| | | selectCycle.replace("X", "") * |
| | | num * |
| | | sxf * |
| | | rate) |
| | | | _toLocaleString |
| | | }} |
| | | </span> |
| | | </span> |
| | | <span style="white-space: nowarp"> </span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="switchs"> |
| | | <!-- <div class="switchs"> |
| | | <div class="zy"> |
| | | <div class="left_zy"> |
| | | <span>{{ $t("hj104") }}</span> |
| | |
| | | </div> |
| | | <div class="zy" v-show="checkedZy"> |
| | | <div class="left_zy"> |
| | | <input |
| | | v-model="profitTarget" |
| | | onkeyup="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')" |
| | | @input="zyInt" |
| | | /> |
| | | <input v-model="profitTarget" onkeyup="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')" |
| | | @input="zyInt" /> |
| | | </div> |
| | | <div class="right_sw" style="width: auto"> |
| | | <div class="addorj" @click="zYjian"> |
| | | <img src="@/assets/img/ic_number_jian.png" /> |
| | | </div> |
| | | <div class="addorj"></div> |
| | | <div |
| | | class="addorj" |
| | | @click="profitTarget = (Number(profitTarget) + 1).toFixed(2)" |
| | | > |
| | | <div class="addorj" |
| | | @click="tabsCurrentIndex==0?profitTarget = (Number(profitTarget) + 1).toFixed(2):profitTarget = (Number(profitTarget) + 1).toFixed(2)"> |
| | | <img src="@/assets/img/ic_number_add.png" /> |
| | | </div> |
| | | </div> |
| | |
| | | </div> |
| | | <div class="zy" v-show="checkedZs"> |
| | | <div class="left_zy"> |
| | | <input |
| | | v-model="zhisun" |
| | | onkeyup="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')" |
| | | @input="zsInt" |
| | | /> |
| | | <input v-model="zhisun" onkeyup="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')" @input="zsInt" /> |
| | | </div> |
| | | <div class="right_sw" style="width: auto"> |
| | | <div class="addorj" @click="zhisun--"> |
| | | <div class="addorj" |
| | | @click="zSjian"> |
| | | <img src="@/assets/img/ic_number_jian.png" /> |
| | | </div> |
| | | <div class="addorj"></div> |
| | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <!-- <div class="zy"> |
| | | <div class="left_zy"> |
| | | <span>追踪止损</span> |
| | | </div> |
| | | <div class="right_sw"> |
| | | <van-switch v-model="profitArr[2].checked" /> |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | </div> --> |
| | | <div class="btn_buy" @click="gdOrSetBuy()"> |
| | | <div :class="tabsCurrentIndex == 0 ? 'maichu' : ''"> |
| | | <span>{{ tabsCurrentIndex == 0 ? $t("hj84") : $t("hj85") }}</span> |
| | | <!-- <div :class="tabsCurrentIndex == 0 ? 'maichu' : ''">#c4d600 --> |
| | | <div class="maichu" style="background-color:#c4d600"> |
| | | <span>{{ tabsCurrentIndex == 0 ? $t("hj84") : $t("gm") }}</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | <script> |
| | | import * as api from "@/axios/api"; |
| | | import { mapActions } from "vuex"; |
| | | import { myMixin } from "@/mixins/myMixin"; |
| | | |
| | | export default { |
| | | name: "trBuy", |
| | | mixins: [myMixin], |
| | | created() { |
| | | if (this.$route.query.t) { |
| | | this.tabsCurrentIndex = Number(this.$route.query.t); |
| | |
| | | profitTarget: 0, |
| | | if_us: 0, |
| | | bayType: "", |
| | | sxf: "", |
| | | id: "", |
| | | actions: [ |
| | | { name: "100X", subname: this.$t("hj102") }, |
| | | { name: "200X", subname: this.$t("hj102") }, |
| | | { name: "300X", subname: this.$t("hj102") }, |
| | | { |
| | | name: "100X", |
| | | subname: this.$t("hj102") |
| | | }, |
| | | { |
| | | name: "200X", |
| | | subname: this.$t("hj102") |
| | | }, |
| | | { |
| | | name: "300X", |
| | | subname: this.$t("hj102") |
| | | } |
| | | ], |
| | | profitArr: [ |
| | | { |
| | | name: this.$t("hj104"), |
| | | checked: false, |
| | | checked: false |
| | | }, |
| | | { |
| | | name: this.$t("hj105"), |
| | | checked: false, |
| | | checked: false |
| | | }, |
| | | { |
| | | name: this.$t("hj110"), |
| | | checked: false, |
| | | }, |
| | | checked: false |
| | | } |
| | | ], |
| | | moneyData: {}, |
| | | gid: "", |
| | | gid: "" |
| | | }; |
| | | }, |
| | | computed: { |
| | | // 计算当前汇率 |
| | | rate() { |
| | | let rate = 1; |
| | | if (this.bayType == "HK") rate = this.htu; |
| | | else if (this.bayType == "IN") rate = this.itu; |
| | | else if (this.bayType == "TW") rate = this.ttu; |
| | | return rate; |
| | | } |
| | | }, |
| | | mounted() { |
| | | this.bayType = this.$route.query.bayType; |
| | |
| | | this.setUseInfo(); |
| | | this.getMoneyData(); |
| | | this.getSettingInfo(); |
| | | this.queryStockConfig(); |
| | | }, |
| | | watch: { |
| | | checkedZy(val) { |
| | |
| | | // 支持 |
| | | navigator.vibrate([55]); |
| | | } |
| | | }, |
| | | } |
| | | }, |
| | | methods: { |
| | | async queryStockConfig() { |
| | | let data = await api.queryStockConfig(); |
| | | if (data.status === 0) { |
| | | this.sxf = data.data.cValue; |
| | | } |
| | | }, |
| | | zSjian() { |
| | | var newzishu = (Number(this.zhisun) - 1).toFixed(2); |
| | | if (Number(newzishu) < 1) { |
| | | } else { |
| | | this.zhisun = newzishu; |
| | | } |
| | | }, |
| | | ...mapActions(["setUseInfo"]), |
| | | |
| | | numInput(e) { |
| | | // this.nowPrice / this.selectCycle.replace("X", "") |
| | | // this.moneyData.availableBalance |
| | | let numbs = Math.floor( |
| | | this.moneyData.availableBalance / |
| | | this.nowPrice / |
| | | this.selectCycle.replace("X", "") |
| | | ); |
| | | if (e.target.value >= numbs) { |
| | | this.num = numbs; |
| | | } |
| | | // if() |
| | | console.log(e.target.value); |
| | | }, |
| | | handleDoubleClick(event) { |
| | | console.log(1); |
| | | // console.log('Input field was double-clicked', event); |
| | | }, |
| | | async getMoneyData() { |
| | | let data = await api.getMoney(); |
| | | let type = this.bayType === "SZHB" ? "US" : this.bayType; |
| | | // let type = this.bayType === "SZHB" ? "US" : this.bayType; |
| | | if (data.status === 0) { |
| | | const newArr = data.data.filter((item) => item.accectType === type); |
| | | // const newArr = data.data.filter(item => item.accectType === type); |
| | | // this.moneyData = newArr[0] || {}; |
| | | |
| | | this.moneyData = newArr[0] || {}; |
| | | this.moneyData = data.data[0]; |
| | | |
| | | // console.log(this.bayType, newArr); |
| | | // 判断是否登录 |
| | | // this.moneyList = data.data; |
| | |
| | | }, |
| | | handleTabsClick(item, index) { |
| | | this.priceTabsCurrentIndex = index; |
| | | }, |
| | | jjjisua() { |
| | | let numbs = Math.floor( |
| | | this.moneyData.availableBalance / |
| | | this.nowPrice / |
| | | this.selectCycle.replace("X", "") |
| | | ); |
| | | typeof this.num == "string" |
| | | ? (this.num = Number(Number(this.num) + 1)) |
| | | : (this.num = Number(Number(this.num) + 1)); |
| | | |
| | | console.log(this.num, numbs); |
| | | if (this.num >= numbs) { |
| | | this.num = numbs; |
| | | } |
| | | }, |
| | | jyslJian() { |
| | | if (typeof this.num === "string") { |
| | |
| | | } |
| | | }, |
| | | zYjian() { |
| | | if ((Number(this.profitTarget) - 1).toFixed(2) < this.nowPrice) { |
| | | this.profitTarget = this.nowPrice; |
| | | var newzishu = (Number(this.profitTarget) - 1).toFixed(2); |
| | | if (Number(newzishu) < 1) { |
| | | } else { |
| | | this.profitTarget = (Number(this.profitTarget) - 1).toFixed(2); |
| | | this.profitTarget = newzishu; |
| | | } |
| | | // this.profitTarget = (Number(this.profitTarget) - 1).toFixed(2); |
| | | // if(this.tabsCurrentIndex==0){ |
| | | // console.log( this.nowPrice); |
| | | // if ((Number(this.profitTarget) - 1).toFixed(2) < this.nowPrice) { |
| | | // this.profitTarget = (Number(this.profitTarget) - 1).toFixed(2); |
| | | // } else { |
| | | // this.profitTarget = this.nowPrice; |
| | | // } |
| | | // }else{ |
| | | // console.log(123); |
| | | // if ((Number(this.profitTarget) - 1).toFixed(2) < this.nowPrice) { |
| | | // this.profitTarget = this.nowPrice; |
| | | // } else { |
| | | // this.profitTarget = (Number(this.profitTarget) - 1).toFixed(2); |
| | | // } |
| | | // } |
| | | }, |
| | | zSjia() { |
| | | if ((Number(this.zhisun) + 1).toFixed(2) > this.nowPrice) { |
| | | this.zhisun = this.nowPrice; |
| | | } else { |
| | | this.zhisun++; |
| | | } |
| | | this.zhisun++; |
| | | // if ((Number(this.zhisun) + 1).toFixed(2) > this.nowPrice) { |
| | | // this.zhisun = this.nowPrice; |
| | | // } else { |
| | | // this.zhisun++; |
| | | // } |
| | | }, |
| | | zsInt(e) { |
| | | if (typeof e.target.value === "string") { |
| | |
| | | stockId: this.code, |
| | | buyNum: this.num, |
| | | lever: this.selectLever, |
| | | targetPrice: this.nums, |
| | | targetPrice: this.nums |
| | | }; |
| | | console.log(this.selectLever, "this.selectLever "); |
| | | |
| | |
| | | this.$store.commit("elAlertShow", { |
| | | elAlertShow: true, |
| | | elAlertText: data.msg, |
| | | elAlertType: "success", |
| | | elAlertType: "success" |
| | | }); |
| | | this.getUserInfo(); |
| | | this.$router.push("/warehouse?index=1&buyType=" + this.bayType); |
| | | // this.$router.push("/warehouse?index=1&buyType=" + this.bayType); |
| | | this.$router.push("/tradeNew?index=1&buyType=" + this.bayType); |
| | | } else { |
| | | this.$store.commit("elAlertShow", { |
| | | elAlertShow: true, |
| | | elAlertText: data.msg, |
| | | elAlertText: data.msg |
| | | }); |
| | | } |
| | | }, |
| | |
| | | if (this.$store.state.userInfo.isActive !== 2) { |
| | | this.$store.commit("elAlertShow", { |
| | | elAlertShow: true, |
| | | elAlertText: this.$t("hj111"), |
| | | elAlertText: this.$t("hj111") |
| | | }); |
| | | this.$router.push("/authentications"); |
| | | return; |
| | |
| | | // stockId: this.detail.id, |
| | | // buyNum: this.selectNumber ? this.selectNumber * 100 : 0, // 单位为手 |
| | | // buyType: this.selectType, |
| | | // lever: this.selectCycle ? this.selectCycle : 0, |
| | | lever: this.selectCycle ? this.selectCycle : 0, |
| | | // subaccountNumber:this.subaccountNumber |
| | | |
| | | // 买入是买涨buyType:0, 卖出是买跌buyType:1,卖出的状态是0,买入的状态是1 |
| | | buyNum: this.num, // 单位为手 |
| | | // buyNum: (this.num.match(/\d+/g))[0] * 100, // 单位为手 |
| | | lever: this.selectLever, |
| | | lever: this.selectLever |
| | | }; |
| | | console.log(this.selectLever, "this.selectLever "); |
| | | if (this.tabsCurrentIndex == 0) { |
| | |
| | | this.$store.commit("elAlertShow", { |
| | | elAlertShow: true, |
| | | elAlertText: data.msg, |
| | | elAlertType: "success", |
| | | elAlertType: "success" |
| | | }); |
| | | this.getUserInfo(); |
| | | var buyType = ""; |
| | |
| | | } else { |
| | | buyType = 0; |
| | | } |
| | | this.$router.push("/warehouse?index=1&buyType=" + this.bayType); |
| | | // this.$router.push("/warehouse?index=1&buyType=" + this.bayType); |
| | | this.$router.push("/tradeNew?index=1&buyType=" + this.bayType); |
| | | } else { |
| | | if (data.msg.indexOf("不在交易时段内") > -1) { |
| | | this.$store.commit("elAlertShow", { |
| | | elAlertShow: true, |
| | | elAlertText: this.$t("hj113"), |
| | | elAlertText: this.$t("hj113") |
| | | }); |
| | | } else { |
| | | this.$store.commit("elAlertShow", { |
| | | elAlertShow: true, |
| | | elAlertText: data.msg, |
| | | elAlertText: data.msg |
| | | }); |
| | | } |
| | | } |
| | |
| | | this.$store.commit("elAlertShow", { |
| | | elAlertShow: true, |
| | | elAlertText: data.msg, |
| | | elAlertType: "success", |
| | | elAlertType: "success" |
| | | }); |
| | | this.getUserInfo(); |
| | | this.$router.push("/warehouse?index=1&buyType=" + this.bayType); |
| | | // this.$router.push("/warehouse?index=1&buyType=" + this.bayType); |
| | | this.$router.push("/tradeNew?index=1&buyType=" + this.bayType); |
| | | } else { |
| | | this.$store.commit("elAlertShow", { |
| | | elAlertShow: true, |
| | | elAlertText: data.msg, |
| | | elAlertText: data.msg |
| | | }); |
| | | } |
| | | }, |
| | |
| | | } else { |
| | | this.$store.commit("elAlertShow", { |
| | | elAlertShow: true, |
| | | elAlertText: data.msg, |
| | | elAlertText: data.msg |
| | | }); |
| | | } |
| | | this.$store.state.user = this.user; |
| | |
| | | i++ |
| | | ) { |
| | | let val = this.$store.state.userInfo.siteLever.split("/")[i]; |
| | | let item = { label: val, name: val + "X" }; |
| | | let item = { |
| | | label: val, |
| | | name: val + "X" |
| | | }; |
| | | this.siteLeverList.push(item); |
| | | } |
| | | console.log(this.siteLeverList, " this.selectCycle"); |
| | |
| | | } else { |
| | | this.$store.commit("elAlertShow", { |
| | | elAlertShow: true, |
| | | elAlertText: data.msg, |
| | | elAlertText: data.msg |
| | | }); |
| | | } |
| | | }, |
| | | } |
| | | }, |
| | | filters: { |
| | | getName(name) { |
| | |
| | | } else { |
| | | return name; |
| | | } |
| | | }, |
| | | }, |
| | | } |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | |
| | | .btn_buy { |
| | | width: 100%; |
| | | height: auto; |
| | | bottom: 0; |
| | | background: #fff; |
| | | padding: 0.8rem 0.8rem; |
| | | display: flex; |
| | |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | background: rgb(68, 155, 84); |
| | | // background: rgb(68, 155, 84); |
| | | color: #fff; |
| | | font-size: 0.3846rem; |
| | | border-radius: 0.15rem; |
| | |
| | | } |
| | | |
| | | .maichu { |
| | | background-color: rgb(225, 59, 69) !important; |
| | | // background-color: rgb(225, 59, 69) !important; |
| | | } |
| | | |
| | | .mr { |
| | |
| | | transform: skew(-10deg, 0deg); |
| | | } |
| | | } |
| | | |
| | | /deep/.van-overlay { |
| | | z-index: 10000 !important; |
| | | } |