登录界面

lxf

2025-07-10 bba4046da481abccecf541e76f17a2e32a4cc344

 src/components/Transform/perpetual-open/index.vue

@@ -45,7 +45,7 @@
                </div>
              </div>
            </template>
            <contract-futrue v-if="selectIndex == 2 && JSON.stringify(initFutrue.para) != '[]'" class="mb-20"
            <contract-futrue v-if="selectIndex == 2" class="mb-20"
              :initFutrue="initFutrue" @paraId="onParaId" />
            <div class="h-76 lh-76 greyBg mb-30 flex pr-20 justify-center rounded-lg textColor" v-if="selectIndex == 1">
              <input placeholder="" class="greyBg w-full pl-20  h-76 border-none text-left rounded-lg"
@@ -53,18 +53,18 @@
              <span class="ml-20">{{ queryType === 'cryptos' ? 'USDT' : 'USD' }}</span>
            </div>

            <div class="w-440 flex items-center greyBg h-76 lh-76 rounded-lg" v-if="initFutrue">
              <div v-if="selectIndex == 1 && initFutrue.para && initFutrue.para.length > 0"
            <div class="w-440 flex items-center greyBg h-76 lh-76 rounded-lg" style="background-color:#f5f5f5;" v-if="initFutrue" >
              <!-- <div v-if="selectIndex == 1 && initFutrue.para && initFutrue.para.length > 0"
                class="w-80 flex items-center justify-center" style="height:100%;" @click="onReduce">
                <img src="../../../assets/image/public/reduce.png" alt="add" class="w-30 h-6" />
              </div>
              <input v-if="selectIndex == 1" :placeholder="$t('张数')" class="border-none greyBg text-center textColor"
                style="width: 156px;" v-model="form.amount" type="number" @input="onInput" />
              </div> -->
              <!-- <input v-if="selectIndex == 1" :placeholder="$t('张数')" class="border-none greyBg text-center textColor"
                style="width: 156px;" v-model="form.amount" type="number" @input="onInput" /> -->
              <input v-if="selectIndex == 2 && JSON.stringify(initFutrue.para) != '[]'"
                :placeholder="($t('最少') + initFutrue && initFutrue.para ? $t('最小金额') + initFutrue.para[paraIndex].buy_min : '')"
                class="border-none greyBg text-center textColor" style="width: 156px;" v-model="form.amount" type="number"
                class="border-none greyBg text-center textColor" style="width: 156px;background-color:#f5f5f5;" v-model="form.amount" type="number"
                @input="onInput" />
              <div class="w-80 flex items-center justify-center" style="height:100%;">
              <div class="w-80 flex items-center justify-center" style="height:100%;background-color:#f5f5f5;">
                <template v-if="selectIndex == 1">
                  <img @click="onAdd" src="../../../assets/image/public/add.png" alt="reduce" class="w-30 h-30" />
                </template>
@@ -74,13 +74,13 @@
              </div>
            </div>
            <template v-if="selectIndex == 1">
              <div class="mt-40 mb-30 w-full flex justify-between items-center">
              <!-- <div class="mt-40 mb-30 w-full flex justify-between items-center">
                <span class="font-22 font-400 text-grey">{{ $t("可开张数") }}</span>
                <span class="font-22 font-400 textColor">
                  {{ initData.volume }}
                  {{ initData.volume || 0}}
                  {{ $t("张") }}
                </span>
              </div>
              </div> -->
              <!-- <vue-slider v-bind="options" v-model="form.amount"></vue-slider> -->
              <!-- <vue-slider class="mainBox" v-bind="options" :marks="marks" v-model="form.volume" :hide-label="true"  width="90%"
              :railStyle="{ background: '#404040', height: '4px' }"
@@ -124,6 +124,7 @@
              <div>{{ $t("可用USDT") }}</div>
              <div class="textColor">{{ initFutrue.amount }} {{ queryType === 'cryptos' ? 'USDT' : 'USD' }}</div>
            </div>
            <!-- {{JSON.stringify(initFutrue.para) != '[]'}} {{JSON.stringify(initFutrue.para)}} -->
            <div class="flex font-24 text-grey justify-between mt-20"
              v-if="selectIndex == 2 && JSON.stringify(initFutrue.para) != '[]'">
              <div>{{ $t("手续费") }}</div>
@@ -131,7 +132,7 @@
                {{
                  (
                    form.amount *
                    (initFutrue && initFutrue.para
                    (initFutrue?.para.length>0
                      ? initData.para[paraIndex].unit_fee
                      : "")
                  ).toFixed(2)
@@ -360,7 +361,7 @@
    },
    selectIndex: {
      type: [String, Number],
      default: 1
      default: 2
    },
    currentType: {
      type: String,
@@ -436,27 +437,32 @@
    '$route'(val) {
      this.getHomeList(val.params.symbol);
    },
    initData(val) {
      if (val.lever.length > 0) {
        val.lever = val.lever.sort(this.orderListAsc('lever_rate'))
      }
    // initData(val) {
    //   if (val && val.lever && val.lever.length > 0) {
    //     val.lever = val.lever.sort(this.orderListAsc('lever_rate'))
    //   }

    }
    // }
  },
  computed: {
    ...mapGetters('user', ['userInfo']),
    ...mapGetters('home', ['currency']),
    initData() {
      let obj = null
      if (this.selectIndex / 1 === 1) {

        obj = this.initOpen
        if (!obj.lever || !obj.lever.length) { // 倍数
          obj.lever = [{ id: 1, lever_rate: 1 }]
        const obj = this.initOpen ? { ...this.initOpen } : { lever: [{ id: 1, lever_rate: 1 }] };
        if (!obj.lever || !Array.isArray(obj.lever) || !obj.lever.length) {
          obj.lever = [{ id: 1, lever_rate: 1 }];
        } else {
          obj.lever = [...obj.lever].sort(this.orderListAsc('lever_rate'));
        }
        return obj
        return obj;
      }
      return this.initFutrue
      // 交割合约
      if (this.initFutrue && Array.isArray(this.initFutrue.para) && this.initFutrue.para.length > 0) {
        return this.initFutrue;
      }
      // 返回一个默认对象，避免模板报错
      return {};
    },
    coudBuyVolume() { // 可买数量
      return Math.floor((this.initOpen.volume / 1) / this.form.lever_rate)
@@ -812,7 +818,9 @@
        if (this.selectIndex / 1 === 1) {
          this.$refs.sliderRef.emptyValue()
        }
        this.$emit('ordered', emitFunc)
        if (this.$emit) {
          // this.$emit('ordered', emitFunc)
        }
        _getBalance().then(data => { // 刷新余额
          this.$store.commit('user/SET_USERINFO', { balance: data.money })
        })
@@ -965,9 +973,11 @@
    right: 0;
    top: 90px;
    width: 100%;
    background-color: $grey_bg;
    background-color: #f5f5f5;
    box-shadow: 0px 0px 0.1875rem 0.1875rem #f5f5f5;
    // background-color: $grey_bg;
    text-align: center;
    box-shadow: 0px 0px 3px 3px $grey_bg;
    // box-shadow: 0px 0px 3px 3px $grey_bg;
    border-radius: 4px;
    color: $text-color;
    z-index: 10;
@@ -1048,12 +1058,17 @@
  .select-box {
    width: 220px;

    background: #1E1E1E;
    background: #f5f5f5;

    margin-right: 20px;
  }
}

.diviLine{
  background-color: #f5f5f5;
}
.textColor2, .textColor{
  color: #fff;
}
.deep-div {
  min-height: 370px;
}