Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
S
shld-databoard-ui
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
潘自豪 Rambo Pan
shld-databoard-ui
Commits
c36a9928
Commit
c36a9928
authored
Sep 20, 2023
by
王礼鸿 Baimax Wang
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
领域细分页面提交
parent
110cae9e
Changes
11
Hide whitespace changes
Inline
Side-by-side
Showing
11 changed files
with
5720 additions
and
23 deletions
+5720
-23
index.css
src/module/databoard/assets/index.css
+1
-0
winners-list.vue
src/module/databoard/components/card/winners-list.vue
+17
-8
line-bar-chart.vue
src/module/databoard/components/chart/line-bar-chart.vue
+201
-0
title-content-mark.vue
...module/databoard/components/layout/title-content-mark.vue
+1
-0
table-column.vue
src/module/databoard/components/table/table-column.vue
+25
-8
order_proportion.json
...module/databoard/databoard/mockData/order_proportion.json
+5278
-0
order-proportion.vue
src/module/databoard/databoard/order-proportion.vue
+155
-0
turnover-detail.vue
src/module/databoard/databoard/turnover-detail.vue
+18
-2
index.vue
src/module/databoard/index.vue
+2
-3
index.vue
src/module/index/index.vue
+16
-2
index_router.js
src/module/index/router/index_router.js
+6
-0
No files found.
src/module/databoard/assets/index.css
View file @
c36a9928
...
@@ -5,6 +5,7 @@
...
@@ -5,6 +5,7 @@
--container-shadow-color
:
#0930A9
;
/* 容器阴影色 */
--container-shadow-color
:
#0930A9
;
/* 容器阴影色 */
--corner-background-color
:
#0E5FFF
;
/* 容器角标色 */
--corner-background-color
:
#0E5FFF
;
/* 容器角标色 */
--card-background-color
:
#041755
;
/* 卡片背景色 */
--card-background-color
:
#041755
;
/* 卡片背景色 */
--card-background-select-color
:
#051135
;
/* 卡片背景色 */
--card-border1-color
:
#3673A3
;
/* 卡片边框色1 */
--card-border1-color
:
#3673A3
;
/* 卡片边框色1 */
--card-border2-color
:
#19EBFF
;
/* 卡片边框色2 */
--card-border2-color
:
#19EBFF
;
/* 卡片边框色2 */
--white-text-color
:
white
;
/* 白色文本 */
--white-text-color
:
white
;
/* 白色文本 */
...
...
src/module/databoard/components/card/winners-list.vue
View file @
c36a9928
...
@@ -3,9 +3,9 @@
...
@@ -3,9 +3,9 @@
<table>
<table>
<tbody>
<tbody>
<tr
v-for=
"(row, idx) in $props.rows"
:key=
"idx"
:style=
"
{height: 100 / rows.length + '%'}">
<tr
v-for=
"(row, idx) in $props.rows"
:key=
"idx"
:style=
"
{height: 100 / rows.length + '%'}">
<td><div
class=
"col_number"
>
{{
idx
+
1
}}
</div></td>
<td
v-if=
"showIcon"
><div
class=
"col_number"
>
{{
idx
+
1
}}
</div></td>
<td
class=
"winner_span"
>
{{
row
.
title
}}
</td>
<td
class=
"winner_span"
:style=
"columnsStyle['title']"
>
{{
row
.
title
}}
</td>
<td
v-for=
"(col, idz) in row.column"
:key=
"idz"
>
<td
v-for=
"(col, idz) in row.column"
:key=
"idz"
:style=
"columnsStyle[col.key]"
>
<p
class=
"key_span"
>
{{
col
.
key
}}
</p>
<p
class=
"key_span"
>
{{
col
.
key
}}
</p>
<p
class=
"value_span"
>
{{
col
.
value
}}
</p>
<p
class=
"value_span"
>
{{
col
.
value
}}
</p>
</td>
</td>
...
@@ -19,13 +19,22 @@
...
@@ -19,13 +19,22 @@
export
default
{
export
default
{
name
:
"WinnersList"
,
name
:
"WinnersList"
,
props
:
{
props
:
{
showIcon
:
{
type
:
Boolean
,
default
:
true
},
columnsStyle
:{
type
:
Object
,
},
rows
:
{
rows
:
{
type
:
Array
,
type
:
Array
,
default
:
[
default
:
function
(){
{
title
:
'标题列'
,
column
:
[{
key
:
'字段'
,
value
:
'0'
}]},
return
[
{
title
:
'标题列'
,
column
:
[{
key
:
'字段'
,
value
:
'0'
}]},
{
title
:
'标题列'
,
column
:
[{
key
:
'字段'
,
value
:
'0'
}]},
{
title
:
'标题列'
,
column
:
[{
key
:
'字段'
,
value
:
'0'
}]}
{
title
:
'标题列'
,
column
:
[{
key
:
'字段'
,
value
:
'0'
}]},
]
{
title
:
'标题列'
,
column
:
[{
key
:
'字段'
,
value
:
'0'
}]}
];
}
}
}
},
},
data
()
{
data
()
{
...
...
src/module/databoard/components/chart/line-bar-chart.vue
0 → 100644
View file @
c36a9928
<
template
>
<div
ref=
"chart"
@
click=
""
/>
</
template
>
<
script
>
import
*
as
echarts
from
"echarts"
;
export
default
{
name
:
"LineBarChart"
,
data
()
{
return
{
chart
:
null
,
};
},
watch
:
{
data
(
n
,
o
){
this
.
refreshData
();
},
x
(
n
,
o
){
this
.
refreshData
();
},
y
(
n
,
o
){
this
.
refreshData
();
},
title
(
n
,
o
){
this
.
refreshData
();
},
formatter
(
n
,
o
){
this
.
refreshData
();
},
barFormatter
(
n
,
o
){
this
.
refreshData
();
},
lineFormatter
(
n
,
o
){
this
.
refreshData
();
},
},
methods
:
{
resizeChart
()
{
if
(
this
.
chart
)
{
this
.
chart
.
resize
();
}
},
refreshData
(){
this
.
option
.
title
.
text
=
this
.
title
;
this
.
option
.
dataset
.
source
=
this
.
data
;
this
.
option
.
dataset
.
dimensions
=
[
this
.
x
,
this
.
y
];
this
.
option
.
tooltip
.
formatter
=
this
.
formatter
;
this
.
option
.
series
[
0
].
label
.
formatter
=
this
.
barFormatter
;
this
.
option
.
series
[
1
].
label
.
formatter
=
this
.
lineFormatter
;
if
(
this
.
chart
){
this
.
chart
.
setOption
(
this
.
option
);
}
}
},
mounted
()
{
setTimeout
(()
=>
{
let
chartDom
=
this
.
$refs
.
chart
;
this
.
refreshData
();
this
.
chart
=
echarts
.
init
(
chartDom
);
this
.
chart
.
setOption
(
this
.
option
);
window
.
addEventListener
(
'resize'
,
this
.
resizeChart
);
},
500
)
},
beforeDestroy
()
{
window
.
removeEventListener
(
"resize"
,
this
.
resizeChart
);
},
props
:
{
title
:
{
type
:
String
,
default
:
"折线条形图"
,
},
x
:
{
type
:
String
,
default
:
"x"
,
},
y
:
{
type
:
String
,
default
:
"y"
,
},
data
:
{
type
:
Array
,
default
:
function
(){
return
[
{
"x"
:
"2月1日"
,
"y"
:
747
,
},
{
"x"
:
"2月2日"
,
"y"
:
786
,
},
{
"x"
:
"2月3日"
,
"y"
:
547
,
},
]
}
},
option
:{
type
:
Object
,
default
:
function
()
{
return
{
tooltip
:
{
trigger
:
'axis'
,
},
title
:
{
text
:
'折线条形图'
,
textStyle
:{
color
:
'white'
,
},
left
:
'center'
},
grid
:{
left
:
"5%"
,
right
:
"3%"
,
},
dataset
:
{
dimensions
:
[
'x'
,
'y'
],
source
:
[
{
"x"
:
"2月1日"
,
"y"
:
747
,
},
{
"x"
:
"2月2日"
,
"y"
:
786
,
},
{
"x"
:
"2月3日"
,
"y"
:
547
,
},
]
},
xAxis
:
{
type
:
'category'
,
axisLabel
:
{
interval
:
0
,
rotate
:
15
,
color
:
'white'
}
},
yAxis
:
[
{
type
:
'value'
,
axisLabel
:
{
color
:
'white'
}
},
{
type
:
'value'
,
axisLabel
:
{
color
:
'white'
},
splitLine
:
false
}
],
series
:
[
{
type
:
'bar'
,
label
:
{
show
:
true
,
position
:
'top'
,
color
:
"#00CCD2"
},
color
:
{
type
:
'linear'
,
x
:
0
,
y
:
0
,
x2
:
0
,
y2
:
1
,
colorStops
:
[
{
offset
:
0
,
color
:
'#00CCD2'
},
{
offset
:
1
,
color
:
'#00A2FF'
}
]
}
},
{
type
:
'line'
,
color
:
'red'
,
label
:
{
show
:
true
,
position
:
'bottom'
,
color
:
"red"
},
}
]
}
}
},
formatter
:{
type
:
Function
},
barFormatter
:{
type
:
Function
},
lineFormatter
:{
type
:
Function
}
},
};
</
script
>
<
style
scoped
>
</
style
>
src/module/databoard/components/layout/title-content-mark.vue
View file @
c36a9928
...
@@ -86,6 +86,7 @@ export default {
...
@@ -86,6 +86,7 @@ export default {
height
:
var
(
--titleHeight
);
height
:
var
(
--titleHeight
);
margin-left
:
10%
;
margin-left
:
10%
;
line-height
:
30px
;
line-height
:
30px
;
white-space
:
nowrap
;
}
}
.center-title
{
.center-title
{
...
...
src/module/databoard/components/table/table-column.vue
View file @
c36a9928
<
template
>
<
template
>
<table>
<table>
<thead
v-if=
"showHead"
>
<thead
v-if=
"showHead"
>
<tr><th>
{{
title
}}
</th></tr>
<tr><th
:style=
"eval('title',title)"
>
{{
title
}}
</th></tr>
</thead>
</thead>
<tbody>
<tbody>
<tr
v-for=
"row in data"
><td
:style=
"eval(
cellStyleJs,row[name])"
>
{{
row
[
name
]
}}
</td></tr>
<tr
v-for=
"row in data"
><td
:style=
"eval(
'cell',(row[name]?row[name]:''))"
>
{{
row
[
name
]?
row
[
name
]:
''
}}
</td></tr>
</tbody>
</tbody>
</table>
</table>
</
template
>
</
template
>
...
@@ -17,12 +17,17 @@ export default {
...
@@ -17,12 +17,17 @@ export default {
}
}
},
},
methods
:
{
methods
:
{
eval
(
str
,
data
){
eval
(
type
,
data
){
let
res
;
let
res
=
type
===
"title"
?
this
.
titleStyle
:
this
.
cellStyle
;
if
(
str
){
if
(
res
){
res
=
eval
(
str
);
return
res
;
}
else
if
(
this
.
cellStyleFunction
)
{
}
res
=
this
.
cellStyleFunction
(
data
);
let
styleJs
=
type
===
"title"
?
this
.
titleStyleJs
:
this
.
cellStyleJs
;
let
styleFunction
=
type
===
"title"
?
this
.
titleStyleFunction
:
this
.
cellStyleFunction
;
if
(
styleJs
){
res
=
eval
(
styleJs
);
}
else
if
(
styleFunction
)
{
res
=
styleFunction
(
data
);
}
}
return
res
;
return
res
;
}
}
...
@@ -42,12 +47,24 @@ export default {
...
@@ -42,12 +47,24 @@ export default {
data
:
{
data
:
{
type
:
Array
,
type
:
Array
,
},
},
cellStyle
:
{
type
:
Object
,
},
cellStyleJs
:
{
cellStyleJs
:
{
type
:
String
,
type
:
String
,
},
},
cellStyleFunction
:{
cellStyleFunction
:{
type
:
Function
type
:
Function
},
},
titleStyle
:
{
type
:
Object
,
},
titleStyleJs
:
{
type
:
String
,
},
titleStyleFunction
:{
type
:
Function
},
}
}
}
}
...
...
src/module/databoard/databoard/mockData/order_proportion.json
0 → 100644
View file @
c36a9928
This source diff could not be displayed because it is too large. You can
view the blob
instead.
src/module/databoard/databoard/order-proportion.vue
0 → 100644
View file @
c36a9928
<
template
>
<div
class=
"turnover-detail"
>
<div
class=
"menu"
>
<input
type=
"button"
:class=
"
{'selectedBtn': currentBtn.subdivide === 'domain'}" value="领域细分" @click="clickBtn('subdivide','domain')">
<input
type=
"button"
:class=
"
{'selectedBtn': currentBtn.subdivide === 'area'}" value="区域细分" @click="clickBtn('subdivide','area')">
<input
type=
"button"
:class=
"
{'selectedBtn': currentBtn.subdivide === 'base'}" value="基地细分" @click="clickBtn('subdivide','base')">
<input
type=
"button"
:class=
"
{'selectedBtn': currentBtn.subdivide === 'business'}" value="事业部细分" @click="clickBtn('subdivide','business')">
</div>
<div
class=
"menu"
>
<input
type=
"button"
:class=
"
{'selectedBtn': currentBtn.date === 'day'}" value="日统计" @click="clickBtn('date','day')">
<input
type=
"button"
:class=
"
{'selectedBtn': currentBtn.date === 'month'}" value="月统计" @click="clickBtn('date','month')">
<input
type=
"button"
:class=
"
{'selectedBtn': currentBtn.date === 'year'}" value="年统计" @click="clickBtn('date','year')">
</div>
<div
class=
"card-board"
v-if=
"currentBtn.subdivide === 'domain'"
>
<contrast-card
v-for=
"data in currentData.head"
style=
"height: 100%;width: 18%;"
:class=
"
{'selectCard': currentCard === data.title}" @click.native="selectCard(data)">
<title-content-mark
style=
"color: #369afa;float: left;width: 40%;font-size: 18px"
:title-style=
"
{'font-weight': 'bold'}" :title="data.title" :content="data.amount" isBold/>
<div
style=
"width: 60%; height: 100%; float:left; padding: 2% 2% 0 8%; line-height: 40px; display: flex; align-items: center;font-size: 16px;"
>
<table-column
style=
"float: left;width: 25%;"
:data=
"data.hb"
name=
"title"
/>
<table-column
style=
"float: left;width: 40%;"
:data=
"data.hb"
name=
"amount"
/>
<table-column
style=
"float: left;width: 35%;"
:data=
"data.hb"
name=
"rate"
cell-style-js=
"var res =
{color: '#5eeef4'}; if(data.indexOf('+') !== -1){res.color = '#fee064'} res;"/>
</div>
</contrast-card>
</div>
<div
class=
"card-board"
v-if=
"currentBtn.subdivide !== 'domain'"
>
<contrast-card
v-for=
"data in currentData.head"
style=
"height: 100%;width: 18%;"
:class=
"
{'selectCard': currentCard === data.title}" @click.native="selectCard(data)" :style="listCardStyle">
<div
style=
"width: 100%; height: 100%; float:left; padding: 2%; line-height: 28px; display: flex; align-items: center; font-size: 14px;"
>
<table-column
style=
"float: left;width: 35%;"
:data=
"data.data"
name=
"title"
:title=
"data.title"
show-head
:title-style=
"
{'font-size': '18px','padding-left':'7%','white-space': 'nowrap'}"/>
<table-column
style=
"float: left;width: 45%;font-size: 24px;font-weight: bold;color: #5eeef4;text-align: center;"
:data=
"data.data"
name=
"today"
show-head
/>
<table-column
style=
"float: left;width: 20%;"
:data=
"data.data"
name=
"yesterday"
title=
"昨日"
show-head
/>
</div>
</contrast-card>
</div>
<div
class=
"chart"
>
<display-board
class=
"trade_left"
:title=
"listTitle"
title_size=
"large"
>
<winners-list
style=
"height: 96%"
id=
"ar_company_list"
:rows=
"currentData[currentCard]?currentData[currentCard].list:[]"
:show-icon=
"false"
:columns-style=
"
{'title':{'width':'50%'},'订单量(万吨)':{'width':'30%'}}"/>
</display-board>
<line-bar-chart
style=
"width: 75%;height: 100%;"
:data=
"currentData[currentCard]?currentData[currentCard].detail:[]"
x=
"company"
y=
"value"
:title=
"chartTitle"
:formatter=
"formatter"
:line-formatter=
"lineFormatter"
/>
</div>
</div>
</
template
>
<
script
>
import
TitleContentMark
from
"../components/layout/title-content-mark.vue"
;
import
TableColumn
from
"../components/table/table-column.vue"
;
import
ContrastCard
from
"../components/card/contrast-card.vue"
;
import
*
as
echarts
from
"echarts"
;
import
data
from
"./mockData/order_proportion.json"
;
import
DisplayBoard
from
"../components/container/display-board.vue"
;
import
WinnersList
from
"../components/card/winners-list.vue"
;
import
LineBarChart
from
"../components/chart/line-bar-chart.vue"
;
export
default
{
name
:
"OrderProportion"
,
components
:
{
LineBarChart
,
WinnersList
,
DisplayBoard
,
ContrastCard
,
TableColumn
,
TitleContentMark
},
data
()
{
return
{
currentData
:
{},
mockData
:
data
,
chart
:
null
,
currentCard
:
null
,
listTitle
:
"当日订单量占比"
,
chartTitle
:
"当日订单委托单位占比"
,
listCardStyle
:{
width
:
"18%"
,
},
currentBtn
:{
date
:
"day"
,
subdivide
:
"domain"
,
},
}
},
methods
:
{
back
(){
this
.
$router
.
push
({
path
:
'/'
});
},
changeDimension
(){
this
.
currentData
=
this
.
mockData
[
this
.
currentBtn
.
subdivide
][
this
.
currentBtn
.
date
];
this
.
currentCard
=
this
.
currentData
.
head
[
0
].
title
;
this
.
calcCardWidth
();
},
clickBtn
(
type
,
dimension
){
this
.
currentBtn
[
type
]
=
dimension
;
this
.
changeDimension
();
},
selectCard
(
data
){
this
.
currentCard
=
data
.
title
;
},
formatter
(
param
){
return
"订单量:<br>"
+
param
[
0
].
marker
+
param
[
0
].
name
+
":
\
t"
+
param
[
0
].
data
.
value
+
"<br> "
+
param
[
1
].
marker
+
"占比:"
+
param
[
1
].
data
.
proportion
+
"%"
;
},
lineFormatter
(
param
){
return
param
.
data
.
proportion
+
'%'
;
},
calcCardWidth
(){
this
.
listCardStyle
.
width
=
"calc((100% - 4rem) / "
+
this
.
currentData
.
head
.
length
+
")"
;
}
},
mounted
()
{
this
.
changeDimension
();
setTimeout
(()
=>
{
let
chartDom
=
this
.
$refs
.
chart
;
this
.
chart
=
echarts
.
init
(
chartDom
);
this
.
chart
.
setOption
(
this
.
chartOption
);
},
500
)
},
}
</
script
>
<
style
scoped
>
.turnover-detail
{
width
:
100%
;
height
:
100%
;
}
.card-board
{
width
:
100%
;
height
:
25%
;
display
:
flex
;
justify-content
:
space-between
;
padding
:
2rem
;
}
.menu
{
width
:
100%
;
height
:
5%
;
display
:
flex
;
align-items
:
center
;
padding-left
:
2%
;
}
.chart
{
width
:
100%
;
height
:
65%
;
display
:
flex
;
justify-content
:
space-between
;
padding
:
0
2rem
2rem
2rem
;
}
input
[
type
=
"button"
]
{
height
:
80%
;
margin
:
0.5%
;
border
:
none
;
font-size
:
12px
;
border-radius
:
25px
;
padding
:
0
10px
;
color
:
#00c8d6
;
background-color
:
#1234a1
;
}
.selectedBtn
{
color
:
#1234a1
!important
;
background-color
:
#00c8d6
!important
;
}
.unSelectedBtn
{
color
:
#00c8d6
;
background-color
:
#1234a1
;
}
.selectCard
{
background-color
:
var
(
--card-background-select-color
)
!important
;
}
</
style
>
src/module/databoard/databoard/turnover-detail.vue
View file @
c36a9928
...
@@ -292,11 +292,14 @@ export default {
...
@@ -292,11 +292,14 @@ export default {
color
:
'white'
color
:
'white'
}
}
},
},
// Declare several bar series, each will be mapped
// to a column of dataset.source by default.
series
:
[
series
:
[
{
{
type
:
'bar'
,
type
:
'bar'
,
label
:
{
show
:
true
,
position
:
'top'
,
color
:
"#00CCD2"
,
},
color
:
{
color
:
{
type
:
'linear'
,
type
:
'linear'
,
x
:
0
,
y
:
0
,
x2
:
0
,
y2
:
1
,
x
:
0
,
y
:
0
,
x2
:
0
,
y2
:
1
,
...
@@ -308,6 +311,11 @@ export default {
...
@@ -308,6 +311,11 @@ export default {
},
},
{
{
type
:
'bar'
,
type
:
'bar'
,
label
:
{
show
:
true
,
position
:
'top'
,
color
:
"#FFFAB7"
,
},
color
:
{
color
:
{
type
:
'linear'
,
type
:
'linear'
,
x
:
0
,
y
:
0
,
x2
:
0
,
y2
:
1
,
x
:
0
,
y
:
0
,
x2
:
0
,
y2
:
1
,
...
@@ -319,6 +327,11 @@ export default {
...
@@ -319,6 +327,11 @@ export default {
},
},
{
{
type
:
'bar'
,
type
:
'bar'
,
label
:
{
show
:
true
,
position
:
'top'
,
color
:
"#81FBB8"
,
},
color
:
{
color
:
{
type
:
'linear'
,
type
:
'linear'
,
x
:
0
,
y
:
0
,
x2
:
0
,
y2
:
1
,
x
:
0
,
y
:
0
,
x2
:
0
,
y2
:
1
,
...
@@ -339,6 +352,9 @@ export default {
...
@@ -339,6 +352,9 @@ export default {
},
},
watch
:
{},
watch
:
{},
methods
:
{
methods
:
{
back
(){
this
.
$router
.
push
({
path
:
'/'
});
},
resizeChart
()
{
resizeChart
()
{
if
(
this
.
chart
)
{
if
(
this
.
chart
)
{
this
.
chart
.
resize
();
this
.
chart
.
resize
();
...
...
src/module/databoard/index.vue
View file @
c36a9928
...
@@ -88,8 +88,8 @@
...
@@ -88,8 +88,8 @@
</div>
</div>
<display-board
class=
"trade_right"
title=
"当日订单量占比"
>
<display-board
class=
"trade_right"
title=
"当日订单量占比"
>
<div
style=
"height: 100%; display: flex; flex-direction: column; justify-content: space-around; padding: 0 1rem 0 1rem;"
>
<div
style=
"height: 100%; display: flex; flex-direction: column; justify-content: space-around; padding: 0 1rem 0 1rem;"
>
<ring-pie-chart
ref=
"transportTypeChart"
style=
"width: 100%;height: 50%;"
name=
"运输类型占比"
:data=
"mockData.drddlzb.transportType"
/>
<ring-pie-chart
ref=
"transportTypeChart"
style=
"width: 100%;height: 50%;"
name=
"运输类型占比"
:data=
"mockData.drddlzb.transportType"
@
click
.
native=
"routerTo('/order-proportion')"
/>
<ring-pie-chart
ref=
"customerChart"
style=
"width: 100%;height: 50%;"
name=
"公司占比"
:data=
"mockData.drddlzb.customer"
/>
<ring-pie-chart
ref=
"customerChart"
style=
"width: 100%;height: 50%;"
name=
"公司占比"
:data=
"mockData.drddlzb.customer"
@
click
.
native=
"routerTo('/order-proportion')"
/>
</div>
</div>
</display-board>
</display-board>
</div>
</div>
...
@@ -377,7 +377,6 @@ export default {
...
@@ -377,7 +377,6 @@ export default {
}
}
},
},
routerTo
(
path
){
routerTo
(
path
){
console
.
log
(
path
)
this
.
$router
.
push
({
path
:
path
});
this
.
$router
.
push
({
path
:
path
});
},
},
// 跳转已开票未收款页面
// 跳转已开票未收款页面
...
...
src/module/index/index.vue
View file @
c36a9928
...
@@ -2,6 +2,7 @@
...
@@ -2,6 +2,7 @@
<div
class=
"page"
>
<div
class=
"page"
>
<div
class=
"head"
@
click=
"goIndex"
>
<div
class=
"head"
@
click=
"goIndex"
>
<div
class=
"text_left"
>
<div
class=
"text_left"
>
<input
class=
"btn"
type=
"button"
value=
"返回上级"
v-if=
"$route.fullPath !== '/index'"
@
click=
"goIndex"
>
<span>
2023-08-01
</span>
<span>
2023-08-01
</span>
<span>
17:18:29
</span>
<span>
17:18:29
</span>
<span>
星期三
</span>
<span>
星期三
</span>
...
@@ -30,6 +31,7 @@ export default {
...
@@ -30,6 +31,7 @@ export default {
},
},
methods
:
{
methods
:
{
goIndex
()
{
goIndex
()
{
console
.
log
(
this
.
$router
)
this
.
$router
.
push
({
path
:
'/'
})
this
.
$router
.
push
({
path
:
'/'
})
},
},
reload
()
{
reload
()
{
...
@@ -37,14 +39,14 @@ export default {
...
@@ -37,14 +39,14 @@ export default {
this
.
$nextTick
(
function
()
{
this
.
$nextTick
(
function
()
{
this
.
isRouterAlive
=
true
this
.
isRouterAlive
=
true
})
})
}
}
,
},
},
mounted
()
{
mounted
()
{
// 倒计时器
// 倒计时器
this
.
countDownTimer
=
setInterval
(()
=>
{
this
.
countDownTimer
=
setInterval
(()
=>
{
this
.
countDown
--
this
.
countDown
--
if
(
this
.
countDown
<=
0
)
{
if
(
this
.
countDown
<=
0
)
{
this
.
reload
()
//
this.reload()
this
.
countDown
=
10
this
.
countDown
=
10
}
}
},
1000
)
},
1000
)
...
@@ -69,4 +71,16 @@ export default {
...
@@ -69,4 +71,16 @@ export default {
padding-left
:
0
;
padding-left
:
0
;
}
}
}
}
.btn
{
height
:
70%
;
margin
:
0.5%
;
border
:
none
;
font-size
:
12px
;
border-radius
:
25px
;
padding
:
0
10px
;
line-height
:
100%
;
color
:
#00c8d6
;
background-color
:
#1234a1
;
margin
:
auto
;
}
</
style
>
</
style
>
src/module/index/router/index_router.js
View file @
c36a9928
...
@@ -7,6 +7,7 @@ import ArMonthlyBar from "../../databoard/components/chart/ar-monthly-bar.vue";
...
@@ -7,6 +7,7 @@ import ArMonthlyBar from "../../databoard/components/chart/ar-monthly-bar.vue";
import
ArCompanyMonthlyBar
from
"../../databoard/components/chart/ar-company-monthly-bar.vue"
;
import
ArCompanyMonthlyBar
from
"../../databoard/components/chart/ar-company-monthly-bar.vue"
;
import
ArMonthlyCompanyBar
from
"../../databoard/components/chart/ar-monthly-company-bar.vue"
;
import
ArMonthlyCompanyBar
from
"../../databoard/components/chart/ar-monthly-company-bar.vue"
;
import
TurnoverDetail
from
"../../databoard/databoard/turnover-detail.vue"
;
import
TurnoverDetail
from
"../../databoard/databoard/turnover-detail.vue"
;
import
OrderProportion
from
"../../databoard/databoard/order-proportion.vue"
;
Vue
.
use
(
Router
)
Vue
.
use
(
Router
)
...
@@ -56,6 +57,11 @@ export default new Router({
...
@@ -56,6 +57,11 @@ export default new Router({
path
:
'/turnover-detail'
,
path
:
'/turnover-detail'
,
name
:
'turnoverDetail'
,
name
:
'turnoverDetail'
,
component
:
TurnoverDetail
component
:
TurnoverDetail
},
{
path
:
'/order-proportion'
,
name
:
'OrderProportion'
,
component
:
OrderProportion
}
}
]
]
})
})
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment