Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
C
CRM
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
华国豪
CRM
Commits
96162b51
Commit
96162b51
authored
May 19, 2022
by
黄奎
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
页面修改
parent
b52edba8
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
487 additions
and
465 deletions
+487
-465
dayStatistics.vue
src/views/workstatistics/dayStatistics.vue
+206
-197
monthStatistics.vue
src/views/workstatistics/monthStatistics.vue
+281
-268
No files found.
src/views/workstatistics/dayStatistics.vue
View file @
96162b51
<
template
>
<
template
>
<div
class=
"customerManage"
>
<div
class=
"customerManage"
>
<div
class=
"tools"
>
<div
class=
"tools"
>
<div
class=
"tools-item"
>
<div
class=
"tools-item"
>
<h1>
每日引流统计
</h1>
<h1>
每日引流统计
</h1>
</div>
</div>
<div
style=
"width: 340px;"
>
<div
style=
"width: 340px;"
>
<el-date-picker
<el-date-picker
v-model=
"msg.month"
type=
"month"
icon=
"el-icon-date"
slot=
"append"
class=
"input-with-select"
v-model=
"msg.month"
@
change=
"changeMonthHandler"
placeholder=
"选择查询的月份"
>
type=
"month"
</el-date-picker>
icon=
"el-icon-date"
</div>
slot=
"append"
<div
class=
"rightmenu"
>
class=
"input-with-select"
<el-dropdown
@
command=
"handleCommand"
>
@
change=
"changeMonthHandler"
<el-button
class=
"crm-btn crm-btn-more easy-btn margin-right0"
>
placeholder=
"选择查询的月份"
>
<i
class=
"iconfont icongengduo"
></i>
</el-date-picker>
</el-button>
</div>
<el-dropdown-menu
slot=
"dropdown"
>
<div
class=
"rightmenu"
>
<el-dropdown-item
command=
"1"
><i
class=
"iconfont icondaochu"
></i>
导出
</el-dropdown-item>
<el-dropdown
@
command=
"handleCommand"
>
</el-dropdown-menu>
<el-button
class=
"crm-btn crm-btn-more easy-btn margin-right0"
>
</el-dropdown>
<i
class=
"iconfont icongengduo"
></i>
</div>
</el-button>
<el-dropdown-menu
slot=
"dropdown"
>
<el-dropdown-item
command=
"1"
><i
class=
"iconfont icondaochu"
></i>
导出
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</div>
<div
class=
"page-content"
style=
"padding-bottom:20px;"
>
<el-table
:data=
"tableData"
tooltip-effect=
"dark"
v-loading=
"loading"
style=
"width: 100%;height:100%;"
border
:cell-class-name=
"tableCellClassName"
:row-class-name=
"tableRowClassName"
>
<el-table-column>
<template
slot-scope=
"scope"
>
<span
class=
"pointer"
@
click=
"seeDetails(scope.row)"
>
{{
scope
.
row
.
DateStr
}}
</span>
</
template
>
</el-table-column>
<el-table-column
prop=
"PushCount"
label=
"引流总数"
>
</el-table-column>
<el-table-column
prop=
"EffectiveCount"
label=
"有效总数"
>
</el-table-column>
<el-table-column
prop=
"InvalidCount"
label=
"无效总数"
>
</el-table-column>
<el-table-column
prop=
"RedBookCount"
label=
"小红书总数"
>
</el-table-column>
<el-table-column
prop=
"DouYinCount"
label=
"抖音总数"
>
</el-table-column>
<el-table-column
prop=
"FlyingPigCount"
label=
"飞猪总数"
>
</el-table-column>
<el-table-column
prop=
"GroupChatCount"
label=
"社群聊天总数"
>
</el-table-column>
<el-table-column
prop=
"OfflineVisitCount"
label=
"线下拜访总数"
>
</el-table-column>
<el-table-column
prop=
"StraightCustomerCount"
label=
"直客介绍总数"
>
</el-table-column>
<el-table-column
prop=
"PeerCount"
label=
"同业介绍总数"
>
</el-table-column>
<el-table-column
prop=
"OtherCount"
label=
"其他介绍总数"
>
</el-table-column>
<el-table-column
prop=
"OrderCount"
label=
"订单总数"
>
</el-table-column>
<el-table-column
prop=
"TicketOrderCount"
label=
"机票订单总数"
>
</el-table-column>
<el-table-column
prop=
"VisaOrderCount"
label=
"签证订单总数"
>
</el-table-column>
<el-table-column
prop=
"GroundOrderCount"
label=
"地接订单总数"
>
</el-table-column>
<el-table-column
prop=
"ComboOrderCount"
label=
"套餐订单总数"
>
</el-table-column>
</el-table>
</div>
<el-drawer
:with-header=
"false"
size=
'70%'
:visible
.
sync=
"drawer"
direction=
"rtl"
:before-close=
"handleClose"
>
<clueComponent
:isDrawer=
"isDrawer"
:queryTime=
"queryTime"
></clueComponent>
</el-drawer>
</div>
</div>
<div
class=
"page-content"
style=
"padding-bottom:20px;"
>
<el-table
:data=
"tableData"
tooltip-effect=
"dark"
v-loading=
"loading"
style=
"width: 100%;height:100%;"
border
:cell-class-name=
"tableCellClassName"
:row-class-name=
"tableRowClassName"
>
<el-table-column>
<template
slot-scope=
"scope"
>
<template
v-if=
"scope.row.YearStr>0&&scope.row.MonthStr>0"
>
<span
class=
"pointer"
style=
"color:blue;text-decoration:underline;"
@
click=
"seeDetails(scope.row)"
>
{{
scope
.
row
.
DateStr
}}
</span>
</
template
>
<
template
v-else
>
<span>
{{
scope
.
row
.
DateStr
}}
</span>
</
template
>
</template>
</el-table-column>
<el-table-column
prop=
"PushCount"
label=
"引流总数"
>
</el-table-column>
<el-table-column
prop=
"EffectiveCount"
label=
"有效总数"
>
</el-table-column>
<el-table-column
prop=
"InvalidCount"
label=
"无效总数"
>
</el-table-column>
<el-table-column
prop=
"RedBookCount"
label=
"小红书总数"
>
</el-table-column>
<el-table-column
prop=
"DouYinCount"
label=
"抖音总数"
>
</el-table-column>
<el-table-column
prop=
"FlyingPigCount"
label=
"飞猪总数"
>
</el-table-column>
<el-table-column
prop=
"GroupChatCount"
label=
"社群聊天总数"
>
</el-table-column>
<el-table-column
prop=
"OfflineVisitCount"
label=
"线下拜访总数"
>
</el-table-column>
<el-table-column
prop=
"StraightCustomerCount"
label=
"直客介绍总数"
>
</el-table-column>
<el-table-column
prop=
"PeerCount"
label=
"同业介绍总数"
>
</el-table-column>
<el-table-column
prop=
"OtherCount"
label=
"其他介绍总数"
>
</el-table-column>
<el-table-column
prop=
"OrderCount"
label=
"订单总数"
>
</el-table-column>
<el-table-column
prop=
"TicketOrderCount"
label=
"机票订单总数"
>
</el-table-column>
<el-table-column
prop=
"VisaOrderCount"
label=
"签证订单总数"
>
</el-table-column>
<el-table-column
prop=
"GroundOrderCount"
label=
"地接订单总数"
>
</el-table-column>
<el-table-column
prop=
"ComboOrderCount"
label=
"套餐订单总数"
>
</el-table-column>
</el-table>
</div>
<el-drawer
:with-header=
"false"
size=
'70%'
:visible
.
sync=
"drawer"
direction=
"rtl"
:before-close=
"handleClose"
>
<clueComponent
:isDrawer=
"isDrawer"
:queryTime=
"queryTime"
></clueComponent>
</el-drawer>
</div>
</template>
</template>
<
script
>
<
script
>
import
clueComponent
from
"@/components/clueManagement/clueComponent"
;
import
clueComponent
from
"@/components/clueManagement/clueComponent"
;
export
default
{
export
default
{
components
:
{
components
:
{
clueComponent
clueComponent
},
data
()
{
return
{
queryTime
:{
StartTime
:
''
,
EndTime
:
''
},
drawer
:
false
,
isDrawer
:
true
,
msg
:
{
month
:
""
,
YearStr
:
""
,
MonthStr
:
""
,
},
total
:
0
,
tableData
:
[],
loading
:
false
,
};
},
created
()
{
let
d
=
new
Date
();
this
.
msg
.
month
=
d
;
this
.
msg
.
YearStr
=
d
.
getFullYear
();
this
.
msg
.
MonthStr
=
d
.
getMonth
()
+
1
;
},
mounted
()
{
this
.
init
();
},
methods
:
{
handleClose
(
done
)
{
done
();
},
// 查看详情
seeDetails
(
row
){
var
d
=
new
Date
();
var
currentY
=
this
.
msg
.
YearStr
;
var
currentM
=
this
.
msg
.
MonthStr
;
var
MonthDayNum
=
new
Date
(
currentY
,
currentM
,
0
).
getDate
();
//计算当月的天数
this
.
queryTime
.
StartTime
=
this
.
msg
.
YearStr
+
'-'
+
row
.
DateStr
this
.
queryTime
.
EndTime
=
this
.
msg
.
YearStr
+
'-'
+
row
.
DateStr
this
.
drawer
=
true
},
},
init
()
{
data
()
{
if
(
this
.
loading
)
return
;
return
{
this
.
loading
=
true
;
queryTime
:
{
this
.
apipost
(
StartTime
:
''
,
"/api/ClueStatic/GetClueDay"
,
EndTime
:
''
this
.
msg
,
(
res
)
=>
{
console
.
log
(
res
);
this
.
loading
=
false
;
this
.
tableData
=
res
.
data
.
data
;
},
},
(
e
)
=>
{
drawer
:
false
,
this
.
loading
=
false
;
isDrawer
:
true
,
}
msg
:
{
);
month
:
""
,
YearStr
:
""
,
MonthStr
:
""
,
},
total
:
0
,
tableData
:
[],
loading
:
false
,
};
},
created
()
{
let
d
=
new
Date
();
this
.
msg
.
month
=
d
;
this
.
msg
.
YearStr
=
d
.
getFullYear
();
this
.
msg
.
MonthStr
=
d
.
getMonth
()
+
1
;
},
},
tableRowClassName
({
row
})
{
mounted
()
{
let
cname
=
"font-size-12"
;
this
.
init
();
if
(
row
.
DateStr
==
"总数"
||
row
.
DateStr
==
"上期总数"
||
row
.
DateStr
==
"环比成长"
)
{
cname
+=
" xiaoji-row"
;
}
else
if
(
row
.
DateStr
==
"月总数"
)
{
cname
+=
" sum-row"
;
}
return
cname
;
},
},
tableCellClassName
({
row
,
column
})
{
methods
:
{
if
(
handleClose
(
done
)
{
row
[
column
.
property
]
&&
row
[
column
.
property
].
toString
().
indexOf
(
"-"
)
!=
-
1
&&
done
();
column
.
property
!=
"DateStr"
},
)
{
// 查看详情
return
"warning-col"
;
seeDetails
(
row
)
{
}
else
if
(
column
.
property
==
"InvalidCount"
)
{
var
d
=
new
Date
();
var
currentY
=
this
.
msg
.
YearStr
;
var
currentM
=
this
.
msg
.
MonthStr
;
var
MonthDayNum
=
new
Date
(
currentY
,
currentM
,
0
).
getDate
();
//计算当月的天数
this
.
queryTime
.
StartTime
=
this
.
msg
.
YearStr
+
'-'
+
row
.
DateStr
this
.
queryTime
.
EndTime
=
this
.
msg
.
YearStr
+
'-'
+
row
.
DateStr
this
.
drawer
=
true
},
init
()
{
if
(
this
.
loading
)
return
;
this
.
loading
=
true
;
this
.
apipost
(
"/api/ClueStatic/GetClueDay"
,
this
.
msg
,
(
res
)
=>
{
console
.
log
(
res
);
this
.
loading
=
false
;
this
.
tableData
=
res
.
data
.
data
;
},
(
e
)
=>
{
this
.
loading
=
false
;
}
);
},
tableRowClassName
({
row
})
{
let
cname
=
"font-size-12"
;
if
(
if
(
parseFloat
(
row
[
column
.
property
])
/
parseFloat
(
row
.
PushCount
)
>=
row
.
DateStr
==
"总数"
||
0.2
row
.
DateStr
==
"上期总数"
||
row
.
DateStr
==
"环比成长"
)
{
cname
+=
" xiaoji-row"
;
}
else
if
(
row
.
DateStr
==
"月总数"
)
{
cname
+=
" sum-row"
;
}
return
cname
;
},
tableCellClassName
({
row
,
column
})
{
if
(
row
[
column
.
property
]
&&
row
[
column
.
property
].
toString
().
indexOf
(
"-"
)
!=
-
1
&&
column
.
property
!=
"DateStr"
)
{
)
{
return
"warning-col"
;
return
"warning-col"
;
}
else
if
(
column
.
property
==
"InvalidCount"
)
{
if
(
parseFloat
(
row
[
column
.
property
])
/
parseFloat
(
row
.
PushCount
)
>=
0.2
)
{
return
"warning-col"
;
}
}
}
}
},
},
changeMonthHandler
(
val
)
{
changeMonthHandler
(
val
)
{
this
.
msg
.
YearStr
=
val
.
getFullYear
();
this
.
msg
.
YearStr
=
val
.
getFullYear
();
this
.
msg
.
MonthStr
=
val
.
getMonth
()
+
1
;
this
.
msg
.
MonthStr
=
val
.
getMonth
()
+
1
;
console
.
log
(
this
.
msg
);
console
.
log
(
this
.
msg
);
this
.
init
();
this
.
init
();
},
},
handleCommand
(
command
)
{
handleCommand
(
command
)
{
console
.
log
(
command
);
console
.
log
(
command
);
if
(
command
==
"1"
)
{
if
(
command
==
"1"
)
{
this
.
downloadHandler
();
this
.
downloadHandler
();
}
},
downloadHandler
()
{
console
.
log
(
"点击了"
);
this
.
GetLocalFile
(
"/api/ClueStatic/DownLoadClueDay"
,
this
.
msg
,
"每日引流数据统计.xls"
,
(
res
)
=>
{
this
.
$message
({
message
:
"导出成功"
,
type
:
"success"
,
});
}
}
);
},
downloadHandler
()
{
console
.
log
(
"点击了"
);
this
.
GetLocalFile
(
"/api/ClueStatic/DownLoadClueDay"
,
this
.
msg
,
"每日引流数据统计.xls"
,
(
res
)
=>
{
this
.
$message
({
message
:
"导出成功"
,
type
:
"success"
,
});
}
);
},
},
},
},
};
};
</
script
>
</
script
>
<
style
>
<
style
>
@import
"../../assets/css/customerManage.css"
;
@import
"../../assets/css/customerManage.css"
;
.el-table__fixed-body-wrapper
table
{
padding-bottom
:
8px
!important
;
}
.el-table
.xiaoji-row
{
background
:
#ffff00
;
}
.el-table
.sum-row
{
background
:
#00b0f0
;
}
.el-table
.warning-col
{
background
:
red
;
}
.el-table__fixed-body-wrapper
table
{
.pointer
{
padding-bottom
:
8px
!important
;
cursor
:
pointer
;
}
}
.el-table
.xiaoji-row
{
background
:
#ffff00
;
}
.el-table
.sum-row
{
.pointer
:hover
{
background
:
#00b0f0
;
color
:
#00b0f0
;
}
}
.el-table
.warning-col
{
</
style
>
background
:
red
;
\ No newline at end of file
}
.pointer
{
cursor
:
pointer
;
}
.pointer
:hover
{
color
:
#00b0f0
;
}
</
style
>
src/views/workstatistics/monthStatistics.vue
View file @
96162b51
<
template
>
<
template
>
<div
class=
"customerManage"
style=
"display:flex;height:calc(100% - 20px);flex-direction:column;"
>
<div
class=
"customerManage"
style=
"display:flex;height:calc(100% - 20px);flex-direction:column;"
>
<div
class=
"tools"
style=
"border:none;"
>
<div
class=
"tools"
style=
"border:none;"
>
<div
class=
"tools-item"
>
<div
class=
"tools-item"
>
<h1>
月度引流统计
</h1>
<h1>
月度引流统计
</h1>
</div>
</div>
<div
style=
"width: 340px;"
>
<div
style=
"width: 340px;"
>
<el-date-picker
<el-date-picker
v-model=
"msg.month"
type=
"year"
icon=
"el-icon-date"
slot=
"append"
class=
"input-with-select"
v-model=
"msg.month"
format=
"yyyy 年"
@
change=
"changeMonthHandler"
placeholder=
"选择查询的月份"
>
type=
"year"
</el-date-picker>
icon=
"el-icon-date"
</div>
slot=
"append"
<div
class=
"rightmenu"
>
class=
"input-with-select"
<el-dropdown
@
command=
"handleCommand"
>
format=
"yyyy 年"
<el-button
class=
"crm-btn crm-btn-more easy-btn margin-right0"
>
@
change=
"changeMonthHandler"
<i
class=
"iconfont icongengduo"
></i>
placeholder=
"选择查询的月份"
>
</el-button>
</el-date-picker>
<el-dropdown-menu
slot=
"dropdown"
>
</div>
<el-dropdown-item
command=
"1"
><i
class=
"iconfont icondaochu"
></i>
导出
</el-dropdown-item>
<div
class=
"rightmenu"
>
</el-dropdown-menu>
<el-dropdown
@
command=
"handleCommand"
>
</el-dropdown>
<el-button
class=
"crm-btn crm-btn-more easy-btn margin-right0"
>
</div>
<i
class=
"iconfont icongengduo"
></i>
</el-button>
<el-dropdown-menu
slot=
"dropdown"
>
<el-dropdown-item
command=
"1"
><i
class=
"iconfont icondaochu"
></i>
导出
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</div>
<el-tabs
v-model=
"activeName"
style=
"flex:1;height:100%;"
class=
"diy-eltabs"
tab-position=
"top"
>
<el-tab-pane
label=
"月度数据"
name=
"monthdata"
style=
"background:#000"
>
<div
class=
"data-box-item"
>
<el-table
:data=
"tableData"
tooltip-effect=
"dark"
v-loading=
"loading"
style=
"width: 100%;"
height=
"100%"
border
:cell-class-name=
"tableCellClassName"
:row-class-name=
"tableRowClassName"
>
<el-table-column>
<template
slot-scope=
"scope"
>
<span
class=
"pointer"
@
click=
"seeDetails(scope.row)"
>
{{
scope
.
row
.
DateStr
}}
</span>
</
template
>
</el-table-column>
<el-table-column
prop=
"PushCount"
label=
"引流总数"
>
</el-table-column>
<el-table-column
prop=
"EffectiveCount"
label=
"有效总数"
>
</el-table-column>
<el-table-column
prop=
"InvalidCount"
label=
"无效总数"
>
</el-table-column>
<el-table-column
prop=
"RedBookCount"
label=
"小红书总数"
>
</el-table-column>
<el-table-column
prop=
"DouYinCount"
label=
"抖音总数"
>
</el-table-column>
<el-table-column
prop=
"FlyingPigCount"
label=
"飞猪总数"
>
</el-table-column>
<el-table-column
prop=
"GroupChatCount"
label=
"社群聊天总数"
>
</el-table-column>
<el-table-column
prop=
"OfflineVisitCount"
label=
"线下拜访总数"
>
</el-table-column>
<el-table-column
prop=
"StraightCustomerCount"
label=
"直客介绍总数"
>
</el-table-column>
<el-table-column
prop=
"PeerCount"
label=
"同业介绍总数"
>
</el-table-column>
<el-table-column
prop=
"OtherCount"
label=
"其他介绍总数"
>
</el-table-column>
<el-table-column
prop=
"OrderCount"
label=
"订单总数"
>
</el-table-column>
<el-table-column
prop=
"TicketOrderCount"
label=
"机票订单总数"
>
</el-table-column>
<el-table-column
prop=
"VisaOrderCount"
label=
"签证订单总数"
>
</el-table-column>
<el-table-column
prop=
"GroundOrderCount"
label=
"地接订单总数"
>
</el-table-column>
<el-table-column
prop=
"ComboOrderCount"
label=
"套餐订单总数"
>
</el-table-column>
</el-table>
</div>
</el-tab-pane>
<el-tab-pane
label=
"月度成长率"
name=
"monthrate"
>
<div
class=
"data-box-item"
>
<el-table
:data=
"rateData"
:formatter=
"formatter"
tooltip-effect=
"dark"
v-loading=
"rateLoading"
style=
"width: 100%;"
height=
"100%"
border
:cell-class-name=
"tableCellClassName"
:row-class-name=
"tableRowClassName"
>
<el-table-column
prop=
"ItemName"
label=
""
>
</el-table-column>
<el-table-column
prop=
"JanuaryRate"
label=
"1月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"FebruaryRate"
label=
"2月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"MarchRate"
label=
"3月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"AprilRate"
label=
"4月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"MayRate"
label=
"5月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"JuneRate"
label=
"6月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"JulyRate"
label=
"7月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"AugustRate"
label=
"8月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"SeptemberRate"
label=
"9月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"OctoberRate"
label=
"10月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"NovemberRate"
label=
"11月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"DecemberRate"
label=
"12月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"AvgRate"
label=
"平均"
:formatter=
"formatter"
>
</el-table-column>
</el-table>
</div>
</el-tab-pane>
</el-tabs>
<el-drawer
:with-header=
"false"
size=
'70%'
:visible
.
sync=
"drawer"
direction=
"rtl"
:before-close=
"handleClose"
>
<clueComponent
:isDrawer=
"isDrawer"
:queryTime=
"queryTime"
></clueComponent>
</el-drawer>
</div>
</div>
<el-tabs
v-model=
"activeName"
style=
"flex:1;height:100%;"
class=
"diy-eltabs"
tab-position=
"top"
>
<el-tab-pane
label=
"月度数据"
name=
"monthdata"
style=
"background:#000"
>
<div
class=
"data-box-item"
>
<el-table
:data=
"tableData"
tooltip-effect=
"dark"
v-loading=
"loading"
style=
"width: 100%;"
height=
"100%"
border
:cell-class-name=
"tableCellClassName"
:row-class-name=
"tableRowClassName"
>
<el-table-column>
<template
slot-scope=
"scope"
>
<template
v-if=
"scope.row.MonthStr>0"
>
<span
class=
"pointer"
style=
"color:blue;text-decoration:underline;"
@
click=
"seeDetails(scope.row)"
>
{{
scope
.
row
.
DateStr
}}
</span>
</
template
>
<
template
v-else
>
<span>
{{
scope
.
row
.
DateStr
}}
</span>
</
template
>
</template>
</el-table-column>
<el-table-column
prop=
"PushCount"
label=
"引流总数"
>
</el-table-column>
<el-table-column
prop=
"EffectiveCount"
label=
"有效总数"
>
</el-table-column>
<el-table-column
prop=
"InvalidCount"
label=
"无效总数"
>
</el-table-column>
<el-table-column
prop=
"RedBookCount"
label=
"小红书总数"
>
</el-table-column>
<el-table-column
prop=
"DouYinCount"
label=
"抖音总数"
>
</el-table-column>
<el-table-column
prop=
"FlyingPigCount"
label=
"飞猪总数"
>
</el-table-column>
<el-table-column
prop=
"GroupChatCount"
label=
"社群聊天总数"
>
</el-table-column>
<el-table-column
prop=
"OfflineVisitCount"
label=
"线下拜访总数"
>
</el-table-column>
<el-table-column
prop=
"StraightCustomerCount"
label=
"直客介绍总数"
>
</el-table-column>
<el-table-column
prop=
"PeerCount"
label=
"同业介绍总数"
>
</el-table-column>
<el-table-column
prop=
"OtherCount"
label=
"其他介绍总数"
>
</el-table-column>
<el-table-column
prop=
"OrderCount"
label=
"订单总数"
>
</el-table-column>
<el-table-column
prop=
"TicketOrderCount"
label=
"机票订单总数"
>
</el-table-column>
<el-table-column
prop=
"VisaOrderCount"
label=
"签证订单总数"
>
</el-table-column>
<el-table-column
prop=
"GroundOrderCount"
label=
"地接订单总数"
>
</el-table-column>
<el-table-column
prop=
"ComboOrderCount"
label=
"套餐订单总数"
>
</el-table-column>
</el-table>
</div>
</el-tab-pane>
<el-tab-pane
label=
"月度成长率"
name=
"monthrate"
>
<div
class=
"data-box-item"
>
<el-table
:data=
"rateData"
:formatter=
"formatter"
tooltip-effect=
"dark"
v-loading=
"rateLoading"
style=
"width: 100%;"
height=
"100%"
border
:cell-class-name=
"tableCellClassName"
:row-class-name=
"tableRowClassName"
>
<el-table-column
prop=
"ItemName"
label=
""
>
</el-table-column>
<el-table-column
prop=
"JanuaryRate"
label=
"1月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"FebruaryRate"
label=
"2月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"MarchRate"
label=
"3月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"AprilRate"
label=
"4月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"MayRate"
label=
"5月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"JuneRate"
label=
"6月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"JulyRate"
label=
"7月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"AugustRate"
label=
"8月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"SeptemberRate"
label=
"9月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"OctoberRate"
label=
"10月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"NovemberRate"
label=
"11月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"DecemberRate"
label=
"12月"
:formatter=
"formatter"
>
</el-table-column>
<el-table-column
prop=
"AvgRate"
label=
"平均"
:formatter=
"formatter"
>
</el-table-column>
</el-table>
</div>
</el-tab-pane>
</el-tabs>
<el-drawer
:with-header=
"false"
size=
'70%'
:visible
.
sync=
"drawer"
direction=
"rtl"
:before-close=
"handleClose"
>
<clueComponent
:isDrawer=
"isDrawer"
:queryTime=
"queryTime"
></clueComponent>
</el-drawer>
</div>
</template>
</template>
<
script
>
<
script
>
import
clueComponent
from
"@/components/clueManagement/clueComponent"
;
import
clueComponent
from
"@/components/clueManagement/clueComponent"
;
export
default
{
export
default
{
components
:
{
components
:
{
clueComponent
clueComponent
},
data
()
{
return
{
queryTime
:{
StartTime
:
''
,
EndTime
:
''
},
drawer
:
false
,
isDrawer
:
true
,
msg
:
{
month
:
""
,
YearStr
:
""
,
},
total
:
0
,
tableData
:
[],
loading
:
false
,
rateLoading
:
false
,
activeName
:
"monthdata"
,
rateData
:
[],
};
},
created
()
{
let
d
=
new
Date
();
this
.
msg
.
month
=
d
;
this
.
msg
.
YearStr
=
d
.
getFullYear
();
},
mounted
()
{
this
.
init
();
this
.
initRate
();
},
methods
:
{
handleClose
(
done
)
{
done
();
},
},
// 查看详情
data
()
{
seeDetails
(
row
){
return
{
var
d
=
new
Date
();
queryTime
:
{
var
currentY
=
this
.
msg
.
YearStr
;
StartTime
:
''
,
var
currentM
=
this
.
msg
.
month
;
EndTime
:
''
if
(
row
.
DateStr
.
length
==
2
){
currentM
=
'0'
+
row
.
DateStr
.
slice
(
0
,
1
)
}
else
{
currentM
=
row
.
DateStr
.
slice
(
0
,
2
)
}
var
MonthDayNum
=
new
Date
(
currentY
,
currentM
,
0
).
getDate
();
//计算当月的天数
this
.
queryTime
.
StartTime
=
this
.
msg
.
YearStr
+
'-'
+
currentM
+
'-01'
this
.
queryTime
.
EndTime
=
currentY
+
'-'
+
currentM
+
'-'
+
MonthDayNum
this
.
drawer
=
true
},
init
()
{
if
(
this
.
loading
)
return
;
this
.
loading
=
true
;
this
.
apipost
(
"/api/ClueStatic/GetClueMonth"
,
this
.
msg
,
(
res
)
=>
{
this
.
loading
=
false
;
this
.
tableData
=
res
.
data
.
data
;
},
},
(
e
)
=>
{
drawer
:
false
,
this
.
loading
=
false
;
isDrawer
:
true
,
}
msg
:
{
);
month
:
""
,
},
YearStr
:
""
,
initRate
()
{
if
(
this
.
rateLoading
)
return
;
this
.
rateLoading
=
true
;
this
.
apipost
(
"/api/ClueStatic/GetClueMonthRate"
,
this
.
msg
,
(
res
)
=>
{
this
.
rateLoading
=
false
;
this
.
rateData
=
res
.
data
.
data
;
},
},
(
e
)
=>
{
total
:
0
,
this
.
rateLoading
=
false
;
tableData
:
[],
}
loading
:
false
,
);
rateLoading
:
false
,
activeName
:
"monthdata"
,
rateData
:
[],
};
},
},
tableRowClassName
({
row
})
{
created
()
{
let
cname
=
"font-size-12"
;
let
d
=
new
Date
();
if
(
row
.
DateStr
==
"平均"
)
{
this
.
msg
.
month
=
d
;
cname
+=
" xiaoji-row"
;
this
.
msg
.
YearStr
=
d
.
getFullYear
();
}
else
if
(
row
.
DateStr
==
"总数"
)
{
cname
+=
" sum-row"
;
}
return
cname
;
},
},
tableCellClassName
({
row
,
column
})
{
mounted
()
{
if
(
row
[
column
.
property
]
&&
row
[
column
.
property
].
toString
().
indexOf
(
"-"
)
!=
-
1
&&
column
.
property
!=
"DateStr"
)
{
return
"warning-col"
;
}
else
if
(
column
.
property
==
"InvalidCount"
)
{
if
(
parseFloat
(
row
[
column
.
property
])
/
parseFloat
(
row
.
PushCount
)
>=
0.2
)
{
return
"warning-col"
;
}
}
},
changeMonthHandler
(
val
)
{
this
.
msg
.
YearStr
=
val
.
getFullYear
();
this
.
init
();
this
.
init
();
this
.
initRate
();
this
.
initRate
();
},
},
formatter
(
row
,
column
)
{
methods
:
{
return
row
[
column
.
property
]
+
"%"
;
handleClose
(
done
)
{
},
done
();
handleCommand
(
command
)
{
},
console
.
log
(
command
);
// 查看详情
if
(
command
==
"1"
)
{
seeDetails
(
row
)
{
if
(
this
.
activeName
==
"monthdata"
)
{
var
d
=
new
Date
();
this
.
downloadHandler
(
var
currentY
=
this
.
msg
.
YearStr
;
"/api/ClueStatic/DownLoadClueMonth"
,
var
currentM
=
this
.
msg
.
month
;
"月度引流数据"
if
(
row
.
DateStr
.
length
==
2
)
{
);
currentM
=
'0'
+
row
.
DateStr
.
slice
(
0
,
1
)
}
else
{
}
else
{
this
.
downloadHandler
(
currentM
=
row
.
DateStr
.
slice
(
0
,
2
)
"/api/ClueStatic/DownLoadClueMonthRate"
,
"月度引流成长率"
);
}
}
}
var
MonthDayNum
=
new
Date
(
currentY
,
currentM
,
0
).
getDate
();
//计算当月的天数
},
this
.
queryTime
.
StartTime
=
this
.
msg
.
YearStr
+
'-'
+
currentM
+
'-01'
downloadHandler
(
url
,
name
)
{
this
.
queryTime
.
EndTime
=
currentY
+
'-'
+
currentM
+
'-'
+
MonthDayNum
console
.
log
(
"点击了"
);
this
.
drawer
=
true
this
.
GetLocalFile
(
url
,
this
.
msg
,
`
${
name
}
.xls`
,
(
res
)
=>
{
},
this
.
$message
({
init
()
{
message
:
"导出成功"
,
if
(
this
.
loading
)
return
;
type
:
"success"
,
this
.
loading
=
true
;
this
.
apipost
(
"/api/ClueStatic/GetClueMonth"
,
this
.
msg
,
(
res
)
=>
{
this
.
loading
=
false
;
this
.
tableData
=
res
.
data
.
data
;
},
(
e
)
=>
{
this
.
loading
=
false
;
}
);
},
initRate
()
{
if
(
this
.
rateLoading
)
return
;
this
.
rateLoading
=
true
;
this
.
apipost
(
"/api/ClueStatic/GetClueMonthRate"
,
this
.
msg
,
(
res
)
=>
{
this
.
rateLoading
=
false
;
this
.
rateData
=
res
.
data
.
data
;
},
(
e
)
=>
{
this
.
rateLoading
=
false
;
}
);
},
tableRowClassName
({
row
})
{
let
cname
=
"font-size-12"
;
if
(
row
.
DateStr
==
"平均"
)
{
cname
+=
" xiaoji-row"
;
}
else
if
(
row
.
DateStr
==
"总数"
)
{
cname
+=
" sum-row"
;
}
return
cname
;
},
tableCellClassName
({
row
,
column
})
{
if
(
row
[
column
.
property
]
&&
row
[
column
.
property
].
toString
().
indexOf
(
"-"
)
!=
-
1
&&
column
.
property
!=
"DateStr"
)
{
return
"warning-col"
;
}
else
if
(
column
.
property
==
"InvalidCount"
)
{
if
(
parseFloat
(
row
[
column
.
property
])
/
parseFloat
(
row
.
PushCount
)
>=
0.2
)
{
return
"warning-col"
;
}
}
},
changeMonthHandler
(
val
)
{
this
.
msg
.
YearStr
=
val
.
getFullYear
();
this
.
init
();
this
.
initRate
();
},
formatter
(
row
,
column
)
{
return
row
[
column
.
property
]
+
"%"
;
},
handleCommand
(
command
)
{
console
.
log
(
command
);
if
(
command
==
"1"
)
{
if
(
this
.
activeName
==
"monthdata"
)
{
this
.
downloadHandler
(
"/api/ClueStatic/DownLoadClueMonth"
,
"月度引流数据"
);
}
else
{
this
.
downloadHandler
(
"/api/ClueStatic/DownLoadClueMonthRate"
,
"月度引流成长率"
);
}
}
},
downloadHandler
(
url
,
name
)
{
console
.
log
(
"点击了"
);
this
.
GetLocalFile
(
url
,
this
.
msg
,
`
${
name
}
.xls`
,
(
res
)
=>
{
this
.
$message
({
message
:
"导出成功"
,
type
:
"success"
,
});
});
});
}
);
}
,
},
},
},
};
};
</
script
>
</
script
>
<
style
>
<
style
>
@import
"../../assets/css/customerManage.css"
;
@import
"../../assets/css/customerManage.css"
;
.el-table__fixed-body-wrapper
table
{
padding-bottom
:
8px
!important
;
}
.el-table
.xiaoji-row
{
background
:
#ffff00
;
}
.el-table
.sum-row
{
background
:
#00b0f0
;
}
.el-table
.warning-col
{
background
:
red
;
}
.diy-eltabs
.el-tabs__content
{
height
:
calc
(
100%
-
40px
);
}
.diy-eltabs
.data-box-item
{
position
:
absolute
;
top
:
0
;
bottom
:
0
;
left
:
0
;
right
:
0
;
}
.el-table__fixed-body-wrapper
table
{
.pointer
{
padding-bottom
:
8px
!important
;
cursor
:
pointer
;
}
}
.el-table
.xiaoji-row
{
background
:
#ffff00
;
}
.el-table
.sum-row
{
.pointer
:hover
{
background
:
#00b0f0
;
color
:
#00b0f0
;
}
}
.el-table
.warning-col
{
</
style
>
background
:
red
;
\ No newline at end of file
}
.diy-eltabs
.el-tabs__content
{
height
:
calc
(
100%
-
40px
);
}
.diy-eltabs
.data-box-item
{
position
:
absolute
;
top
:
0
;
bottom
:
0
;
left
:
0
;
right
:
0
;
}
.pointer
{
cursor
:
pointer
;
}
.pointer
:hover
{
color
:
#00b0f0
;
}
</
style
>
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