0430号修改

lxf

2025-04-30 b4c4556a5eddf6708ec55b07e3edc15b2217842e

 src/page/funds/index.vue

@@ -4,15 +4,30 @@
          <div class="money-info">
            <div class="money-info_left">
                <div class="money-info_total">
                    <img class="ino-ico" v-show="$state.theme !='red' " src="../../assets/ico/zongzichan.png">
                    <img class="ino-ico" v-show="$state.theme =='red' " src="../../assets/ico/zongzichan-red.png">
            <img
              class="ino-ico"
              v-show="$state.theme != 'red'"
              src="../../assets/ico/zongzichan.png"
            />
            <img
              class="ino-ico"
              v-show="$state.theme == 'red'"
              src="../../assets/ico/zongzichan-red.png"
            />
                    <span class="ino-title">沪深资产总计</span>
                    <span class="ino-money">
                    <span style="font-size: .3rem"> ﷼</span>
                    {{(Number($store.state.userInfo.enableAmt + $store.state.userInfo.allFreezAmt)).toFixed(2)}}</span>
              <span style="font-size: .3rem"> </span>
              {{
                Number(
                  $store.state.userInfo.enableAmt +
                    $store.state.userInfo.allFreezAmt
                ).toFixed(2)
              }}</span
            >
                </div>
                <div class="money-info_progress">
                    <div class="money-info_progress__inner"
            <div
              class="money-info_progress__inner"
                    style="width: `${progress}`%"
                    ></div>
                </div>
@@ -24,55 +39,86 @@
          </div>
          <div class="money-detail">
              <div class="money-detail_title">
                  <span style="font-size: .24rem; font-weight:bold;color:#fff"
          <span
            style="font-size: .24rem; font-weight:bold;color:#fff"
                  :style="{color:$state.theme =='red'&&'#000'}"
                  >沪深账户
                  <span
                  >(￥{{(Number($store.state.userInfo.enableAmt + $store.state.userInfo.allFreezAmt)).toFixed(2)}})</span>
              >(￥{{
                Number(
                  $store.state.userInfo.enableAmt +
                    $store.state.userInfo.allFreezAmt
                ).toFixed(2)
              }})</span
            >
                  </span>
                  <span style="font-size: .2rem"
          <span
            style="font-size: .2rem"
                  :style="{color:$state.theme =='red'&&'#000'}"
                  >资金互转
                  <i
                  style="font-size: .2rem"
                  class="iconfont icon-you"></i>
            <i style="font-size: .2rem" class="iconfont icon-you"></i>
                  </span>
              </div>
              <div class="money-detail_acc">
                  <div class=" acc">
                      <img src="../../assets/ico/hszzj.png"
            <img
              src="../../assets/ico/hszzj.png"
                      style="width:.25rem;height:.3rem"
                      >
            />
                      <div class="acc-item">
                          <div class="acc-item_title">沪深总资金</div>
                          <div class="acc-item_num">￥{{(Number($store.state.userInfo.enableAmt + $store.state.userInfo.allFreezAmt)).toFixed(2)}}</div>
              <div class="acc-item_num">
                ￥{{
                  Number(
                    $store.state.userInfo.enableAmt +
                      $store.state.userInfo.allFreezAmt
                  ).toFixed(2)
                }}
              </div>
                      </div>
                  </div>
                  <div class=" acc">
                      <img src="../../assets/ico/hsdjbzj.png"
            <img
              src="../../assets/ico/hsdjbzj.png"
                      style="width:.29rem;height:.25rem"
                      >
            />
                      <div class="acc-item">
                          <div class="acc-item_title">沪深冻结保证金</div>
                          <div class="acc-item_num">￥{{$store.state.hide?'****':$store.state.userInfo.allFreezAmt}}</div>
              <div class="acc-item_num">
                ￥{{
                  $store.state.hide ? "****" : $store.state.userInfo.allFreezAmt
                }}
              </div>
                      </div>
                  </div>
                  <div class=" acc">
                      <img src="../../assets/ico/hskyzj.png"
            <img
              src="../../assets/ico/hskyzj.png"
                      style="width:.28rem;height:.28rem"
                      >
            />
                      <div class="acc-item">
                          <div class="acc-item_title">沪深可用资金</div>
                          <div class="acc-item_num">￥{{$store.state.hide?'****':$store.state.userInfo.enableAmt}}</div>
              <div class="acc-item_num">
                ￥{{
                  $store.state.hide ? "****" : $store.state.userInfo.enableAmt
                }}
              </div>
                      </div>
                  </div>
                  <div class=" acc">
                      <img src="../../assets/ico/zyk.png"
            <img
              src="../../assets/ico/zyk.png"
                      style="width:.28rem;height:.28rem"
                      >
            />
                      <div class="acc-item">
                          <div class="acc-item_title">沪深持仓总盈亏</div>
                          <div class="acc-item_num">￥{{$store.state.hide?'****':$store.state.userInfo.tradingAmount}}</div>
              <div class="acc-item_num">
                ￥{{
                  $store.state.hide
                    ? "****"
                    : $store.state.userInfo.tradingAmount
                }}
              </div>
                      </div>
                  </div>
              </div>
