first

zzzz

2024-04-21 60739973cb024fb8902000251531e006e7988f23

first

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

@@ -3,19 +3,41 @@
  <div class="perpetual-open">
    <div class="flex header-open">
      <div class="flex flex-1 pt-34">
        <div class="w-180 h-60 lh-60 text-center rounded inputBackground textColor">
        <div
          class="w-180 h-60 lh-60 text-center rounded inputBackground textColor"
        >
          {{ $t("全仓") }}
        </div>
        <!-- <div class="w-80 h-60 lh-60 ml-29 rounded tabBackground textColor" style="text-align:center">1x</div> -->
        <div class="w-140 h-60 lh-60 ml-29 rounded tabBackground textColor" v-if="selectIndex / 1 === 1">
          <div @click="showOptions = !showOptions" style="height: 100%; box-sizing: border-box"
            class="relative word-30 pl-28 pr-10 w-140 h-60 select-wrap flex justify-between items-center">
        <div
          class="w-140 h-60 lh-60 ml-29 rounded tabBackground textColor"
          v-if="selectIndex / 1 === 1"
        >
          <div
            @click="showOptions = !showOptions"
            style="height: 100%; box-sizing: border-box"
            class="relative word-30 pl-28 pr-10 w-140 h-60 select-wrap flex justify-between items-center"
          >
            {{ form.lever_rate }}x
            <img src="../../assets/image/public/grey-select.png" alt="select-icon" class="w-22 h-11" />
            <div v-if="showOptions" class="options w-140 absolute top-97 left-0 z-10">
              <div class="w-full" @click.stop="handleChoose(item)" :class="{
                'option-active': form.lever_rate === item.lever_rate,
              }" :value="item.lever_rate" v-for="item in initData.lever" :key="item.id">
            <img
              src="../../assets/image/public/grey-select.png"
              alt="select-icon"
              class="w-22 h-11"
            />
            <div
              v-if="showOptions"
              class="options w-140 absolute top-97 left-0 z-10"
            >
              <div
                class="w-full"
                @click.stop="handleChoose(item)"
                :class="{
                  'option-active': form.lever_rate === item.lever_rate,
                }"
                :value="item.lever_rate"
                v-for="item in initData.lever"
                :key="item.id"
              >
                {{ item.lever_rate }}x
              </div>
            </div>
@@ -23,7 +45,12 @@
        </div>
      </div>
      <div>
        <img src="../../assets/image/public/k-line.png" alt="line-img" class="w-38 h-35" @click="jump" />
        <img
          src="../../assets/image/public/k-line.png"
          alt="line-img"
          class="w-38 h-35"
          @click="jump"
        />
      </div>
    </div>
    <div class="pt-30 pb-20">
