Skip to content

Commit 89a4c3b

Browse files
PanJiaChenPanJiaChen
committed
add
1 parent 15a7d07 commit 89a4c3b

File tree

19 files changed

+754
-98
lines changed

19 files changed

+754
-98
lines changed

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
"jquery": "3.1.1",
2222
"js-cookie": "2.1.3",
2323
"jsonlint": "1.6.2",
24+
"mockjs": "^1.0.1-beta3",
2425
"normalize.css": "3.0.2",
2526
"nprogress": "0.2.0",
2627
"showdown": "1.6.4",

‎src/api/article.js‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import fetch, { tpFetch } from 'utils/fetch';
2+
import { param } from 'utils';
3+
4+
export function getList(query) {
5+
return tpFetch({
6+
url: '/article/list',
7+
method: 'get'
8+
});
9+
}
10+
export function upload(data) {
11+
return tpFetch({
12+
url: 'https://upload.qbox.me',
13+
method: 'post',
14+
data
15+
});
16+
}
17+
18+
19+
/* 外部uri转七牛uri*/
20+
export function netUpload(token, net_url) {
21+
const imgData = {
22+
net_url
23+
};
24+
return fetch({
25+
url: '/qiniu/upload/net/async',
26+
method: 'post',
27+
data: imgData
28+
});
29+
}

