1
PC-20250623MANY\Administrator
2025-09-23 01d33e0271209b14ed364ccdb5d6ed0270a906af
src/views/account/account.vue
@@ -5,55 +5,30 @@
      <div class="overview-header">
        <div class="title">
          <!-- <i class="el-icon-lock"></i> -->
          <img src="@/assets/images/fund-icon_b.png" alt="Account" />
          <img src="@/assets/images/account-icon.png" alt="Account" />
          <span>{{ $t("ao1") }}</span>
        </div>
      </div>
      <div class="flex-between" style="width: 100%">
        <div class="overview-content">
          <div class="overview-item">
            <div class="item-label">{{ $t("hj49") }}</div>
            <div class="item-value">
              {{ moneyData.symbol }} {{ moneyData.totalMoney }}
            </div>
          </div>
          <div class="overview-item">
            <div class="item-label">{{ $t("hj48") }}</div>
            <div class="item-value">
              {{ moneyData.symbol }} {{ moneyData.availableBalance }}
            </div>
          </div>
          <div class="overview-item">
            <div class="item-label">{{ $t("ff1") }}</div>
            <div class="item-value">
              {{ moneyData.symbol }} {{ moneyData.freezeMoney }}
            </div>
          </div>
        </div>
        <div class="action-buttons">
         <el-button
           type="success"
           class="deposit-btn"
           @click="trasferireVisible = true"
         >
           <div class="flex-center">
             <img src="@/assets/images/account_hz.png" alt="Deposit" />
             {{ $t("劃轉") }}
           </div>
         </el-button>
          <el-button
          <!-- <el-button
            type="success"
            class="deposit-btn"
            @click="depositDialogVisible = true"
            @click="trasferireVisible = true"
          >
            <div class="flex-center">
              <img src="@/assets/images/account_hz.png" alt="Deposit" />
              {{ $t("劃轉") }}
            </div>
          </el-button> -->
          <el-button type="primary" class="deposit-btn" @click="depositTip">
            <div class="flex-center">
              <img src="@/assets/images/account_rec.png" alt="Deposit" />
              {{ $t("dep") }}
            </div>
          </el-button>
          <el-button class="withdraw-btn" @click="withdrawVisible = true">
          <el-button type="primary" class="withdraw-btn" @click="withdrawVisible = true">
            <div class="flex-center">
              <img src="@/assets/images/account_ret.png" alt="Withdraw" />
              {{ $t("hj177") }}