@@ -31,62 +58,131 @@
        <div class="w-440 flex flex-col">
          <template v-if="selectIndex == 1">
            <div class="flex items-center h-66 rounded-lg text-grey">
              <p class="font-28 flex-1 flex items-center justify-center h-66 "
                :class="currentType == 'long' ? 'long' : ''" @click="changeTab('long')">
              <p
                class="font-28 flex-1 flex items-center justify-center h-66"
                :class="currentType == 'long' ? 'long' : ''"
                @click="changeTab('long')"
              >
                {{ $t("开多") }}
              </p>
              <p class="font-28 flex-1 flex items-center justify-center h-66"
                :class="currentType == 'short' ? 'short' : ''" @click="changeTab('short')">
              <p
                class="font-28 flex-1 flex items-center justify-center h-66"
                :class="currentType == 'short' ? 'short' : ''"
                @click="changeTab('short')"
              >
                {{ $t("开空") }}
              </p>
            </div>
            <div class="mt-30 mb-30" style="position: relative">
              <div class="inputBackground flex justify-between items-center w-full h-76 rounded-lg textColor"
                @click="selectBtn">
                <img src="../../assets/image/public/warn.png" alt="warn-icon" class="w-25 h-25 pl-20" />
              <div
                class="inputBackground flex justify-between items-center w-full h-76 rounded-lg textColor"
                @click="selectBtn"
              >
                <img
                  src="../../assets/image/public/warn.png"
                  alt="warn-icon"
                  class="w-25 h-25 pl-20"
                />
                <div class="text-center" style="width: 80%">{{ title }}</div>
                <img src="../../assets/image/public/grey-select.png" alt="select-icon" class="w-22 h-11 pr-20" />
                <img
                  src="../../assets/image/public/grey-select.png"
                  alt="select-icon"
                  class="w-22 h-11 pr-20"
                />
              </div>
              <div class="option-box" v-show="isShow">
                <div class="font-30" v-for="item in selectData" :key="item.type" @click="selectItem(item)">
                <div
                  class="font-30"
                  v-for="item in selectData"
                  :key="item.type"
                  @click="selectItem(item)"
                >
                  {{ item.title }}
                </div>
              </div>
            </div>
          </template>
          <contract-futrue v-if="selectIndex == 2" class="mb-20" :initFutrue="initFutrue" @paraId="onParaId" />
          <div class="h-76 lh-76 inputBackground mb-30 flex pr-20 justify-center rounded-lg textColor"
            v-if="selectIndex == 1">
            <input placeholder="" class="inputBackground w-full pl-20 h-76 border-none text-left rounded-lg"
              :disabled="type / 1 === 1" @focus="focus = true" v-model="form.price" />
          <contract-futrue
            v-if="selectIndex == 2"
            class="mb-20"
            :initFutrue="initFutrue"
            @paraId="onParaId"
          />
          <div
            class="h-76 lh-76 inputBackground mb-30 flex pr-20 justify-center rounded-lg textColor"
            v-if="selectIndex == 1"
          >
            <input
              placeholder=""
              class="inputBackground w-full pl-20 h-76 border-none text-left rounded-lg"
              :disabled="type / 1 === 1"
              @focus="focus = true"
              v-model="form.price"
            />
            <span class="ml-20">USDT</span>
          </div>
          <div class="h-76 lh-76 inputBackground mb-30 flex pr-20 justify-center rounded-lg textColor"
            v-if="selectIndex == 1">
            <input :placeholder="selectIndex == 1 ? $t('请输入止盈金额'): ''" class="inputBackground  pl-20 h-76 border-none text-left rounded-lg"
               v-model="form.stop_price_profit" />
            <span class="font-22 font-400 textColor">{{ $t("止盈") }}</span>
          </div>
          <div class="h-76 lh-76 inputBackground mb-30 flex pr-20 justify-center rounded-lg textColor"
            v-if="selectIndex == 1">
            <input :placeholder="selectIndex == 1 ? $t('请输入止损金额'): ''" class="inputBackground  pl-20 h-76 border-none text-left rounded-lg"
              v-model="form.stop_price_loss" />
            <span class="font-22 font-400 textColor">{{ $t("止损") }}</span>
          </div>
          <div class="w-440 flex items-center inputBackground h-76 lh-76 rounded-lg">
            <div v-if="selectIndex == 1" 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
            class="h-76 lh-76 inputBackground mb-30 flex pr-20 justify-center rounded-lg textColor"
            v-if="selectIndex == 1"
          >
            <input
              :placeholder="selectIndex == 1 ? $t('请输入止盈金额') : ''"
              class="inputBackground pl-20 h-76 border-none text-left rounded-lg"
              v-model="form.stop_price_profit"
            />
            <span class="font-22 font-400 textColor">{{ $t("止盈") }}</span>
          </div>
          <div
            class="h-76 lh-76 inputBackground mb-30 flex pr-20 justify-center rounded-lg textColor"
            v-if="selectIndex == 1"
          >
            <input
              :placeholder="selectIndex == 1 ? $t('请输入止损金额') : ''"
              class="inputBackground pl-20 h-76 border-none text-left rounded-lg"
              v-model="form.stop_price_loss"
            />
            <span class="font-22 font-400 textColor">{{ $t("止损") }}</span>
          </div>
          <div
            class="w-440 flex items-center inputBackground h-76 lh-76 rounded-lg"
          >
            <div
              v-if="selectIndex == 1"
              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 :placeholder="selectIndex == 1 ? $t('张数')
              : $t('最少') + initFutrue && initFutrue.para
                ? $t('最小金额') + initFutrue.para[paraIndex].buy_min
                : ''
              " class="border-none inputBackground text-center textColor" style="width: 156px" v-model="form.amount"
              type="number" @input="onInput" />
            <div class="w-80 flex items-center justify-center" style="height: 100%">
            <input
              :placeholder="
                selectIndex == 1
                  ? $t('张数')
                  : $t('最少') + initFutrue && initFutrue.para
                  ? $t('最小金额') + initFutrue.para[paraIndex].buy_min
                  : ''
              "
              class="border-none inputBackground text-center textColor"
              style="width: 156px"
              v-model="form.amount"
              type="number"
              @input="onInput"
            />
            <div
              class="w-80 flex items-center justify-center"
              style="height: 100%"
            >
              <template v-if="selectIndex == 1">
                <img @click="onAdd" src="../../assets/image/public/add.png" alt="reduce" class="w-30 h-30" />
                <img
                  @click="onAdd"
                  src="../../assets/image/public/add.png"
                  alt="reduce"
                  class="w-30 h-30"
                />
              </template>
              <template v-else>
                <span class="textColor">USDT</span>
