1112

DESKTOP-CVS3R96\我恁爹

2022-11-12 8ac736966cb9748724123373cf517c19d79b8f70

1112

 src/axios/api.js

@@ -8,25 +8,6 @@
export function getProductSetting (options) {
  return post('/api/admin/getProductSetting.do', options)
}
// 申购
export function xingusg (options) {
  return get('/new/public/index.php/api/Newlist/index', options)
}
// 申购提交
export function xingusgs (options) {
  return post('/new/public/index.php/api/Lists/add', options)
}

//新股冻结资金
export function getprice (options) {
  return get('/new/public/index.php/api/Lists/getprice', options)
}


// 申购提交列表
export function xingusgsList (options) {
  return get('/new/public/index.php/api/Lists/index', options)
}

// 登录
export function login (options) {
@@ -159,6 +140,16 @@
  return post('/user/list.do', options)
}

// 新股申购
export function getNewAdd (options) {
  return post('/user/add.do', options)
}

// 申购列表
export function getUserNewGuList (options) {
  return post('/user/getOneSubscribeByUserId.do', options)
}

// 期货下单
export function buyFutures (options) {
  return post('/user/buyFutures.do', options)
@@ -169,6 +160,10 @@
  return post('/user/addOrder.do', options)
}

// 删除挂单
export function delGuaDan (options) {
  return post('/user/delOrder.do', options)
}
// 挂单列表
export function getorderList (options) {
  return post('/user/orderList.do', options)

 src/components/foot.vue

@@ -26,12 +26,12 @@
      </div>
      <div :class="$store.state.select == '/warehouse'?'blueFont':''">仓位</div>
    </div>
    <div :class="touch==4?'footDemos':'footDemo'" @click="goRouter('/newUser',4)">
    <div :class="touch==4?'footDemos':'footDemo'" @click="goRouter('/user',4)">
      <div class="footImgDeft">
        <img v-show="$store.state.select == '/newUser'" src="~@/assets/foot/mine_selected.png" />
        <img v-show="$store.state.select != '/newUser'" src="~@/assets/foot/tab_main_mine_default.png" />
        <img v-show="$store.state.select == '/user'" src="~@/assets/foot/mine_selected.png" />
        <img v-show="$store.state.select != '/user'" src="~@/assets/foot/tab_main_mine_default.png" />
      </div>
      <div :class="$store.state.select == '/newUser'?'blueFont':''">我的</div>
      <div :class="$store.state.select == '/user'?'blueFont':''">我的</div>
    </div>
  </div>
</template>

 src/page/funds/xingu.vue

@@ -1,469 +0,0 @@
<template>
    <div class="wrapper">

        <div class="funds-list">
            <div style="display: flex;width: 80%;justify-content: space-between;margin: 0 auto;">
                <div class="funds-list-title" @click="shengouuu">
                    申购
                </div>
                <div class="funds-list-title" @click="shengoulist">
                    申购列表
                </div>
            </div>
            <div class="funds-list-item" v-for="(i, k) in shengou" :key="k" v-if="aaa == 'aaa' && i.zt == 1">
                <div class="funds-list-item__account clearfix" style="display: flex;align-items: center;">
                    <div class="col-xs-3 account">
                        <!-- 配资资金：17.63 股票可用金额：17.63 配资管理费：已结束 -->
                        <div class="order-title">新股名称</div>
                        <div class="order-money">{{i.names || 0}}</div>
                    </div>
                    <div class="col-xs-3 account">
                       
                        <div class="order-title">发行价格</div>
                        <div class="order-money">{{i.price || 0}}</div>
                    </div>
                    <div class="col-xs-3 account">
                        <!-- 保证金：100 股票市值：0 股票盈亏：0  -->
                        <div class="order-title">申购代码</div>
                        <div class="order-money">{{i.code || 0}}</div>
                    </div>
                    <div class="col-xs-3 account" >
                        <!-- <div class="order-title">状态</div>
                        <div class="order-money">
                            <span v-if="i.zt==0">已关闭</span>
                            <span v-if="i.zt==1">已开启</span>
                        </div> -->
                        <div class="peizi" @click="shengouclik(i)" >
                            申购
                        </div>
                    </div>
                </div>
            </div>
            <div class="funds-list-item" v-for="(item,index) in sgList" :key="index" v-if="aaa == 'bbb'">
                <div class="funds-list-item__account clearfix">
                    <div class="col-xs-4 account">
                        <!-- 配资资金：17.63 股票可用金额：17.63 配资管理费：已结束 -->
                        <div class="order-title">新股名称</div>
                        <div class="order-money">{{item.xgname || 0}}</div>
                        <div class="order-title">保证金</div>
                        <div class="order-money">{{item.bzj|| 0}}</div>
                    
                    </div>
                    <div class="col-xs-4 account">
                        <!-- 保证金：100 股票市值：0 股票盈亏：0  -->
                        <div class="order-title">申购代码</div>
                        <div class="order-money">{{item.codes || 0}}</div>
                        <div class="order-title">买入数量</div>
                        <div class="order-money">{{item.nums || 0}}</div>
                    </div>
                    <div class="col-xs-4 account">
                        <div class="order-title">状态</div>
                        <div class="order-money">
                            <span v-if="item.zts==3">未审核</span>
                            <span v-if="item.zts==1">已中签</span>
                            <span v-if="item.zts==2">未中签</span>
                        </div>
                    </div>
                </div>
            </div>
            <!-- <div class="funds-list-loadmore">
                点击加载更多内容
            </div> -->
            <el-dialog show-close :visible.sync="dialogCommunity" width="80%">
                <div class="storeinformation_popup">
                    <el-form :model="haoForm" ref="haoForm" class="demo-form">
                        <div class="storeinformation_popup_top">
                            <el-form-item>
                                <el-input type="text" v-model="haoForm.shehao" placeholder="请填写申购数量"
                                    show-word-limit oninput="value=value.replace(/[^\d]/g,'')">
                                </el-input>
                            </el-form-item>
                        </div>
                        <el-form-item style="text-align:center;">
                            <el-button @click="dialogCommunity = false">取 消</el-button>
                            <el-button type="primary" @click="shengData()"
                                style="background-color: #fff !important;color:#333 !important;border-color:#DCDFE6 !important;">
                                确 定
                            </el-button>
                        </el-form-item>
                    </el-form>
                </div>
            </el-dialog>
        </div>
    </div>
</template>

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

    export default {
        data() {
            return {
                list: {
                    list: []
                },
                aaa: 'aaa',
                shengou: "",
                dialogCommunity: false,
                haoForm: {
                    shehao: ''
                },
                tijiao: '',
                sgList: ''
            }
        },
        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
            // }
        },
        created() {
            this.getlist()
            this.xxxx();
        },
        methods: {
            async shengouclik(i) {
                this.dialogCommunity = true
                this.tijiao = i
                console.log(i)
            },
            async shengouuu() {
                this.aaa = 'aaa'
            },
            async shengoulist() {
                this.aaa = 'bbb'
                this.shengouList();
            },
            async getlist() {
                // 获取持仓列表
                let opt = {
                    userId: 0,
                    pageNum: this.pageNum,
                    pageSize: this.pageSize
                }
                console.log(opt)
                let data = await api.getUserApplyList(opt)
                if (data.status === 0) {
                    this.list = data.data
                }

            },
            async xxxx() {
                // 获取持仓列表
                let opt = {};
                let data = await api.xingusg(opt);
                this.shengou = data.data.list;
                console.log(this.shengou, "申购");
            },
            async shengData() {
                // 获取持仓列表
                var timestamps = (new Date()).getTime();
                let opt = {
                    sgname: this.tijiao.names,
                    sgdaima: this.tijiao.code,
                    sgprice: this.tijiao.price,
                    sgsumber: this.haoForm.shehao,
                    tmes: timestamps,
                };
                console.log(opt);
                let data = await api.xingusgs(opt);
                this.shengoutijiao = data.data.list;
                console.log(this.shengoutijiao, "申购提交");
                this.dialogCommunity = false
                if (data.status == 200) {
                    this.$message({
                        message: data.msg,
                        type: 'success'
                    });
                } else {
                    this.$message({
                        message: data.msg,
                        type: 'warning'
                    });
                }
            },
            async shengouList() {
                let opt = {};
                let data = await api.xingusgsList(opt);
                this.sgList = data.data.list;
                // this.timestampToTime()
                console.log(this.sgList)
            },
        },

    }
</script>

