Skip to content

C
CRM
Commit 1024e8d6 authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent 26436a8f
Hide whitespace changes
Inline Side-by-side
Showing with 235 additions and 209 deletions
src/views/workstatistics/monthStatistics.vue
View file @ 1024e8d6
...@@ -38,98 +38,119 @@ ...@@ -38,98 +38,119 @@
</el-table-column> </el-table-column>
<el-table-column label="引流总数"> <el-table-column label="引流总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,1,'0')">{{scope.row.PushCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.PushCount}} </span> @click="seeDetails(scope.row,1,'0')">{{scope.row.PushCount}}</span>
<span v-else>{{scope.row.PushCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="有效总数"> <el-table-column label="有效总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,1,'1')">{{scope.row.EffectiveCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.EffectiveCount}} </span> @click="seeDetails(scope.row,1,'1')">{{scope.row.EffectiveCount}}</span>
<span v-else>{{scope.row.EffectiveCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="无效总数"> <el-table-column label="无效总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,1,'2')">{{scope.row.InvalidCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.InvalidCount}} </span> @click="seeDetails(scope.row,1,'2')">{{scope.row.InvalidCount}}</span>
<span v-else>{{scope.row.InvalidCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="小红书总数"> <el-table-column label="小红书总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,2,'7')">{{scope.row.RedBookCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.RedBookCount}} </span> @click="seeDetails(scope.row,2,'7')">{{scope.row.RedBookCount}}</span>
<span v-else>{{scope.row.RedBookCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="DouYinCount" label="抖音总数"> <el-table-column prop="DouYinCount" label="抖音总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,2,'9')">{{scope.row.DouYinCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.DouYinCount}} </span> @click="seeDetails(scope.row,2,'9')">{{scope.row.DouYinCount}}</span>
<span v-else>{{scope.row.DouYinCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="飞猪总数"> <el-table-column label="飞猪总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,2,'8')">{{scope.row.FlyingPigCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.FlyingPigCount}} </span> @click="seeDetails(scope.row,2,'8')">{{scope.row.FlyingPigCount}}</span>
<span v-else>{{scope.row.FlyingPigCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="社群聊天总数"> <el-table-column label="社群聊天总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,2,'1')">{{scope.row.GroupChatCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.GroupChatCount}} </span> @click="seeDetails(scope.row,2,'1')">{{scope.row.GroupChatCount}}</span>
<span v-else>{{scope.row.GroupChatCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="线下拜访总数"> <el-table-column label="线下拜访总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,2,'2')">{{scope.row.OfflineVisitCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.OfflineVisitCount}} </span> @click="seeDetails(scope.row,2,'2')">{{scope.row.OfflineVisitCount}}</span>
<span v-else>{{scope.row.OfflineVisitCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="直客介绍总数"> <el-table-column label="直客介绍总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,2,'3')">{{scope.row.StraightCustomerCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.StraightCustomerCount}} </span> @click="seeDetails(scope.row,2,'3')">{{scope.row.StraightCustomerCount}}</span>
<span v-else>{{scope.row.StraightCustomerCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="同业介绍总数"> <el-table-column label="同业介绍总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,2,'4')">{{scope.row.PeerCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.PeerCount}} </span> @click="seeDetails(scope.row,2,'4')">{{scope.row.PeerCount}}</span>
<span v-else>{{scope.row.PeerCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="其他介绍总数"> <el-table-column label="其他介绍总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,2,'6')">{{scope.row.OtherCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.OtherCount}} </span> @click="seeDetails(scope.row,2,'6')">{{scope.row.OtherCount}}</span>
<span v-else>{{scope.row.OtherCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="订单总数"> <el-table-column label="订单总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,3,'')">{{scope.row.OrderCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.OrderCount}} </span> @click="seeDetails(scope.row,3,'')">{{scope.row.OrderCount}}</span>
<span v-else>{{scope.row.OrderCount}} </span>
</template>
</el-table-column>
<el-table-column label="成交率">
<template slot-scope="scope">
<span>{{scope.row.TransRate}}% </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="机票订单总数"> <el-table-column label="机票订单总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,3,'1')">{{scope.row.TicketOrderCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.TicketOrderCount}} </span> @click="seeDetails(scope.row,3,'1')">{{scope.row.TicketOrderCount}}</span>
<span v-else>{{scope.row.TicketOrderCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="签证订单总数"> <el-table-column label="签证订单总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,3,'2')">{{scope.row.VisaOrderCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.VisaOrderCount}} </span> @click="seeDetails(scope.row,3,'2')">{{scope.row.VisaOrderCount}}</span>
<span v-else>{{scope.row.VisaOrderCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="地接订单总数"> <el-table-column label="地接订单总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,3,'3')">{{scope.row.GroundOrderCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.GroundOrderCount}} </span> @click="seeDetails(scope.row,3,'3')">{{scope.row.GroundOrderCount}}</span>
<span v-else>{{scope.row.GroundOrderCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="套餐订单总数"> <el-table-column label="套餐订单总数">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,3,'4')">{{scope.row.ComboOrderCount}}</span> <span v-if="scope.row.MonthStr>0" class="pointer"
<span v-else>{{scope.row.ComboOrderCount}} </span> @click="seeDetails(scope.row,3,'4')">{{scope.row.ComboOrderCount}}</span>
<span v-else>{{scope.row.ComboOrderCount}} </span>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -179,204 +200,209 @@ ...@@ -179,204 +200,209 @@
</template> </template>
<script> <script>
import rightDrawer from "../../components/workStatistics/rightDrawer.vue"; import rightDrawer from "../../components/workStatistics/rightDrawer.vue";
export default { export default {
components: { components: {
rightDrawer, rightDrawer,
},
data() {
return {
drawer: false,
isDrawer: true,
msg: {
month: "",
YearStr: "",
},
total: 0,
tableData: [],
loading: false,
rateLoading: false,
activeName: "monthdata",
rateData: [],
selfParams: {
queryTime: {},
},
};
},
provide() {
return {
selfParams: this.selfParams,
};
},
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, type = 0, val = "0") { return {
var d = new Date(); drawer: false,
var currentY = this.msg.YearStr; isDrawer: true,
var currentM = this.msg.month; msg: {
if (row.DateStr.length == 2) { month: "",
currentM = "0" + row.DateStr.slice(0, 1); YearStr: "",
} else {
currentM = row.DateStr.slice(0, 2);
}
var MonthDayNum = new Date(currentY, currentM, 0).getDate(); //计算当月的天数
this.selfParams.queryTime.StartTime =
this.msg.YearStr + "-" + currentM + "-01";
this.selfParams.queryTime.EndTime =
currentY + "-" + currentM + "-" + MonthDayNum;
delete this.selfParams.queryTime.ClueState;
delete this.selfParams.queryTime.CustomerSourceType;
this.selfParams.queryTime.OrderType = "";
this.selfParams.queryTime.queryType = type;
this.selfParams.queryTime.queryVal = val;
if (type == 1) {
this.selfParams.queryTime.ClueState = val;
} else if (type == 2) {
this.selfParams.queryTime.CustomerSourceType = val;
} else if (type == 3) {
this.selfParams.queryTime.OrderType = val;
}
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) => { total: 0,
this.loading = false; tableData: [],
} loading: false,
); rateLoading: false,
}, activeName: "monthdata",
initRate() { rateData: [],
if (this.rateLoading) return; selfParams: {
this.rateLoading = true; queryTime: {},
this.apipost(
"/api/ClueStatic/GetClueMonthRate",
this.msg,
(res) => {
this.rateLoading = false;
this.rateData = res.data.data;
}, },
(e) => { };
this.rateLoading = false;
}
);
}, },
tableRowClassName({ row }) { provide() {
let cname = "font-size-12"; return {
if (row.DateStr == "平均") { selfParams: this.selfParams,
cname += " xiaoji-row"; };
} else if (row.DateStr == "总数") {
cname += " sum-row";
}
return cname;
}, },
tableCellClassName({ row, column }) { created() {
if ( let d = new Date();
row[column.property] && this.msg.month = d;
row[column.property].toString().indexOf("-") != -1 && this.msg.YearStr = d.getFullYear();
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) { mounted() {
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) { },
if (command == "1") { // 查看详情
if (this.activeName == "monthdata") { seeDetails(row, type = 0, val = "0") {
this.downloadHandler( var d = new Date();
"/api/ClueStatic/DownLoadClueMonth", var currentY = this.msg.YearStr;
"月度引流数据" 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.selfParams.queryTime.StartTime =
downloadHandler(url, name) { this.msg.YearStr + "-" + currentM + "-01";
this.GetLocalFile(url, this.msg, `${name}.xls`, (res) => { this.selfParams.queryTime.EndTime =
this.$message({ currentY + "-" + currentM + "-" + MonthDayNum;
message: "导出成功",
type: "success", delete this.selfParams.queryTime.ClueState;
delete this.selfParams.queryTime.CustomerSourceType;
this.selfParams.queryTime.OrderType = "";
this.selfParams.queryTime.queryType = type;
this.selfParams.queryTime.queryVal = val;
if (type == 1) {
this.selfParams.queryTime.ClueState = val;
} else if (type == 2) {
this.selfParams.queryTime.CustomerSourceType = val;
} else if (type == 3) {
this.selfParams.queryTime.OrderType = val;
}
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) => {
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) {
if (command == "1") {
if (this.activeName == "monthdata") {
this.downloadHandler(
"/api/ClueStatic/DownLoadClueMonth",
"月度引流数据"
);
} else {
this.downloadHandler(
"/api/ClueStatic/DownLoadClueMonthRate",
"月度引流成长率"
);
}
}
},
downloadHandler(url, name) {
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 { .el-table__fixed-body-wrapper table {
padding-bottom: 8px !important; padding-bottom: 8px !important;
} }
.el-table .xiaoji-row { .el-table .xiaoji-row {
background: #ffff00; background: #ffff00;
} }
.el-table .sum-row { .el-table .sum-row {
background: #00b0f0; background: #00b0f0;
} }
.el-table .warning-col { .el-table .warning-col {
background: red; background: red;
} }
.diy-eltabs .el-tabs__content { .diy-eltabs .el-tabs__content {
height: calc(100% - 40px); height: calc(100% - 40px);
} }
.diy-eltabs .data-box-item { .diy-eltabs .data-box-item {
position: absolute; position: absolute;
top: 0; top: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
} }
.pointer { .pointer {
cursor: pointer; cursor: pointer;
} }
.pointer:hover { .pointer:hover {
color: #00b0f0; color: #00b0f0;
} }
</style> </style>
\ No newline at end of file
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