1

PC-20250623MANY\Administrator

2025-09-30 9ddad348a549154e7b328f9d7dd9517d2abd330c

 src/page/user/Warehouse/Stockdetail.vue

@@ -1,48 +1,81 @@
<!--  -->
<template>
  <div style="height: 100%">
    <van-nav-bar
      :placeholder="true"
      :safe-area-inset-top="true"
      :title="$t('订单详情')"
      left-arrow
      :fixed="true"
      @click-left="handleBack"
    >
    <van-nav-bar :placeholder="true" :safe-area-inset-top="true" :title="$t('订单详情')" left-arrow :fixed="true"
      @click-left="handleBack">
    </van-nav-bar>

    <div class="bottomIfr">
      <div class="pagebox">
        <div class="pagebox_left">{{ $t("盈虧") }} ({{ pages.stockGid }})</div>
        <div class="pagebox_right">{{ pages.profitAndLose }}</div>
      <div class="pagebox" @click="toDetails">
        <div class="pagebox_left">
          <span class="i_icon">{{ pages.stockGid }}</span>
          <span class="i_hint">{{ pages.stockSpell }}</span>
        </div>
        <div class="pagebox_right">
          <van-icon name="arrow" size="1.2em" />
        </div>
      </div>
      <div class="pagebox">
        <div class="pagebox_left">{{ $t("hj141") }} ({{ pages.stockGid }})</div>
        <div class="pagebox_right">{{ pages.profitAndLoseParent }}</div>
        <div class="pagebox_left">
          {{ $t("sc") }}
        </div>
        <div class="pagebox_right">{{ pages.stockCode }}</div>
      </div>
      <div class="pagebox">
        <div class="pagebox_left">
          {{ $t("類型") }}
        </div>
        <div class="pagebox_right">
          {{ pages.orderDirection == "买涨" ? $t("gm") : $t("hj78") }}
        </div>
      </div>
      <div class="pagebox">
        <div class="pagebox_left">{{ $t("盈虧") }}</div>
        <div class="pagebox_right">
          {{ pages.stockGid | currencySymbol }}
          {{ pages.profitAndLose | _toString }}
        </div>
      </div>
      <div class="pagebox">
        <div class="pagebox_left">{{ $t("hj141") }}</div>
        <div class="pagebox_right">
          {{ pages.stockGid | currencySymbol }} {{ pages.profitAndLoseParent }}
        </div>
      </div>
      <div class="pagebox">
        <div class="pagebox_left">{{ $t("倉位(股)") }}</div>
        <div class="pagebox_right">{{ pages.orderNum }}</div>
      </div>
      <div class="pagebox" v-if="pages.now_price">
        <div class="pagebox_left">{{ $t("hj40") }}({{ pages.stockGid }})</div>
        <div class="pagebox_right">{{ pages.now_price }}</div>
        <div class="pagebox_left">{{ $t("hj40") }}</div>
        <div class="pagebox_right">
          {{ pages.stockGid | currencySymbol }}
          {{ pages.now_price | _toString }}
        </div>
      </div>
      <div class="pagebox">
        <div class="pagebox_left">
          {{ $t("持倉價") }} ({{ pages.stockGid }})
          {{ $t("持倉價") }}
        </div>
        <div class="pagebox_right">{{ pages.buyOrderPrice }}</div>
        <div class="pagebox_right">
          {{ pages.stockGid | currencySymbol }}
          {{ pages.buyOrderPrice | _toString }}
        </div>
      </div>
      <div class="pagebox">
        <div class="pagebox_left">
          {{ $t("訂單金額") }} ({{ pages.stockGid }})
          {{ $t("訂單金額") }}
        </div>
        <div class="pagebox_right">{{ pages.orderTotalPrice }}</div>
        <div class="pagebox_right">
          {{ pages.stockGid | currencySymbol }}
          {{ pages.orderTotalPrice | _toString }}
        </div>
      </div>
      <div class="pagebox">
        <div class="pagebox_left">{{ $t("hj44") }} ({{ pages.stockGid }})</div>
        <div class="pagebox_right">{{ pages.orderFee }}</div>
        <div class="pagebox_left">{{ $t("hj44") }}</div>
        <div class="pagebox_right">
          {{ pages.stockGid | currencySymbol }} {{ pages.orderFee | _toString }}
        </div>
      </div>
      <div class="pagebox">
        <div class="pagebox_left">
@@ -50,29 +83,67 @@
        </div>
        <div class="pagebox_right">{{ pages.buyOrderId }}</div>
      </div>

      <div class="pagebox" v-if="pages.buyOrderTime">
        <div class="pagebox_left">{{ $t("持倉時間") }}</div>
        <div class="pagebox_right">
          {{ $moment(pages.buyOrderTime).format("YYYY-MM-DD HH:mm:ss") }}
          {{ $moment(pages.buyOrderTime).format("DD-MM-YYYY hh:mm:ss A") }}
        </div>
      </div>
      <div class="pagebox" v-if="pages.sellOrderTime">
        <div class="pagebox_left">{{ $t("hj128") }}</div>
        <div class="pagebox_right">
          {{ $moment(pages.sellOrderTime).format("YYYY-MM-DD HH:mm:ss") }}
          {{ $moment(pages.sellOrderTime).format("DD-MM-YYYY hh:mm:ss A") }}
        </div>
      </div>
      <div class="buttonbox flex-center" v-show="!pages.sellOrderTime">
        <!-- <van-button type="primary" @click="close"> {{ $t("平仓") }}</van-button> -->

        <van-popover v-model="showPopover" trigger="click" placement="top" :actions="actions" @select="onSelect">
          <template #reference>
            <van-button type="primary"> {{ $t("平仓") }}</van-button>
          </template>
        </van-popover>
      </div>

      <Dialog ref="closeDialog" :title="$t('确认平仓')" :confirm="confirm">
        <template v-slot:center>
          <div>
            <div class="hang">
              <div class="left">{{ $t("hj39") }}</div>
              <div class="right">{{ pages.stockName }}</div>
            </div>
            <div class="hang">
              <div class="left">{{ $t("買漲/買跌") }}</div>
              <div class="right">{{ $t(pages.orderDirection) }}</div>
            </div>
            <div class="hang">
              <div class="left">{{ $t("倉位(股)") }}</div>
              <input class="input_box" type="number" :max="pages.orderNum" :placeholder="$t('hj262')"
                v-model="ordernum" />
            </div>
            <div class="hang">
              <div class="left">{{ $t("類型") }}</div>
              <div class="right">{{ $t("市價") }}</div>
            </div>
          </div>
        </template>
      </Dialog>
    </div>
  </div>
</template>

<script>
import Dialog from "@/components/Dialog";
import * as api from "@/axios/api";
import { Notify } from "vant";
export default {
  components: { Dialog },
  data() {
    return {
      pages: {},
      ordernum: "",
      actions: [{ text: this.$t('确定'), key: '1' }, { text: this.$t('取消'), key: '2' }],
      showPopover: false,
    };
  },
  // 生命周期 - 创建完成（访问当前this实例）
@@ -80,7 +151,7 @@
    this.getInfoSite();
  },
  // 生命周期 - 挂载完成（访问DOM元素）
  mounted() {},
  mounted() { },
  methods: {
    handleBack() {
      // 点击返回/
@@ -88,20 +159,76 @@
    },
    async getInfoSite() {
      var res = {
        positionSn: this.$route.query.codes,
        positionSn: this.$route.query.codes
      };
      let data = await api.findByPostionSn(res);
      if (data.status === 0) {
        this.pages = data.data;
      }
    },
  },
    // 点击进入详情
    toDetails() {
      const obj = {
        pid: this.pages.stockCode || "",
        type: this.pages.stockGid || ""
      };
      window.localStorage.setItem("kLine", JSON.stringify(obj));

      this.$router.push({
        path: "/kline",
        query: {
          code: this.pages.stockCode,
          type: this.pages.stockGid
        }
      });
    },
    // 打开平仓弹窗
    close() {
      this.$refs.closeDialog.show = true;
      this.ordernum = "";
    },
    // 平仓
    async confirm() {
      this.$refs.closeDialog.show = false;
      const res = await api.sell({
        positionSn: this.pages.positionSn,
        number: this.ordernum
      });
      if (res.status === 0) {
        this.finished = false;
        Notify({ type: "success", message: res.msg });
        this.$router.go(-1);
      } else {
        Notify({ type: "danger", message: res.msg });
      }
    },
    // 直接全部确认弹框
    onSelect(action) {
      if (action.key == 1) this.oneClose();
    },
    // 直接全部平仓
    async oneClose() {
      const res = await api.sell({
        positionSn: this.pages.positionSn,
        number: this.pages.orderNum
      });
      if (res.status === 0) {
        Notify({ type: "success", message: res.msg });
      } else {
        Notify({ type: "danger", message: res.msg });
      }
    }
  }
};
</script>
<style scoped lang='less'>
<style scoped lang="less">
@dark_green: #07c160;
@green: #c4d600;

/deep/ .van-nav-bar__content {
  height: 65px;
}

/deep/ .van-nav-bar__title {
  font-family: "DINPro";
  width: 100%;
@@ -114,6 +241,7 @@
  font-size: 0.48rem;
  color: #14181f;
}

.bottomIfr {
  // position: absolute;
  // top: 1.5rem;
@@ -124,15 +252,69 @@
  height: calc(100% - 65px);
  // height:;
  background-color: #fff !important;
  font-size: 10vw;

  .buttonbox {
    padding-top: 1.2em;
    padding-bottom: 1.2em;

    /deep/ .van-button--primary {
      background-color: @green;
      border-color: @green;
      font-size: 0.4em;
    }
  }
}

.pagebox {
  margin: 0 15px;
  height: 60px;
  margin: 0 0.6em;
  height: 3.2em;
  font-size: 0.4em;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #ddd;

  .i_icon {
    border-radius: 0 26em 26em 0;
    background: @dark_green;
    color: #fff;
    padding: 0.1em 0.5em 0.1em 0.4em;
    margin-right: 0.3em;
    font-size: 0.8em;
  }

  .i_name {
    margin-top: 0.2em;
    // color: #777777;
    font-size: 0.9em;
  }

  .pagebox_right {
    color: #969799;
  }
}

.hang {
  display: flex;
  justify-content: space-between;

  .left {
    font-style: normal;
    font-weight: 500;
    font-size: 0.34667rem;
    color: #8c9fad;
  }

  .right {
    font-style: normal;
    font-weight: 500;
    font-size: 0.34667rem;
    color: #14181f;
    text-align: right;
  }
}

.conentIfr {
  width: 100%;
  height: 90%;