@@ -82,10 +128,7 @@
          <div class="funds-list-title">
              我的配资
          </div>
          <div class="funds-list-item"
            v-for="(i, k) in list.list"
            :key="k"
          >
      <div class="funds-list-item" v-for="(i, k) in list.list" :key="k">
            <div class="funds-list-item__title">
                <span class="funds-list-item__title-left">
                    <!-- <span class="zhishu">
@@ -94,8 +137,7 @@
                    总操盘资金：
                    <span class="green">{{i.totalTradingAmount}}</span>
                </span>
                <span class="funds-list-item__title-right">
                </span>
          <span class="funds-list-item__title-right"> </span>
            </div>
            <div class="funds-list-item__account clearfix">
                <div class="col-xs-4 account">
@@ -139,7 +181,7 @@
</template>

<script>
import * as api from '../../axios/api'
import * as api from "../../axios/api";

export default {
  data () {
@@ -147,25 +189,47 @@
      list: {
        list: []
      }
    }
    };
  },
  computed: {
    progress () {
      let per = this.$store.state.userInfo.userAmt / (this.$store.state.userInfo.userAmt + this.$store.state.userInfo.userIndexAmt) * 100 > 100 ? 100 : this.$store.state.userInfo.userAmt / (this.$store.state.userInfo.userAmt + this.$store.state.userInfo.userIndexAmt) * 100 > 100 ? this.$store.state.userInfo.userAmt / (this.$store.state.userInfo.userAmt + this.$store.state.userInfo.userIndexAmt) * 100 > 100 ? 100 : this.$store.state.userInfo.userAmt / (this.$store.state.userInfo.userAmt + this.$store.state.userInfo.userIndexAmt) * 100 : 100
      return per
      let per =
        (this.$store.state.userInfo.userAmt /
          (this.$store.state.userInfo.userAmt +
            this.$store.state.userInfo.userIndexAmt)) *
          100 >
        100
          ? 100
          : (this.$store.state.userInfo.userAmt /
              (this.$store.state.userInfo.userAmt +
                this.$store.state.userInfo.userIndexAmt)) *
              100 >
            100
          ? (this.$store.state.userInfo.userAmt /
              (this.$store.state.userInfo.userAmt +
                this.$store.state.userInfo.userIndexAmt)) *
              100 >
            100
            ? 100
            : (this.$store.state.userInfo.userAmt /
                (this.$store.state.userInfo.userAmt +
                  this.$store.state.userInfo.userIndexAmt)) *
              100
          : 100;
      return per;
    }
  },
  created () {
    this.getlist()
    this.getlist();
  },
  methods: {
    toRecharge () {
      // 充值
      this.$router.push('/recharge')
      this.$router.push("/recharge");
    },
    toCash () {
      // 提现
      this.$router.push('/cash')
      this.$router.push("/cash");
    },
    async getlist () {
      // 获取持仓列表
@@ -173,18 +237,18 @@
        userId: 0,
        pageNum: this.pageNum,
        pageSize: this.pageSize
      }
      console.log(opt)
      let data = await api.getUserApplyList(opt)
      };
      console.log(opt);
      let data = await api.getUserApplyList(opt);
      if (data.status === 0) {
        this.list = data.data
        this.list = data.data;
      }
      // else {
      //     this.$message.error(data.msg)
      // }
    }
  }
}
};
</script>

