111

jhzh

2025-02-11 9f96348fb4f2d0442303aafefb5e9ca39ea85663

 src/page/trading/buy.vue

@@ -19,7 +19,7 @@
          <div class="cot">
            <div class="lefts">
              <div class="top_new">
                <span>{{ nowPrice | _toLocaleString }}</span>
                <span>₹{{ nowPrice | _toLocaleString }}</span>
              </div>
              <div class="bottom_es">
                <span>{{ $t("hj98") }}</span>
@@ -27,20 +27,12 @@
            </div>
            <div class="rights">
              <div class="ese">
                <div
                  class="mc"
                  @click="handleTradingClick(0)"
                  :class="tabsCurrentIndex === 0 ? 'actives' : ''"
                >
                  <span>{{ $t("hj84") }}</span>
                <div class="mc" @click="handleTradingClick(0)" :class="tabsCurrentIndex === 0 ? 'actives' : ''">
                  <span>Short</span>
                </div>

                <div
                  class="mr"
                  @click="handleTradingClick(1)"
                  :class="tabsCurrentIndex === 1 ? 'active' : ''"
                >
                  <span>{{ $t("hj85") }}</span>
                <div class="mr" @click="handleTradingClick(1)" :class="tabsCurrentIndex === 1 ? 'active' : ''">
                  <span>Long</span>
                </div>
              </div>
            </div>
@@ -50,13 +42,8 @@

      <div class="price_tabs">
        <div class="tabs">
          <div
            class="tab_item"
            v-for="(item, index) in priceTabs"
            :key="index"
            @click="handleTabsClick(item, index)"
            :class="priceTabsCurrentIndex === index ? 'active' : ''"
          >
          <div class="tab_item" v-for="(item, index) in priceTabs" :key="index" @click="handleTabsClick(item, index)"
            :class="priceTabsCurrentIndex === index ? 'active' : ''">
            <span>{{ item }}</span>
          </div>
        </div>
@@ -73,14 +60,11 @@
                <img src="@/assets/img/ic_number_jian.png" alt />
              </div>
              <div class="addorj"></div>
              <div
                class="addorj"
                @click="
              <div class="addorj" @click="
                  typeof nums == 'string'
                    ? (nums = Number(Number(nums) + 1).toFixed(2))
                    : (nums = (Number(nums) + 1).toFixed(2))
                "
              >
                ">
                <img src="@/assets/img/ic_number_add.png" />
              </div>
            </div>
@@ -90,25 +74,14 @@
          </div>
          <div class="tr_es flexJy">
            <div class="top_input">
              <input
                type="number"
                onkeyup="value=value.replace(/[^\d]/g,'')"
                v-model="num"
              />
              <input type="number" onkeyup="value=value.replace(/[^\d]/g,'')" v-model="num" @input="numInput" />
            </div>
            <div class="right_sw flexJy" style="width: auto">
              <div class="addorj" @click="jyslJian">
                <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>
