dg/dabao_wap.git

parent: 9382eab4 | patch | commit | ignore whitespace

flowstocktrading

2022-11-03 2f72cf1a3a30b665619e7fcaa2657e225598554e

备份

13 files modified

11 files added

	config/index.js	2 ●●●●● patch \| view \| raw \| blame \| history
	index.html	28 ●●●●● patch \| view \| raw \| blame \| history
	src/App.vue	5 ●●●●● patch \| view \| raw \| blame \| history
	src/assets/foot/home_default.png	patch \| view \| raw \| blame \| history
	src/assets/foot/ic_camera_take.png	patch \| view \| raw \| blame \| history
	src/assets/foot/ic_home_tab_def.png	patch \| view \| raw \| blame \| history
	src/assets/foot/mine_default.png	patch \| view \| raw \| blame \| history
	src/assets/foot/mine_selected.png	patch \| view \| raw \| blame \| history
	src/assets/foot/positions_default.png	patch \| view \| raw \| blame \| history
	src/assets/foot/positions_selected.png	patch \| view \| raw \| blame \| history
	src/assets/foot/trade_default.png	patch \| view \| raw \| blame \| history
	src/assets/foot/trade_selected.png	patch \| view \| raw \| blame \| history
	src/components/foot.vue	168 ●●●●● patch \| view \| raw \| blame \| history
	src/main.js	3 ●●●●● patch \| view \| raw \| blame \| history
	src/page/home/components/GoLogin.vue	2 ●●●●● patch \| view \| raw \| blame \| history
	src/page/home/components/echart.vue	87 ●●●●● patch \| view \| raw \| blame \| history
	src/page/home/home.vue	42 ●●●●● patch \| view \| raw \| blame \| history
	src/page/list/list.vue	4 ●●●●● patch \| view \| raw \| blame \| history
	src/page/user/order-list.vue	12 ●●●●● patch \| view \| raw \| blame \| history
	src/page/user/order-list1.vue	2 ●●●●● patch \| view \| raw \| blame \| history
	src/page/user/order-list2.vue	2 ●●●●● patch \| view \| raw \| blame \| history
	src/page/user/order-list3.vue	2 ●●●●● patch \| view \| raw \| blame \| history
	src/page/user/order-list4.vue	2 ●●●●● patch \| view \| raw \| blame \| history
	src/page/user/user.vue	2 ●●●●● patch \| view \| raw \| blame \| history

 config/index.js

@@ -24,7 +24,7 @@
    },

    // Various Dev Server settings
    host: 'localhost', // can be overwritten by process.env.HOST
    host: '0.0.0.0', // can be overwritten by process.env.HOST
    port: 80, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
    autoOpenBrowser: true,
    errorOverlay: true,

 index.html

@@ -41,6 +41,34 @@
      }
    }
  </script>
  <script>
      // // 禁用缩放
      // function addMeta() {
      //     $('head').append('<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />');
      // }
      // setTimeout(addMeta, 3000);

      // // 禁用双指放大
      // document.documentElement.addEventListener('touchstart', function (event) {
      //     if (event.touches.length > 1) {
      //         event.preventDefault();
      //     }
      // }, {
      //     passive: false
      // });

      // // 禁用双击放大
      // var lastTouchEnd = 0;
      // document.documentElement.addEventListener('touchend', function (event) {
      //     var now = Date.now();
      //     if (now - lastTouchEnd <= 300) {
      //         event.preventDefault();
      //     }
      //     lastTouchEnd = now;
      // }, {
      //     passive: false
      // });
    </script>
</head>
<body style="height: 100%; position: absolute; width: 100%;">
<div id="app"></div>

 src/App.vue

@@ -18,11 +18,16 @@
        <router-view></router-view>
      </transition>
    </div>
    <foot></foot>
  </div>
</template>

<script>
  import foot from "@/components/foot.vue";