<style lang="less" scoped>
@@ -197,12 +261,12 @@
  .funds-info {
      display: block;
      width: 6.9rem;
      margin:.3rem;
      padding: .6rem .2rem .12rem .2rem;
      background-color: #1F2636;
      border-radius: .1rem;
  margin: 0.3rem;
  padding: 0.6rem 0.2rem 0.12rem 0.2rem;
  background-color: #1f2636;
  border-radius: 0.1rem;
    .money-info {
        padding-bottom: .42rem;
    padding-bottom: 0.42rem;
        display: flex;
        justify-content: space-between;
        border-bottom: 1px solid #fff2;
@@ -213,39 +277,39 @@
            flex-direction: column;
            justify-content: space-between;
            .money-info_total {
                height: .4rem;
        height: 0.4rem;
                display: flex;
                align-items: center;
                .ino-ico {
                    width: .38rem;
                    height: .38rem;
                    margin-right: .15rem;
          width: 0.38rem;
          height: 0.38rem;
          margin-right: 0.15rem;
                }
                .ino-title {
                    font-size: .24rem;
                    margin-right: .15rem;
          font-size: 0.24rem;
          margin-right: 0.15rem;
                }
                .ino-money {
                    font-size: .4rem;
                    color: #009C46;
          font-size: 0.4rem;
          color: #009c46;
                    letter-spacing: 0;
                    font-family: lightnumber;
                }
            }
            .money-info_progress {
                width: 100%;
                height: .1rem;
                border-radius: .05rem;
                background-color: #4E5A73;
        height: 0.1rem;
        border-radius: 0.05rem;
        background-color: #4e5a73;
                &__inner {
                    background-color: #E6003E;
                    height: .1rem;
                    border-radius: .05rem;
          background-color: #e6003e;
          height: 0.1rem;
          border-radius: 0.05rem;
                }
            }
        }
        &_right {
            margin-left: .3rem;
      margin-left: 0.3rem;
            width: 1.4rem;
            height: 1.14rem;
            display: flex;
@@ -253,18 +317,18 @@
            justify-content: space-between;
            .money-info_botton {
                width:  1.4rem;
                height: .42rem;
                line-height: .42rem;
                font-size: .24rem;
        height: 0.42rem;
        line-height: 0.42rem;
        font-size: 0.24rem;
                color: #fff;
                text-align: center;
                &.redBtn {
                    background-color: #E6003E;
                    border-radius: .21rem;
          background-color: #e6003e;
          border-radius: 0.21rem;
                }
                &.blueBtn {
                    background-color: #024DA1;
                    border-radius: .21rem;
          background-color: #024da1;
          border-radius: 0.21rem;
                }
            }
        }
@@ -272,7 +336,7 @@
    .money-detail {
        position: relative;
        &_title {
            padding: .3rem 0;
      padding: 0.3rem 0;
            display: flex;
            justify-content: space-between;
        }
@@ -284,91 +348,90 @@
                display: flex;
                width: 50%;
                .acc-item{
                    margin-left: .2rem;
                    margin-bottom: .3rem;
          margin-left: 0.2rem;
          margin-bottom: 0.3rem;
                }
                .acc-item_title {
                    font-size: .24rem;
          font-size: 0.24rem;
                    color: #fff;
                    line-height: .3rem;
                    margin-bottom: .2rem;
          line-height: 0.3rem;
          margin-bottom: 0.2rem;
                }
                .acc-item_num {
                    font-size: .3rem;
                    color: #E6003E;
          font-size: 0.3rem;
          color: #e6003e;
                    font-family: lightnumber;
                }
            }
        }
    }

  }
  .funds-list {
    display: block;
    width: 6.9rem;
    margin:.3rem;
    padding: .12rem .2rem .12rem .2rem;
    background-color: #1F2636;
    border-radius: .1rem;
  margin: 0.3rem;
  padding: 0.12rem 0.2rem 0.12rem 0.2rem;
  background-color: #1f2636;
  border-radius: 0.1rem;
    &-title {
        text-align: center ;
        padding: .26rem 0;
    padding: 0.26rem 0;
        color: #fff;
        font-size: .25rem;
    font-size: 0.25rem;
        font-weight: bold;
    }
    &-item {
        padding: .45rem .16rem;
    padding: 0.45rem 0.16rem;
        border-top: 1px solid #fff2;
        &__title {
            display: flex;
            justify-content: space-between;
            margin-bottom: .35rem;
      margin-bottom: 0.35rem;
            &-left {
                font-size: .3rem;
        font-size: 0.3rem;
                .zhishu {
                    font-size: .2rem;
          font-size: 0.2rem;
                    color: #fff;
                    padding: .05rem .15rem;
          padding: 0.05rem 0.15rem;
                    background-image: url(../../assets/ico/zhishu.png);
                    background-size: 100% 100%;
                }
            }
            &-right {
                font-size: .24rem;
        font-size: 0.24rem;
            }
        }
        .account {
            padding: 0;
            .order-title {
                color: #AAAAAA;
                font-size: .24rem;
                margin-bottom: .1rem;
        color: #aaaaaa;
        font-size: 0.24rem;
        margin-bottom: 0.1rem;
            }
            .order-money {
                color: #fff;
                font-size: .24rem;
                margin-bottom: .13rem;
        font-size: 0.24rem;
        margin-bottom: 0.13rem;
            }
            .peizi {
                height: .34rem;
                background-color: #138EB4;
                border-radius: .17rem;
        height: 0.34rem;
        background-color: #138eb4;
        border-radius: 0.17rem;
                text-align: center;
                width: 1.26rem;
                line-height: .35rem;
        line-height: 0.35rem;
            }
        }
    }
    &-loadmore {
        height: .67rem;
        line-height: .67rem;
    height: 0.67rem;
    line-height: 0.67rem;
        text-align: center;
        font-size: .27rem;
    font-size: 0.27rem;
        color: #fff;
        background-color: #494951;
        border-radius: 3px;
        margin-bottom: .4rem;
    margin-bottom: 0.4rem;
    }
  }
  .red-theme {
@@ -398,14 +461,14 @@
                  color: #000;
              }
              .account .peizi {
                  background-color: #BC1816;
        background-color: #bc1816;
                  color: #fff;
              }
          }
      }

      .funds-list-loadmore {
          background-color: #BC1816;
    background-color: #bc1816;
      }
  }
</style>