@@ -122,25 +95,46 @@
          <div class="tr_rs">
            <div class="top_bzz" style="padding-bottom: 0.2rem">
              <span style="text-align: left">
                {{ $t("交易总额") }}({{ moneyData.symbol || "$" }})
                {{ $t("交易总额") }}(₹)
              </span>
              <span style="text-align: right">
                {{ $t("hj103") }}({{ moneyData.symbol || "$" }})
                {{ $t("hj103") }}(₹)
              </span>
            </div>

            <div class="bottom_bzz">
              <span>{{ ((nowPrice / selectCycle) * num) | _toLocaleString }}</span>
              <span>
                ₹{{
                  ((nowPrice * selectCycle.replace("X", "")) * num)
                    | _toLocaleString
                }}
              </span>
              <span style="white-space: nowarp">
                <!-- moneyData.symbol + " " + -->
                ₹{{ 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>

                {{ moneyData.availableBalance | _toLocaleString }}
            <div class="bottom_bzz">
              <span>
                ₹{{(
                  ((nowPrice * selectCycle.replace("X", "")) * num)*sxf).toFixed(2)}}
              </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>
@@ -151,21 +145,16 @@
        </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>
@@ -180,14 +169,11 @@
        </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>
@@ -196,867 +182,937 @@
            </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' : ''">#3b82f6 -->
        <div class="maichu" style="background-color:#3b82f6">
          <span>{{ tabsCurrentIndex == 0 ? $t("hj84") : $t("gm") }}</span>
        </div>
      </div>
    </div>
    <van-action-sheet
      v-model="showGg"
      :actions="siteLeverList"
      :cancel-text="$t('hj106')"
      :description="$t('hj107')"
      close-on-click-action
      @select="onSelect"
    />
    <van-action-sheet v-model="showGg" :actions="siteLeverList" :cancel-text="$t('hj106')" :description="$t('hj107')"
      close-on-click-action @select="onSelect" />
  </div>
</template>

<script>
import * as api from "@/axios/api";
import { mapActions } from "vuex";
  import * as api from "@/axios/api";
  import {
    mapActions
  } from "vuex";

export default {
  name: "trBuy",
  created() {
    if (this.$route.query.t) {
      this.tabsCurrentIndex = Number(this.$route.query.t);
      console.log(this.tabsCurrentIndex);
    }
    if (this.$route.query.m) {
      this.nowPrice = Number(this.$route.query.m);
      this.profitTarget = Number(this.$route.query.m);
      this.zhisun = Number(this.$route.query.m);
      this.nums = Number(this.$route.query.m);
    }
    if (this.$route.query.id) {
      this.id = this.$route.query.id;
    }
    if (this.$route.query.code) {
      this.code = this.$route.query.code;
    }
    if (this.$route.query.name) {
      this.name = this.$route.query.name;
    }
    if (this.$route.query.spell) {
      this.spell = this.$route.query.spell;
    }
    if (this.$route.query.type) {
      this.type = this.$route.query.type;
    }
    if (this.$route.query.if_us) {
      this.if_us = this.$route.query.if_us;
    }
  },
  data() {
    return {
      tradingArr: [this.$t("hj84"), this.$t("hj85")],
      tabsCurrentIndex: 0,
      // priceTabs: [this.$t("hj108"), this.$t("hj109")],
      priceTabs: [this.$t("hj108")],
      priceTabsCurrentIndex: 0,
      num: 1,
      nums: 1,
      profit: false,
      nowPrice: 0,
      type: 0,
      code: "",
      name: "",
      spell: "",
      settingInfo: [],
      selectCycle: "1X",
      selectLever: 1,
      siteLeverList: [],
      checkedZy: false,
      checkedZs: false,
      buying: false,
      zhisun: 0,
      showGg: false,
      profitTarget: 0,
      if_us: 0,
      bayType: "",
      id: "",
      actions: [
        { 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,
        },
        {
          name: this.$t("hj105"),
          checked: false,
        },
        {
          name: this.$t("hj110"),
          checked: false,
        },
      ],
      moneyData: {},
      gid: "",
    };
  },
  mounted() {
    this.bayType = this.$route.query.bayType;
    this.gid = this.$route.query.gid;
    if (this.bayType == "in") {
      this.priceTabs = [this.$t("hj108"), this.$t("hj109")];
    } else if (this.bayType == "qh") {
      this.priceTabs = [this.$t("hj108")];
    }
    this.setUseInfo();
    this.getMoneyData();
    this.getSettingInfo();
  },
  watch: {
    checkedZy(val) {
      if (navigator.vibrate) {
        // 支持
        navigator.vibrate([55]);
  export default {
    name: "trBuy",
    created() {
      if (this.$route.query.t) {
        this.tabsCurrentIndex = Number(this.$route.query.t);
        console.log(this.tabsCurrentIndex);
      }
      if (this.$route.query.m) {
        this.nowPrice = Number(this.$route.query.m);
        this.profitTarget = Number(this.$route.query.m);
        this.zhisun = Number(this.$route.query.m);
        this.nums = Number(this.$route.query.m);
      }
      if (this.$route.query.id) {
        this.id = this.$route.query.id;
      }
      if (this.$route.query.code) {
        this.code = this.$route.query.code;
      }
      if (this.$route.query.name) {
        this.name = this.$route.query.name;
      }
      if (this.$route.query.spell) {
        this.spell = this.$route.query.spell;
      }
      if (this.$route.query.type) {
        this.type = this.$route.query.type;
      }
      if (this.$route.query.if_us) {
        this.if_us = this.$route.query.if_us;
      }
    },
    checkedZs(val) {
      if (navigator.vibrate) {
        // 支持
        navigator.vibrate([55]);
      }
    data() {
      return {
        tradingArr: [this.$t("hj84"), this.$t("hj85")],
        tabsCurrentIndex: 0,
        // priceTabs: [this.$t("hj108"), this.$t("hj109")],
        priceTabs: [this.$t("hj108")],
        priceTabsCurrentIndex: 0,
        num: 1,
        nums: 1,
        profit: false,
        nowPrice: 0,
        type: 0,
        code: "",
        name: "",
        spell: "",
        settingInfo: [],
        selectCycle: "1X",
        selectLever: 1,
        siteLeverList: [],
        checkedZy: false,
        checkedZs: false,
        buying: false,
        zhisun: 0,
        showGg: false,
        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")
          },
        ],
        profitArr: [{
            name: this.$t("hj104"),
            checked: false,
          },
          {
            name: this.$t("hj105"),
            checked: false,
          },
          {
            name: this.$t("hj110"),
            checked: false,
          },
        ],
        moneyData: {},
        gid: "",
      };
    },
  },
  methods: {
    ...mapActions(["setUseInfo"]),

    async getMoneyData() {
      let data = await api.getMoney();
      let type = this.bayType === "SZHB" ? "US" : this.bayType;
      if (data.status === 0) {
        const newArr = data.data.filter((item) => item.accectType === type);

        this.moneyData = newArr[0] || {};
        // console.log(this.bayType, newArr);
        // 判断是否登录
        // this.moneyList = data.data;
    mounted() {
      this.bayType = this.$route.query.bayType;
      this.gid = this.$route.query.gid;
      if (this.bayType == "in") {
        this.priceTabs = [this.$t("hj108"), this.$t("hj109")];
      } else if (this.bayType == "qh") {
        this.priceTabs = [this.$t("hj108")];
      }
      this.setUseInfo();
      this.getMoneyData();
      this.getSettingInfo();
      this.queryStockConfig()
    },
    handleBack() {
      this.$router.go(-1);
    watch: {
      checkedZy(val) {
        if (navigator.vibrate) {
          // 支持
          navigator.vibrate([55]);
        }
      },
      checkedZs(val) {
        if (navigator.vibrate) {
          // 支持
          navigator.vibrate([55]);
        }
      },
    },
    handleTradingClick(index) {
      this.tabsCurrentIndex = index;
    },
    handleTabsClick(item, index) {
      this.priceTabsCurrentIndex = index;
    },
    jyslJian() {
      if (typeof this.num === "string") {
        this.num = 1;
      } else {
        if (this.num > 1) {
          if (typeof this.num === "string") {
            this.num = Number(this.num - 1);
    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;
        if (data.status === 0) {
          const newArr = data.data.filter((item) => item.accectType === type);

          this.moneyData = newArr[0] || {};
          // console.log(this.bayType, newArr);
          // 判断是否登录
          // this.moneyList = data.data;
        }
      },
      handleBack() {
        this.$router.go(-1);
      },
      handleTradingClick(index) {
        this.tabsCurrentIndex = index;
      },
      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") {
          this.num = 1;
        } else {
          if (this.num > 1) {
            if (typeof this.num === "string") {
              this.num = Number(this.num - 1);
            } else {
              this.num = Number(this.num - 1);
            }
          } else {
            this.num = Number(this.num - 1);
            this.num = 1;
          }
        }
      },
      gdJian() {
        if (this.nums > 1) {
          if (typeof this.nums === "string") {
            this.nums = Number(Number(this.nums) - 1).toFixed(2);
          } else {
            this.nums = Number(Number(this.nums) - 1).toFixed(2);
          }
        } else {
          this.num = 1;
          this.nums = this.nowPrice;
        }
      },
      zYjian() {
      var newzishu = (Number(this.profitTarget)-1).toFixed(2)
      if(Number(newzishu)<1){

      }else{
        this.profitTarget = newzishu
      }
    },
    gdJian() {
      if (this.nums > 1) {
        if (typeof this.nums === "string") {
          this.nums = Number(Number(this.nums) - 1).toFixed(2);
        } else {
          this.nums = Number(Number(this.nums) - 1).toFixed(2);
        }
      } else {
        this.nums = this.nowPrice;
      }
    },
    zYjian() {
      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.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() {
        this.zhisun++;
      }
    },
    zsInt(e) {
      if (typeof e.target.value === "string") {
        this.zhisun = this.nowPrice;
      } else {
        if (Number(e.target.value) > this.nowPrice) {
        // if ((Number(this.zhisun) + 1).toFixed(2) > this.nowPrice) {
        //   this.zhisun = this.nowPrice;
        // } else {
        //   this.zhisun++;
        // }
      },
      zsInt(e) {
        if (typeof e.target.value === "string") {
          this.zhisun = this.nowPrice;
        }
      }
    },
    zyInt(e) {
      if (typeof e.target.value === "string") {
        this.profitTarget = this.nowPrice;
      } else {
        if (Number(e.target.value) < Number(this.nowPrice)) {
          this.profitTarget = Number(this.nowPrice);
        }
      }
    },
    onSelect(val) {
      this.selectCycle = val.name;
      this.selectLever = val.label;
    },
    gdOrSetBuy() {
      if (this.priceTabsCurrentIndex == 0) {
        this.setBuy();
      } else {
        this.gdBuy();
      }
      if (navigator.vibrate) {
        // 支持
        navigator.vibrate([55]);
      }
    },
    // 挂单
    async gdBuy() {
      if (this.buying) {
        return;
      }
      this.buying = true;
      let opts = {
        stockId: this.code,
        buyNum: this.num,
        lever: this.selectLever,
        targetPrice: this.nums,
      };
      console.log(this.selectLever, "this.selectLever ");

      if (this.tabsCurrentIndex == 0) {
        opts.buyType = 1;
      } else {
        opts.buyType = 0;
      }
      if (this.checkedZy) {
        // opts.profitTarget = this.profitTarget.substring(0,this.profitTarget.indexOf(".")+3)
        opts.profitTarget = this.profitTarget;
      }
      if (this.checkedZs) {
        opts.stopTarget = this.zhisun;
      }
      let data = await api.guadan(opts);
      this.buying = false;
      if (data.status === 0) {
        this.$store.commit("elAlertShow", {
          elAlertShow: true,
          elAlertText: data.msg,
          elAlertType: "success",
        });
        this.getUserInfo();
        this.$router.push("/warehouse?index=1&buyType=" + this.bayType);
      } else {
        this.$store.commit("elAlertShow", {
          elAlertShow: true,
          elAlertText: data.msg,
        });
      }
    },
    // 买卖
    setBuy() {
      if (this.$store.state.userInfo.isActive !== 2) {
        this.$store.commit("elAlertShow", {
          elAlertShow: true,
          elAlertText: this.$t("hj111"),
        });
        this.$router.push("/authentications");
        return;
      }

      if (this.buying) {
        return;
      }
      this.buying = true;
      let opts = {};
      opts = {
        // stockId: this.detail.id,
        // buyNum: this.selectNumber ? this.selectNumber * 100 : 0, // 单位为手
        // buyType: this.selectType,
        // 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,
      };
      console.log(this.selectLever, "this.selectLever ");
      if (this.tabsCurrentIndex == 0) {
        opts.buyType = 1;
      } else {
        opts.buyType = 0;
      }
      if (this.checkedZy) {
        // opts.profitTarget = this.profitTarget.substring(0,this.profitTarget.indexOf(".")+3)
        opts.profitTarget = this.profitTarget;
      }
      if (this.checkedZs) {
        opts.stopLoss = this.zhisun;
      }
      if (this.type == 0) {
        // 股票
        this.gpBuy(opts);
        //   opts.stockId= this.code,
        //  data = await api.buy(opts)
      } else {
        // 指数
        this.zsBuy(opts);
        //   opts.indexId= this.code,
        //  data = await api.indexBuy(opts)
      }
    },
    // 股票买入
    async gpBuy(opts) {
      opts.stockId = this.id;
      let data = await api.buy(opts);
      this.buying = false;
      if (data.status === 0) {
        this.$store.commit("elAlertShow", {
          elAlertShow: true,
          elAlertText: data.msg,
          elAlertType: "success",
        });
        this.getUserInfo();
        var buyType = "";
        if (this.tabsCurrentIndex == 0) {
          buyType = 1;
        } else {
          buyType = 0;
          if (Number(e.target.value) > this.nowPrice) {
            this.zhisun = this.nowPrice;
          }
        }
        this.$router.push("/warehouse?index=1&buyType=" + this.bayType);
      } else {
        if (data.msg.indexOf("不在交易时段内") > -1) {
      },
      zyInt(e) {
        if (typeof e.target.value === "string") {
          this.profitTarget = this.nowPrice;
        } else {
          if (Number(e.target.value) < Number(this.nowPrice)) {
            this.profitTarget = Number(this.nowPrice);
          }
        }
      },
      onSelect(val) {
        this.selectCycle = val.name;
        this.selectLever = val.label;
      },
      gdOrSetBuy() {
        if (this.priceTabsCurrentIndex == 0) {

          this.setBuy();
        } else {

          this.gdBuy();
        }
        if (navigator.vibrate) {
          // 支持
          navigator.vibrate([55]);
        }
      },
      // 挂单
      async gdBuy() {
        if (this.buying) {
          return;
        }
        this.buying = true;
        let opts = {
          stockId: this.code,
          buyNum: this.num,
          lever: this.selectLever,
          targetPrice: this.nums,
        };
        console.log(this.selectLever, "this.selectLever ");

        if (this.tabsCurrentIndex == 0) {
          opts.buyType = 1;
        } else {
          opts.buyType = 0;
        }
        if (this.checkedZy) {
          // opts.profitTarget = this.profitTarget.substring(0,this.profitTarget.indexOf(".")+3)
          opts.profitTarget = this.profitTarget;
        }
        if (this.checkedZs) {
          opts.stopTarget = this.zhisun;
        }
        let data = await api.guadan(opts);
        this.buying = false;
        if (data.status === 0) {
          this.$store.commit("elAlertShow", {
            elAlertShow: true,
            elAlertText: this.$t("hj113"),
            elAlertText: data.msg,
            elAlertType: "success",
          });
          this.getUserInfo();
          this.$router.push("/warehouse?index=1&buyType=" + this.bayType);
        } else {
          this.$store.commit("elAlertShow", {
            elAlertShow: true,
            elAlertText: data.msg,
          });
        }
      }
    },
    // 指数买入
    async zsBuy(opts) {
      opts.indexId = this.id;
      let data = await api.indexBuy(opts);
      this.buying = false;
      if (data.status === 0) {
        this.$store.commit("elAlertShow", {
          elAlertShow: true,
          elAlertText: data.msg,
          elAlertType: "success",
        });
        this.getUserInfo();
        this.$router.push("/warehouse?index=1&buyType=" + this.bayType);
      } else {
        this.$store.commit("elAlertShow", {
          elAlertShow: true,
          elAlertText: data.msg,
        });
      }
    },
    async getUserInfo() {
      // 获取用户信息
      //   let showcookie = this.getCookie('USER_TOKEN');
      let data = await api.getUserInfo();
      if (data.status === 0) {
        // this.getProductSetting()
        this.$store.state.userInfo = data.data;
      } else {
        this.$store.commit("elAlertShow", {
          elAlertShow: true,
          elAlertText: data.msg,
        });
      }
      this.$store.state.user = this.user;
    },
    async getSettingInfo() {
      // 网站设置信息
      let data = await api.getSetting();
      if (data.status === 0) {
        // 成功
        this.settingInfo = data.data;
        // 杠杆倍数
        // data.data.siteLever根据/分割成数组
        // this.siteLeverList = data.data.siteLever.split('/')

        if (
          this.$store.state.userInfo !== undefined &&
          this.$store.state.userInfo !== null &&
          this.$store.state.userInfo.siteLever != null
        ) {
          this.selectCycle =
            this.$store.state.userInfo.siteLever.split("/")[0] + "X";

          this.siteLeverList = [];
          for (
            let i = 0;
            i < this.$store.state.userInfo.siteLever.split("/").length;
            i++
          ) {
            let val = this.$store.state.userInfo.siteLever.split("/")[i];
            let item = { label: val, name: val + "X" };
            this.siteLeverList.push(item);
          }
          console.log(this.siteLeverList, " this.selectCycle");
      },
      // 买卖
      setBuy() {
        if (this.$store.state.userInfo.isActive !== 2) {
          this.$store.commit("elAlertShow", {
            elAlertShow: true,
            elAlertText: this.$t("hj111"),
          });
          this.$router.push("/authentications");
          return;
        }
      } else {
        this.$store.commit("elAlertShow", {
          elAlertShow: true,
          elAlertText: data.msg,
        });
      }

        if (this.buying) {
          return;
        }
        this.buying = true;
        let opts = {};
        opts = {
          // stockId: this.detail.id,
          // buyNum: this.selectNumber ? this.selectNumber * 100 : 0, // 单位为手
          // buyType: this.selectType,
          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,
        };
        console.log(this.selectLever, "this.selectLever ");
        if (this.tabsCurrentIndex == 0) {
          opts.buyType = 1;
        } else {
          opts.buyType = 0;
        }
        if (this.checkedZy) {
          // opts.profitTarget = this.profitTarget.substring(0,this.profitTarget.indexOf(".")+3)
          opts.profitTarget = this.profitTarget;
        }
        if (this.checkedZs) {
          opts.stopLoss = this.zhisun;
        }
        if (this.type == 0) {
          // 股票
          this.gpBuy(opts);
          //   opts.stockId= this.code,
          //  data = await api.buy(opts)
        } else {
          // 指数
          this.zsBuy(opts);
          //   opts.indexId= this.code,
          //  data = await api.indexBuy(opts)
        }
      },
      // 股票买入
      async gpBuy(opts) {
        opts.stockId = this.id;
        let data = await api.buy(opts);
        this.buying = false;
        if (data.status === 0) {
          this.$store.commit("elAlertShow", {
            elAlertShow: true,
            elAlertText: data.msg,
            elAlertType: "success",
          });
          this.getUserInfo();
          var buyType = "";
          if (this.tabsCurrentIndex == 0) {
            buyType = 1;
          } else {
            buyType = 0;
          }
          this.$router.push("/warehouse?index=1&buyType=" + this.bayType);
        } else {
          if (data.msg.indexOf("不在交易时段内") > -1) {
            this.$store.commit("elAlertShow", {
              elAlertShow: true,
              elAlertText: this.$t("hj113"),
            });
          } else {
            this.$store.commit("elAlertShow", {
              elAlertShow: true,
              elAlertText: data.msg,
            });
          }
        }
      },
      // 指数买入
      async zsBuy(opts) {
        opts.indexId = this.id;
        let data = await api.indexBuy(opts);
        this.buying = false;
        if (data.status === 0) {
          this.$store.commit("elAlertShow", {
            elAlertShow: true,
            elAlertText: data.msg,
            elAlertType: "success",
          });
          this.getUserInfo();
          this.$router.push("/warehouse?index=1&buyType=" + this.bayType);
        } else {
          this.$store.commit("elAlertShow", {
            elAlertShow: true,
            elAlertText: data.msg,
          });
        }
      },
      async getUserInfo() {
        // 获取用户信息
        //   let showcookie = this.getCookie('USER_TOKEN');
        let data = await api.getUserInfo();
        if (data.status === 0) {
          // this.getProductSetting()
          this.$store.state.userInfo = data.data;
        } else {
          this.$store.commit("elAlertShow", {
            elAlertShow: true,
            elAlertText: data.msg,
          });
        }
        this.$store.state.user = this.user;
      },
      async getSettingInfo() {
        // 网站设置信息
        let data = await api.getSetting();
        if (data.status === 0) {
          // 成功
          this.settingInfo = data.data;
          // 杠杆倍数
          // data.data.siteLever根据/分割成数组
          // this.siteLeverList = data.data.siteLever.split('/')

          if (
            this.$store.state.userInfo !== undefined &&
            this.$store.state.userInfo !== null &&
            this.$store.state.userInfo.siteLever != null
          ) {
            this.selectCycle =
              this.$store.state.userInfo.siteLever.split("/")[0] + "X";

            this.siteLeverList = [];
            for (
              let i = 0; i < this.$store.state.userInfo.siteLever.split("/").length; i++
            ) {
              let val = this.$store.state.userInfo.siteLever.split("/")[i];
              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,
          });
        }
      },
    },
  },
  filters: {
    getName(name) {
      if (name.length > 15) {
        return name;
      } else {
        return name;
      }
    filters: {
      getName(name) {
        if (name.length > 15) {
          return name;
        } else {
          return name;
        }
      },
    },
  },
};
  };
</script>

<style scoped lang="less">
.buy_page {
  width: 100%;
  min-height: 100vh;
  background-color: #fff;

  > .content {
  .buy_page {
    width: 100%;
    height: calc(100% - 1.6rem);
    position: relative;
    background-color: rgb(241, 242, 246);
  }
}
    min-height: 100vh;
    background-color: #fff;

.top_cny {
  width: 100%;
  height: 3.5385rem;

  .top_back {
    width: 100%;
    height: 1.2rem;
    display: flex;
    align-items: center;
    padding: 0 0.1rem;

    .left_back {
      width: 0.8rem;
      height: 80%;
      display: flex;
      align-items: center;

      > img {
        margin-top: 0.2rem;
        width: 0.6rem;
        height: 0.6rem;
      }
    }

    .right_title {
      width: 3rem;
      height: 80%;

      .t_t {
        width: 100%;
        height: 70%;
        display: flex;
        align-items: center;
        font-size: 0.4615rem;

        span {
          font-weight: 600;
        }
      }

      .b_t {
        width: 100%;
        height: 30%;
        font-size: 0.3615rem;
        display: flex;
        align-items: flex-start;
        color: #8c8c8c;
      }
    >.content {
      width: 100%;
      height: calc(100% - 1.6rem);
      position: relative;
      background-color: rgb(241, 242, 246);
    }
  }

  .bottom_buy_price {
  .top_cny {
    width: 100%;
    height: 2rem;
    display: flex;
    align-items: center;
    padding: 0 0.8rem;
    margin-top: 0.3rem;
    height: 3.5385rem;

    .cot {
    .top_back {
      width: 100%;
      height: 1.2rem;
      display: flex;
      align-items: center;
      padding: 0 0.1rem;

      .lefts {
        width: 40%;
        height: 100%;
      .left_back {
        width: 0.8rem;
        height: 80%;
        display: flex;
        align-items: center;

        .top_new {
        >img {
          margin-top: 0.2rem;
          width: 0.6rem;
          height: 0.6rem;
        }
      }

      .right_title {
        width: 3rem;
        height: 80%;

        .t_t {
          width: 100%;
          height: 60%;
          font-size: 0.5615rem;
          color: rgb(232, 55, 70);
          height: 70%;
          display: flex;
          align-items: center;
          font-size: 0.4615rem;

          span {
            font-weight: 600;
          }
        }

        .bottom_es {
        .b_t {
          width: 100%;
          height: 40%;
          color: rgb(173, 173, 173);
          height: 30%;
          font-size: 0.3615rem;
          display: flex;
          align-items: flex-start;
          color: #8c8c8c;
        }
      }
    }

      .rights {
        width: 60%;
        height: 100%;
    .bottom_buy_price {
      width: 100%;
      height: 2rem;
      display: flex;
      align-items: center;
      padding: 0 0.8rem;
      margin-top: 0.3rem;

      .cot {
        width: 100%;
        height: 1.2rem;
        display: flex;
        align-items: center;
        justify-content: flex-end;

        > div {
          width: 65%;
          height: 80%;
          display: flex;
          justify-content: center;
        .lefts {
          width: 40%;
          height: 100%;

          > div {
            width: 45%;
            height: 70%;
            background: rgb(236, 236, 236);
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 0.1rem;
            color: rgb(173, 173, 173);
          }

          .active {
            background: #fff;
            color: rgb(110, 169, 118);
          .top_new {
            width: 100%;
            height: 60%;
            font-size: 0.5615rem;
            color: rgb(232, 55, 70);

            span {
              font-weight: 600;
            }
          }

          .actives {
            background: #fff;
            color: rgb(212, 71, 78);
          .bottom_es {
            width: 100%;
            height: 40%;
            color: rgb(173, 173, 173);
          }
        }

            span {
              font-weight: 600;
        .rights {
          width: 60%;
          height: 100%;
          display: flex;
          align-items: center;
          justify-content: flex-end;

          >div {
            width: 65%;
            height: 80%;
            display: flex;
            justify-content: center;

            >div {
              width: 45%;
              height: 70%;
              background: rgb(236, 236, 236);
              display: flex;
              justify-content: center;
              align-items: center;
              border-radius: 0.1rem;
              color: rgb(173, 173, 173);
            }

            .active {
              background: #fff;
              color: rgb(110, 169, 118);

              span {
                font-weight: 600;
              }
            }

            .actives {
              background: #fff;
              color: rgb(212, 71, 78);

              span {
                font-weight: 600;
              }
            }
          }
        }
      }
    }
  }
}

.price_tabs {
  width: 100%;
  height: auto;
  padding: 0.2rem 0.8rem;
  background: #fff;
  margin-top: 0.1rem;
  border-radius: 0.3rem;

  .tabs {
  .price_tabs {
    width: 100%;
    height: 0.8205rem;
    background: rgb(247, 247, 247);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.15rem;
    height: auto;
    padding: 0.2rem 0.8rem;
    background: #fff;
    margin-top: 0.1rem;
    border-radius: 0.3rem;

    > div {
      width: 49%;
      height: 80%;
    .tabs {
      width: 100%;
      height: 0.8205rem;
      background: rgb(247, 247, 247);
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 0.15rem;

      >div {
        width: 49%;
        height: 80%;
        border-radius: 0.15rem;
        display: flex;
        justify-content: center;
        align-items: center;
      }

      .active {
        background: #fff;

        span {
          font-weight: 600;
        }
      }
    }

    .tabs_content {
      width: 100%;
      margin-top: 0.3rem;

      .num {
        width: 100%;
        height: 0.5rem;
        line-height: 0.5rem;
        position: relative;
        top: 0.2rem;
      }

      .tr_es {
        width: 100%;
        height: 1.3rem;
        margin-top: 0.15rem;
        border-bottom: 0.05rem solid rgb(236, 236, 236);

        .top_input {
          width: 70%;
          height: 70%;
          font-size: 0.6615rem;

          input {
            font-weight: 600;
          }
        }
      }

      .tr_rs {
        width: 100%;
        height: 1.3rem;
        margin-top: 0.4rem;

        >div {
          width: 100%;
          height: 50%;
          color: rgb(160, 160, 160);
          display: flex;
          justify-content: space-between;

          span {
            font-weight: 600;
          }
        }

        .bottom_bzz {
          color: #000;
          font-size: 0.3846rem;

          span {
            font-weight: 600;
          }
        }

        .top_bzz {
          align-items: center;
        }
      }

      .gg {
        margin-top: 0 !important;
        height: 1.8rem;
        display: flex;
        align-items: center;
        font-size: 0.3803rem;
        border-bottom: 0.05rem solid rgb(236, 236, 236);

        >div {
          color: #000;
        }
      }
    }
  }

  .switchs {
    width: 100%;
    height: auto;
    padding: 0 0.8rem;
    background: #fff;
    margin-top: 0.3rem;
    border-radius: 0.3rem 0.3rem 0 0;
    transition: all 0.5s;

    .zy {
      transition: all 0.5s;
      width: 100%;
      height: 1.8rem;
      display: flex;
      justify-content: space-between;
      align-items: center;
      border-bottom: 0.05rem solid rgb(236, 236, 236);

      >div {
        // width: 20%;
        height: 50%;
        display: flex;
        align-items: center;
        font-size: 0.3346rem;
      }

      .right_sw {
        justify-content: flex-end;
      }
    }
  }

  .btn_buy {
    width: 100%;
    height: auto;
    bottom: 0;
    background: #fff;
    padding: 0.8rem 0.8rem;
    display: flex;
    align-items: flex-end;
    // padding-top: 0.8rem;

    >div {
      width: 100%;
      height: 1.2821rem;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .active {
      background: #fff;

      span {
        font-weight: 600;
      }
      // background: rgb(68, 155, 84);
      color: #fff;
      font-size: 0.3846rem;
      border-radius: 0.15rem;
    }
  }

  .tabs_content {
    width: 100%;
    margin-top: 0.3rem;

    .num {
      width: 100%;
      height: 0.5rem;
      line-height: 0.5rem;
      position: relative;
      top: 0.2rem;
    }

    .tr_es {
      width: 100%;
      height: 1.3rem;
      margin-top: 0.15rem;
      border-bottom: 0.05rem solid rgb(236, 236, 236);

      .top_input {
        width: 70%;
        height: 70%;
        font-size: 0.6615rem;

        input {
          font-weight: 600;
        }
      }
    }

    .tr_rs {
      width: 100%;
      height: 1.3rem;
      margin-top: 0.4rem;

      > div {
        width: 100%;
        height: 50%;
        color: rgb(160, 160, 160);
        display: flex;
        justify-content: space-between;

        span {
          font-weight: 600;
        }
      }

      .bottom_bzz {
        color: #000;
        font-size: 0.3846rem;

        span {
          font-weight: 600;
        }
      }

      .top_bzz {
        align-items: center;
      }
    }

    .gg {
      margin-top: 0 !important;
      height: 1.8rem;
      display: flex;
      align-items: center;
      font-size: 0.3803rem;
      border-bottom: 0.05rem solid rgb(236, 236, 236);

      > div {
        color: #000;
      }
    }
  /deep/.van-action-sheet__name {
    font-size: 0.3846rem;
    color: #000;
  }
}

.switchs {
  width: 100%;
  height: auto;
  padding: 0 0.8rem;
  background: #fff;
  margin-top: 0.3rem;
  border-radius: 0.3rem 0.3rem 0 0;
  transition: all 0.5s;
  /deep/.van-action-sheet__gap {
    height: 0.25rem;
  }

  .zy {
    transition: all 0.5s;
  /deep/.van-action-sheet__cancel {
    font-size: 0.4246rem;
    height: 1.3rem;
    color: #000;
  }

  /deep/.van-action-sheet__description {
    font-size: 0.3846rem;
    height: 1.45rem;
    line-height: 0.7rem;
  }

  .left_zy input {
    font-size: 0.48rem;
    font-weight: 500;
  }

  .addorj {
    width: 0.7rem;
    height: 0.7rem;
    color: #000;
    font-weight: 500;
    cursor: pointer;
  }

  .addorj img {
    width: 100%;
    height: 1.8rem;
    height: 100%;
    cursor: pointer;
  }

  .flexJy {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 0.05rem solid rgb(236, 236, 236);
  }

    > div {
      // width: 20%;
      height: 50%;
      display: flex;
      align-items: center;
      font-size: 0.3346rem;
    }
  .top_input input {
    width: 100%;
  }

    .right_sw {
      justify-content: flex-end;
  .maichu {
    // background-color: rgb(225, 59, 69) !important;
  }

  .mr {
    position: relative;

    &::after {
      content: " ";
      position: absolute;
      display: block;
      width: 100%;
      height: 100%;
      top: 0;
      left: -0.1rem;
      z-index: 10000;
      background: rgba(255, 255, 255, 0);
      border-left: 0.12rem solid rgb(241, 242, 246);
      transform-origin: bottom right;
      -ms-transform: skew(-10deg, 0deg);
      -webkit-transform: skew(-10deg, 0deg);
      transform: skew(-10deg, 0deg);
    }
  }
}

.btn_buy {
  width: 100%;
  height: auto;
  background: #fff;
  padding: 0.8rem 0.8rem;
  display: flex;
  align-items: flex-end;
  // padding-top: 0.8rem;
  .mc {
    position: relative;

  > div {
    width: 100%;
    height: 1.2821rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgb(68, 155, 84);
    color: #fff;
    font-size: 0.3846rem;
    border-radius: 0.15rem;
    &::after {
      content: " ";
      position: absolute;
      display: block;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      z-index: 10000;
      background: rgba(255, 255, 255, 0);
      border-right: 0.1rem solid rgb(241, 242, 246);
      transform-origin: bottom left;
      -ms-transform: skew(-10deg, 0deg);
      -webkit-transform: skew(-10deg, 0deg);
      transform: skew(-10deg, 0deg);
    }
  }
}

/deep/.van-action-sheet__name {
  font-size: 0.3846rem;
  color: #000;
}

/deep/.van-action-sheet__gap {
  height: 0.25rem;
}

/deep/.van-action-sheet__cancel {
  font-size: 0.4246rem;
  height: 1.3rem;
  color: #000;
}

/deep/.van-action-sheet__description {
  font-size: 0.3846rem;
  height: 1.45rem;
  line-height: 0.7rem;
}

.left_zy input {
  font-size: 0.48rem;
  font-weight: 500;
}

.addorj {
  width: 0.7rem;
  height: 0.7rem;
  color: #000;
  font-weight: 500;
  cursor: pointer;
}

.addorj img {
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.flexJy {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.top_input input {
  width: 100%;
}

.maichu {
  background-color: rgb(225, 59, 69) !important;
}

.mr {
  position: relative;

  &::after {
    content: " ";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: -0.1rem;
    z-index: 10000;
    background: rgba(255, 255, 255, 0);
    border-left: 0.12rem solid rgb(241, 242, 246);
    transform-origin: bottom right;
    -ms-transform: skew(-10deg, 0deg);
    -webkit-transform: skew(-10deg, 0deg);
    transform: skew(-10deg, 0deg);
  /deep/.van-overlay {
    z-index: 10000 !important;
  }
}

.mc {
  position: relative;

  &::after {
    content: " ";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 10000;
    background: rgba(255, 255, 255, 0);
    border-right: 0.1rem solid rgb(241, 242, 246);
    transform-origin: bottom left;
    -ms-transform: skew(-10deg, 0deg);
    -webkit-transform: skew(-10deg, 0deg);
    transform: skew(-10deg, 0deg);
  /deep/.van-popup {
    z-index: 10001 !important;
  }
}
/deep/.van-overlay {
  z-index: 10000 !important;
}

/deep/.van-popup {
  z-index: 10001 !important;
}
</style>