export default {
  components: {
    foot,
    },
  name: "App",
  created() {
    let title = this.$route.meta.title || "首页";

 src/assets/foot/home_default.png


 src/assets/foot/ic_camera_take.png


 src/assets/foot/ic_home_tab_def.png


 src/assets/foot/mine_default.png


 src/assets/foot/mine_selected.png


 src/assets/foot/positions_default.png


 src/assets/foot/positions_selected.png


 src/assets/foot/trade_default.png


 src/assets/foot/trade_selected.png


 src/components/foot.vue

New file
@@ -0,0 +1,168 @@
<template>
  <div class="footCss">
    <div :class="touch==1?'footDemos':'footDemo'" @click="goRouter('/home',1)">
      <div class="homeImgOut" v-show="$store.state.select == '/home'">
        <div class="homeImg">
          <img src="~@/assets/foot/ic_home_tab_def.png" />
        </div>
      </div>
      <div v-show="$store.state.select != '/home'" class="footImgDeft">
        <img src="~@/assets/foot/home_default.png" />
      </div>
      <div v-show="$store.state.select != '/home'">首页</div>
    </div>
    <div :class="touch==2?'footDemos':'footDemo'" @click="goRouter('/list',2)">
      <div class="footImgDeft">

        <img v-show="$store.state.select == '/list'" src="~@/assets/foot/trade_selected.png" />
        <img v-show="$store.state.select != '/list'" src="~@/assets/foot/trade_default.png" />
      </div>
      <div :class="$store.state.select == '/list'?'blueFont':''">交易</div>
    </div>
    <div :class="touch==3?'footDemos':'footDemo'" @click="goRouter('/orderlist',3)">
      <div class="footImgDeft">
        <img v-show="$store.state.select == '/orderlist'" src="~@/assets/foot/positions_selected.png" />
        <img v-show="$store.state.select != '/orderlist'" src="~@/assets/foot/positions_default.png" />
      </div>
      <div :class="$store.state.select == '/orderlist'?'blueFont':''">仓位</div>
    </div>
    <div :class="touch==4?'footDemos':'footDemo'" @click="goRouter('/user',4)">
      <div class="footImgDeft">
        <img v-show="$store.state.select == '/user'" src="~@/assets/foot/mine_selected.png" />
        <img v-show="$store.state.select != '/user'" src="~@/assets/foot/mine_default.png" />
      </div>
      <div :class="$store.state.select == '/user'?'blueFont':''">我的</div>
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        touch: 0,
      }
    },
    mounted() {

    },
    methods: {
      goRouter(url, index) {
        this.touch = index
        setTimeout(() => {
          this.touch = 0
        }, 500)
        this.$router.push(url)
        if (navigator.vibrate) {
          // 支持
          navigator.vibrate([55]);
        }
      }
    },

  }
</script>

<style>
  .footCss {
    border-top: 0.01rem solid rgba(192, 192, 192, 0.1);
    background: rgb(33, 33, 43);
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 1.3rem;
    display: flex;
    justify-content: space-around;
  }

  .footDemo {
    width: 0.8rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    font-size: 0.24rem;
  }

  .footDemos {
    width: 0.8rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    font-size: 0.24rem;
  }

  .footDemos::before {
    content: '';
    width: 0.9rem;
    height: 0.9rem;
    border-radius: 100%;
    position: absolute;
    background-color: rgba(25, 122, 246, 0.14);
    -webkit-animation: footBlueBg 0.5s linear infinite;
    animation: footBlueBg 0.5s linear infinite;
    transition: all 0.5s;
  }

  @-webkit-keyframes footBlueBg {
    0% {
      -webkit-transform: scale(1.6);
      transform: scale(1.6);
    }

    25% {
      -webkit-transform: scale(1.3);
      transform: scale(1.3);
    }

    50% {
      -webkit-transform: scale(1);
      transform: scale(1);
    }

    75% {
      background-color: rgba(25, 122, 246, 0.1);

    }

    100% {
      background-color: rgba(25, 122, 246, 0);
    }
  }

  .footImgDeft {
    width: 0.56rem;
    height: 0.56rem;
    margin-bottom: 0.08rem;

  }

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

  .homeImgOut {
    width: 0.9rem;
    height: 0.9rem;
    border-radius: 100%;
    background-color: rgb(25, 122, 246);
  }

  .homeImg {
    width: 0.9rem;
    height: 0.9rem;
  }

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

  .blueFont {
    color: rgb(25, 122, 246);
  }
