Authored by 郭成尧

style-modified

@@ -6,10 +6,10 @@ @@ -6,10 +6,10 @@
6 <hr class="box-entry-line"> 6 <hr class="box-entry-line">
7 <div class="grade-bill-box"> 7 <div class="grade-bill-box">
8 <div class="grade-level"> 8 <div class="grade-level">
9 - 您当前的会员等级为:银卡会员 9 + <span>您当前的会员等级为:银卡会员</span>
10 </div> 10 </div>
11 <div class="grade-bill-title"> 11 <div class="grade-bill-title">
12 - 成长值来源 12 + <span>成长值来源</span>
13 </div> 13 </div>
14 <div class="grade-bill-list"> 14 <div class="grade-bill-list">
15 <div class="grade-bill"> 15 <div class="grade-bill">
@@ -3,7 +3,6 @@ import $ from 'yoho-jquery'; @@ -3,7 +3,6 @@ import $ from 'yoho-jquery';
3 import echarts from 'echarts'; 3 import echarts from 'echarts';
4 import Page from 'yoho-page'; 4 import Page from 'yoho-page';
5 5
6 -  
7 class GradeDetailPage extends Page { 6 class GradeDetailPage extends Page {
8 constructor() { 7 constructor() {
9 super(); 8 super();
@@ -16,16 +15,14 @@ class GradeDetailPage extends Page { @@ -16,16 +15,14 @@ class GradeDetailPage extends Page {
16 15
17 let option = { 16 let option = {
18 backgroundColor: '#2d2d2d', 17 backgroundColor: '#2d2d2d',
19 - grid: {  
20 - show: false  
21 - },  
22 tooltip: { 18 tooltip: {
23 trigger: 'none' 19 trigger: 'none'
24 }, 20 },
25 dataZoom: [{ 21 dataZoom: [{
26 type: 'inside', 22 type: 'inside',
27 startValue: '2月', 23 startValue: '2月',
28 - endValue: '5月', 24 + endValue: '6月',
  25 + zoomLock: true,
29 zoomOnMouseWheel: false, 26 zoomOnMouseWheel: false,
30 filterMode: 'none' 27 filterMode: 'none'
31 }], 28 }],
@@ -42,48 +39,65 @@ class GradeDetailPage extends Page { @@ -42,48 +39,65 @@ class GradeDetailPage extends Page {
42 value: '1月', 39 value: '1月',
43 textStyle: { 40 textStyle: {
44 color: '#fff', 41 color: '#fff',
45 - fontSize: 12 42 + fontSize: 14
46 } 43 }
47 }, { 44 }, {
48 value: '2月', 45 value: '2月',
49 textStyle: { 46 textStyle: {
50 color: '#fff', 47 color: '#fff',
51 - fontSize: 12 48 + fontSize: 14
52 } 49 }
53 }, { 50 }, {
54 value: '3月', 51 value: '3月',
55 textStyle: { 52 textStyle: {
56 color: '#fff', 53 color: '#fff',
57 - fontSize: 12 54 + fontSize: 14
58 } 55 }
59 }, { 56 }, {
60 value: '4月', 57 value: '4月',
61 textStyle: { 58 textStyle: {
62 color: '#fff', 59 color: '#fff',
63 - fontSize: 12 60 + fontSize: 14
64 } 61 }
65 }, { 62 }, {
66 value: '5月', 63 value: '5月',
67 textStyle: { 64 textStyle: {
68 - color: '#000',  
69 - fontWeight: 'bold',  
70 - fontSize: 18,  
71 - backgroundColor: '#fff' 65 + color: '#fff',
  66 + fontSize: 14
72 } 67 }
73 }, { 68 }, {
74 value: '6月', 69 value: '6月',
75 textStyle: { 70 textStyle: {
76 - color: '#fff',  
77 - fontSize: 12 71 + color: '#000',
  72 + fontSize: 18,
  73 + backgroundColor: '#fff'
78 } 74 }
79 - }] 75 + }],
  76 +
  77 + // axisLabel: {
  78 + // formatter: function(value) {
  79 + // if (value === '6月') {
  80 + // return '{current|6} {current|月}';
  81 + // }
  82 + // },
  83 + // rich: {
  84 + // normal: {
  85 + // color: '#fff',
  86 + // fontSize: 14
  87 + // },
  88 + // current: {
  89 + // color: '#fff',
  90 + // fontSize: 18
  91 + // }
  92 + // }
  93 + // }
80 }, 94 },
81 yAxis: { 95 yAxis: {
82 type: 'value', 96 type: 'value',
83 show: false, 97 show: false,
84 }, 98 },
85 series: [{ 99 series: [{
86 - data: [820, 932, 901, 934, 1290, 1330, 1320], 100 + data: [820, 932, 901, 934, 1290, 1330],
87 color: ['#A59075'], 101 color: ['#A59075'],
88 symbol: 'circle', 102 symbol: 'circle',
89 symbolSize: 8, 103 symbolSize: 8,
@@ -47,8 +47,12 @@ @@ -47,8 +47,12 @@
47 } 47 }
48 48
49 .grade-bill-title { 49 .grade-bill-title {
50 - text-align: center; 50 + display: flex;
  51 + align-items: center;
  52 + justify-content: center;
51 margin-top: 32px; 53 margin-top: 32px;
  54 + height: 60px;
  55 + background-image: resolve("activity/grade/BG@2x.png");
52 } 56 }
53 57
54 .grade-bill-list > .grade-bill { 58 .grade-bill-list > .grade-bill {