@@ -101,39 +76,25 @@
        <div class="market-header">
          <h3>{{ $t("美国") }}</h3>
        </div>
        <div class="overview-content" v-for="i in moneyData" :key="i.id" v-show="i.accectType == 'US'">
          <div class="overview-item">
            <div class="item-label">{{ $t("hj49") }}</div>
            <div class="item-value">{{ i.symbol }} {{ i.totalMoney }}</div>
          </div>
          <div class="overview-item">
            <div class="item-label">{{ $t("hj48") }}</div>
            <div class="item-value">
              {{ i.symbol }} {{ i.availableBalance }}
            </div>
          </div>
          <div class="overview-item">
            <div class="item-label">{{ $t("ff1") }}</div>
            <div class="item-value">{{ i.symbol }} {{ i.freezeMoney }}</div>
          </div>
        </div>
        <div class="market-content">
          <div class="market-row">
            <div class="market-label">
              <span class="market-tag sc_c">US</span>
              <span>{{ $t("mv1") }}</span>
            </div>
            <div class="market-value">{{ positionData.usMarketValue }} USD</div>
          </div>
          <div class="market-row">
            <div class="market-label">
              <span class="market-tag sc_c">US</span>
              <span>{{ $t("upl1") }}</span>
            </div>
            <div
              class="market-value flex-center"
              :class="`${positionData.usPositionEarnings < 0 ? 'r_c' : ''} ${
                positionData.usPositionEarnings > 0 ? 'lc_c' : ''
              }`"
            >
              <img
                src="@/assets/images/up.png"
                alt=""
                v-if="positionData.usPositionEarnings > 0"
              />
              <img
                src="@/assets/images/down.png"
                alt=""
                v-else-if="positionData.usPositionEarnings < 0"
              />
              {{ positionData.usPositionEarnings }}
              ({{ positionData.usPositionEarningsParent }})
            </div>
          </div>
          <div class="market-footer">
            <div class="position-btn sc_c" @click="positionOpen('US')">
              {{ $t("hj2") }}
@@ -144,229 +105,56 @@
          </div>
        </div>
      </div>
      <div class="market-section sb_b">
        <div class="market-header">
          <h3>{{ $t("hk1") }}</h3>
        </div>
        <div class="market-content">
          <div class="market-row">
            <div class="market-label">
              <el-tag type="success" size="small" style="margin-right: 8px">
                HK
              </el-tag>
              <span>{{ $t("mv1") }}</span>
            </div>
            <div class="market-value">{{ positionData.hkMarketValue }} HKD</div>
          </div>
          <div class="market-row">
            <div class="market-label">
              <el-tag type="success" size="small" style="margin-right: 8px"
                >HK</el-tag
              >
              <span>{{ $t("upl1") }}</span>
            </div>
            <div
              class="market-value flex-center"
              :class="`${positionData.hkPositionEarnings < 0 ? 'r_c' : ''} ${
                positionData.hkPositionEarnings > 0 ? 'lc_c' : ''
              }`"
            >
              <img
                src="@/assets/images/up.png"
                alt=""
                v-if="positionData.hkPositionEarnings > 0"
              />
              <img
                src="@/assets/images/down.png"
                alt=""
                v-else-if="positionData.hkPositionEarnings < 0"
              />
              {{ positionData.hkPositionEarnings }}
              ({{ positionData.hkPositionEarningsParent }})
            </div>
          </div>
          <div class="market-footer">
            <div class="position-btn sc_c" @click="positionOpen('HK')">
              {{ $t("hj2") }}
            </div>
            <div class="trade-log-btn lc_c" @click="tradeLogOpen('HK')">
              {{ $t("hj121") }}
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="market-data page-w a_card" style="padding-top: 0;">
      <div class="market-section sb_b">
        <div class="market-header">
          <h3>{{ $t("tw") }}</h3>
        </div>
        <div class="market-content">
          <div class="market-row">
            <div class="market-label">
              <el-tag type="success" size="small" style="margin-right: 8px">
                TW
              </el-tag>
              <span>{{ $t("mv1") }}</span>
            </div>
            <div class="market-value">{{ positionData.twMarketValue }} TWD</div>
          </div>
          <div class="market-row">
            <div class="market-label">
              <el-tag type="success" size="small" style="margin-right: 8px"
                >TW</el-tag
              >
              <span>{{ $t("upl1") }}</span>
            </div>
            <div
              class="market-value flex-center"
              :class="`${positionData.twPositionEarnings < 0 ? 'r_c' : ''} ${
                positionData.twPositionEarnings > 0 ? 'lc_c' : ''
              }`"
            >
              <img
                src="@/assets/images/up.png"
                alt=""
                v-if="positionData.twPositionEarnings > 0"
              />
              <img
                src="@/assets/images/down.png"
                alt=""
                v-else-if="positionData.twPositionEarnings < 0"
              />
              {{ positionData.twPositionEarnings }}
              ({{ positionData.twPositionEarningsParent }})
            </div>
          </div>
          <div class="market-footer">
            <div class="position-btn sc_c" @click="positionOpen('TW')">
              {{ $t("hj2") }}
            </div>
            <div class="trade-log-btn lc_c" @click="tradeLogOpen('TW')">
              {{ $t("hj121") }}
            </div>
          </div>
        </div>
      </div>
      <div class="market-section sb_b">
        <div class="market-header">
          <h3>{{ $t("id1") }}</h3>
        </div>
        <div class="market-content">
          <div class="market-row">
            <div class="market-label">
              <el-tag type="success" size="small" style="margin-right: 8px">
                IN
              </el-tag>
              <span>{{ $t("mv1") }}</span>
            </div>
            <div class="market-value">{{ positionData.inMarketValue }} INR</div>
          </div>
          <div class="market-row">
            <div class="market-label">
              <el-tag type="success" size="small" style="margin-right: 8px"
                >IN</el-tag
              >
              <span>{{ $t("upl1") }}</span>
            </div>
            <div
              class="market-value flex-center"
              :class="`${positionData.inPositionEarnings < 0 ? 'r_c' : ''} ${
                positionData.inPositionEarnings > 0 ? 'lc_c' : ''
              }`"
            >
              <img
                src="@/assets/images/up.png"
                alt=""
                v-if="positionData.inPositionEarnings > 0"
              />
              <img
                src="@/assets/images/down.png"
                alt=""
                v-else-if="positionData.inPositionEarnings < 0"
              />
              {{ positionData.inPositionEarnings }}
              ({{ positionData.inPositionEarningsParent }})
            </div>
          </div>
          <div class="market-footer">
            <div class="position-btn sc_c" @click="positionOpen('IN')">
              {{ $t("hj2") }}
            </div>
            <div class="trade-log-btn lc_c" @click="tradeLogOpen('IN')">
              {{ $t("hj121") }}
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- 账户变更详情 -->
    <div class="account-details page-w a_card">
      <div class="account-details-left">
        <div
        <!-- <div
          class="nav_item"
          :class="`${nav == 1 ? 'active' : ''}`"
          @click="navChange(1)"
        >
          {{ $t("账户变动记录") }}
        </div>
        <div
          class="nav_item"
          :class="`${nav == 2 ? 'active' : ''}`"
          @click="navChange(2)"
        >
        </div> -->
        <div class="nav_item" :class="`${nav == 2 ? 'active' : ''}`" @click="navChange(2)">
          {{ $t("dawr") }}
        </div>
        <div
        <!-- <div
          class="nav_item"
          :class="`${nav == 3 ? 'active' : ''}`"
          @click="navChange(3)"
        >
          {{ $t("aqt1") }}
        </div>
        <div
        </div> -->
        <!-- <div
          class="nav_item"
          :class="`${nav == 4 ? 'active' : ''}`"
          @click="navChange(4)"
        >
          {{ $t("大宗交易订单") }}
        </div>
        <div
        </div> -->
        <!-- <div
          class="nav_item"
          :class="`${nav == 5 ? 'active' : ''}`"
          @click="navChange(5)"
        >
          {{ $t("io1") }}
        </div>
        <div
        </div> -->
        <!-- <div
          class="nav_item"
          :class="`${nav == 6 ? 'active' : ''}`"
          @click="navChange(6)"
        >
          {{ $t("基金订单") }}
        </div>
        <div
          class="nav_item"
          :class="`${nav == 7 ? 'active' : ''}`"
          @click="navChange(7)"
        >
        </div> -->
        <div class="nav_item" :class="`${nav == 7 ? 'active' : ''}`" @click="navChange(7)">
          {{ $t("fnv") }}
        </div>
        <div
          class="nav_item"
          :class="`${nav == 8 ? 'active' : ''}`"
          @click="navChange(8)"
        >
        <div class="nav_item" :class="`${nav == 8 ? 'active' : ''}`" @click="navChange(8)">
          {{ $t("bc") }}
        </div>
        <div
          class="nav_item"
          :class="`${nav == 9 ? 'active' : ''}`"
          @click="navChange(9)"
        >
        <div class="nav_item" :class="`${nav == 9 ? 'active' : ''}`" @click="navChange(9)">
          {{ $t("hj10") }}
        </div>
      </div>
@@ -383,57 +171,33 @@
      </div>
    </div>
   <!-- 划转弹窗 -->
   <Trasferire
     :dialogVisible.sync="trasferireVisible"
     v-if="trasferireVisible"
     @onClose="getMoney"
     :maxNum="Math.floor(moneyData.availableBalance * 100) / 100"
   ></Trasferire>
    <!-- 划转弹窗 -->
    <Trasferire :dialogVisible.sync="trasferireVisible" v-if="trasferireVisible" @onClose="getMoney"
      :moneyData="moneyData"></Trasferire>
    <!-- 充值弹窗 -->
    <Deposit
      :dialogVisible.sync="depositDialogVisible"
      v-if="depositDialogVisible"
      @onClose="getMoney"
    ></Deposit>
    <Deposit :dialogVisible.sync="depositDialogVisible" v-if="depositDialogVisible" @onClose="getMoney"></Deposit>
    <!-- 提现弹窗 -->
    <Withdraw
      :dialogVisible.sync="withdrawVisible"
      v-if="withdrawVisible"
      @onClose="getMoney"
      :maxNum="Math.floor(moneyData.availableBalance * 100) / 100"
    ></Withdraw>
    <Withdraw :dialogVisible.sync="withdrawVisible" v-if="withdrawVisible" @onClose="getMoney" :moneyData="moneyData">
    </Withdraw>
    <!-- 贷款申请弹窗 -->
    <loan-application
      :dialogVisible.sync="applicationVisible"
      v-if="applicationVisible"
    ></loan-application>
    <loan-application :dialogVisible.sync="applicationVisible" v-if="applicationVisible"></loan-application>
    <!-- 贷款记录弹窗 -->
    <loan-records
      :dialogVisible.sync="recordsVisible"
      v-if="recordsVisible"
    ></loan-records>
    <loan-records :dialogVisible.sync="recordsVisible" v-if="recordsVisible"></loan-records>
    <!-- 交易列表弹窗(包括us和mx的) -->
    <Position
      :dialogVisible.sync="positionVisible"
      v-if="positionVisible"
      :type="positionType"
    ></Position>
    <Position :dialogVisible.sync="positionVisible" v-if="positionVisible" :type="positionType" :moneyData="moneyData"
      @pc="pc"></Position>
    <!-- 交易记录弹窗(包括us和mx的) -->
    <trade-log
      :dialogVisible.sync="tradelogVisible"
      v-if="tradelogVisible"
      :type="positionType"
    ></trade-log>
    <trade-log :dialogVisible.sync="tradelogVisible" v-if="tradelogVisible" :type="positionType"></trade-log>
  </div>
</template>
<script>
let teimss = null;
import * as api from "@/axios/api";
import dawr from "./components/dawr.vue";
import acd from "./components/acd.vue";
@@ -464,7 +228,7 @@
    lp,
    bto,
    Deposit,
   Trasferire,
    Trasferire,
    Withdraw,
    LoanApplication,
    LoanRecords,
@@ -473,14 +237,13 @@
  },
  data() {
    return {
      nav: 1,
      moneyData: {}, // 账户金额
      nav: 2,
      moneyData: [], // 账户金额
      userInfo: {}, // 用户信息
      positionData: {}, // 账户持仓数据
      depositAmount: "", // 存款金额
      depositMethod: "Bank Transfer", // 存款方式
      depositDialogVisible: false, // 存款弹窗显示状态
     trasferireVisible: false, // 存款弹窗显示状态
      trasferireVisible: false, // 存款弹窗显示状态
      withdrawVisible: false, // 存款弹窗显示状态
      applicationVisible: false, // 申请贷款弹窗显示状态
      recordsVisible: false, // 贷款记录弹窗显示状态
@@ -498,31 +261,31 @@
    this.init();
  },
  beforeDestroy() {
    clearInterval(teimss);
  },
  methods: {
    // 初始化
    init() {
      this.getMoney();
      this.getInfo();
      this.getMyPositionProfitAndLose();
      clearInterval(teimss);
      teimss = setInterval(() => {
        this.getMoney();
      }, 3000);
    },
    // 获取账户金额
    async getMoney() {
      let data = await api.getMoney();
      if (data.status === 0) {
        this.moneyData = data.data[0];
        this.moneyData = data.data;
      }
    },
    // 获取用户信息
    async getInfo() {
      let data = await api.getUserInfo();
      this.userInfo = data.data;
    },
    // 获取账户持仓数据
    async getMyPositionProfitAndLose() {
      let data = await api.getMyPositionProfitAndLose();
      if (data.data) {
        this.positionData = data.data;
      }
    },
    // 交易列表弹窗打开
    positionOpen(type) {
@@ -540,15 +303,28 @@
        this.nav = val;
      }
    },
    // 存款提示
    depositTip() {
      this.$message({
        message: this.$t("充值提示"),
        type: "warning",
      });
    },
    // 持仓列表关闭,打开平仓列表
    pc() {
      this.positionVisible = false;
      this.tradelogVisible = true;
    },
  },
};
</script>
<style lang="scss" scoped>
$s_c: #c4d600;
$s_c: #287dff;
$l_c: #07c160;
// .account-container {}
::v-deep .el-drawer__header > :first-child {
::v-deep .el-drawer__header> :first-child {
  font-size: 18px;
  font-weight: 700;
  color: #333;
@@ -593,8 +369,8 @@
.overview-content {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
  width: 50%;
  // margin-bottom: 20px;
  padding: 15px 20px 0;
}
.overview-item {
@@ -602,7 +378,7 @@
}
.item-label {
  color: #666;
  color: #ccc;
  font-size: 14px;
  margin-bottom: 10px;
}
@@ -610,12 +386,12 @@
.item-value {
  font-size: 20px;
  font-weight: bold;
  color: #333;
  color: #eee;
}
.action-buttons {
  display: flex;
  justify-content: flex-end;
  justify-content: flex-start;
  margin-bottom: 20px;
  width: 50%;
@@ -626,8 +402,6 @@
}
.deposit-btn {
  background-color: $l_c !important;
  border-color: $l_c !important;
  margin-right: 10px;
  height: 40px;
  padding: 0 20px;
@@ -639,11 +413,6 @@
  color: #fff !important;
  height: 40px;
  padding: 0 20px;
}
.deposit-btn:hover,
.withdraw-btn:hover {
  opacity: 0.5;
}
.loan-info {
@@ -711,10 +480,9 @@
.market-section {
  flex: 1;
  background-color: #fff;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid #e1e1e1;
  border: 1px solid #777;
}
.market-header {
@@ -790,12 +558,12 @@
/* 账户变更详情样式 */
.account-details {
  background-color: #fff;
  // background-color: #fff;
  border-radius: 8px;
  display: flex;
  gap: 24px;
  padding: 32px;
  border-top: 1px solid #f5f5f5;
  border-top: 1px solid #555;
  .account-details-right {
    flex: 3;