</style>

 src/main.js

@@ -25,7 +25,8 @@
import animated from 'animate.css' // npm install animate.css --save安装，在引入

import '../static/css/public2.css'

import echarts from 'echarts'
Vue.prototype.$echarts = echarts;
// import VueTouch from 'vue-touch'
Vue.use(Swipe);
Vue.use(SwipeItem);

 src/page/home/components/GoLogin.vue

@@ -62,7 +62,7 @@
        > .btn {
            width: 1.7949rem;
            height: .7692rem;
            background: rgb(54,124,248);
            background: rgb(25,122,246);
            border-radius: .1064rem;
            display: flex;
            justify-content: center;

 src/page/home/components/echart.vue

New file
@@ -0,0 +1,87 @@
<template>
  <div style="width: 100%;height: 100%;">
    <div style="width: 100%;height: 100%;" :id="'main'+ids"></div>
  </div>
</template>
<script>
  import * as echarts from 'echarts';
  export default{
    props:{
      ids:{
        type:String,
        default: '0',
      },
      colorType:{
        type:Number,
        default: 0,
      }
    },
    data () {
      return {
        myChart:"",
      };
    },
    methods: {
      initCharts () {
        var chartDom = document.getElementById('main'+this.ids);
       var myChart = echarts.init(chartDom, 'dark');
        var option;
        var greenOrRed="";
        var greenOrReds="";
        console.log(this.colorType)
        if(this.colorType>0){
          greenOrRed='rgba(65,172,117,0.6)'
          greenOrReds='rgba(65,172,117,0.05)'
        }else{
          greenOrRed='rgba(166,10,36,0.6)'
          greenOrReds='rgba(166,10,36,0.05)'
        }
        option = {
          xAxis: {
            show:false,
            type: 'category',
            boundaryGap: false,

          },
          yAxis: {
            show:false,
            type: 'value'
          },
          tooltip: {
                              show: true,
                              extraCssText:'100%;height: 1.5385rem;'
                          },
          backgroundColor: 'rgba(0,0,0,0)',
          color: {
              type: 'linear',
              x:0,
              y:0,
              x2: 0,
              y2: 1,
              colorStops: [{
                  offset: 0, color: greenOrRed    // 0% 处的颜色
              }, {
                  offset: 1, color: greenOrReds   // 100% 处的颜色
              }],
              globalCoord: false // 缺省为 false
          },
          series: [
            {
              data: [820, 932, 901, 934, 1000, 900, 1320,820, 932, 901, 934, 1000, 900,],
              type: 'line',
              areaStyle: {}
            }
          ]
        };

        option && myChart.setOption(option);
      }
    },
    mounted () {
      this.initCharts();
      window.onresize = function() {
        this.myChart.resize();
      };
    }
  }
</script>

 src/page/home/home.vue

@@ -39,6 +39,7 @@
            </div>
          </div>
        </div>

        <!-- 排行入门 -->
        <van-skeleton title :row="2" :loading="loading" />
        <div class="navs" v-if="!loading">
@@ -68,24 +69,28 @@
              <van-swipe class="fo_my-swipe" :autoplay="0" indicator-color="white" @change="onChange">
                <van-swipe-item v-for="(item, index)  in proData" :key="index" style="margin-top: 20px;">
                  <div class="item_cont" v-for="(item2, idx) in proData[currentIndex]" :key="idx">
                    <div class="top_fo">
                      <div class="title">
                    <div class="top_fo" style="width: 80%;">
                      <div class="title" style="width: 30%;">
                        <span>{{ item2.f14 }}</span>
                      </div>
                      <div class="numbers">
                        <span>{{ item2.f2 }}</span>
                      </div>
                      <div class="percentage" :class="item2.f3 > 0 ? 'gree' : 'redd'">
                      <div class="percentage"  :class="item2.f3 > 0 ? 'gree' : 'redd'">

                        <span>{{ item2.f3 > 0 ? `+${item2.f3}%` : `${item2.f3}%` }}</span>
                      </div>
                      <div class="percentage"></div>
                      <div class="percentage" style="width: 38%;position: absolute;right: 0;" :class="item2.f3 > 0 ? 'gree' : 'redd'">
                        <echart :colorType="item2.f3" :ids="idx+'1'+index"></echart>
                      </div>
                    </div>
                    <div class="bottom_fo">
                      <div class="title">
                    <div class="bottom_fo" style="width: 80%;">
                      <div class="title"style="width: 30%;">
                        <span>{{ item2.f12 }}</span>
                        <img :src="Huo" alt style="margin-left: 0.12rem;" />
                      </div>
                      <div class="numbers">
                        <span>{{ '04:59:57' }}</span>
                      <div  class="percentage" >
                      <!-- class="numbers" -->
                        <!-- <span>{{ '04:59:57' }}</span> -->
                        <span>{{ item2.f2 }}</span>
                      </div>
                      <div class="percentage">
                        <span></span>
@@ -150,14 +155,14 @@
    <!-- tab -->

    <GoToLogin />
    <!-- <foot></foot> -->
  </div>
</template>

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

  import AllList from "@/page/list/list-all";
  import HomeList from "./components/home-list";
    import Echart from "./components/echart.vue";
  import {
    Toast
  } from "mint-ui";
@@ -179,10 +184,10 @@

  export default {
    components: {
      foot,
      HomeList,
      AllList,
      GoToLogin,
      Echart
    },
    props: {},
    data() {
@@ -232,7 +237,7 @@
    methods: {
      async getNewsList(type) {
        let data = await api.queryNewsList(type);
        console.log('xinwen:', data)
        
        switch (type) {
          case 1:
            this.newsContent1 = data.data.list
@@ -252,7 +257,7 @@
        }
      },
      handleBannerClick(ind) {
        console.log(ind);
        // console.log(ind);
      },
      ProcessData() {
        // 把数据分割成三等份
@@ -263,7 +268,7 @@
      onChange(index) {
        this.currentIndex = index;
        this.proData[index].forEach(item => {
          console.log(item.f14);
          // console.log(item.f14);
        });
      },
      handleSearchClick() {
@@ -308,6 +313,9 @@
      this.getNewsList(1);
      this.getNewsList(2);
      this.getNewsList(4);



      setTimeout(() => {
        this.loading = false
      }, 1000)
@@ -533,7 +541,7 @@
        }

        .title {
          width: 50%;
          width: 20%;
          height: 100%;
          display: flex;
          align-items: center;

 src/page/list/list.vue

@@ -58,7 +58,7 @@
</template>

<script>
import foot from '@/components/foot/foot'

// import '@/assets/style/common.less'
import List0 from './list-all'
import List1 from './list-index'
@@ -70,7 +70,7 @@

export default {
  components: {
    foot,

    List0,
    List1,
    List2,

 src/page/user/order-list.vue

@@ -26,12 +26,11 @@
        <List4 :selectedNumber='selected'/>
      </mt-tab-container-item>
    </mt-tab-container>
    <foot></foot>
  </div>
</template>

<script>
import foot from '@/components/foot/foot'

// import '@/assets/style/common.less'
import List1 from './order-list1'
import List2 from './order-list2'
@@ -42,7 +41,6 @@

export default {
  components: {
    foot,
    List1,
    List2,
    List3,
@@ -150,7 +148,7 @@
    .mint-tab-item {
      padding: 0.3rem 0;
      background-color: #16171D;
      

    }
    .top-nav-item{
      position: relative;
@@ -207,7 +205,7 @@
    }
    .table-title {
      font-size: .24rem;
      

    }
    .table-value {
      font-size: .24rem;
@@ -231,7 +229,7 @@
    .top-navbar {
      background-color: #E9E9E9 !important;
      .mint-tab-item {
        background-color: #E9E9E9; 
        background-color: #E9E9E9;
      }
      .top-nav-item.is-selected {
        color : #000;
@@ -249,7 +247,7 @@
    .load-all {
      background: #fff !important;
    }
    

  }
  /deep/.red-theme .order-info-box{
      background-color: #fff ;

 src/page/user/order-list1.vue

@@ -25,7 +25,7 @@
        <HistoryList :selectedNumber='selectedNumber' :hasChangeSell="hasChangeSell" :handleOptions='handleOptions'/>
      </mt-tab-container-item>
    </mt-tab-container>
    <foot></foot>
    <!-- <foot></foot> -->
  </div>
</template>


 src/page/user/order-list2.vue

@@ -26,7 +26,7 @@
                          :handleOptions='handleOptions2'/>
      </mt-tab-container-item>
    </mt-tab-container>
    <foot></foot>
    <!-- <foot></foot> -->
  </div>
</template>


 src/page/user/order-list3.vue

@@ -19,7 +19,7 @@
        <HistoryList :hasChangeSell="hasChangeSell" :handleOptions='handleOptions'/>
      </mt-tab-container-item>
    </mt-tab-container>
    <foot></foot>
   <!-- <foot></foot> -->
  </div>
</template>


 src/page/user/order-list4.vue

@@ -25,7 +25,7 @@
        <HistoryList :selectedNumber='selectedNumber' :hasChangeSell="hasChangeSell2" :handleOptions='handleOptions2'/>
      </mt-tab-container-item>
    </mt-tab-container>
    <foot></foot>
    <!-- <foot></foot> -->
  </div>
</template>


 src/page/user/user.vue

@@ -387,7 +387,7 @@
        <span class="text-center btnok loginout" @click="toRegister">注销登录</span>
      </div>
    </div>
    <foot></foot>
    <!-- <foot></foot> -->
  </div>
</template>
<script type="text/ecmascript-6">

			@@ -24,7 +24,7 @@
			},

			// Various Dev Server settings
			host: 'localhost', // can be overwritten by process.env.HOST
			host: '0.0.0.0', // can be overwritten by process.env.HOST
			port: 80, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
			autoOpenBrowser: true,
			errorOverlay: true,

			@@ -41,6 +41,34 @@
			}
			}
			</script>
			<script>
			// // 禁用缩放
			// function addMeta() {
			// $('head').append('<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />');
			// }
			// setTimeout(addMeta, 3000);

			// // 禁用双指放大
			// document.documentElement.addEventListener('touchstart', function (event) {
			// if (event.touches.length > 1) {
			// event.preventDefault();
			// }
			// }, {
			// passive: false
			// });

			// // 禁用双击放大
			// var lastTouchEnd = 0;
			// document.documentElement.addEventListener('touchend', function (event) {
			// var now = Date.now();
			// if (now - lastTouchEnd <= 300) {
			// event.preventDefault();
			// }
			// lastTouchEnd = now;
			// }, {
			// passive: false
			// });
			</script>
			</head>
			<body style="height: 100%; position: absolute; width: 100%;">
			<div id="app"></div>

			@@ -18,11 +18,16 @@
			<router-view></router-view>
			</transition>
			</div>
			<foot></foot>
			</div>
			</template>

			<script>
			import foot from "@/components/foot.vue";
			export default {
			components: {
			foot,
			},
			name: "App",
			created() {
			let title = this.$route.meta.title \|\| "首页";

New file
			@@ -0,0 +1,168 @@
			<template>
			<div class="footCss">
			<div :class="touch==1?'footDemos':'footDemo'" @click="goRouter('/home',1)">
			<div class="homeImgOut" v-show="$store.state.select == '/home'">
			<div class="homeImg">
			<img src="~@/assets/foot/ic_home_tab_def.png" />
			</div>
			</div>
			<div v-show="$store.state.select != '/home'" class="footImgDeft">
			<img src="~@/assets/foot/home_default.png" />
			</div>
			<div v-show="$store.state.select != '/home'">首页</div>
			</div>
			<div :class="touch==2?'footDemos':'footDemo'" @click="goRouter('/list',2)">
			<div class="footImgDeft">

			<img v-show="$store.state.select == '/list'" src="~@/assets/foot/trade_selected.png" />
			<img v-show="$store.state.select != '/list'" src="~@/assets/foot/trade_default.png" />
			</div>
			<div :class="$store.state.select == '/list'?'blueFont':''">交易</div>
			</div>
			<div :class="touch==3?'footDemos':'footDemo'" @click="goRouter('/orderlist',3)">
			<div class="footImgDeft">
			<img v-show="$store.state.select == '/orderlist'" src="~@/assets/foot/positions_selected.png" />
			<img v-show="$store.state.select != '/orderlist'" src="~@/assets/foot/positions_default.png" />
			</div>
			<div :class="$store.state.select == '/orderlist'?'blueFont':''">仓位</div>
			</div>
			<div :class="touch==4?'footDemos':'footDemo'" @click="goRouter('/user',4)">
			<div class="footImgDeft">
			<img v-show="$store.state.select == '/user'" src="~@/assets/foot/mine_selected.png" />
			<img v-show="$store.state.select != '/user'" src="~@/assets/foot/mine_default.png" />
			</div>
			<div :class="$store.state.select == '/user'?'blueFont':''">我的</div>
			</div>
			</div>
			</template>

			<script>
			export default {
			data() {
			return {
			touch: 0,
			}
			},
			mounted() {

			},
			methods: {
			goRouter(url, index) {
			this.touch = index
			setTimeout(() => {
			this.touch = 0
			}, 500)
			this.$router.push(url)
			if (navigator.vibrate) {
			// 支持
			navigator.vibrate([55]);
			}
			}
			},

			}
			</script>

			<style>
			.footCss {
			border-top: 0.01rem solid rgba(192, 192, 192, 0.1);
			background: rgb(33, 33, 43);
			position: fixed;
			bottom: 0;
			width: 100%;
			height: 1.3rem;
			display: flex;
			justify-content: space-around;
			}

			.footDemo {
			width: 0.8rem;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			flex-wrap: wrap;
			font-size: 0.24rem;
			}

			.footDemos {
			width: 0.8rem;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			flex-wrap: wrap;
			font-size: 0.24rem;
			}

			.footDemos::before {
			content: '';
			width: 0.9rem;
			height: 0.9rem;
			border-radius: 100%;
			position: absolute;
			background-color: rgba(25, 122, 246, 0.14);
			-webkit-animation: footBlueBg 0.5s linear infinite;
			animation: footBlueBg 0.5s linear infinite;
			transition: all 0.5s;
			}

			@-webkit-keyframes footBlueBg {
			0% {
			-webkit-transform: scale(1.6);
			transform: scale(1.6);
			}

			25% {
			-webkit-transform: scale(1.3);
			transform: scale(1.3);
			}

			50% {
			-webkit-transform: scale(1);
			transform: scale(1);
			}

			75% {
			background-color: rgba(25, 122, 246, 0.1);

			}

			100% {
			background-color: rgba(25, 122, 246, 0);
			}
			}

			.footImgDeft {
			width: 0.56rem;
			height: 0.56rem;
			margin-bottom: 0.08rem;

			}

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

			.homeImgOut {
			width: 0.9rem;
			height: 0.9rem;
			border-radius: 100%;
			background-color: rgb(25, 122, 246);
			}

			.homeImg {
			width: 0.9rem;
			height: 0.9rem;
			}

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

			.blueFont {
			color: rgb(25, 122, 246);
			}
			</style>

			@@ -25,7 +25,8 @@
			import animated from 'animate.css' // npm install animate.css --save安装，在引入

			import '../static/css/public2.css'

			import echarts from 'echarts'
			Vue.prototype.$echarts = echarts;
			// import VueTouch from 'vue-touch'
			Vue.use(Swipe);
			Vue.use(SwipeItem);

			@@ -62,7 +62,7 @@
			> .btn {
			width: 1.7949rem;
			height: .7692rem;
			background: rgb(54,124,248);
			background: rgb(25,122,246);
			border-radius: .1064rem;
			display: flex;
			justify-content: center;

New file
			@@ -0,0 +1,87 @@
			<template>
			<div style="width: 100%;height: 100%;">
			<div style="width: 100%;height: 100%;" :id="'main'+ids"></div>
			</div>
			</template>
			<script>
			import * as echarts from 'echarts';
			export default{
			props:{
			ids:{
			type:String,
			default: '0',
			},
			colorType:{
			type:Number,
			default: 0,
			}
			},
			data () {
			return {
			myChart:"",
			};
			},
			methods: {
			initCharts () {
			var chartDom = document.getElementById('main'+this.ids);
			var myChart = echarts.init(chartDom, 'dark');
			var option;
			var greenOrRed="";
			var greenOrReds="";
			console.log(this.colorType)
			if(this.colorType>0){
			greenOrRed='rgba(65,172,117,0.6)'
			greenOrReds='rgba(65,172,117,0.05)'
			}else{
			greenOrRed='rgba(166,10,36,0.6)'
			greenOrReds='rgba(166,10,36,0.05)'
			}
			option = {
			xAxis: {
			show:false,
			type: 'category',
			boundaryGap: false,

			},
			yAxis: {
			show:false,
			type: 'value'
			},
			tooltip: {
			show: true,
			extraCssText:'100%;height: 1.5385rem;'
			},
			backgroundColor: 'rgba(0,0,0,0)',
			color: {
			type: 'linear',
			x:0,
			y:0,
			x2: 0,
			y2: 1,
			colorStops: [{
			offset: 0, color: greenOrRed // 0% 处的颜色
			}, {
			offset: 1, color: greenOrReds // 100% 处的颜色
			}],
			globalCoord: false // 缺省为 false
			},
			series: [
			{
			data: [820, 932, 901, 934, 1000, 900, 1320,820, 932, 901, 934, 1000, 900,],
			type: 'line',
			areaStyle: {}
			}
			]
			};

			option && myChart.setOption(option);
			}
			},
			mounted () {
			this.initCharts();
			window.onresize = function() {
			this.myChart.resize();
			};
			}
			}
			</script>

			@@ -39,6 +39,7 @@
			</div>
			</div>
			</div>

			<!-- 排行入门 -->
			<van-skeleton title :row="2" :loading="loading" />
			<div class="navs" v-if="!loading">
			@@ -68,24 +69,28 @@
			<van-swipe class="fo_my-swipe" :autoplay="0" indicator-color="white" @change="onChange">
			<van-swipe-item v-for="(item, index) in proData" :key="index" style="margin-top: 20px;">
			<div class="item_cont" v-for="(item2, idx) in proData[currentIndex]" :key="idx">
			<div class="top_fo">
			<div class="title">
			<div class="top_fo" style="width: 80%;">
			<div class="title" style="width: 30%;">
			<span>{{ item2.f14 }}</span>
			</div>
			<div class="numbers">
			<span>{{ item2.f2 }}</span>
			</div>
			<div class="percentage" :class="item2.f3 > 0 ? 'gree' : 'redd'">
			<div class="percentage" :class="item2.f3 > 0 ? 'gree' : 'redd'">

			<span>{{ item2.f3 > 0 ? `+${item2.f3}%` : `${item2.f3}%` }}</span>
			</div>
			<div class="percentage"></div>
			<div class="percentage" style="width: 38%;position: absolute;right: 0;" :class="item2.f3 > 0 ? 'gree' : 'redd'">
			<echart :colorType="item2.f3" :ids="idx+'1'+index"></echart>
			</div>
			</div>
			<div class="bottom_fo">
			<div class="title">
			<div class="bottom_fo" style="width: 80%;">
			<div class="title"style="width: 30%;">
			<span>{{ item2.f12 }}</span>
			<img :src="Huo" alt style="margin-left: 0.12rem;" />
			</div>
			<div class="numbers">
			<span>{{ '04:59:57' }}</span>
			<div class="percentage" >
			<!-- class="numbers" -->
			<!-- <span>{{ '04:59:57' }}</span> -->
			<span>{{ item2.f2 }}</span>
			</div>
			<div class="percentage">
			<span></span>
			@@ -150,14 +155,14 @@
			<!-- tab -->

			<GoToLogin />
			<!-- <foot></foot> -->
			</div>
			</template>

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

			import AllList from "@/page/list/list-all";
			import HomeList from "./components/home-list";
			import Echart from "./components/echart.vue";
			import {
			Toast
			} from "mint-ui";
			@@ -179,10 +184,10 @@

			export default {
			components: {
			foot,
			HomeList,
			AllList,
			GoToLogin,
			Echart
			},
			props: {},
			data() {
			@@ -232,7 +237,7 @@
			methods: {
			async getNewsList(type) {
			let data = await api.queryNewsList(type);
			console.log('xinwen:', data)

			switch (type) {
			case 1:
			this.newsContent1 = data.data.list
			@@ -252,7 +257,7 @@
			}
			},
			handleBannerClick(ind) {
			console.log(ind);
			// console.log(ind);
			},
			ProcessData() {
			// 把数据分割成三等份
			@@ -263,7 +268,7 @@
			onChange(index) {
			this.currentIndex = index;
			this.proData[index].forEach(item => {
			console.log(item.f14);
			// console.log(item.f14);
			});
			},
			handleSearchClick() {
			@@ -308,6 +313,9 @@
			this.getNewsList(1);
			this.getNewsList(2);
			this.getNewsList(4);



			setTimeout(() => {
			this.loading = false
			}, 1000)
			@@ -533,7 +541,7 @@
			}

			.title {
			width: 50%;
			width: 20%;
			height: 100%;
			display: flex;
			align-items: center;

			@@ -58,7 +58,7 @@
			</template>

			<script>
			import foot from '@/components/foot/foot'

			// import '@/assets/style/common.less'
			import List0 from './list-all'
			import List1 from './list-index'
			@@ -70,7 +70,7 @@

			export default {
			components: {
			foot,

			List0,
			List1,
			List2,

			@@ -26,12 +26,11 @@
			<List4 :selectedNumber='selected'/>
			</mt-tab-container-item>
			</mt-tab-container>
			<foot></foot>
			</div>
			</template>

			<script>
			import foot from '@/components/foot/foot'

			// import '@/assets/style/common.less'
			import List1 from './order-list1'
			import List2 from './order-list2'
			@@ -42,7 +41,6 @@

			export default {
			components: {
			foot,
			List1,
			List2,
			List3,
			@@ -150,7 +148,7 @@
			.mint-tab-item {
			padding: 0.3rem 0;
			background-color: #16171D;


			}
			.top-nav-item{
			position: relative;
			@@ -207,7 +205,7 @@
			}
			.table-title {
			font-size: .24rem;


			}
			.table-value {
			font-size: .24rem;
			@@ -231,7 +229,7 @@
			.top-navbar {
			background-color: #E9E9E9 !important;
			.mint-tab-item {
			background-color: #E9E9E9;
			background-color: #E9E9E9;
			}
			.top-nav-item.is-selected {
			color : #000;
			@@ -249,7 +247,7 @@
			.load-all {
			background: #fff !important;
			}


			}
			/deep/.red-theme .order-info-box{
			background-color: #fff ;

			@@ -25,7 +25,7 @@
			<HistoryList :selectedNumber='selectedNumber' :hasChangeSell="hasChangeSell" :handleOptions='handleOptions'/>
			</mt-tab-container-item>
			</mt-tab-container>
			<foot></foot>
			<!-- <foot></foot> -->
			</div>
			</template>

			@@ -26,7 +26,7 @@
			:handleOptions='handleOptions2'/>
			</mt-tab-container-item>
			</mt-tab-container>
			<foot></foot>
			<!-- <foot></foot> -->
			</div>
			</template>

			@@ -19,7 +19,7 @@
			<HistoryList :hasChangeSell="hasChangeSell" :handleOptions='handleOptions'/>
			</mt-tab-container-item>
			</mt-tab-container>
			<foot></foot>
			<!-- <foot></foot> -->
			</div>
			</template>

			@@ -387,7 +387,7 @@
			<span class="text-center btnok loginout" @click="toRegister">注销登录</span>
			</div>
			</div>
			<foot></foot>
			<!-- <foot></foot> -->
			</div>
			</template>
			<script type="text/ecmascript-6">