@@ -95,7 +191,9 @@
          </div>
          <template v-if="selectIndex == 1">
            <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 text-grey">{{
                $t("可开张数")
              }}</span>
              <span class="font-22 font-400 textColor">
                {{ initData.volume }}
                {{ $t("张") }}
@@ -117,12 +215,18 @@
              <span class="flex-1 text-right">100%</span>
            </div> -->
            <!-- 张数输入 -->
            <amount-slider ref="sliderRef" :maxAmount="getVolumnByLever()" @getAmount="getAmount"></amount-slider>
            <amount-slider
              ref="sliderRef"
              :maxAmount="getVolumnByLever()"
              @getAmount="getAmount"
            ></amount-slider>
          </template>
          <template v-if="selectIndex == 1 && userInfo.token">
            <div class="flex justify-between mt-30">
              <div class="text-grey">{{ $t('合约金额') }}</div>
              <div class="textColor">{{ initData.amount * (form.amount / 1) * form.lever_rate }} USDT</div>
              <div class="text-grey">{{ $t("合约金额") }}</div>
              <div class="textColor">
                {{ initData.amount * (form.amount / 1) * form.lever_rate }} USDT
              </div>
            </div>
            <div class="flex justify-between mt-30">
              <div class="text-grey">{{ $t("保证金") }}</div>
