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 @@
</el-table-column>
<el-table-column label="引流总数">
<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-else>{{scope.row.PushCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,1,'0')">{{scope.row.PushCount}}</span>
<span v-else>{{scope.row.PushCount}} </span>
</template>
</el-table-column>
<el-table-column label="有效总数">
<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-else>{{scope.row.EffectiveCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,1,'1')">{{scope.row.EffectiveCount}}</span>
<span v-else>{{scope.row.EffectiveCount}} </span>
</template>
</el-table-column>
<el-table-column label="无效总数">
<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-else>{{scope.row.InvalidCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,1,'2')">{{scope.row.InvalidCount}}</span>
<span v-else>{{scope.row.InvalidCount}} </span>
</template>
</el-table-column>
<el-table-column label="小红书总数">
<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-else>{{scope.row.RedBookCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,2,'7')">{{scope.row.RedBookCount}}</span>
<span v-else>{{scope.row.RedBookCount}} </span>
</template>
</el-table-column>
<el-table-column prop="DouYinCount" label="抖音总数">
<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-else>{{scope.row.DouYinCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,2,'9')">{{scope.row.DouYinCount}}</span>
<span v-else>{{scope.row.DouYinCount}} </span>
</template>
</el-table-column>
<el-table-column label="飞猪总数">
<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-else>{{scope.row.FlyingPigCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,2,'8')">{{scope.row.FlyingPigCount}}</span>
<span v-else>{{scope.row.FlyingPigCount}} </span>
</template>
</el-table-column>
<el-table-column label="社群聊天总数">
<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-else>{{scope.row.GroupChatCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,2,'1')">{{scope.row.GroupChatCount}}</span>
<span v-else>{{scope.row.GroupChatCount}} </span>
</template>
</el-table-column>
<el-table-column label="线下拜访总数">
<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-else>{{scope.row.OfflineVisitCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,2,'2')">{{scope.row.OfflineVisitCount}}</span>
<span v-else>{{scope.row.OfflineVisitCount}} </span>
</template>
</el-table-column>
<el-table-column label="直客介绍总数">
<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-else>{{scope.row.StraightCustomerCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,2,'3')">{{scope.row.StraightCustomerCount}}</span>
<span v-else>{{scope.row.StraightCustomerCount}} </span>
</template>
</el-table-column>
<el-table-column label="同业介绍总数">
<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-else>{{scope.row.PeerCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,2,'4')">{{scope.row.PeerCount}}</span>
<span v-else>{{scope.row.PeerCount}} </span>
</template>
</el-table-column>
<el-table-column label="其他介绍总数">
<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-else>{{scope.row.OtherCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,2,'6')">{{scope.row.OtherCount}}</span>
<span v-else>{{scope.row.OtherCount}} </span>
</template>
</el-table-column>
<el-table-column label="订单总数">
<template slot-scope="scope">
<span v-if="scope.row.MonthStr>0" class="pointer" @click="seeDetails(scope.row,3,'')">{{scope.row.OrderCount}}</span>
<span v-else>{{scope.row.OrderCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@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>
</el-table-column>
<el-table-column label="机票订单总数">
<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-else>{{scope.row.TicketOrderCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,3,'1')">{{scope.row.TicketOrderCount}}</span>
<span v-else>{{scope.row.TicketOrderCount}} </span>
</template>
</el-table-column>
<el-table-column label="签证订单总数">
<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-else>{{scope.row.VisaOrderCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,3,'2')">{{scope.row.VisaOrderCount}}</span>
<span v-else>{{scope.row.VisaOrderCount}} </span>
</template>
</el-table-column>
<el-table-column label="地接订单总数">
<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-else>{{scope.row.GroundOrderCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,3,'3')">{{scope.row.GroundOrderCount}}</span>
<span v-else>{{scope.row.GroundOrderCount}} </span>
</template>
</el-table-column>
<el-table-column label="套餐订单总数">
<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-else>{{scope.row.ComboOrderCount}} </span>
<span v-if="scope.row.MonthStr>0" class="pointer"
@click="seeDetails(scope.row,3,'4')">{{scope.row.ComboOrderCount}}</span>
<span v-else>{{scope.row.ComboOrderCount}} </span>
</template>
</el-table-column>
</el-table>
......@@ -179,204 +200,209 @@
</template>
<script>
import rightDrawer from "../../components/workStatistics/rightDrawer.vue";
export default {
components: {
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();
import rightDrawer from "../../components/workStatistics/rightDrawer.vue";
export default {
components: {
rightDrawer,
},
// 查看详情
seeDetails(row, type = 0, val = "0") {
var d = new Date();
var currentY = this.msg.YearStr;
var currentM = this.msg.month;
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.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;
data() {
return {
drawer: false,
isDrawer: true,
msg: {
month: "",
YearStr: "",
},
(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;
total: 0,
tableData: [],
loading: false,
rateLoading: false,
activeName: "monthdata",
rateData: [],
selfParams: {
queryTime: {},
},
(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;
provide() {
return {
selfParams: this.selfParams,
};
},
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";
}
}
created() {
let d = new Date();
this.msg.month = d;
this.msg.YearStr = d.getFullYear();
},
changeMonthHandler(val) {
this.msg.YearStr = val.getFullYear();
mounted() {
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",
"月度引流数据"
);
methods: {
handleClose(done) {
done();
},
// 查看详情
seeDetails(row, type = 0, val = "0") {
var d = new Date();
var currentY = this.msg.YearStr;
var currentM = this.msg.month;
if (row.DateStr.length == 2) {
currentM = "0" + row.DateStr.slice(0, 1);
} else {
this.downloadHandler(
"/api/ClueStatic/DownLoadClueMonthRate",
"月度引流成长率"
);
currentM = row.DateStr.slice(0, 2);
}
}
},
downloadHandler(url, name) {
this.GetLocalFile(url, this.msg, `${name}.xls`, (res) => {
this.$message({
message: "导出成功",
type: "success",
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) => {
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>
<style>
@import "../../assets/css/customerManage.css";
@import "../../assets/css/customerManage.css";
.el-table__fixed-body-wrapper table {
padding-bottom: 8px !important;
}
.el-table__fixed-body-wrapper table {
padding-bottom: 8px !important;
}
.el-table .xiaoji-row {
background: #ffff00;
}
.el-table .xiaoji-row {
background: #ffff00;
}
.el-table .sum-row {
background: #00b0f0;
}
.el-table .sum-row {
background: #00b0f0;
}
.el-table .warning-col {
background: red;
}
.el-table .warning-col {
background: red;
}
.diy-eltabs .el-tabs__content {
height: calc(100% - 40px);
}
.diy-eltabs .el-tabs__content {
height: calc(100% - 40px);
}
.diy-eltabs .data-box-item {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.diy-eltabs .data-box-item {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.pointer {
cursor: pointer;
}
.pointer {
cursor: pointer;
}
.pointer:hover {
color: #00b0f0;
}
</style>
.pointer:hover {
color: #00b0f0;
}
</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