<style lang="less" scoped>
    .funds-list-item {
        padding: 0.2rem 0.16rem 0.45rem !important;
    }

    body {
        background-color: #16171d;
    }

    .wrapper {
        padding-bottom: 0;
    }

    .funds-info {
        display: block;
        width: 6.9rem;
        margin: .3rem;
        padding: .6rem .2rem .12rem .2rem;
        background-color: #1F2636;
        border-radius: .1rem;

        .money-info {
            padding-bottom: .42rem;
            display: flex;
            justify-content: space-between;
            border-bottom: 1px solid #fff2;

            &_left {
                flex: 1;
                position: relative;
                display: flex;
                flex-direction: column;
                justify-content: space-between;

                .money-info_total {
                    height: .4rem;
                    display: flex;
                    align-items: center;

                    .ino-ico {
                        width: .38rem;
                        height: .38rem;
                        margin-right: .15rem;
                    }

                    .ino-title {
                        font-size: .24rem;
                        margin-right: .15rem;
                    }

                    .ino-money {
                        font-size: .4rem;
                        color: #009C46;
                        letter-spacing: 0;
                        font-family: lightnumber;
                    }
                }

                .money-info_progress {
                    width: 100%;
                    height: .1rem;
                    border-radius: .05rem;
                    background-color: #4E5A73;

                    &__inner {
                        background-color: #E6003E;
                        height: .1rem;
                        border-radius: .05rem;
                    }
                }
            }

            &_right {
                margin-left: .3rem;
                width: 1.4rem;
                height: 1.14rem;
                display: flex;
                flex-direction: column;
                justify-content: space-between;

                .money-info_botton {
                    width: 1.4rem;
                    height: .42rem;
                    line-height: .42rem;
                    font-size: .24rem;
                    color: #fff;
                    text-align: center;

                    &.redBtn {
                        background-color: #E6003E;
                        border-radius: .21rem;
                    }

                    &.blueBtn {
                        background-color: #024DA1;
                        border-radius: .21rem;
                    }
                }
            }
        }

        .money-detail {
            position: relative;

            &_title {
                padding: .3rem 0;
                display: flex;
                justify-content: space-between;
            }

            &_acc {
                display: flex;
                flex-wrap: wrap;

                .acc {
                    padding: 0;
                    display: flex;
                    width: 50%;

                    .acc-item {
                        margin-left: .2rem;
                        margin-bottom: .3rem;
                    }

                    .acc-item_title {
                        font-size: .24rem;
                        color: #fff;
                        line-height: .3rem;
                        margin-bottom: .2rem;
                    }

                    .acc-item_num {
                        font-size: .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;

        &-title {
            text-align: center;
            padding: .26rem 0;
            color: #fff;
            font-size: .25rem;
            font-weight: bold;
        }

        &-item {
            padding: .45rem .16rem;
            border-top: 1px solid #fff2;

            &__title {
                display: flex;
                justify-content: space-between;
                margin-bottom: .35rem;

                &-left {
                    font-size: .3rem;

                    .zhishu {
                        font-size: .2rem;
                        color: #fff;
                        padding: .05rem .15rem;
                        background-image: url(../../assets/ico/zhishu.png);
                        background-size: 100% 100%;
                    }
                }

                &-right {
                    font-size: .24rem;
                }
            }

            .account {
                padding: 0;

                .order-title {
                    color: #AAAAAA;
                    font-size: .24rem;
                    margin-bottom: .1rem;
                    margin-top: .4rem;
                    text-align:center;
                }

                .order-money {
                    color: #fff;
                    font-size: .24rem;
                    margin-bottom: .13rem;
                    text-align: center;
                }

                .peizi {
                    height: .34rem;
                    background-color: #138EB4;
                    border-radius: .17rem;
                    text-align: center;
                    width: 1.26rem;
                    line-height: .35rem;
                }
            }
        }

        &-loadmore {
            height: .67rem;
            line-height: .67rem;
            text-align: center;
            font-size: .27rem;
            color: #fff;
            background-color: #494951;
            border-radius: 3px;
            margin-bottom: .4rem;
        }
    }

    .red-theme {
        .funds-info {
            background-color: #fff;

            .ino-title {
                color: #000;
            }

            .acc-item_title {
                color: #000 !important;
            }
        }

        .funds-list {
            background-color: #fff;

            &-title {
                color: #000;
            }

            &-item {
                border-top-color: #2222;

                &__title-left {
                    color: #222;
                }

                .account .order-title {
                    color: #666666;
                }

                .account .order-money {
                    color: #000;
                }

                .account .peizi {
                    background-color: #BC1816;
                    color: #fff;
                }
            }
        }

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

 src/page/home/home.vue

@@ -335,13 +335,13 @@
    goJy(index){
      switch (index) {
        case 0:
          this.$router.push('/list');
          this.$router.push('/trading-list');
          break;
          case 1:
          this.$router.push('/orderlist');
          this.$router.push('/warehouse');
          break;
          case 2:
          //this.$router.push();
          this.$router.push({path:'/trading-list',query:{listid:3}});
          break;
          case 3:
          this.$router.push('/user');

 src/page/list/trading-list.vue

@@ -44,8 +44,8 @@
              <span>{{ '最新价' }}</span>
            </div>
            <div class="item_title applies">
              <span v-show="tabsItemIndex!=3">{{ '涨跌幅' }}</span>
              <span v-show="tabsItemIndex==3" style="width: 100%;text-align: center;">{{ '最大数量' }}</span>
              <span v-show="tabsItemIndex != 3">{{ '涨跌幅' }}</span>
              <span v-show="tabsItemIndex == 3" style="width: 100%;text-align: center;">{{ '申购类型' }}</span>
            </div>
          </div>
          <div class="list" :class="isToken == '' ? 'listHeight' : 'listHeights'">
@@ -55,70 +55,78 @@
                <div class="list_items">
                  <div class="item" v-for="(item, index) in listArr" :key="index"
                    @click="handleGoToKlineDetail(item, index)">
                    <div class="left_title">
                      <div class="tp">
                        <span class="collection" @click.stop="options(item)">
                          <span v-show="tabsItemIndex!=3" class="shu" :class="item.isOption == '1' ? 'shublue' : ''"></span>
                          <span v-show="tabsItemIndex==3" class="shu hongse"></span>
                        </span>
                        <span class="title_color">
                          {{ tabsItemIndex == 3 ? item.name : tabsItemIndex ==
                              2 ? item.name : tabsItemIndex == 0 ? item.name : item.indexName
                          }}
                        </span>
                    <div v-if="(tabsItemIndex == 3 && item.zt == 0) || tabsItemIndex != 3">
                      <div class="left_title">
                        <div class="tp">
                          <span class="collection" @click.stop="options(item)">
                            <span v-show="tabsItemIndex != 3" class="shu"
                              :class="item.isOption == '1' ? 'shublue' : ''"></span>
                            <span v-show="tabsItemIndex == 3" class="shu hongse"></span>
                          </span>
                          <span class="title_color">
                            {{ tabsItemIndex == 3 ? item.name : tabsItemIndex ==
                                2 ? item.name : tabsItemIndex == 0 ? item.name : item.indexName
                            }}
                          </span>
                        </div>
                        <div class="bt">
                          <span>
                            {{ tabsItemIndex == 3 ? item.stockType + item.code : tabsItemIndex == 2 ? item.gid :
                                tabsItemIndex
                                  ==
                                  0 ? item.gid : item.indexCode
                            }}
                          </span>
                        </div>
                      </div>
                      <div class="bt">
                        <span>
                          {{ tabsItemIndex == 3 ? item.code : tabsItemIndex == 2 ? item.code : tabsItemIndex
                              ==
                              0 ? item.code : item.indexCode
                          }}
                        </span>
                      <div class="center_price">
                        <div class="tp">
                          <span class="price_color" v-if="tabsItemIndex == 0 || tabsItemIndex == 2"
                            :class="item.hcrate > 0 ? 'green' : 'red'">
                            {{ item.nowPrice
                            }}
                          </span>
                          <span class="price_color" v-else>
                            {{ tabsItemIndex == 3 ? Number(item.price).toFixed(2) :
                                item.currentPoint
                            }}
                          </span>
                        </div>
                        <div class="bt">
                          <span v-if="tabsItemIndex == 3 || tabsItemIndex == 1">{{ tabsItemIndex == 3 ? 'Max:' +
                              Number(item.orderNumber) : '手续费:' + Number(item.transFee)
                          }}</span>
                          <span v-else>{{ item.today_min }}</span>
                        </div>
                      </div>
                    </div>
                    <div class="center_price">
                      <div class="tp">
                        <span class="price_color" v-if="tabsItemIndex == 0 || tabsItemIndex == 2"
                          :class="item.hcrate > 0 ? 'green' : 'red'">
                          {{ item.nowPrice
                          }}
                        </span>
                        <span class="price_color" v-else>
                          {{ tabsItemIndex == 3 ? Number(item.price).toFixed(2) :
                              item.currentPoint
                          }}
                        </span>
                      </div>
                      <div class="bt">
                        <span v-if="tabsItemIndex == 3 || tabsItemIndex == 1">{{ tabsItemIndex == 3? '' :'手续费:' + Number(item.transFee) }}</span>
                        <span v-else>{{ item.today_min }}</span>
                      </div>
                    </div>
                    <div class="right_bs">
                      <div class="tp">
                        <span class="price_color" v-if="tabsItemIndex == 0 || tabsItemIndex == 2"
                          :class="item.hcrate > 0 ? 'green' : 'red'">{{ item.hcrate }}</span>
                        <span class="price_color" v-if="tabsItemIndex == 1"
                          :class="item.floatRate > 0 ? 'green' : 'red'">
                          {{
                              item.floatRate + '%'
                          }}
                        </span>
                        <!-- <span class="price_color" v-if="tabsItemIndex == 3"
                      <div class="right_bs">
                        <div class="tp">
                          <span class="price_color" v-if="tabsItemIndex == 0 || tabsItemIndex == 2"
                            :class="item.hcrate > 0 ? 'green' : 'red'">{{ item.hcrate }}</span>
                          <span class="price_color" v-if="tabsItemIndex == 1"
                            :class="item.floatRate > 0 ? 'green' : 'red'">
                            {{
                                item.floatRate + '%'
                            }}
                          </span>
                          <!-- <span class="price_color" v-if="tabsItemIndex == 3"
                          :class="((item.nowPrice - item.lastClose) / item.lastClose * 100).toFixed(2) > 0 ? 'green' : 'red'">
                          {{
                              item.lastClose == "" ? 0.00 : ((Number(item.nowPrice) - Number(item.lastClose)) /
                                Number(item.lastClose) * 100).toFixed(2) + '%'
                          }}
                        </span> -->
                        <span v-if="tabsItemIndex == 3" class="price_color" style="text-align: center;width: 100%;">
                          {{item.orderNumber}}
                        </span>
                          <div v-if="tabsItemIndex == 3" :class="item.type == 1 ? 'xgsgType' : 'xgsgTypeRed'">
                            <!-- {{item.orderNumber}} -->
                            {{ item.type == 1 ? '新股申购' : '线下配售' }}
                          </div>
                        </div>
                        <div class="bt">
                          <div v-if="tabsItemIndex != 1 && tabsItemIndex != 3">{{ item.preclose_px }}</div>
                          <!-- class="codeIcon"  item.stock_type.toUpperCase()-->
                        </div>
                      </div>
                      <div class="bt">
                        <div v-if="tabsItemIndex != 1 && tabsItemIndex != 3">{{ item.stock_type.toUpperCase() }}</div>
                        <!-- class="codeIcon" -->
                      </div>

                    </div>
                  </div>
                </div>
@@ -215,15 +223,18 @@
                  {{ '¥' + $store.state.userInfo.userIndexAmt
                  }}
                </span>
                <span v-if="$store.state.userInfo.userAmt != undefined && tabsItemIndex == 0" style="white-space: nowarp;">
                <span v-if="$store.state.userInfo.userAmt != undefined && tabsItemIndex == 0"
                  style="white-space: nowarp;">
                  {{ '¥ ' + $store.state.userInfo.userAmt
                  }}
                </span>
                <span v-if="$store.state.userInfo.userAmt != undefined && tabsItemIndex == 2" style="white-space: nowarp;">
                <span v-if="$store.state.userInfo.userAmt != undefined && tabsItemIndex == 2"
                  style="white-space: nowarp;">
                  {{ '¥ ' + $store.state.userInfo.userAmt
                  }}
                </span>
                <span v-if="$store.state.userInfo.userAmt != undefined && tabsItemIndex == 3" style="white-space: nowarp;">
                <span v-if="$store.state.userInfo.userAmt != undefined && tabsItemIndex == 3"
                  style="white-space: nowarp;">
                  {{ '¥ ' + $store.state.userInfo.userAmt
                  }}
                </span>
@@ -295,7 +306,7 @@
                      $store.state.userInfo.allIndexFreezAmt) * indexSettingInfo.forceSellPercent).toFixed(2)
                }}
              </span>
              <span v-show="tabsItemIndex == 0||tabsItemIndex == 3">
              <span v-show="tabsItemIndex == 0 || tabsItemIndex == 3">
                {{ $store.state.hide ? '****' : Number(($store.state.userInfo.enableAmt
                    +
                    $store.state.userInfo.allFreezAmt) * settingInfo.forceStopPercent).toFixed(2)
@@ -331,7 +342,7 @@
          <div class="bottom_price">
            <div>
              <span v-show="tabsItemIndex == 1">{{ '¥ ' + $store.state.userInfo.userIndexAmt }}</span>
              <span v-show="tabsItemIndex == 0||tabsItemIndex == 3">{{ '¥ ' + $store.state.userInfo.userAmt }}</span>
              <span v-show="tabsItemIndex == 0 || tabsItemIndex == 3">{{ '¥ ' + $store.state.userInfo.userAmt }}</span>
              <span v-show="tabsItemIndex == 2">{{ '¥ ' + $store.state.userInfo.userAmt }}</span>
              <!-- <span v-show="tabsItemIndex == 3">{{ '¥ ' + $store.state.userInfo.userFuturesAmt }}</span> -->
            </div>
@@ -346,7 +357,7 @@
          <div class="bottom_price">
            <div>
              <span v-show="tabsItemIndex == 1">{{ '¥ ' + $store.state.userInfo.enableIndexAmt }}</span>
              <span v-show="tabsItemIndex == 0||tabsItemIndex == 3">{{ '¥ ' + $store.state.userInfo.enableAmt }}</span>
              <span v-show="tabsItemIndex == 0 || tabsItemIndex == 3">{{ '¥ ' + $store.state.userInfo.enableAmt }}</span>
              <span v-show="tabsItemIndex == 2">{{ '¥ ' + $store.state.userInfo.enableAmt }}</span>
              <!-- <span v-show="tabsItemIndex == 3">{{ '¥ ' + $store.state.userInfo.enableFuturesAmt }}</span> -->
            </div>
@@ -361,7 +372,8 @@
          <div class="bottom_price">
            <div>
              <span v-show="tabsItemIndex == 1">{{ '¥ ' + $store.state.userInfo.allIndexFreezAmt }}</span>
              <span v-show="tabsItemIndex == 0||tabsItemIndex == 3">{{ '¥ ' + $store.state.userInfo.allFreezAmt }}</span>
              <span v-show="tabsItemIndex == 0 || tabsItemIndex == 3">{{ '¥ ' + $store.state.userInfo.allFreezAmt
              }}</span>
              <span v-show="tabsItemIndex == 2">{{ '¥ ' + $store.state.userInfo.allFreezAmt }}</span>
              <!-- <span v-show="tabsItemIndex == 3">{{ '¥ ' + $store.state.userInfo.allFuturesFreezAmt }}</span> -->
            </div>
@@ -380,7 +392,8 @@
                v-show="tabsItemIndex == 1">{{ '¥ ' + $store.state.userInfo.allIndexProfitAndLose }}</span>
              <span
                :class="$store.state.userInfo.allProfitAndLose > 0 ? ' red' : $store.state.userInfo.allProfitAndLose < 0 ? ' green' : ''"
                v-show="tabsItemIndex == 0||tabsItemIndex == 3">{{ '¥ ' + $store.state.userInfo.allProfitAndLose }}</span>
                v-show="tabsItemIndex == 0 || tabsItemIndex == 3">{{ '¥ ' + $store.state.userInfo.allProfitAndLose
                }}</span>
              <span
                :class="$store.state.userInfo.allProfitAndLose > 0 ? ' red' : $store.state.userInfo.allProfitAndLose < 0 ? ' green' : ''"
                v-show="tabsItemIndex == 2">{{ '¥ ' + $store.state.userInfo.allProfitAndLose }}</span>
@@ -392,10 +405,59 @@
        </div>
      </div>
    </div>

    <!-- 新股弹窗 -->
    <van-popup v-model="settingDialog" position="bottom" :style="{ height: '35%' }" @close="popClose">
      <div class="setting_content">
        <div class="old_password">
          <div class="left_titles">
            <span>{{ '申购数量:' }}</span>
          </div>
          <div class="right_password_input">
            <input type="number" v-model="sgNum" />
          </div>
        </div>
        <div class="btn_setting" @click="changeSg()">
          <span>{{ '立即申购' }}</span>
        </div>
        <div class="shijian">
          <div class="xgsj">

            <div class="sjtlt">申购时间: </div>
            <div class="xgTime" v-if="this.sgsj">{{ this.sgsj | getTimeYear }}</div>
          </div>
          <div class="xgsj">
            <div class="sjtlt">认缴时间: </div>
            <div class="xgTime" v-if="this.rjsj">{{ this.rjsj | getTimeYear }}</div>
          </div>
        </div>
        <!-- <div class="old_password">
          <div class="left_titles">
            <span>{{ '新密码:' }}</span>
          </div>
          <div class="right_password_input">
            <input type="password" v-model="newPassword" />
          </div>
        </div>
        <div class="old_password">
          <div class="left_titles">
            <span>{{ '确认新密码:' }}</span>
          </div>
          <div class="right_password_input">
            <input type="password" v-model="cirNewPassword" />
          </div>
        </div> -->

      </div>
    </van-popup>


  </div>
</template>

<script>
//Toast 
import { Toast } from 'vant';
import * as api from "@/axios/api";
export default {
  name: "trading",
@@ -420,9 +482,15 @@
      loadings: false,
      finished: false,
      finisheds: false,
      settingDialog: false,
      sgNum: 1,
      sgCode: '',
      gpcode: "",
      gpcodes: "",
      texts: "",
      sgsj: "",
      rjsj: "",
      orderNumber: "",
      elAlertShow: false,
      elAlertText: "",
      tabsClassArr: [
@@ -461,10 +529,12 @@
        this.$refs.search.focus();
      });
    }
    if(this.$route.query.listid){
      this.tabsItemIndex = Number(this.$route.query.listid)
    }
  },

  mounted() {
    
    this.loading = true;
    this.getStock();
    this.isToken = window.localStorage.getItem("USERTOKEN");
@@ -508,7 +578,7 @@
      // }
    },
    gpinput() {
      

      this.pageNum = 1;
      this.listArr = [];
      this.loading = true;
@@ -555,7 +625,7 @@
        // this.getProductSetting()
        this.$store.state.userInfo = data.data;
      } else {
        this.$store.commit('elAlertShow',{'elAlertShow':true,'elAlertText': data.msg});
        this.$store.commit('elAlertShow', { 'elAlertShow': true, 'elAlertText': data.msg });
      }
      this.$store.state.user = this.user;
    },
@@ -566,7 +636,7 @@
        // 成功
        this.indexSettingInfo = data.data;
      } else {
        this.$store.commit('elAlertShow',{'elAlertShow':true,'elAlertText': data.msg});
        this.$store.commit('elAlertShow', { 'elAlertShow': true, 'elAlertText': data.msg });
      }
    },
    async getFuturesSetting() {
@@ -576,7 +646,7 @@
        // 成功
        this.futuresSettingInfo = data.data;
      } else {
        this.$store.commit('elAlertShow',{'elAlertShow':true,'elAlertText': data.msg});
        this.$store.commit('elAlertShow', { 'elAlertShow': true, 'elAlertText': data.msg });
      }
    },
    async getSettingInfo() {
@@ -585,7 +655,7 @@
        // 成功
        this.settingInfo = data.data;
      } else {
       ` this.$store.commit('elAlertShow',{'elAlertShow':true,'elAlertText': data.msg});`
        ` this.$store.commit('elAlertShow',{'elAlertShow':true,'elAlertText': data.msg});`
      }
    },
    async getListMarket() {
@@ -663,8 +733,48 @@
        this.alertShow = true;
      }
    },
    popClose() {
      this.sgCode = '';
      this.sgsj = '';
      this.rjsj = '';
      this.orderNumber = '';
    },
    async changeSg() {
      if (!this.sgNum) {
        Toast('数量不能为空');
        return;
      };
      //this.sgNum必须是数字并且不能小于1
      if (this.sgNum < 1) {
        Toast('数量不能小于1');
        return;
      }
      if (this.sgNum > this.orderNumber) {
        Toast('数量不能大于' + this.orderNumber);
        return;
      }

      let opt = {
        newCode: this.sgCode,
        applyNums: this.sgNum,
        phone: this.$store.state.userInfo.phone,
      };
      let data = await api.getNewAdd(opt);
      if (data.status === 0) {
        this.sgShow = false;
        this.sgCode = '';
        this.sgsj = '';
        this.rjsj = '';
        this.orderNumber = '';
        Toast('申购成功');
        this.$router.push({ path: '/warehouse?index=3' });
      } else {
        Toast(data.msg);
      }

    },
    handleGoToKlineDetail(item) {
      

      var codes = "";
      var names = "";
      var stock_type = "";
@@ -693,7 +803,11 @@
          if_zhishu = '0';
          break;
        case 3:

          this.sgCode = item.code;
          this.sgsj = item.subscribeTime;
          this.rjsj = item.subscriptionTime;
          this.orderNumber = item.orderNumber;
          this.settingDialog = true;
          return;
          codes = item.futuresGid;
          names = item.futuresName;
@@ -728,8 +842,8 @@
    async getFutures() {
      // 获取期货列表
      let opt = {
        
        


      };
      let data = await api.getNewGu(opt);
      this.loading = false;
@@ -814,7 +928,6 @@
      this.pageNum = 1;
      this.finished = false;
      this.loading = true;
      console.log(item.type,"阿斯顿八岁的跟随阿达");
      switch (item.type) {
        case 1:
          this.listArr = [];
@@ -993,6 +1106,35 @@
      }
      //17:35:2922-06-2022
      return h + ":" + m + ":" + c;
    },
    getTimeYear(time) {
      if (!time) {
        return "";
      }
      var nd = new Date(time);
      var y = nd.getFullYear();
      var mm = nd.getMonth() + 1;
      var d = nd.getDate();
      var h = nd.getHours();
      var m = nd.getMinutes();
      var c = nd.getSeconds();
      if (mm < 10) {
        mm = "0" + mm;
      }
      if (d < 10) {
        d = "0" + d;
      }
      if (h < 10) {
        h = "0" + h;
      }
      if (m < 10) {
        m = "0" + m;
      }
      if (c < 10) {
        c = "0" + c;
      }
      //17:35:2922-06-2022
      return y + '-' + mm + '-' + d + ' ' + h + ":" + m + ":" + c;
    }
  }
};
@@ -1081,7 +1223,7 @@
  position: fixed;
  background: #fff;
  top: 0;
  z-index: 9999999;
  z-index: 2000;
  transition: all 0.5s;
  overflow: hidden;
  border-radius: 0 0 0.2rem 0.2rem;