@@ -132,15 +236,27 @@
            </div>
            <div class="flex justify-between mt-30">
              <div class="text-grey">{{ $t("建仓手续费") }}</div>
              <div class="textColor">{{ userInfo.perpetual_contracts_status === '1' ? initData.fee *
                (form.amount / 1) : initData.fee * (form.amount / 1) * form.lever_rate | nan }} USDT</div>
              <div class="textColor">
                {{
                  userInfo.perpetual_contracts_status === "1"
                    ? initData.fee * (form.amount / 1)
                    : (initData.fee * (form.amount / 1) * form.lever_rate) | nan
                }}
                USDT
              </div>
            </div>
          </template>
          <div class="flex font-24 text-grey justify-between mt-32" v-if="selectIndex == 2">
          <div
            class="flex font-24 text-grey justify-between mt-32"
            v-if="selectIndex == 2"
          >
            <div>{{ $t("可用USDT") }}</div>
            <div class="textColor">{{ initFutrue.amount | nan }} USDT</div>
          </div>
          <div class="flex font-24 text-grey justify-between mt-20" v-if="selectIndex == 2">
          <div
            class="flex font-24 text-grey justify-between mt-20"
            v-if="selectIndex == 2"
          >
            <div>{{ $t("手续费") }}</div>
            <div class="textColor">
              {{
@@ -156,30 +272,59 @@
          </div>
          <template v-if="userInfo.token">
            <template v-if="selectIndex == 1">
              <div class="w-full h-80 lh-80 bg-green flex text-white rounded-md mt-50" v-if="currentType == 'long'"
                @click="order('long')">
                <div class="font-34 relative text-center" style="flex-grow:1;" v-if="selectIndex == 1">
                  {{ $t('开多') }}
                  <span class="right-word font-22 text-center">{{ $t('看涨') }}</span>
              <div
                class="w-full h-80 lh-80 bg-green flex text-white rounded-md mt-50"
                v-if="currentType == 'long'"
                @click="order('long')"
              >
                <div
                  class="font-34 relative text-center"
                  style="flex-grow: 1"
                  v-if="selectIndex == 1"
                >
                  {{ $t("开多") }}
                  <span class="right-word font-22 text-center">{{
                    $t("看涨")
                  }}</span>
                </div>
                <div class="font-34 relative text-center" style="flex-grow:1;" v-else>
                  {{ $t('做多买入') }}
                <div
                  class="font-34 relative text-center"
                  style="flex-grow: 1"
                  v-else
                >
                  {{ $t("做多买入") }}
                </div>
              </div>
              <div class="w-full h-80 lh-80 bg-red flex text-white rounded-md mt-50" v-if="currentType == 'short'"
                @click="order('short')">
                <div class="relative font-34 text-center" style="flex-grow:1;" v-if="selectIndex == 1">
                  {{ $t('开空') }}
                  <span class="right-word font-22 text-center">{{ $t('看跌') }}</span>
              <div
                class="w-full h-80 lh-80 bg-red flex text-white rounded-md mt-50"
                v-if="currentType == 'short'"
                @click="order('short')"
              >
                <div
                  class="relative font-34 text-center"
                  style="flex-grow: 1"
                  v-if="selectIndex == 1"
                >
                  {{ $t("开空") }}
                  <span class="right-word font-22 text-center">{{
                    $t("看跌")
                  }}</span>
                </div>
                <div class="relative font-34 text-center" style="flex-grow:1;" v-else>
                  {{ $t('做空买入') }}
                <div
                  class="relative font-34 text-center"
                  style="flex-grow: 1"
                  v-else
                >
                  {{ $t("做空买入") }}
                </div>
              </div>
            </template>
            <template v-if="selectIndex == 2">
              <div class="w-full h-80 lh-80 bg-green flex text-white rounded-md mt-30 " @click="order('open')"
                v-if="userInfo.token">
              <div
                class="w-full h-80 lh-80 bg-green flex text-white rounded-md mt-30"
                @click="order('open')"
                v-if="userInfo.token"
              >
                <div class="font-34 relative text-center" style="flex-grow: 1">
                  {{ $t("开多") }}
                  <span class="right-word font-22 text-center">{{
@@ -187,8 +332,13 @@
                  }}</span>
                </div>
              </div>
              <div class="w-full h-80 lh-80 bg-red flex text-white rounded-md mt-20 mb-10" style="position: relative;"
                :class="{ 'mt-22': selectIndex == 2 }" @click="order('close')" v-if="userInfo.token">
              <div
                class="w-full h-80 lh-80 bg-red flex text-white rounded-md mt-20 mb-10"
                style="position: relative"
                :class="{ 'mt-22': selectIndex == 2 }"
                @click="order('close')"
                v-if="userInfo.token"
              >
                <div class="relative font-34 text-center" style="flex-grow: 1">
                  {{ $t("开空") }}
                  <span class="right-word font-22 text-center">{{
@@ -203,8 +353,10 @@
              <p>{{ $t("套期保值，风险对冲") }}</p>
              <p class="pt-8">{{ $t("登陆后继续") }}</p>
            </div>
            <div class="h-80 lh-80 btnBackground flex text-white rounded-md justify-center mt-50"
              @click="$router.push('/login')">
            <div
              class="h-80 lh-80 btnBackground flex text-white rounded-md justify-center mt-50"
              @click="$router.push('/login')"
            >
              {{ $t("登录后进行交易") }}
            </div>
          </div>
@@ -217,21 +369,28 @@
            </div>
            <div class="text-right items-end justify-end">
              <div class="">{{ $t("数量") }}</div>
              <div class="mt-4">({{ symbol.toUpperCase() || "--" }})</div>
              <div class="mt-4">({{ symbol | _symbolName }})</div>
            </div>
          </div>
          <div v-if="showType == 0 || showType == 1" class="w-290 flex justify-between pt-12 font-26"
            v-for="(item, index) in greenData" :key="index" @click="onQuickPrice(item.price)" :style="{
          <div
            v-if="showType == 0 || showType == 1"
            class="w-290 flex justify-between pt-12 font-26"
            v-for="(item, index) in greenData"
            :key="index"
            @click="onQuickPrice(item.price)"
            :style="{
              background:
                `linear-gradient(to right,${theme == 'dark' ? '#121212' : '#ffffff'
                `linear-gradient(to right,${
                  theme == 'dark' ? '#121212' : '#ffffff'
                } 0%` +
                (1 - item.amount / greenData[greenData.length - 1].amount) *
                100 +
                  100 +
                '%,rgba(94,186,137,.1) ' +
                (1 - item.amount / greenData[greenData.length - 1].amount) *
                100 +
                  100 +
                '%,rgba(94,186,137,.1) 100%)',
            }">
            }"
          >
            <div class="text-green">{{ item.price }}</div>
            <div class="text-right textColor" v-if="symbol == 'shib'">
              {{ fixDate(item.amount, $i18n) || "--" }}
@@ -240,26 +399,37 @@
              {{ item.amount || "--" }}
            </div>
          </div>
          <div v-if="showType == 0 || showType == 1 || showType == 2"
            class="w-290 text-red pt-12 font-34 font-700 text-center">
          <div
            v-if="showType == 0 || showType == 1 || showType == 2"
            class="w-290 text-red pt-12 font-34 font-700 text-center"
          >
            {{ approximately || "--" }}
          </div>
          <div v-if="showType == 0 || showType == 1 || showType == 2"
            class="approximately-text pb-12 font-20 text-center">
          <div
            v-if="showType == 0 || showType == 1 || showType == 2"
            class="approximately-text pb-12 font-20 text-center"
          >
            ≈ {{ price || "--" }}
          </div>
          <div v-if="showType == 0 || showType == 2" class="w-290 flex justify-between pt-12 font-26"
            v-for="(item, index) in redData" :key="item + index" @click="onQuickPrice(item.price)" :style="{
          <div
            v-if="showType == 0 || showType == 2"
            class="w-290 flex justify-between pt-12 font-26"
            v-for="(item, index) in redData"
            :key="item + index"
            @click="onQuickPrice(item.price)"
            :style="{
              background:
                `linear-gradient(to right,${theme == 'dark' ? '#121212' : '#ffffff'
                `linear-gradient(to right,${
                  theme == 'dark' ? '#121212' : '#ffffff'
                } 0%` +
                (1 - item.amount / greenData[greenData.length - 1].amount) *
                100 +
                  100 +
                '%,rgba(246,70,93,.1) ' +
                (1 - item.amount / greenData[greenData.length - 1].amount) *
                100 +
                  100 +
                '%,rgba(246,70,93,.1) 100%)',
            }">
            }"
          >
            <div class="text-red">{{ item.price }}</div>
            <div class="text-right textColor" v-if="symbol == 'shib'">
              {{ fixDate(item.amount, $i18n) || "--" }}
@@ -270,33 +440,61 @@
          </div>
          <div class="flex k-select-box">
            <div class="mt-30 mb-30 select-box" style="position: relative">
              <div class="flex justify-between items-center w-full h-70" @click="selectArryBtn">
              <div
                class="flex justify-between items-center w-full h-70"
                @click="selectArryBtn"
              >
                <!-- <img src="@/assets/image/public/warn.png" alt="warn-icon" class="w-25 h-25 pl-20"/> -->
                <div class="pl-16 textColor" style="width: 80%">
                  {{ dataArrTitle }}
                </div>
                <img src="@/assets/image/public/grey-select.png" alt="select-icon" class="w-22 h-11 pr-20" />
                <img
                  src="@/assets/image/public/grey-select.png"
                  alt="select-icon"
                  class="w-22 h-11 pr-20"
                />
              </div>
              <div class="option-box" v-show="arryIsShow">
                <div class="font-30" v-for="(item, index) in selectDataArry" :key="index" @click="selectItemArry(item)">
                <div
                  class="font-30"
                  v-for="(item, index) in selectDataArry"
                  :key="index"
                  @click="selectItemArry(item)"
                >
                  {{ item.name }}
                </div>
              </div>
            </div>
            <div @click="isSelectShow = true">
              <img src="@/assets/image/selectIcon.png" alt="warn-icon" class="w-36 h-30" />
              <img
                src="@/assets/image/selectIcon.png"
                alt="warn-icon"
                class="w-36 h-30"
              />
            </div>
          </div>
        </div>
      </div>
    </div>
    <van-popup v-model="show" class="rounded-2xl">

      <popup-delivery showBtns :detailData="detailData" :key="detailData.order_no" @close="onClose"
        @continueToBuy="continueTobuy" @timeEnd="handleTimeEnd" :price="price" />
      <popup-delivery
        showBtns
        :detailData="detailData"
        :key="detailData.order_no"
        @close="onClose"
        @continueToBuy="continueTobuy"
        @timeEnd="handleTimeEnd"
        :price="price"
      />
    </van-popup>
    <van-action-sheet v-model="isSelectShow" @select="onSelect" :actions="actions" :cancel-text="$t('取消')"
      close-on-click-action @cancel="onCancel">
    <van-action-sheet
      v-model="isSelectShow"
      @select="onSelect"
      :actions="actions"
      :cancel-text="$t('取消')"
      close-on-click-action
      @cancel="onCancel"
    >
    </van-action-sheet>
  </div>
</template>
@@ -320,7 +518,7 @@
import PopupDelivery from "@/components/popup-delivery";
import { fixDate } from "@/utils/utis";
import { _getHomeList } from "@/API/home.api";
import { getStorage } from '@/utils/utis'
import { getStorage } from "@/utils/utis";
// import PopupConfirmOrder from '@/components/popup-confirm-order'
export default {
  name: "perpetualPosition",
@@ -450,37 +648,38 @@
          });
        }
      }
      this.approximately = this.redData[0].price
      this.approximately = this.redData[0].price;
    },
  },
  mounted() {
    this.getHomeList(this.$route.params.symbol);
    setInterval(() => {
      // 刷新页面
          if (location.href.indexOf("#reloaded") == -1&&location.href.indexOf("perpetualContract")>0) {
            location.href = location.href + "#reloaded";
            location.reload();
          }
      if (
        location.href.indexOf("#reloaded") == -1 &&
        location.href.indexOf("perpetualContract") > 0
      ) {
        location.href = location.href + "#reloaded";
        location.reload();
      }
    }, 1000); // 1000毫秒 = 1秒


  },
  computed: {
    ...mapGetters({
      userInfo: 'user/userInfo',
      theme: 'home/theme'
      userInfo: "user/userInfo",
      theme: "home/theme",
    }),
    initData() {
      let obj = null
      let obj = null;
      if (this.selectIndex / 1 === 1) {

        obj = this.initOpen
        if (!obj.lever || !obj.lever.length) { // 倍数
          obj.lever = [{ id: 1, lever_rate: 1 }]
        obj = this.initOpen;
        if (!obj.lever || !obj.lever.length) {
          // 倍数
          obj.lever = [{ id: 1, lever_rate: 1 }];
        }
        return obj
        return obj;
      }
      return this.initFutrue
      return this.initFutrue;
    },
    coudBuyVolume() {
      // 可买数量
@@ -517,8 +716,8 @@
        direction: "buy", // 买or卖
        price_type: "opponent", // 市价or限价
        lever_rate: 1, // 杠杆
        stop_price_profit:'',
        stop_price_loss:'',
        stop_price_profit: "",
        stop_price_loss: "",
        price: "",
        amount: "", // 数量
        para_id: "", // 交割周琦id
@@ -531,16 +730,16 @@
      selectDataArry: [],
      isSelectShow: false,
      actions: [
        { name: this.$t("默认"), value: 0, className: 'actions-active' },
        { name: this.$t("展示买单"), value: 1, className: '' },
        { name: this.$t("展示卖单"), value: 2, className: '' },
        { name: this.$t("默认"), value: 0, className: "actions-active" },
        { name: this.$t("展示买单"), value: 1, className: "" },
        { name: this.$t("展示卖单"), value: 2, className: "" },
      ],
      showType: 0,
      dataArrTitle: 0,
      dataArrValue: 0,
      arryIsShow: false,
      marks: (val) => val % 50 === 0,
      approximately: ''
      approximately: "",
    };
  },
  beforeDestroy() {
@@ -552,7 +751,7 @@
      { title: this.$t("限价"), type: "2" },
    ];
    this.title = this.selectData[0].title;
    this.type = this.selectData[0].type
    this.type = this.selectData[0].type;
  },

  methods: {
@@ -695,7 +894,7 @@
      if (this.form.amount === this.options.max) {
        return;
      }
      console.log(this.options.max)
      console.log(this.options.max);
      this.form.amount++;
    },
    onReduce() {
@@ -711,7 +910,7 @@
      // 交割日期
      // console.log(evt)
      this.form.para_id = id;
      this.form.amount = ''
      this.form.amount = "";
      this.paraIndex = index;
    },
    onInput() {
@@ -736,7 +935,7 @@
    //选择价格类型
    selectItem(item) {
      if (item.type == 1) {
        this.form.price = this.price
        this.form.price = this.price;
      }
      this.form.price_type = item.type === "1" ? "opponent" : "limit";
      this.title = item.title;
@@ -754,7 +953,7 @@
      this.$emit("changeCurrentType", type);
      // this.currentType = type;

      this.$refs.sliderRef.emptyValue()
      this.$refs.sliderRef.emptyValue();
      this.handleInitSliderOption();
    },
    onClose() {
@@ -775,14 +974,14 @@
        this.$router.push("/login");
        return false;
      }
     //  if (!this.form.stop_price_profit) {
     //      this.$toast.fail(this.$t("请输入止盈金额"));
     //       return false;
     //      }
        // if (!this.form.stop_price_loss) {
        //     this.$toast.fail(this.$t("请输入止损金额"));
        //      return false;
        //     }
      //  if (!this.form.stop_price_profit) {
      //      this.$toast.fail(this.$t("请输入止盈金额"));
      //       return false;
      //      }
      // if (!this.form.stop_price_loss) {
      //     this.$toast.fail(this.$t("请输入止损金额"));
      //      return false;
      //     }
      if (!this.form.amount) {
        if (this.selectIndex == 1) {
          this.$toast.fail(this.$t("请输入合约张数"));
@@ -792,21 +991,20 @@
        return;
      }


      // this.form.direction = type
      this.form.symbol = this.$route.params.symbol;
      if (type == 'long' || type == 'open') {
        this.form.direction = 'buy'
      if (type == "long" || type == "open") {
        this.form.direction = "buy";
      } else {
        this.form.direction = 'sell'
        this.form.direction = "sell";
      }
      let _order = null; // api
      let emitFunc = null; // 触发函数
      if (this.selectIndex / 1 === 1) {
        // 永续合约
        this.form.session_token = this.initOpen.session_token
        _order = _orderOpen
        emitFunc = this.currentType
        this.form.session_token = this.initOpen.session_token;
        _order = _orderOpen;
        emitFunc = this.currentType;
        this.openOrder(_order, emitFunc);
      } else {
        // 交割合约
@@ -839,7 +1037,7 @@
      _order(this.form)
        .then((res) => {
          if (this.selectIndex / 1 === 1) {
            this.$refs.sliderRef.emptyValue()
            this.$refs.sliderRef.emptyValue();
          }
          this.$toast(this.$t("操作成功"));
          _getBalance().then((data) => {
@@ -859,7 +1057,7 @@
          // 也需要重新初始化
          this.$emit("ordered", emitFunc);
          if (this.selectIndex / 1 === 1) {
            this.$refs.sliderRef.emptyValue()
            this.$refs.sliderRef.emptyValue();
          }
        });
    },
@@ -872,9 +1070,9 @@
    },
    onSelect(item) {
      this.actions.map((item) => {
        item.className = ''
      })
      item.className = 'actions-active'
        item.className = "";
      });
      item.className = "actions-active";
      this.showType = item.value;
      this.$emit("changeValueBack", this.showType);
    },
@@ -986,16 +1184,16 @@
  overflow: hidden;
}

.tab>* {
.tab > * {
  height: 100%;
}

.tab>img {
.tab > img {
  margin-left: -2px;
  margin-right: -2px;
}

.tab>a {
.tab > a {
  flex-grow: 1;
  display: flex;
  justify-content: center;
@@ -1034,11 +1232,11 @@
  }
}

.option-box>div {
.option-box > div {
  padding: 30px 0;
}

.option-box>div:hover {
.option-box > div:hover {
  // background-color: #f5f5f5;
}

@@ -1054,7 +1252,8 @@
  -webkit-appearance: none;
  /* Safari and Chrome */
  padding: 0 20px 0 20px;
  background: url("../../assets/image/public/grey-select.png") no-repeat scroll right center transparent;
  background: url("../../assets/image/public/grey-select.png") no-repeat scroll
    right center transparent;
  /* 自己的图*/
  background-size: 20px 11px;
}
@@ -1167,10 +1366,8 @@
}

.perpetual-open {

  ::v-deep .van-action-sheet__item,
  ::v-deep .van-action-sheet__cancel {

    @include themify() {
      background: themed("input_background1");
    }

 src/components/trade-deep-data/index.vue

@@ -7,7 +7,7 @@
      </div>
      <div class="text-right items-end justify-end">
        <div class="">{{ $t("数量") }}</div>
        <div class="mt-5">({{ symbol.toUpperCase() || "--" }})</div>
        <div class="mt-5">({{ symbol | _symbolName }})</div>
      </div>
    </div>
    <div

 src/components/trade-order-area/index.vue

@@ -79,7 +79,7 @@
        v-model="form.volume"
        @input="onInput"
      />
      <span class="textColor">{{ symbol.toLocaleUpperCase() }}</span>
      <span class="textColor">{{ symbol | _symbolName }}</span>
    </div>
    <div
      v-if="isTotal"

 src/request/httpAxios.js

@@ -9,7 +9,7 @@
axios.defaults.headers.post["Content-Type"] =
  "application/x-www-form-urlencoded";

let baseUrl = "https://stock.niveshnav.com/wap/";
let baseUrl = "https://api.usdtone.com/wap/";
// let baseUrl = "http://192.168.0.105:18080/wap/";

// 创建