‎src/components/Charts/keyboard.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,11 +17,11 @@
1717
props: {
1818
className: {
1919
type: String,
20-
default: 'bar-percent-chart'
20+
default: 'chart'
2121
},
2222
id: {
2323
type: String,
24-
default: 'bar-percent-chart'
24+
default: 'chart'
2525
},
2626
width: {
2727
type: String,

‎src/components/Charts/keyboard2.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,11 +17,11 @@
1717
props: {
1818
className: {
1919
type: String,
20-
default: 'bar-percent-chart'
20+
default: 'chart'
2121
},
2222
id: {
2323
type: String,
24-
default: 'bar-percent-chart'
24+
default: 'chart'
2525
},
2626
width: {
2727
type: String,

‎src/components/Charts/linemarker.vue‎

Lines changed: 219 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,219 @@
1+
<template>
2+
<div :class="className" :id="id" :style="{height:height,width:width}"></div>
3+
</template>
4+
<script>
5+
// 引入 ECharts 主模块
6+
const echarts = require('echarts/lib/echarts');
7+
8+
require('echarts/lib/chart/line');
9+
// 引入提示框和标题组件
10+
require('echarts/lib/component/tooltip');
11+
require('echarts/lib/component/title');
12+
require('echarts/lib/component/legend');
13+
export default {
14+
name: 'barPercent',
15+
props: {
16+
className: {
17+
type: String,
18+
default: 'chart'
19+
},
20+
id: {
21+
type: String,
22+
default: 'chart'
23+
},
24+
width: {
25+
type: String,
26+
default: '200px'
27+
},
28+
height: {
29+
type: String,
30+
default: '200px'
31+
}
32+
},
33+
data() {
34+
return {};
35+
},
36+
mounted() {
37+
this.initChart();
38+
},
39+
methods: {
40+
initChart() {
41+
this.chart = echarts.init(document.getElementById(this.id));
42+
43+
this.chart.setOption({
44+
backgroundColor: '#394056',
45+
title: {
46+
text: '请求数',
47+
textStyle: {
48+
fontWeight: 'normal',
49+
fontSize: 16,
50+
color: '#F1F1F3'
51+
},
52+
left: '6%'
53+
},
54+
tooltip: {
55+
trigger: 'axis',
56+
axisPointer: {
57+
lineStyle: {
58+
color: '#57617B'
59+
}
60+
}
61+
},
62+
legend: {
63+
icon: 'rect',
64+
itemWidth: 14,
65+
itemHeight: 5,
66+
itemGap: 13,
67+
data: ['移动', '电信', '联通'],
68+
right: '4%',
69+
textStyle: {
70+
fontSize: 12,
71+
color: '#F1F1F3'
72+
}
73+
},
74+
grid: {
75+
left: '3%',
76+
right: '4%',
77+
bottom: '3%',
78+
containLabel: true
79+
},
80+
xAxis: [{
81+
type: 'category',
82+
boundaryGap: false,
83+
axisLine: {
84+
lineStyle: {
85+
color: '#57617B'
86+
}
87+
},
88+
data: ['13:00', '13:05', '13:10', '13:15', '13:20', '13:25', '13:30', '13:35', '13:40', '13:45', '13:50', '13:55']
89+
}],
90+
yAxis: [{
91+
type: 'value',
92+
name: '单位（%）',
93+
axisTick: {
94+
show: false
95+
},
96+
axisLine: {
97+
lineStyle: {
98+
color: '#57617B'
99+
}
100+
},
101+
axisLabel: {
102+
margin: 10,
103+
textStyle: {
104+
fontSize: 14
105+
}
106+
},
107+
splitLine: {
108+
lineStyle: {
109+
color: '#57617B'
110+
}
111+
}
112+
}],
113+
series: [{
114+
name: '移动',
115+
type: 'line',
116+
smooth: true,
117+
symbol: 'circle',
118+
symbolSize: 5,
119+
showSymbol: false,
120+
lineStyle: {
121+
normal: {
122+
width: 1
123+
}
124+
},
125+
areaStyle: {
126+
normal: {
127+
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
128+
offset: 0,
129+
color: 'rgba(137, 189, 27, 0.3)'
130+
}, {
131+
offset: 0.8,
132+
color: 'rgba(137, 189, 27, 0)'
133+
}], false),
134+
shadowColor: 'rgba(0, 0, 0, 0.1)',
135+
shadowBlur: 10
136+
}
137+
},
138+
itemStyle: {
139+
normal: {
140+
color: 'rgb(137,189,27)',
141+
borderColor: 'rgba(137,189,2,0.27)',
142+
borderWidth: 12
143+
144+
}
145+
},
146+
data: [220, 182, 191, 134, 150, 120, 110, 125, 145, 122, 165, 122]
147+
}, {
148+
name: '电信',
149+
type: 'line',
150+
smooth: true,
151+
symbol: 'circle',
152+
symbolSize: 5,
153+
showSymbol: false,
154+
lineStyle: {
155+
normal: {
156+
width: 1
157+
}
158+
},
159+
areaStyle: {
160+
normal: {
161+
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
162+
offset: 0,
163+
color: 'rgba(0, 136, 212, 0.3)'
164+
}, {
165+
offset: 0.8,
166+
color: 'rgba(0, 136, 212, 0)'
167+
}], false),
168+
shadowColor: 'rgba(0, 0, 0, 0.1)',
169+
shadowBlur: 10
170+
}
171+
},
172+
itemStyle: {
173+
normal: {
174+
color: 'rgb(0,136,212)',
175+
borderColor: 'rgba(0,136,212,0.2)',
176+
borderWidth: 12
177+
178+
}
179+
},
180+
data: [120, 110, 125, 145, 122, 165, 122, 220, 182, 191, 134, 150]
181+
}, {
182+
name: '联通',
183+
type: 'line',
184+
smooth: true,
185+
symbol: 'circle',
186+
symbolSize: 5,
187+
showSymbol: false,
188+
lineStyle: {
189+
normal: {
190+
width: 1
191+
}
192+
},
193+
areaStyle: {
194+
normal: {
195+
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
196+
offset: 0,
197+
color: 'rgba(219, 50, 51, 0.3)'
198+
}, {
199+
offset: 0.8,
200+
color: 'rgba(219, 50, 51, 0)'
201+
}], false),
202+
shadowColor: 'rgba(0, 0, 0, 0.1)',
203+
shadowBlur: 10
204+
}
205+
},
206+
itemStyle: {
207+
normal: {
208+
color: 'rgb(219,50,51)',
209+
borderColor: 'rgba(219,50,51,0.2)',
210+
borderWidth: 12
211+
}
212+
},
213+
data: [220, 182, 125, 145, 122, 191, 134, 150, 120, 110, 165, 122]
214+
}]
215+
})
216+
}
217+
}
218+
}
219+
</script>

0 commit comments

Comments
 (0)