Commit 96162b51 authored by 黄奎's avatar 黄奎

页面修改

parent b52edba8
<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>
<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>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment