1

zzzz

2024-04-24 2007ac8b95033bccbc7bc1e048e896757611e8f7

 src/page/user/Warehouse/data.list.vue

@@ -10,85 +10,171 @@
        {{ item.title }}
      </li>
    </ul>
    <van-list
      v-model="loading"
      :finished="finished"
      :finished-text="$t('hj43')"
      :loading-text="$t('hj430')"
      @load="onLoad"
    >
      <div
        class="sport-content-li"
        :style="actives === 1 ? 'height:5.52rem' : 'height:7.52rem'"
        v-for="(item, index) in dataList"
        :key="index"
        @click="$router.push(`/Stockdetail?codes=${item.positionSn}`)"
      >
        <div @click.stop="pushRouter(item)">
          <div class="title-box">
            <div class="span">{{ item.stockName }}</div>
            <div
              class="states"
              :class="item.orderDirection === '买跌' ? 'states-red' : ''"
            >
              {{ $t(item.orderDirection) }}
            </div>
          </div>
          {{ item.stockSpell }}
        </div>
        <!-- <div @click="$router.push('/Stockdetail')"></div> -->
        <van-row>
          <van-col span="8">
            <div style="text-align: left">
              <div class="sport-content-title2">
                {{ $t("盈虧") }} ({{ activeObj.symbolCode }})
              </div>
              <div class="sport-content-text" style="color: #d04b64">
                {{ item.profitAndLose | _toLocaleString }}
              </div>
            </div>
          </van-col>
          <van-col span="8">
            <div style="text-align: center">
              <div class="sport-content-title2">
                {{ $t("hj141") }} ({{ activeObj.symbolCode }})
              </div>
              <div class="sport-content-text2">
                {{ item.profitAndLoseParent }}
              </div>
            </div>
          </van-col>
          <van-col span="8">
            <div style="text-align: right">
              <div class="sport-content-title2">{{ $t("倉位(股)") }}</div>
              <div class="sport-content-text">{{ item.orderNum }}</div>
            </div></van-col
          >
        </van-row>
        <van-row>
          <van-col span="8">
            <div style="text-align: left">
              <div class="sport-content-title2">
                {{ $t("hj40") }}({{ activeObj.symbolCode }})
              </div>
              <div class="sport-content-text2">
                {{ item.now_price | _toLocaleString }}
              </div>
            </div>
          </van-col>
          <van-col span="8">
            <div style="text-align: center">
              <div class="sport-content-title2">
                {{ $t("持倉價") }} ({{ activeObj.symbolCode }})
              </div>
              <div class="sport-content-text2">
                {{ item.buyOrderPrice | _toLocaleString }}
              </div>
            </div>
          </van-col>
          <van-col span="8">
            <div style="text-align: right">
              <div class="sport-content-title2">
                {{ $t("訂單金額") }} ({{ activeObj.symbolCode }})
              </div>
              <div class="sport-content-text2">
                {{ item.orderTotalPrice | _toLocaleString }}
              </div>
            </div>
          </van-col>
        </van-row>
        <van-row>
          <van-col span="8">
            <div style="text-align: left">
              <div class="sport-content-title2">
                {{ $t("hj44") }} ({{ activeObj.symbolCode }})
              </div>
              <div class="sport-content-text2">
                {{ item.orderFee | _toLocaleString }}
              </div>
            </div>
          </van-col>
          <van-col span="8">
            <div style="text-align: center">
              <div class="sport-content-title2">
                {{ $t("止損價") }} ({{ activeObj.symbolCode }})
              </div>
              <div class="sport-content-text2">
                {{ item.profitTargetPrice | _toLocaleString }}
              </div>
            </div>
          </van-col>
          <van-col span="8">
            <div style="text-align: right">
              <div class="sport-content-title2">
                {{ $t("止盈價") }} ({{ activeObj.symbolCode }})
              </div>
              <div class="sport-content-text2">
                {{ item.stopTargetPrice | _toLocaleString }}
              </div>
            </div>
          </van-col>
        </van-row>
        <van-row>
          <van-col span="12">
            <div style="text-align: left">
              <div class="sport-content-title2">{{ $t("持倉時間") }}</div>
              <div class="sport-content-text2">
                {{ $moment(item.buyOrderTime).format("DD-MM-YYYY hh:mm:ss A") }}
              </div>
            </div>
          </van-col>
          <van-col span="12">
            <div style="text-align: right">
              <div class="sport-content-title2">{{ $t("訂單編號") }}</div>
              <div class="sport-content-text2">{{ item.buyOrderId }}</div>
            </div>
          </van-col>
        </van-row>

    <div class="sport-content-li">
      <div class="title-box">
        <div class="span">SoundHound AI, Inc. Class A Commond StockSOUN</div>
        <div class="states">买涨</div>
      </div>
      <div class="van-rows">
        <div style="text-align: left">
          <div class="sport-content-title2">盈虧 (USD)</div>
          <div class="sport-content-text" style="color: #d04b64">-35.4632</div>
        </div>
        <div style="text-align: right">
          <div class="sport-content-title2">盈虧 (USD)</div>
          <div class="sport-content-text">-35.4632</div>
        <div class="but-box" v-if="actives === 0" @click.stop="close(item)">
          <div class="but">{{ $t("平仓") }}</div>
          <!-- <div class="but buts">止盈止损</div> -->
        </div>
      </div>
      <div class="van-rows">
        <div style="text-align: left">
          <div class="sport-content-title2">最新價(USD)</div>
          <div class="sport-content-text2">-35.4632</div>
        </div>
        <div style="text-align: center">
          <div class="sport-content-title2">持倉價 (USD)</div>
          <div class="sport-content-text2">-35.4632</div>
        </div>
        <div style="text-align: right">
          <div class="sport-content-title2">訂單金額 (USD)</div>
          <div class="sport-content-text2">-35.4632</div>
        </div>
      </div>
      <div class="van-rows">
        <div style="text-align: left">
          <div class="sport-content-title2">開倉手續費 (USD)</div>
          <div class="sport-content-text2">-35.4632</div>
        </div>
        <div style="text-align: center">
          <div class="sport-content-title2">止損價 (USD)</div>
          <div class="sport-content-text2">-35.4632</div>
        </div>
        <div style="text-align: right">
          <div class="sport-content-title2">止盈價 (USD)</div>
          <div class="sport-content-text2">-35.4632</div>
        </div>
      </div>
      <div class="van-rows">
        <div style="text-align: left">
          <div class="sport-content-title2">持倉時間</div>
          <div class="sport-content-text2">19-03-24 16:11:22</div>
        </div>
        <div style="text-align: right">
          <div class="sport-content-title2">訂單編號</div>
          <div class="sport-content-text2">-17108358821839588500127</div>
        </div>
      </div>
      <div class="but-box">
        <div class="but" @click="close">平仓</div>
        <!-- <div class="but buts">止盈止损</div> -->
      </div>
    </div>
    <van-popup v-model="show" position="top" :style="{ height: '30%' }" />
    </van-list>

    <Dialog ref="closeDialog" title="确认平仓">
    <!-- <van-popup v-model="show" position="top" :style="{ height: '30%' }" /> -->

    <Dialog ref="closeDialog" :title="$t('确认平仓')" :confirm="confirm">
      <template v-slot:center>
        <div>
          <div class="hang">
            <div class="left">名称</div>
            <div class="right">SOUN</div>
            <div class="left">{{ $t("hj39") }}</div>
            <div class="right">{{ closeSell.stockName }}</div>
          </div>
          <div class="hang">
            <div class="left">買漲/買跌</div>
            <div class="right">買漲</div>
            <div class="left">{{ $t("買漲/買跌") }}</div>
            <div class="right">{{ $t(closeSell.orderDirection) }}</div>
          </div>
          <div class="hang">
            <div class="left">倉位(股)</div>
            <div class="right" style="color: rgb(3, 173, 143)">20.0000</div>
            <div class="left">{{ $t("倉位(股)") }}</div>
            <div class="right" style="color: rgb(3, 173, 143)">
              {{ closeSell.orderNum }}
            </div>
          </div>
          <div class="hang">
            <div class="left">類型</div>
            <div class="right">市價</div>
            <div class="left">{{ $t("類型") }}</div>
            <div class="right">{{ $t("市價") }}</div>
          </div>
        </div>
      </template>
@@ -98,41 +184,120 @@

<script>
import Dialog from "@/components/Dialog";

import { getchicang, sell } from "../../../axios/api";
import { Notify } from "vant";
export default {
  components: { Dialog },

  props: {
    activeObj: {
      type: Object,
      default: {},
    },
  },
  mounted() {
    this.getList();
  },
  data() {
    return {
      // show:
      actives: "1",
      pageNum: 1,
      pageSize: 150,
      loading: true,
      finished: false,
      closeSell: {},
      show: false,
      actives: 0,
      dataList: [],
      tabsList: [
        {
          title: "持倉",
          key: "1",
          title: this.$t("持倉"),
          key: 0,
        },

        {
          title: "掛單",
          key: "2",
        },
        {
          title: "撤單",
          key: "3",
        },
        {
          title: "平倉",
          key: "4",
          title: this.$t("平倉"),
          key: 1,
        },
      ],
    };
  },

  methods: {
    close() {
    pushRouter(item) {
      const obj = {
        pid: item.stockCode || "",
        type: item.stockGid || "",
      };
      window.localStorage.setItem("kLine", JSON.stringify(obj));
      // return;
      var codes = item.stockCode;
      var names = item.stockName;

      this.$router.push({
        path: "/kline",
        query: {
          name: names,
          code: codes,
          if_us: "",
          if_zhishu: 0,
          sok: "",
          type: item.stockGid,
        },
      });
    },
    onLoad() {
      this.pageNum++;
      this.loading = true;
    },
    async confirm() {
      const res = await sell({
        positionSn: this.closeSell.positionSn,
      });
      if (res.status === 0) {
        this.$refs.closeDialog.show = false;
        this.dataList = [];
        this.pageNum = 1;
        this.finished = false;
        this.getList();
        this.$emit("closingPosition");
      } else {
        Notify({ type: "danger", message: res.msg });
      }
    },
    // 获取仓位列表
    async getList(laber) {
      if (laber) {
        this.dataList = [];
        this.pageNum = 1;
        this.finished = false;
      }
      const res = await getchicang({
        state: this.actives,
        stockType: laber || this.activeObj.laber,
        pageNum: this.pageNum,
        pageSize: this.pageSize,
      });

      this.loading = false;
      if (res.status === 0) {
        this.dataList = res.data.list;
        // if (res.data.total <= this.dataList.length) {
        this.finished = true;
        //   }
      } else {
        this.loading = false;
        this.finished = true;
      }
    },
    close(item) {
      this.closeSell = item;
      this.$refs.closeDialog.show = true;
    },
    clickTabs(e) {
      console.log(e);
      this.dataList = [];
      this.pageNum = 1;
      this.finished = false;
      this.actives = e.key;
      this.getList();
    },
  },
};
@@ -207,39 +372,41 @@
    flex-shrink: 0;
    font-weight: 900;
  }
}
.van-rows {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  .sport-content-title2 {
    font-style: normal;
    font-weight: 400;
    font-size: 0.29333rem;
    color: #8c9fad;
    // text-align: left;
  }
  .sport-content-text {
    margin-top: 5px;
    font-style: normal;
    // font-weight: 500;
    font-size: 0.48rem;
    color: #14181f;
    // font-family: "PingFang SC";
    // line-height: 18px;
    // text-align: right;
  }
  .sport-content-text2 {
    margin-top: 5px;
    // font-family: "PingFang SC";
    font-style: normal;
    // font-weight: 500;
    font-size: 0.34667rem;
    color: #14181f;
    word-break: break-word;
    // line-height: 18px;

  .states-red {
    background: rgba(208, 75, 100, 0.15);
    color: rgb(208, 75, 100);
  }
}

.sport-content-title2 {
  font-style: normal;
  font-weight: 400;
  font-size: 0.29333rem;
  color: #8c9fad;
  // text-align: left;
}
.sport-content-text {
  margin-top: 5px;
  font-style: normal;
  // font-weight: 500;
  font-size: 0.48rem;
  color: #14181f;
  // font-family: "PingFang SC";
  // line-height: 18px;
  // text-align: right;
}
.sport-content-text2 {
  margin-top: 5px;
  // font-family: "PingFang SC";
  font-style: normal;
  // font-weight: 500;
  font-size: 0.34667rem;
  color: #14181f;
  word-break: break-word;
  // line-height: 18px;
}

.but-box {
  display: flex;
  justify-content: space-around;
@@ -289,4 +456,4 @@
    text-align: right;
  }
}
</style>
</style>