@@ -1227,19 +1369,25 @@
      margin: 0.5rem 0;

      >div {
        width: 100%;
        height: 1.0256rem;
        display: flex;

        >div {
          display: flex;
          align-items: center;
        }
          >div {
            display: flex;
            align-items: center;
          }

        .tp {
          width: 100%;
          height: 70%;
        }
          .tp {
            width: 100%;
            height: 70%;
          }

        .bt {
          width: 100%;
          height: 30%;
          .bt {
            width: 100%;
            height: 30%;
          }
        }
      }
    }
@@ -1526,8 +1674,140 @@
/deep/.van-list__loading {
  margin-top: 0.2rem;
}
.hongse{

  background-color: #4d73b1!important;
.hongse {

  background-color: #4d73b1 !important;
}

.xgsgType {
  position: relative;
  top: 30%;
  left: 0;
  right: 0;
  margin: auto;
  width: 85%;
  height: 80%;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 0.1rem;
  background-color: rgba(102, 204, 153, 0.1);
  border: 0.04rem solid #5CE398;
  color: #5CE398;
}

.xgsgTypeRed {
  position: relative;
  top: 30%;
  left: 0;
  right: 0;
  margin: auto;
  width: 85%;
  height: 80%;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 0.1rem;
  background-color: rgba(223, 59, 59, 0.062);
  border: 0.04rem solid rgb(231, 61, 61);
  color: rgb(231, 61, 61);
}

.setting_content {
  width: 100%;
  height: 5rem;
  padding: 0.3rem;

  .old_password {
    width: 100%;
    height: 1.6rem;
    background: rgb(243, 243, 243);
    border-radius: 0.15rem;
    display: flex;
    margin-top: 0.8rem;

    .left_titles {
      margin-left: 0.2rem;
      width: 25%;
      height: 100%;
      display: flex;
      align-items: center;
      padding-left: 0.2rem;
      font-size: 0.3975rem;

      // justify-content: flex-end;
      span {
        font-weight: 600;
        letter-spacing: 0.04rem;
      }
    }

    .right_password_input {
      width: 75%;
      height: 100%;
      display: flex;
      align-items: center;

      input {
        width: 100%;
        height: 100%;
        padding-left: 0.2rem;
        border-radius: 0 0.2rem 0.2rem 0;
        font-size: 0.3975rem;
        font-weight: 600;
        //文字间距
        letter-spacing: 0.04rem;
      }
    }
  }

  .btn_setting {
    width: 100%;
    height: 1.3rem;
    border-radius: 0.15rem;
    background: #2d6ae9;
    color: #fff;
    font-size: 0.4615rem;
    margin-top: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;

    span {
      font-weight: 600;
    }
  }
}

.shijian {
  width: 100%;
  height: 1.6rem;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.xgsj {
  font-size: 0.3875rem;
  font-weight: 600;
  display: flex;
  height: 50%;
  align-items: center;

}

.sjtlt {
  width: 25%;
  margin-left: 0.4rem;
}

.xgTime() {
  width: 75%;
}

/deep/.van-popup {
  border-radius: 0.2rem 0.2rem 0 0;
}
</style>

 src/page/trading/buy.vue

@@ -369,7 +369,6 @@
        return;
      }
        this.buying = true
        console.log(this.tabsCurrentIndex,"啊是对啊是给丢啊施工队啊收到过")
      let opts={
        stockId:this.code,
        buyNum:this.num * 100,
@@ -393,7 +392,7 @@
      if (data.status === 0) {
          this.$store.commit('elAlertShow',{'elAlertShow':true,'elAlertText': data.msg,'elAlertType':'success'});
          this.getUserInfo()
          this.$router.push('/orderlist?index=2')
          this.$router.push('/warehouse?index=1')
        } else {
          this.$store.commit('elAlertShow',{'elAlertShow':true,'elAlertText': data.msg});
        }

 src/page/user/Warehouse.vue

@@ -144,7 +144,7 @@
              <div class="title_items" v-for="(item, index) in   tabsArr" :key="index"
                @click="handleTabsClick(item, index)" :class="index == 0 ? 'kuan' : 'kuan'">
                <span :class="tabsCurrentIndex === index ? 'active' : ''">{{ item }}{{ index == 0 ? '(' + total + ')' : index == 1 ? '(' + totalss + ')' : 
                    '(' + totals + ')'
                    index == 2 ?  '(' + totals + ')' : '(' + xgTotal + ')'
                }}</span>
              </div>
            </div>
@@ -194,7 +194,7 @@
                <div class="waiting_box">
                  <div class="img_cont">
                    <img src="../../assets/img/zhaobudao.png" alt />
                    <span class="gd">{{ '当前无挂单' }}</span>
                    <span class="gd">{{ '当前无持仓' }}</span>
                    <div class="trading" @click="$router.push('/trading-list')">
                      <span>{{ '开始交易' }}</span>
                    </div>
@@ -204,7 +204,7 @@




              <!-- 挂单 -->
              <div class="waiting" v-if="totalss == 0 && tabsCurrentIndex === 1">
                <div class="waiting_box">
                  <div class="img_cont">
@@ -246,7 +246,7 @@
                        <span>{{ '当前价格' }}</span>
                      </div>
                    </div>
                    <div class="right_btn">
                    <div class="right_btn" @click="gdClose(item)">
                      <span>{{ '撤销' }}</span>
                    </div>
                  </div>
@@ -256,12 +256,12 @@




              <!-- 平仓 -->
              <div class="waiting" v-if="totals == 0 && tabsCurrentIndex === 2">
                <div class="waiting_box">
                  <div class="img_cont">
                    <img src="../../assets/img/zhaobudao.png" alt />
                    <span class="gd">{{ '当前无挂单' }}</span>
                    <span class="gd">{{ '当前无平仓' }}</span>
                    <div class="trading" @click="$router.push('/trading-list')">
                      <span>{{ '开始交易' }}</span>
                    </div>
@@ -291,6 +291,56 @@
                  </div>
                </div>
              </van-list>
              <!-- 新股 -->
              <div class="waiting" v-if="xgTotal == 0 && tabsCurrentIndex === 3">
                <div class="waiting_box">
                  <div class="img_cont">
                    <img src="../../assets/img/zhaobudao.png" alt />
                    <span class="gd">{{ '当前无申购' }}</span>
                    <div class="trading" @click="$router.push({path:'/trading-list',query:{listid:3}})">
                      <span>{{ '开始交易' }}</span>
                    </div>
                  </div>
                </div>
              </div>
              <van-list v-model="loadingXg" :finished="finishedXg" finished-text="没有更多了"
                v-show="tabsCurrentIndex === 3 && xgTotal != 0" @load="onLoadXg" :immediate-check="immediate">
                <div class="tabs_o">
                  <div class="tabs_o_items" v-for="(item, index) in tabsXgArr" :key="item.id">
                    <div class="tabs_o_title">
                      <span class="title">{{ item.newName }}</span>
                      <span class="buy_to_sell" :class="item.type == 0 ? 'maichu' : 'mairu'">{{
                          item.type == 0 ? '线下配售' : '新股申购'
                      }}</span>
                      <!-- <span class="multiple">{{ item.lever  }}X</span>
                      <span class="nums">{{ item.buyNum / 100 + '手' }}</span> -->
                    </div>
                    <div class="center_price">
                      
                      <div class="start_price jiantou">
                        <span>{{ item.buyPrice }}</span>
                      </div>
                      <div class="new_price">
                        <span>{{ item.applyNums }}</span>
                      </div>
                    </div>
                    <div class="bottom_price_title">
                     
                      <div class="start_price">
                        <span>{{ '申购价格' }}</span>
                      </div>
                      <div class="new_price">
                        <span>{{ '申购数量' }}</span>
                      </div>
                    </div>
                    <div class="right_btn" @click="zcsg(item)">
                      <span>{{ '新股申购' }}</span>
                    </div>
                  </div>
                </div>
              </van-list>


            </div>

          </div>
@@ -302,11 +352,12 @@
</template>

<script>
 import { Toast } from 'vant';
import * as api from "@/axios/api";
export default {
  data() {
    return {
      tabsArr: ["持仓", "挂单", "已平仓"],
      tabsArr: ["持仓", "挂单", "已平仓","新股"],
      tabsCurrentIndex: 0,
      titleName: "沪深京账户",
      indexSettingInfo: {},
@@ -329,7 +380,11 @@
      immediate: false,
      loadings: false,
      loadingss:false,
      tabsOrderList:[]
      tabsOrderList:[],
      xgTotal:0,
      tabsXgArr:[],
      loadingXg:false,
      finishedXg:false,
    };
  },
  mounted() {
@@ -340,6 +395,14 @@
    this.getFuturesSetting();
    this.getListDetails();
    this.getorderList();
    this.getNewXg();
  },
  created() {
    if(this.$route.query.index){
      this.tabsCurrentIndex = Number(this.$route.query.index)
    }

    
  },
  methods: {
    onLoad() {
@@ -371,6 +434,51 @@
        default:
          break;
      }
    },
    onLoadXg() {
      this.getNewXg();
    },
    async gdClose(item){
      let opts = {
        id:item.id
      }
      let data = await api.delGuaDan(opts)
      if(data.status == 1){
        Toast('撤单成功')
        this.page = 1;
      this.pages = 1;
      this.finished = false;
      this.finisheds = false;
      this.tabsPositionNumArr = [];
      this.tabsPcArr = [];
        switch (this.titleIndex) {
        case 0:
          this.titleName = "沪深京账户";
          this.getListDetail();
          this.getListDetails();
          this.getorderList();
          break;
        case 1:
          this.titleName = "指数账户";
          this.getzhishuListDetail();
          this.getzhishuListDetails();
          this.getorderList();
          break;
        case 2:
          this.titleName = "期货账户";
          this.getQhListDetail();
          this.getQhListDetails();
          this.getorderList();
          break;
        default:
          break;
      }
      }else{
        Toast(data.msg)
      }
    },
    zcsg(item){
      this.$router.push({path:'/trading-list',query:{listid:3}})
    },
    SetTitleIndex(index) {
      //账户选项卡
@@ -408,6 +516,9 @@
    handleTabsClick(item, index) {
      //持仓已平仓选项卡
      this.tabsCurrentIndex = index;
      if(index==3){
          this.getNewXg();
      }
    },
    handleOpenDialog() {
      this.titleDialog = !this.titleDialog;
@@ -610,6 +721,26 @@
          this.tabsPcArr.push(element)
        })
        this.totals = data.data.total
      } else {
        Toast(data.msg)
      }
    },
    async getNewXg() {
      //获取新股
      this.loadingXg = true;
      let opt = {
      }
      let data = await api.getUserNewGuList(opt)
      this.loadingXg = false;
      if (data.data.length < 15) {
        this.finishedXg = true;
      }
      if (data.status === 0) {
        this.tabsXgArr = data.data
        // data.data.list.forEach(element => {
        //   this.tabsXgArr.push(element)
        // })
        this.xgTotal = data.data.length
      } else {
        Toast(data.msg)
      }
@@ -1065,8 +1196,8 @@
}

.right_btn {
  width: 1.7949rem;
  height: 0.6667rem;
  width: 1.9949rem;
  height: 0.7667rem;
  position: absolute;
  right: 1%;
  top: 48%;

 src/page/user/user.vue

@@ -1,1303 +0,0 @@
<template>
  <div class="page wrapper">
    <!-- <div class="header">
      <mt-header title="">
        <router-link to="" slot="left">
          <span v-if="$store.state.userInfo.accountType == 1" class="status">(模拟)</span>
          <span @click="hideNumber" class="status">资产状况
                        <i v-show="$store.state.hide" class="iconfont icon-yanjing1"></i>
                        <i v-show="!$store.state.hide" class="iconfont icon-yanjing"></i>
                    </span>
        </router-link>
        <mt-button @click="tosetting" class="setting" slot="right">
          <i class="iconfont icon-shezhi"></i>
        </mt-button>
      </mt-header>
    </div> -->
    <div class="account-info">
      <div class="account-info_avatar">
        <img src="../../assets/ico/wogerenziliao.png" alt="">
      </div>
      <div class="account-info_detail">
        <div class="account-phone">账户：{{$store.state.userInfo.phone || '未登录'}}</div>
        <div class="account-name">昵称：{{$store.state.userInfo.nickName || '未登录'}}</div>
      </div>
      <div class="account-info_ctl" @click="hideNumber">
        资产状况
        <i v-show="$store.state.hide" class="iconfont icon-yanjing"></i>
        <i v-show="!$store.state.hide" class="iconfont icon-yanjing1"></i>
      </div>
    </div>
    <div class="account-container">
      <!-- <div class="account-header">
        <h2 class="title">账户总资产 <span class="sub-title">( 沪深账户 <i
          v-if="this.$store.state.settingForm.indexDisplay">+ 指数账户</i> <i
          v-if="this.$store.state.settingForm.futuresDisplay"> + 期货账户</i>)</span></h2>
        <div>
          <p v-if="this.$store.state.settingForm.indexDisplay && !this.$store.state.settingForm.futuresDisplay "
            class="account">¥{{$store.state.hide?'****':Number($store.state.userInfo.userAmt +
            $store.state.userInfo.userIndexAmt).toFixed(2)}}</p>
          <p v-else-if="!this.$store.state.settingForm.indexDisplay && this.$store.state.settingForm.futuresDisplay"
            class="account">¥{{$store.state.hide?'****':Number($store.state.userInfo.userAmt +
            $store.state.userInfo.userFuturesAmt).toFixed(2)}}</p>
          <p v-else-if="!this.$store.state.settingForm.indexDisplay && !this.$store.state.settingForm.futuresDisplay"
            class="account">¥{{$store.state.hide?'****':Number($store.state.userInfo.userAmt).toFixed(2)}}</p>
          <p v-else-if="this.$store.state.settingForm.indexDisplay && this.$store.state.settingForm.futuresDisplay"
            class="account">¥{{$store.state.hide?'****':Number($store.state.userInfo.userAmt +
            $store.state.userInfo.userIndexAmt + $store.state.userInfo.userFuturesAmt).toFixed(2)}}</p>
        </div>
        <div class="iconfont">
          <mt-button class="btn-red pull-right" size="small" type="danger" @click="toCash">提现</mt-button>
          <mt-button class="btn-red pull-right" size="small" type="danger" @click="toRecharge">充值</mt-button>
        </div>
        <mt-progress
          :value="$store.state.userInfo.userAmt/($store.state.userInfo.userAmt + $store.state.userInfo.userIndexAmt)*100"
          :bar-height="5"></mt-progress>
      </div> -->
      <div class="account-preview">
        <div class="acc-pre-left">
          <img v-show="$state.theme!='red'" src="../../assets/ico/zongzichan.png" alt="">
          <img v-show="$state.theme=='red'" src="../../assets/ico/zongzichan-red.png" alt="">
          
          <span class="ti">总资产</span>
          <span class="de">
            <div>
              <p v-if="this.$store.state.settingForm.indexDisplay && !this.$store.state.settingForm.futuresDisplay "
                class="account">¥{{$store.state.hide?'****':Number($store.state.userInfo.userAmt +
                $store.state.userInfo.userIndexAmt).toFixed(2)}}</p>
              <p v-else-if="!this.$store.state.settingForm.indexDisplay && this.$store.state.settingForm.futuresDisplay"
                class="account">¥{{$store.state.hide?'****':Number($store.state.userInfo.userAmt +
                $store.state.userInfo.userFuturesAmt).toFixed(2)}}</p>
              <p v-else-if="!this.$store.state.settingForm.indexDisplay && !this.$store.state.settingForm.futuresDisplay"
                class="account">¥{{$store.state.hide?'****':Number($store.state.userInfo.userAmt).toFixed(2)}}</p>
              <p v-else-if="this.$store.state.settingForm.indexDisplay && this.$store.state.settingForm.futuresDisplay"
                class="account">¥{{$store.state.hide?'****':Number($store.state.userInfo.userAmt +
                $store.state.userInfo.userIndexAmt + $store.state.userInfo.userFuturesAmt).toFixed(2)}}</p>
            </div>
          </span>
        </div>
        <div class="acc-pre-center">
          <div>沪深账户: <span>￥{{$store.state.hide?'****':$store.state.userInfo.userAmt}}</span></div>
          <div>指数账户: <span>￥{{$store.state.hide?'****':$store.state.userInfo.userIndexAmt}}</span></div>
          <div>期货账户: <span>￥{{$store.state.hide?'****':Number($store.state.userInfo.userFuturesAmt).toFixed(2)}}</span></div>
        </div>
        <div class="acc-pre-right">
          <div class="redbtn btn" @click="toRecharge">充值</div>
          <div class="bluebtn btn" @click="toCash">提现</div>
        </div>
      </div>
      <div v-for="item in account" :key="item.key">
        <div class="account-box" v-if="item.isDisplay">
          <div class="header" @click="item.isShow = item.isShow?false:true">
            <!-- <i v-if="item.isShow" class="iconfont jian"></i>
            <i v-else class="iconfont jia"></i> -->
            <div class="header-left">
            <img v-if="item.isShow&&$state.theme =='red'" class="iconfont"
            src="../../assets/ico/jian-red.png"
            >
            <img v-else-if="item.isShow&&$state.theme !='red'" class="iconfont"
            src="../../assets/ico/jian.png"
            >
            <img v-else-if="!item.isShow&&$state.theme !='red'" class="iconfont"
            src="../../assets/ico/jia.png"
            >
            <img v-else class="iconfont"
            src="../../assets/ico/jia-red.png"
            >
            <span :style="{color:$state.theme =='red'?'#000':'#fff'}">{{item.name}}账户</span>
            <span v-if="item.name == '指数'">(￥{{$store.state.hide?'****':$store.state.userInfo.userIndexAmt}})</span>
            <span v-if="item.name == '沪深'">(￥{{$store.state.hide?'****':$store.state.userInfo.userAmt}})</span>
            <span
              v-if="item.name == '期货'">(￥{{$store.state.hide?'****':Number($store.state.userInfo.userFuturesAmt).toFixed(2)}})
            </span>
            </div>
            <a class="pull-right" @click="toTransfer(1)">
              <span :style="{color:$state.theme == 'red'?'#000':'#fff'}">资金互转<i class="iconfont icon-you"></i></span>
            </a>
          </div>
          <div v-show="item.isShow" class="content">
            <ul class="clearfix">
              <li>
                <i class="iconfont icon-zijin1"></i>
                <div class="name">总资产</div>
                <p v-if="item.name == '指数'" class="number yellow">
                  {{$store.state.hide?'****':$store.state.userInfo.userIndexAmt}}</p>
                <p v-if="item.name == '沪深'" class="number yellow">
                  {{$store.state.hide?'****':$store.state.userInfo.userAmt}}</p>
                <p v-if="item.name == '期货'" class="number yellow">
                  {{$store.state.hide?'****':Number($store.state.userInfo.userFuturesAmt).toFixed(2)}}</p>
              </li>
              <li>
                <i class="iconfont icon-keyongzijin"></i>
                <div class="name">可用资金</div>
                <p v-if="item.name == '指数'" class="number yellow">
                  {{$store.state.hide?'****':$store.state.userInfo.enableIndexAmt}}</p>
                <p v-if="item.name == '沪深'" class="number yellow">
                  {{$store.state.hide?'****':$store.state.userInfo.enableAmt}}</p>
                <p v-if="item.name == '期货'" class="number yellow">
                  {{$store.state.hide?'****':$store.state.userInfo.enableFuturesAmt}}</p>
              </li>
              <li>
                <i class="iconfont icon-dongjiezijin"></i>
                <div class="name">冻结保证金</div>
                <p v-if="item.name == '指数'" class="number yellow">
                  {{$store.state.hide?'****':$store.state.userInfo.allIndexFreezAmt}}</p>
                <p v-if="item.name == '沪深'" class="number yellow">
                  {{$store.state.hide?'****':$store.state.userInfo.allFreezAmt}}</p>
                <p v-if="item.name == '期货'" class="number yellow">
                  {{$store.state.hide?'****':$store.state.userInfo.allFuturesFreezAmt}}</p>
              </li>
              <li>
                <i class="iconfont icon-yingkuixuanzhong"></i>
                <div class="name">持仓总盈亏</div>
                <p v-if="item.name == '指数'"
                  :class="$store.state.userInfo.allIndexProfitAndLose>0?'number red':$store.state.userInfo.allIndexProfitAndLose<0?'number green':'number'">
                  {{$store.state.hide?'****':$store.state.userInfo.allIndexProfitAndLose}}</p>
                <p v-if="item.name == '沪深'"
                  :class="$store.state.userInfo.allProfitAndLose>0?'number red':$store.state.userInfo.allProfitAndLose<0?'number green':'number'">
                  {{$store.state.hide?'****':$store.state.userInfo.allProfitAndLose}}</p>
                <p v-if="item.name == '期货'"
                  :class="$store.state.userInfo.allFuturesProfitAndLose>0?'number red':$store.state.userInfo.allFuturesProfitAndLose<0?'number green':'number'">
                  {{$store.state.hide?'****':Number($store.state.userInfo.allFuturesProfitAndLose).toFixed(2)}}</p>
              </li>
              <li>
                <i class="iconfont icon-dongjiezijin"></i>
                <div class="name">新股冻结保证金</div>
                <p>{{shengoudj.djzj}}</p>
              </li>
            </ul>
          </div>
        </div>
        <div v-show="item.isShow" 
        class="pcx"
        style="padding: 0.12rem 0.4rem 0.15rem;">
          <!-- 强制平仓线为 ： 可用资金 + 冻结保证金 * 0.6 -->
          <div style="background:#1A1E29">
            您的{{item.name}}账户强制平仓线为
          <span v-if="item.name == '指数'" style="font-weight:bold;font-size:0.26rem;margin:0 0.1rem;">{{$store.state.hide?'****':Number(($store.state.userInfo.enableIndexAmt + $store.state.userInfo.allIndexFreezAmt) * indexSettingInfo.forceSellPercent).toFixed(2)}} </span>
          <span v-if="item.name == '沪深'" style="font-weight:bold;font-size:0.26rem;margin:0 0.1rem;">{{$store.state.hide?'****':Number(($store.state.userInfo.enableAmt + $store.state.userInfo.allFreezAmt) * settingInfo.forceStopPercent).toFixed(2)}} </span>
          <span v-if="item.name == '期货'" style="font-weight:bold;font-size:0.26rem;margin:0 0.1rem;">{{$store.state.hide?'****':Number(($store.state.userInfo.enableFuturesAmt + $store.state.userInfo.allFuturesFreezAmt) * futuresSettingInfo.forceSellPercent).toFixed(2)}} </span>
          <!-- 请实时注意账户风险 -->
          <i @click="focePromptPopup = true" ref="button" class="iconfont icon-xinshou"></i>
          </div>
        </div>
      </div>
    </div>
    <div class="panel">
      <div class="panel-head">
        <span class="font-w">分仓配资</span>
      </div>
      <div class="panel-body">
        <div class="row">
          <div @click="goFunds(3)" class="col-xs-3">
            <i class="iconfont icon-rongzi2"></i>
            新股申购
          </div>
          <div @click="goFunds(1)" class="col-xs-3">
            <i class="iconfont icon-rongzi2"></i>
            配资主页
          </div>
          <div @click="goFunds(2)" class="col-xs-3">
            <i class="iconfont icon-rongzi2"></i>
            按天配资
          </div>
          <div @click="goFundsList(1)" class="col-xs-3">
            <i class="iconfont icon-rongzi2"></i>
            我的配资
          </div>
          <div @click="goFundsList(2)" class="col-xs-3">
            <i class="iconfont icon-rongzi2"></i>
            配资持仓
          </div>
          <div @click="goFundsList(3)" class="col-xs-3">
            <i class="iconfont icon-rongzi2"></i>
            配资平仓
          </div>
        </div>
      </div>
    </div>
    <div class="panel">
      <div class="panel-head">
        <span class="font-w">我的持仓</span>
      </div>
      <div class="panel-body">
        <div class="row">
          <div @click="goOrderList(1)" class="col-xs-3">
            <i class="iconfont icon-rongzi2"></i>
            沪深持仓
          </div>
          <div @click="goOrderList(1)" class="col-xs-3">
            <i class="iconfont icon-rongzilishi"></i>
            沪深平仓
          </div>
          <div v-if="this.$store.state.settingForm.indexDisplay" @click="goOrderList(2)" class="col-xs-3">
            <i class="iconfont icon-zhishuyidong"></i>
            指数持仓
          </div>
          <div v-if="this.$store.state.settingForm.indexDisplay" @click="goOrderList(2)" class="col-xs-3">
            <i class="iconfont icon-geguyingkui"></i>
            指数平仓
          </div>
          <div v-if="this.$store.state.settingForm.futuresDisplay" @click="goOrderList(4)" class="col-xs-3">
            <i class="iconfont icon-jiaoyitixing"></i>
            期货持仓
          </div>
          <div v-if="this.$store.state.settingForm.futuresDisplay" @click="goOrderList(4)" class="col-xs-3">
            <i class="iconfont icon-qihuo1"></i>
            期货平仓
          </div>
        </div>
      </div>
    </div>
    <div class="other">
      <ul class="after">
        <li @click="toAuthentication">
                  <span>
                    <!-- <icon name="shoufei" slot="icon"></icon> -->
                    <!-- <i style="font-size:0.34rem" class="iconfont icon-shenfenrenzheng"></i> -->
                    <img src="../../assets/ico/shimin.png"
                    style="width:.28rem;height:.24rem;margin-right: 0.15rem;"
                    >
                    实名认证
                    <span class="renzhen done"
                    v-if="$store.state.userInfo.isActive == 2"
                    >
                      <i class="iconfont el-icon-circle-check" ></i>
                      审核通过
                    </span>
                    <span class="renzhen ing"
                    v-if="$store.state.userInfo.isActive == 0 || $store.state.userInfo.isActive == 3" style="color:red;font-size: 0.7rem;"
                    >
                      <i class="iconfont el-icon-circle-close" ></i>
                      未审核
                    </span>
                    <!-- <i v-if="$store.state.userInfo.isActive == 1" style="color:red;font-size: 0.7rem;"
                       class="iconfont icon-shenhezhong"></i>
                    <i v-if="$store.state.userInfo.isActive == 2" style="color:red;font-size: 0.7rem;"
                       class="iconfont icon-tongguo1"></i>
                    <i v-if="$store.state.userInfo.isActive == 0 || $store.state.userInfo.isActive == 3"
                       style="color:red;font-size: 0.75rem;" class="iconfont icon-icon-test"></i> -->
                    <icon name="right66" class="right" slot="icon"></icon>
                  </span>
        </li>
        <li @click="goCard">
                <span>
                    <!-- <i style="font-size:0.28rem" class="iconfont icon-yinhangqia"></i> -->
                     <img src="../../assets/ico/yinhangka.png"
                      style="width:.28rem;height:.24rem;margin-right: 0.15rem;"
                    >
                    银行卡
                    <!-- <i v-if="!$store.state.bankInfo.bankNo" style="color:red;font-size: 0.3rem;margin-left: 0.1rem;"
                       class="iconfont icon-iconfontweitongguo"></i>
                    <i v-if="$store.state.bankInfo.bankNo" style="color:red;font-size: 0.3rem;margin-left: 0.1rem;"
                       class="iconfont icon-yanzhengma"></i> -->
                    <icon name="right66" class="right" slot="icon"></icon>
                </span>
        </li>
        <li >
            <span>
                <!-- <i style="font-size:0.28rem" class="iconfont icon-yinhangqia"></i> -->
                 <img src="../../assets/ico/gaimima.png"
                      style="width:.24rem;height:.24rem;margin-right: 0.15rem;"
                    >
                修改密码
                <!-- <i v-if="!$store.state.bankInfo.bankNo" style="color:red;font-size: 0.3rem;margin-left: 0.1rem;"
                    class="iconfont icon-iconfontweitongguo"></i>
                <i v-if="$store.state.bankInfo.bankNo" style="color:red;font-size: 0.3rem;margin-left: 0.1rem;"
                    class="iconfont icon-yanzhengma"></i> -->
                <icon name="right66" class="right" slot="icon"></icon>
            </span>
        </li>
      </ul>
      <ul class="after">
        <!-- <li  @click="goOrderList">
            <span>
              <i style="font-size:0.28rem" class="iconfont icon-chicang"></i>
              我的持仓
              <icon name="right66" class="right" slot="icon"></icon>
            </span>
        </li> -->

      </ul>
      <ul class="after">
        
        <li @click="goDetail">
              <span>
                  <!-- <i style="font-size:0.28rem" class="iconfont icon-zijinmingxi"></i> -->
                  <img src="../../assets/ico/zijin.png"
                      style="width:.27rem;height:.24rem;margin-right: 0.15rem;"
                    >
                  资金明细
                  <icon name="right66" class="right" slot="icon"></icon>
              </span>
        </li>
        <li @click="toRechargeList">
                  <span>
                    <!-- <i style="font-size:0.28rem" class="iconfont icon-dingdanjilu1"></i> -->
                    <img src="../../assets/ico/chongzhi.png"
                      style="width:.27rem;height:.27rem;margin-right: 0.15rem;"
                    >
                    充值记录
                    <icon name="right66" class="right" slot="icon"></icon>
                  </span>
        </li>
        <li @click="toCashList">
                <span>
                    <!-- <i style="font-size:0.28rem" class="iconfont icon-dingdanjilu1"></i> -->
                    <img src="../../assets/ico/tixian.png"
                      style="width:.24rem;height:.24rem;margin-right: 0.15rem;"
                    >
                    提现记录
                    <icon name="right66" class="right" slot="icon"></icon>
                </span>
        </li>
      </ul>
      <!-- <ul class="after">
          <li  @click="changeStyle">
              <span>
                <i style="font-size:0.28rem" class="iconfont icon-shouye"></i>
                主题换肤
                <span class="right">
                    <i v-if="styleName == 'red'" style="color:#ff9800" class="iconfont icon-baitian"></i>
                    <i v-if="styleName == 'black'" style="color:#ff9800" class="iconfont icon-yewan1"></i>
                </span>
              </span>
          </li>
      </ul> -->
      <mt-popup v-model="focePromptPopup" popup-transition="popup-fade" class="mint-popup-white">
        <div class="clearfix">
          <a @click="focePromptPopup = false" class="pull-right"><i class="iconfont icon-weitongguo"></i></a>
        </div>
        <p class="font-title">什么是强制平仓线？</p>
        <!--  账户可用资金 +  -->
        <p v-if="$store.state.settingForm.stockDisplay" class="font-bold">(沪深)强制平仓线 = (账户可用资金+冻结保证金) *
          {{settingInfo.forceStopPercent ? settingInfo.forceStopPercent:0}}</p>
        <p v-if="$store.state.settingForm.indexDisplay" class="font-bold">(指数)强制平仓线 = (账户可用资金+冻结保证金) *
          {{indexSettingInfo.forceSellPercent ? indexSettingInfo.forceSellPercent:0}}</p>
        <p v-if="$store.state.settingForm.futuresDisplay" class="font-bold">(期货)强制平仓线 = (账户可用资金+冻结保证金) *
          {{futuresSettingInfo.forceSellPercent ? futuresSettingInfo.forceSellPercent:0}}</p>
        <p v-if="$store.state.settingForm.stockDisplay">当您的沪深账户持仓总盈亏为<span class="green number">-{{Number(($store.state.userInfo.enableAmt + $store.state.userInfo.allFreezAmt) * settingInfo.forceStopPercent).toFixed(2)}}</span>时系统会强制平仓
        </p>
        <p v-if="$store.state.settingForm.indexDisplay">当您的指数账户持仓总盈亏为<span class="green number">-{{Number(($store.state.userInfo.allIndexFreezAmt + $store.state.userInfo.enableIndexAmt) * indexSettingInfo.forceSellPercent).toFixed(2)}}</span>时系统会强制平仓
        </p>
        <p v-if="$store.state.settingForm.futuresDisplay">当您的期货账户持仓总盈亏为<span class="green number">-{{Number(($store.state.userInfo.allFuturesFreezAmt + $store.state.userInfo.enableFuturesAmt) * futuresSettingInfo.forceSellPercent).toFixed(2)}}</span>时系统会强制平仓
        </p>
      </mt-popup>
      <div class="btnbox">
        <span class="text-center btnok loginout" @click="toRegister">注销登录</span>
      </div>
    </div>
    <!-- <foot></foot> -->
  </div>
</template>
<script type="text/ecmascript-6">
import { Toast } from 'mint-ui'
// import '@/assets/style/bg.less'
import foot from '../../components/foot/foot'
// import { hideNumberTo } from '@/utils/utils'
import * as api from '@/axios/api'

export default {
  components: {
    foot
  },
  data () {
    return {
      user: {
        img: ''
      },
      defaultUser: {
        img: require('../../assets/img/default-head.png')
      },
      changeHideStatus: false,
      userAmt: '',
      settingInfo: {}, // 设置信息
      indexSettingInfo: {}, // 设置信息 指数
      futuresSettingInfo: {}, // 设置信息 期货
      focePromptPopup: false, // 强制平仓提示框
      buttonBottom: 0,
      account: [
        { name: '沪深', link: 'stock', isShow: true, isDisplay: false },
        { name: '指数', link: 'index', isShow: false, isDisplay: false },
        { name: '期货', link: 'futures', isShow: false, isDisplay: false }
      ],
      showChangeBtn: false, // 是否显示资金互转按钮
      styleName: 'black',
      shengoudj:''
    }
  },
  watch: {
    //   changeHideStatus(newval){
    //     //   this.userAmt = hideNumberTo(this.$store.state.userInfo.userAmt)
    //   }
  },
  computed: {},
  created () {
    this.getUserInfo()
    this.styleName = window.localStorage.getItem('styleName') ? window.localStorage.getItem('styleName') : 'red'
  },
  mounted () {
    this.getSettingInfo()
    this.getIndexSettingInfo()
    this.getFuturesSetting()
    this.getCardDetail()
    this.getprice()
    this.changeHideStatus = this.$store.state.hide
    if (this.$store.state.settingForm.indexDisplay || this.$store.state.settingForm.futuresDisplay) {
      this.showChangeBtn = true
    }
  },
  methods: {
    async getprice() {
      let opt = {};
      let data = await api.getprice(opt);
      this.shengoudj = data.data;
      console.log(this.shengoudj, "申购");
    },
    goFunds(type) {
      if (type  == 1) {
        this.$router.push('/funds')
      }
      if (type == 2) {
        this.$router.push('/days')
      }
      if (type == 3){
        this.$router.push('/xingu')
      }
    },
    changeStyle () {
      if (this.styleName === 'red') {
        this.styleName = 'black'
        this.$store.state.className = 'black'
        window.localStorage.setItem('styleName', 'black')
      } else {
        this.styleName = 'red'
        this.$store.state.className = 'red'
        window.localStorage.setItem('styleName', 'red')
      }
      window.location.reload()
    },
    async getProductSetting () {
      let data = await api.getProductSetting()
      if (data.status === 0) {
        this.$store.state.settingForm = data.data
        // if(this.$store.state.userInfo.accountType != 1){
        this.account[0].isDisplay = data.data.stockDisplay
        this.account[1].isDisplay = data.data.indexDisplay
        this.account[2].isDisplay = data.data.futuresDisplay
        // }else{
        //     this.account[0].isDisplay = true
        //     this.account[1].isDisplay = true
        //     this.account[2].isDisplay = true
        // }
      } else {
        this.$message.error(data.msg)
      }
    },
    hideNumber () {
      this.changeHideStatus = this.$store.state.hide
      let i = false
      let j = true
      this.$store.state.hide = this.$store.state.hide ? i : j
    },
    goOrderList: function (val) {
      //   this.$router.push('/orderlist')
      this.$router.push('/orderlist?index=' + val)
    },
    goFundsList: function (val) {
      this.$router.push('/fundslist?index=' + val)
    },
    goDetail: function () {
      this.$router.push('/detail')
    },
    goCard: function () {
      this.$router.push('/card')
    },
    toAggre: function () {
      this.$router.push('/aggre')
    },
    toAuthentication: function () {
      this.$router.push('/authentication')
    },
    toRecharge () {
      // 充值
      this.$router.push('/recharge')
    },
    toCash () {
      // 提现
      this.$router.push('/cash')
    },
    async toRegister () {
      // 注销登陆
      this.clearCookie()
      let data = await api.logout()
      if (data.status === 0) {
        // Toast(data.msg)
        this.$router.push('/login')
      } else {
        Toast(data.msg)
      }
    },
    tosetting () {
      this.$router.push('/setting')
    },
    toCashList () {
      this.$router.push('/Cashlist')
    },
    toRechargeList () {
      this.$router.push('/rechargelist')
    },
    toTransfer (val) {
      this.$router.push({
        path: '/transfer',
        query: {
          type: val
        }
      })
    },
    async getCardDetail () {
      // 获取银行卡信息
      let data = await api.getBankCard()
      if (data.status === 0) {
        this.$store.state.bankInfo = data.data
      } else {
        // Toast(data.msg)
      }
    },
    async getSettingInfo () {
      let data = await api.getSetting()
      if (data.status === 0) {
        // 成功
        this.settingInfo = data.data
      } else {
        Toast(data.msg)
      }
    },
    async getIndexSettingInfo () {
      // 网站设置信息 指数
      let data = await api.getIndexSetting()
      if (data.status === 0) {
        // 成功
        this.indexSettingInfo = data.data
      } else {
        Toast(data.msg)
      }
    },
    async getFuturesSetting () {
      // 网站设置信息 期货
      let data = await api.getFuturesSetting()
      if (data.status === 0) {
        // 成功
        this.futuresSettingInfo = data.data
      } else {
        Toast(data.msg)
      }
    },
    async getUserInfo () {
      // 获取用户信息
      //   let showcookie = this.getCookie('USER_TOKEN');
      let data = await api.getUserInfo()
      if (data.status === 0) {
        this.getProductSetting()
        this.$store.state.userInfo = data.data
      } else {
        Toast(data.msg)
      }
      this.$store.state.user = this.user
    }
  }
}
</script>

<style lang="less" scoped>
  // @bgColor: #fff;
  @bgColor: #16171d;
  @fontColor: #fff;
  @borderColor: #676b6f;
  body {
    background: #000
  }

  .page .head {
    width: 100%;
    // height: 0;
    // padding-top: 44%;
    height: 2.8rem;
    background-image: url('../../assets/img/header.png');
    background-size: 100% 100%;

  }
  .wrapper {
    background-color: @bgColor;
  }
  .after {
    .iconfont {
      vertical-align: middle;
      margin-right: 0.15rem;
    }
  }

  .setting {
    margin-right: 0.2rem;
  }

  .status {
    font-size: 0.24rem;
    // margin-left: 0.2rem;
    .iconfont {
      margin-left: 0.2rem;
      font-size: 0.24rem;
    }
  }

  .user {
    .user-top {
      padding: 0 0.4rem;
      // width: 96%;
      // height: 1.96rem;
      margin: 0 auto;
      background: #2e3237;
      // border-radius: 0.11rem;
      box-shadow: 0.014rem 0.014rem 0.014rem rgba(103, 107, 111, 0.38);
      // margin-top: -0.945rem;
      position: relative;
      margin-bottom: .16rem;
      padding-bottom: 0.2rem;
      margin-top: 0.1rem;

      .user-header {
        width: 1.4rem;
        height: 1.4rem;
        border-radius: 100%;
        background: #000;
        position: absolute;
        left: 50%;
        top: -0.68rem;
        margin-left: -0.68rem;

        .green {
          color: green;
        }
      }

      .user-img {
        width: 1.3rem;
        height: 1.3rem;
        background-color: @bgColor;
        border-radius: 100%;
        margin: 0 auto;
        margin-top: 0.014rem;

        img {
          width: 100%;
          height: 100%;
        }
      }

      .user-box {
        // padding-top: 1.08rem;
        font-size: 0.33rem;
        color: @fontColor;
        font-weight: 700;
        height: 0.68rem;
        line-height: 0.695rem;

        .btn-red {
          // width: 1.418rem;
          width: 2.418rem;
          height: 0.68rem;
          font-size: 0.29rem;
          line-height: 0.68rem;
          padding: 0;
          border-radius: 0.028rem;
          background: #b60c0d;
        }
      }
    }
  }

  .other {
    margin: 0.12rem .28rem;

    ul {
      position: relative;
      background-color: #1F2636;
      border-radius: 4px;
      overflow: hidden;
        padding: 0 0.2rem ;
      li {
        position: relative;
        height: 0.92rem;
        line-height: 0.92rem;
        // padding: 0 0.4rem;
        font-size: 0.26rem;
        background-color: #1F2636;
        position: relative;
        border-bottom: 1px solid #3f444a;
      }
      li:last-child {
        border-bottom: none;
      }
    }

    .after {
      margin-bottom: 0.125rem;
    }

  }
  .renzhen{
    position: relative;
    padding: 0 .1rem;
    font-size: .18rem;
    height: .35rem;
    line-height: .35rem;
    display: inline-block;
    vertical-align: middle;
    padding-left: .3rem;
    .iconfont{
      font-size: .18rem;
      vertical-align: middle;
      position: absolute;
      left: 0.05rem ;
      top: .05rem;
    }
    &.ing {
      background-color: #E6003E;
    }
    &.done {
      background-color: #04823E;
    }
  }
  .other ul li svg {
    width: 16px;
    height: 15px;
    line-height: 25px;
    margin-top: .28rem;
    color: #ccc;
  }

  .other ul li svg:first {
    float: left;
    margin-right: 0.39rem;
  }

  .my-Assets {
    .img-box {
      width: 1.3rem;
      height: 1.3rem;
    }

    .assets-box {
      line-height: 0.5rem;
      margin-top: 0.2rem;

      .iconfont {
        margin-right: 0.2rem;
      }
    }

    font-size: 0.25rem;
    padding: 0.2rem 0 0.3rem;
  }

  .user-header {
    padding: 0rem 0.3rem 0;
    background: #2e3237;
    margin-bottom: 0.15rem;

    .box:nth-child(1) {
      margin-right: 6%;
    }

    .box {
      padding: 0.26rem 0.25rem 0.3rem;
      padding: 0.26rem 0.25rem 0.2rem;
      background-color: #c6c8d4;
      width: 47%;
      float: left;
      color: #2f2f2f;
      border-radius: 0.2rem 0.2rem 0.1rem 0.1rem;

      .name {
        font-size: 0.26rem;
        font-weight: bold;
        margin-bottom: 0.2rem;
      }

      .account {
        font-size: 0.3rem;
        font-weight: bold;
      }

      .name2 {
        font-size: 0.23rem;
        margin-top: 0.2rem;

        span {
          padding-left: 0.1rem;
        }
      }
    }
  }

  .loginout {
    color: #999;
    font-size: 0.3rem;
    background: none;
  }

  .btnbox .btnok {
    background: none;
    font-size: 0.28rem;
    height: 0.6rem;
    line-height: 0.6rem;
    color: #606060;
  }

  .btnbox {
    width: 100%;
    padding: 0 0.3rem;
  }

  .mint-popup-1 {
    color: #333;
    width: 200px;
    border-radius: 8px;
    padding: 10px;
    transform: translate(-50%, 0);

    h1 {
      font-size: 20px;
      color: #26a2ff;
    }

    p {
      margin-bottom: 10px;
    }

    top: 3.2rem;
  }

  .mint-popup-1::before {
    triangle: 10px top #fff;
    content: '';
    position: absolute;
    top: -20px;
    right: 50px;
  }

  .mint-popup-white {
    padding: 0.3rem 0.28rem;

    .font-title {
      font-size: 0.26rem;
      margin-bottom: 0.12rem;
    }

    .font-bold {
      font-weight: bold;
    }

    .number {
      margin: 0 0.1rem;
      font-weight: bold;
      font-size: 0.26rem;
    }

    p {
      line-height: 0.4rem;
    }
  }

  // 总资产
  .account-header {
    padding: 0.2rem 0.2rem 0;
    position: relative;
    background-color: #1F2636;

    .iconfont {
      position: absolute;
      right: 0.2rem;
      // top: 50%;
      top: 1.1rem;
      font-size: 0.8rem;
      color: #FF5722;
      margin-top: -0.4rem;

      .btn-red {
        margin-left: 0.2rem;
        padding: 0.08rem 0.2rem;
        background: #FF5722;
      }
    }

    .title {
      font-size: 0.28rem;
      margin-bottom: 0.26rem;
    }

    .sub-title {
      color: #7e8c8d;
      font-size: 0.2rem;

      i {
        font-style: normal;
      }
    }

    .account {
      color: #b60c0d;
      font-size: 0.4rem;
      font-weight: 600;
      font-family: lightnumber;
    }
  }

  .account-box {
    // margin-bottom: 0.12rem;
    padding: 0 0.2rem;
    // padding: 0 0.35rem;
    background-color: #1F2636;
    .header {
      font-size: 0.22rem;
      line-height: 0.7rem;
      height: .7rem;
      display: flex;
      justify-content: space-between;
      .header-left{
        display: flex;
        align-items: center;
      }
      img.iconfont {
        color: #f5ca07;
        width: .3rem;
        height: .3rem;
        display: inline-block;
        margin-right: .2rem;
        &.jian {
          background-image: url(../../assets/ico/jian.png);
        }
      }

      .iconfont {
        font-size: 0.24rem;
        vertical-align: middle;
        margin: 0 0.05rem;
      }
    }

    .content {
      padding: 0 0.2rem 0.18rem;

      li {
        width: 50%;
        float: left;
        padding: 0.2rem 0.2rem 0.04rem 0.56rem;
        line-height: 0.36rem;
        position: relative;

        &:nth-child(2) {
          .iconfont {
            color: #2f97fc;
          }
        }

        &:nth-child(3) {
          .iconfont {
            color: #17b780;
          }
        }

        &:nth-child(3) {
          .iconfont {
            color: #ff7602;
          }
        }

        .iconfont {
          position: absolute;
          top: 0.38rem;
          left: 0;
          font-size: 0.42rem;
          color: #fd4256;

        }

        .name {
          color: #888;
          font-size: 0.22rem;
        }

        .number {
          font-size: 0.27rem;
        }

      }
    }
  }

  .mt-progress {
    height: 5px;
    line-height: 5px;
    margin-top: 0.3rem;
    border-radius: 0.2rem;
    // padding: 0 0.2rem;
    /deep/ .mt-progress-runway {
      border-radius: 0.2rem;
      background-color: #ff7602;
    }

    /deep/ .mt-progress-progress {
      border-radius: 0.2rem;
      background-color: #bb3d4c;
    }
  }

  .panel {
    margin: 0.2rem .28rem;
    padding: 0 0.2rem;
    background-color: #1F2636;

    .panel-head {
      height: 0.88rem;
      line-height: 0.88rem;
      padding-top: .1rem;
      text-align: center;
      font-weight: bold;
      .font-w {
        font-size: 0.28rem;
        // font-weight: 600;
        // color: #000;
      }
    }

    .panel-body {
      padding: 0 0.2rem;
      text-align: center;

      .iconfont {
        display: block;
        font-size: 20px;
        margin-bottom: 0.1rem;
        color: #138DB2;
      }

      .font {
        font-size: 0.3rem;
        color: #000;
        font-weight: 600;
        line-height: 0.5rem;
      }

      .col-xs-3 {
        padding: 0.2rem 0;
      }
    }
  }

  .account-info {
    padding: .28rem;
    display: flex;
    justify-content: space-between;
    &_avatar {
      width: 1.13rem;
      height: 1.13rem;
      line-height: 1.13rem;
      border-radius: 50%;
      background-color: #444656;
      display: flex;
      align-items: center;
      justify-content: center;
      img {
        width: .55rem;
        height: .58rem;
      }
    }
    &_detail {
      padding-left: .22rem;
      display: flex;
      flex-direction: column;
      justify-content: space-around;
      flex: 1;
      .account-phone{
        font-size: .3rem;
        color: #fff;
      }
      .account-name {
        color: #636A93;
      }
    }
    &_ctl {
      margin-top: .1rem;
    }
  }
  .account-container {
    // margin: .28rem;
    width: 6.9rem;
    margin: .28rem auto;
    border-radius: 5px;
    overflow: hidden;
    background-color: #1F2636;
    .pcx {
      margin: .2rem;
      // background-color: #1F2636;
      background:#1A1E29
    }
    .account-preview {
      display: flex;
      padding: .3rem .2rem .28rem;
      .acc-pre-left {
        width: 1.92rem;
        height: 1.92rem;
        background-image: url(../../assets/ico/round.png);
        background-size: cover;
        display: flex;
        flex-direction: column;
        justify-content: center;
        text-align: center;
        align-items: center;
        position: relative;
        img {
          width:.36rem;
          height: .36rem;
          margin-bottom: .1rem;
        }
        span.ti {
          font-size: .24rem;
          color: #ccc;
          margin-bottom: .1rem;
        }
        span.de {
          font-size: .24rem;
          color: #009C46;
          font-family: lightnumber;
          .account {
            font-family: lightnumber;
          }
        }
        &::after {
          display: block;
          content : "";
          width: .67rem;
          height: 2.21rem;
          position: absolute;
          top: -.16rem;
          right: -.44rem;
          background-image: url(../../assets/ico/round-r.png);
          background-size: cover;
        }
      }
      .acc-pre-center {
        margin-left: .45rem;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        font-family: lightnumber;
        color: #ccc;
        span {
          color: #fff;
          font-family: lightnumber;
          font-weight: 300;
        }
      }
      .acc-pre-right {
        flex: 1;
        align-items: center;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        .btn {
          color: #fff;
          padding: 0 10px;
          border-radius: .2rem;
        }
        .redbtn {
          background-color: #E6003E;
        }
        .bluebtn {
          background-color: #024DA1;
        }
      }
    }
  }

  .red-theme {
    .wrapper {
      background-color: #E9E9E9;
    }
    .account-info_avatar{
      background-color: #B5B5B5;
    }
    .account-phone{
      color: #000;
    }
    .account-name {
      color: #999999;
    }
    .account-info_ctl{
      color: #858585;
    }
    .account-container{
      background-color: #fff;
      span.ti{
        color: #000 !important;
      }
    }
   .acc-pre-center{
     color: #333 !important;
     span {
      color: #333 !important;
     }
   }
   .acc-pre-right {
     .bluebtn {
       background-color: #222 !important;
     }
   }
   .account-box{
     background-color: #fff;
   }
   .name {
     color : #12354E !important;
   }
   .number {
     color: #E6003E !important;
   }
   .pcx {
     background-color: #E7E7E8;
     div {
      background-color: transparent !important;
      color: #000;
     }
   }
   .panel {
     background-color: #fff;
     color: #000;
     .panel-head {
       border-bottom-color: #cbcbcb;
     }
     .iconfont {
       color: #E6003E;
     }
     .font-w {
       color: #000;
     }
   }
   .other {
     .after{
      background-color: #fff;
      li{
        background-color: #fff;
        color: #000;
       border-bottom-color: #cbcbcb;
        .renzhen {
          color: #fff;
        }
        svg{
          color: #222;
        }
      }
     }
   }
  }
</style>

 src/router/index.js

@@ -15,7 +15,6 @@
import ListDetail2 from '@/page/list/detail2'
import MyList from '@/page/list/my-list'
import Inquiry from '@/page/home/inquiry'
import User from '@/page/user/user'
import OrderList from '@/page/user/order-list'
import Warehouse from '@/page/user/Warehouse.vue'
import holdOrderList from '@/page/user/search-order/hold-stockCode'
@@ -290,17 +289,18 @@
        index: 19
      },
      component: Inquiry
    }, {
      path: '/user',
      name: 'user',
      meta: {
        title: '我的',
        requireAuth: false,
        hasHeader: true,
        index: 20
      },
      component: User
    },
    }, 
    // {
    //   path: '/user',
    //   name: 'user',
    //   meta: {
    //     title: '我的',
    //     requireAuth: false,
    //     hasHeader: true,
    //     index: 20
    //   },
    //   component: User
    // },
    {
      path: '/transfer',
      name: 'transfer',
@@ -631,7 +631,7 @@
      component: TradingBuy
    },
    {
      path: '/NewUser',
      path: '/User',
      name: 'NewUser',
      meta: {
        title: '图标',