| | |
| | | <template> |
| | | <div class="home_right"> |
| | | <div class="deal_type"> |
| | | <div |
| | | class="deal_item flex-center bt" |
| | | :class="{ deal_item_active: active == 0 }" |
| | | @click="changeTab(0)" |
| | | > |
| | | <div class="deal_item flex-center bt" :class="{ deal_item_active: active == 0 }" @click="changeTab(0)"> |
| | | {{ $t("buy") }} |
| | | </div> |
| | | <div |
| | | v-if="!!positionSn" |
| | | class="deal_item flex-center bt" |
| | | :class="{ deal_item_active: active == 1 }" |
| | | @click="changeTab(1)" |
| | | > |
| | | <div v-if="!!positionSn" class="deal_item flex-center bt" :class="{ deal_item_active: active == 1 }" |
| | | @click="changeTab(1)"> |
| | | {{ $t("hj121") }} |
| | | </div> |
| | | </div> |
| | | <!-- buy --> |
| | | <div class="submit_form" v-if="active == 0"> |
| | | <el-input |
| | | v-model="bform.price" |
| | | style="text-align: end" |
| | | oninput="value=value.replace(/[^\d.]/g,'')" |
| | | disabled |
| | | > |
| | | <el-input v-model="bform.price" style="text-align: end" oninput="value=value.replace(/[^\d.]/g,'')" disabled> |
| | | <div slot="prefix" class="inp_prefix flex-center">{{ $t("bp") }}</div> |
| | | </el-input> |
| | | |
| | | <el-input |
| | | v-model="bform.num" |
| | | style="text-align: end" |
| | | oninput="value=value.replace(/[^\d.]/g,'')" |
| | | > |
| | | <el-input v-model="bform.num" style="text-align: end" oninput="value=value.replace(/[^\d.]/g,'')"> |
| | | <div slot="prefix" class="inp_prefix flex-center">{{ $t("sl") }}</div> |
| | | </el-input> |
| | | |
| | |
| | | <div class="value"> |
| | | {{ obj.type | currencySymbol }} |
| | | {{ (obj.nowPrice * bform.num) | _toLocaleString }} |
| | | <div v-if="obj.type != $mc"> |
| | | <!-- <div v-if="obj.type != $mc"> |
| | | ≈ $ |
| | | {{ (obj.nowPrice * bform.num * rate(obj.type)) | _toLocaleString }} |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="info_item flex-between"> |
| | | <div class="label">{{ $t("hj48") }}</div> |
| | | <div class="value"> |
| | | {{ moneyData.symbol }} {{ moneyData.availableBalance }} |
| | | {{ CurrentMoneyData.symbol }} {{ CurrentMoneyData.availableBalance }} |
| | | </div> |
| | | </div> |
| | | |
| | |
| | | </div> |
| | | </div> |
| | | |
| | | <el-input |
| | | v-model="sform.price" |
| | | style="text-align: end" |
| | | oninput="value=value.replace(/[^\d.]/g,'')" |
| | | disabled |
| | | > |
| | | <el-input v-model="sform.price" style="text-align: end" oninput="value=value.replace(/[^\d.]/g,'')" disabled> |
| | | <div slot="prefix" class="inp_prefix flex-center">{{ $t("sp") }}</div> |
| | | </el-input> |
| | | |
| | | <el-input |
| | | v-model="sform.num" |
| | | style="text-align: end" |
| | | oninput="value=value.replace(/[^\d.]/g,'')" |
| | | > |
| | | <el-input v-model="sform.num" style="text-align: end" oninput="value=value.replace(/[^\d.]/g,'')"> |
| | | <div slot="prefix" class="inp_prefix flex-center">{{ $t("sl") }}</div> |
| | | </el-input> |
| | | |
| | | <div class="slider_box"> |
| | | <!-- <div class="slider_box"> |
| | | <el-slider v-model="sVal" :marks="marks"> </el-slider> |
| | | </div> |
| | | </div> --> |
| | | |
| | | <div class="info_item flex-between"> |
| | | <div class="label">{{ $t("tc") }}</div> |
| | | <div class="value"> |
| | | {{ obj.type | currencySymbol }} |
| | | {{ (obj.nowPrice * sform.num) | _toLocaleString }} |
| | | <div v-if="obj.type != $mc"> |
| | | <!-- <div v-if="obj.type != $mc"> |
| | | ≈ $ |
| | | {{ (obj.nowPrice * sform.num * rate(obj.type)) | _toLocaleString }} |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | </div> |
| | | |
| | |
| | | 100: "100%", |
| | | }, |
| | | depositAmount: "", // 存款金额 |
| | | moneyData: {}, // 账户金额 |
| | | moneyData: [], // 账户金额 |
| | | pages: {}, // 已购买股票信息 |
| | | }; |
| | | }, |
| | | props: { |
| | | obj: { |
| | | type: Object, |
| | | default: () => {}, |
| | | default: () => { }, |
| | | }, |
| | | positionSn: { |
| | | type: String, |
| | | default: null, |
| | | }, |
| | | }, |
| | | computed: { |
| | | // 当前账户金额 |
| | | CurrentMoneyData() { |
| | | let obj = {}; |
| | | this.moneyData.forEach((i) => { |
| | | if (i.accectType == this.obj.type) { |
| | | obj = i; |
| | | } |
| | | }); |
| | | return obj; |
| | | }, |
| | | }, |
| | | watch: { |
| | |
| | | }, |
| | | // 通过进度条来计算数量 |
| | | bVal(val) { |
| | | if (this.obj.type != this.$mc) |
| | | this.bform.num = Math.floor( |
| | | (this.moneyData.availableBalance * (val / 100)) / |
| | | (this.obj.nowPrice * this.rate(this.obj.type)) |
| | | ); |
| | | else |
| | | this.bform.num = Math.floor( |
| | | (this.moneyData.availableBalance * (val / 100)) / this.obj.nowPrice |
| | | ); |
| | | this.bform.num = Math.floor( |
| | | (this.CurrentMoneyData.availableBalance * (val / 100)) / |
| | | this.obj.nowPrice |
| | | ); |
| | | }, |
| | | sVal(val) { |
| | | this.sform.num = Math.ceil(this.pages.orderNum * (val / 100)); |
| | |
| | | async getMoney() { |
| | | let data = await api.getMoney(); |
| | | if (data.status === 0) { |
| | | this.moneyData = data.data[0]; |
| | | this.moneyData = data.data; |
| | | } |
| | | }, |
| | | // 买卖,买:0,卖:1 |
| | |
| | | if (data.status === 0) { |
| | | this.$message.success(data.msg); |
| | | this.getMoney(); |
| | | this.$emit("Refresh"); |
| | | } else { |
| | | this.$message.error(data.msg); |
| | | } |
| | |
| | | if (data.status == 0) { |
| | | this.$message.success(data.msg); |
| | | this.getInfoSite(); |
| | | this.$emit("Refresh"); |
| | | } |
| | | }), |
| | | }, |
| | |
| | | <style lang="scss" scoped> |
| | | .home_right { |
| | | width: 100%; |
| | | |
| | | .submit_form { |
| | | padding: 16px; |
| | | display: flex; |
| | |
| | | display: flex; |
| | | flex-direction: column; |
| | | gap: 10px; |
| | | |
| | | .position_item { |
| | | background-color: #fff; |
| | | padding: 10px; |
| | |
| | | height: 40px; |
| | | border-radius: 40px; |
| | | } |
| | | |
| | | .bt2 { |
| | | background-color: #dfb758; |
| | | } |
| | |
| | | color: #fff; |
| | | background-color: #07c160; |
| | | } |
| | | |
| | | .deal_item_active:nth-child(2) { |
| | | background-color: #dfb758; |
| | | } |