1

jhzh

2024-08-12 f1dc8f5a7f3a661ce19513a9ad47fe18e3e883ff

 src/components/constract/DeliveryContract/DetailDialog.vue

@@ -14,12 +14,14 @@
      class="detailWrapper"
      :modal-append-to-body="true"
      :append-to-body="true"
      @close="jixuxiadanClick"
      @open="jixuxiadanOpen"
    >
      <div class="dialog-box">
        <!-- 交割倒计时 -->
        <div class="circleBox" v-show="showProgress">
          <div class="countdown">
            <div v-if="day" class="time-div">{{ day ? day + " d " : "" }}</div>
            <!-- <div v-if="day" class="time-div">{{ day ? day + " d " : "" }}</div>
            <div v-if="day" class="dot">ꔷ</div>
            <div v-if="hour" class="time-div">
              {{ hour ? hour + " h " : "" }}
@@ -29,16 +31,17 @@
              {{ minute ? minute + " m " : "" }}
            </div>
            <div v-if="minute" class="dot">ꔷ</div>
            <div v-if="secound" class="time-div">{{ secound + " s" }}</div>
            <div v-if="secound" class="time-div">{{ secound + " s" }}</div> -->
            <div class="time-div">{{ daojishi + " s" }}</div>
          </div>
        </div>
        <!-- 盈亏 -->
        <div v-show="showProfit" class="font-size18 text-center yingkui">
          <div v-if="detailData.profit > 0" class="green">
            {{ $t("message.home.yingkui") }} {{ detailData.profit }} USD
            {{ $t("message.home.yingkui") }} {{ detailData.profit }} USDT
          </div>
          <div v-else class="red">
            {{ $t("message.home.yingkui") }} {{ detailData.profit }} USD
            {{ $t("message.home.yingkui") }} {{ detailData.profit }} USDT
          </div>
        </div>
        <!-- 交割信息 -->
@@ -68,18 +71,24 @@
        </div>
        <div class="delivery-text">
          <div class="delivery-text-left">
            {{ $t("message.home.jiesuanjia") }}
          </div>
          <div>{{ detailData.close_price }}</div>
        </div>
        <div class="delivery-text">
          <div class="delivery-text-left">
            {{ $t("message.home.shuliang") }}
          </div>
          <div>{{ detailData.volume }}</div>
        </div>
        <div class="delivery-text">
        <!-- <div class="delivery-text">
          <div class="delivery-text-left">
            {{ $t("message.jiaoyi.yujishouyi") }}
          </div>
          <div :class="[detailData.profit > 0 ? 'green' : 'red']">
            {{ detailData.profit }}
          </div>
        </div>
        </div> -->
        <div class="delivery-text" v-if="typeValue == 1">
          <div class="delivery-text-left">
            {{ $t("message.home.jiaogeshijian") }}
@@ -89,7 +98,7 @@
      </div>
      <span slot="footer" class="dialog-footer">
        <!-- <el-button v-if="typeValue == 1" @click="visible = false">{{ '取消'}}</el-button> -->
        <el-button type="info" @click="visible = false" class="continueOrder">{{
        <el-button type="info" @click="jixuxiadanClick" class="continueOrder">{{
          $t("message.home.jixuxiadan")
        }}</el-button>
        <!-- <el-button v-if="typeValue == 1" type="info" @click="visible = false">{{$t('message.home.jixuxiadan')}}</el-button> -->
@@ -109,6 +118,10 @@
    dialogVisible: {
      type: Boolean,
      default: false, // 弹窗是否展示
    },
    showDetail: {
      type: Object,
      default: {}, 
    },
    // pageData: {
    //   type: Object,
@@ -137,6 +150,7 @@
      // nowPrice: "", //现价
      symbol: "", //币种
      showBtn: false, //显示按钮
      setIntervalId: null
    };
  },
  watch: {
@@ -163,50 +177,88 @@
      },
    },
  },
  mounted() {
    bus.on("showDetail", (obj) => {
      this.symbol = obj.symbol;
      if (obj.order_no) {
        if (this.existToken) {
          this.futuresOrder(obj.order_no);
        }
      }
    });
  // mounted() {
  //   bus.on("showDetail", (obj) => {
  //     console.log('showDetailq2222');
  //     this.symbol = obj.symbol;
  //     if (obj.order_no) {
  //       if (this.existToken) {
  //         this.futuresOrder(obj.order_no);
  //         this.setIntervalId = setInterval(() => {
  //           // console.log(this.setIntervalId);
  //           // this.futuresOrder1(obj.order_no);
  //         },1000)
  //       }
  //     }
  //   });
  // },
  unmounted(){
    clearInterval(this.setIntervalId)
  },
  methods: {
    jixuxiadanOpen(){
      this.symbol = this.showDetail.symbol;
      if (this.showDetail.order_no) {
        if (this.existToken) {
          this.futuresOrder(this.showDetail.order_no);
          this.setIntervalId = setInterval(() => {
            this.futuresOrder1(this.showDetail.order_no);
          },1000)
        }
      }
    },
    jixuxiadanClick(){
      this.visible = false
      clearInterval(this.setIntervalId)
    },
    //倒计时 天时分秒
    countTime() {
      const t = this;
      // if (t.daojishi > 0) {
      //   t.deliveryTime = t.daojishi;
      //   t.percentValue = t.percentValue - t.daojishi_baifenbi;
      // }
      // if (t.daojishi == 0) {
      //   t.deliveryTime = 0;
      //   t.percentValue = 0;
      //   clearTimeout(t.daojishi_status);
      //   t.daojishi_status = undefined;
      //   //倒计时结束，关闭进度条显示盈亏数据
      //   this.showProgress = false;
      //   this.showProfit = true;
      //   this.showBtn = true;
      //   return 1111;
      // }
      // let sub = t.daojishi;

      // let day = parseInt(sub / 86400);
      // let hour = parseInt((sub % 86400) / 3600);
      // let min = parseInt(((sub % 86400) % 3600) / 60);
      // let sec = parseInt(((sub % 86400) % 3600) % 60);
      // t.secound = sec;
      // t.day = day;
      // t.hour = hour;
      // t.minute = min;
      // t.daojishi--;
      if (t.daojishi > 0) {
        t.deliveryTime = t.daojishi;
        t.percentValue = t.percentValue - t.daojishi_baifenbi;
      }
      if (t.daojishi == 0) {
        t.deliveryTime = 0;
        t.percentValue = 0;
        clearTimeout(t.daojishi_status);
        t.daojishi_status = undefined;
        //倒计时结束，关闭进度条显示盈亏数据
        this.showProgress = false;
        t.daojishi_status = setTimeout(() => {
          t.daojishi--;
          t.countTime();
        }, 1000);
      } else {
        this.showProfit = true;
        this.showProgress = false;
        this.showBtn = true;
        return 1111;
      }
      let sub = t.daojishi;

      let day = parseInt(sub / 86400);
      let hour = parseInt((sub % 86400) / 3600);
      let min = parseInt(((sub % 86400) % 3600) / 60);
      let sec = parseInt(((sub % 86400) % 3600) % 60);
      t.secound = sec;
      t.day = day;
      t.hour = hour;
      t.minute = min;
      t.daojishi--;

      t.daojishi_status = setTimeout(() => {
        t.countTime();
      }, 1000);
    },
    futuresOrder1(order_no){
      const t = this;
      Axios.futuresDetail({
        order_no: order_no,
      }).then((res) => {
        this.detailData.close_price = res.data.close_price;
        this.detailData.profit = res.data.profit;
      });
    },
    // ??
    futuresOrder(order_no) {