Skip to content

C
CRM
Commit 832c6eb6 authored by 罗超's avatar 罗超
Browse files
Options

新增统计数据

parent a71f2a7b
Hide whitespace changes
Inline Side-by-side
Showing with 843 additions and 433 deletions
src/router.js
View file @ 832c6eb6
...@@ -26,454 +26,472 @@ export default new Router({ ...@@ -26,454 +26,472 @@ export default new Router({
mode: "hash", mode: "hash",
base: process.env.BASE_URL, base: process.env.BASE_URL,
routes: [{ routes: [{
path: "/login", path: "/login",
name: "login", name: "login",
component: login, component: login,
meta: {
title: "欢迎使用CRM系统-请登录使用",
"http-equiv": "X-UA-Compatible",
content: "IE=Edge,chrome=1"
}
},
{
path: "/",
name: "login",
component: login,
meta: {
title: "欢迎使用CRM系统-请登录使用",
"http-equiv": "X-UA-Compatible",
content: "IE=Edge,chrome=1"
}
},
{
path: "/automaticLogin",
name: "automaticLogin",
component: automaticLogin,
meta: {
title: "欢迎使用CRM系统-自动登录",
"http-equiv": "X-UA-Compatible",
content: "IE=Edge,chrome=1"
}
},
{
path: "/index",
name: "index",
component: index,
meta: {
title: "大象CRM",
"http-equiv": "X-UA-Compatible",
content: "IE=Edge,chrome=1"
},
children: [{
path: "/Home",
name: "Home",
component: Home,
meta: {
title: "CRM-仪表盘",
},
},
{
path: "/customerManage",
name: "customerManage",
component: customerManage,
meta: { meta: {
title: "欢迎使用CRM系统-请登录使用", title: "客户管理"
"http-equiv": "X-UA-Compatible",
content: "IE=Edge,chrome=1"
} }
}, },
{ {
path: "/", path: "/customerManageDemo",
name: "login", name: "customerManageDemo",
component: login, component: customerManageDemo,
meta: { meta: {
title: "欢迎使用CRM系统-请登录使用", title: "客户管理"
"http-equiv": "X-UA-Compatible",
content: "IE=Edge,chrome=1"
} }
}, },
{ {
path: "/automaticLogin", path: "/businessManagement",
name: "automaticLogin", name: "businessManagement",
component: automaticLogin, component: businessManagement,
meta: { meta: {
title: "欢迎使用CRM系统-自动登录", title: "商机管理"
"http-equiv": "X-UA-Compatible",
content: "IE=Edge,chrome=1"
} }
}, },
{ {
path: "/index", path: "/clueManagement",
name: "index", name: "clueManagement",
component: index, component: clueManagement,
meta: { meta: {
title: "大象CRM", title: "线索管理"
"http-equiv": "X-UA-Compatible", }
content: "IE=Edge,chrome=1" },
}, {
children: [{ path: "/contactsManagement",
path: "/Home", name: "contactsManagement",
name: "Home", component: contactsManagement,
component: Home, meta: {
meta: { title: "联系人管理"
title: "CRM-仪表盘", }
}, },
}, {
{ path: "/watersManagement",
path: "/customerManage", name: "watersManagement",
name: "customerManage", component: watersManagement,
component: customerManage, meta: {
meta: { title: "公海管理"
title: "客户管理" }
} },
}, {
{ path: "/waitMatter",
path: "/customerManageDemo", name: "waitMatter",
name: "customerManageDemo", component: waitMatter,
component: customerManageDemo, meta: {
meta: { title: "待办事项"
title: "客户管理" }
} },
}, {
{ path: "/datasheet",
path: "/businessManagement", name: "datasheet",
name: "businessManagement", component: datasheet,
component: businessManagement, meta: {
meta: { title: "数据明细"
title: "商机管理" }
} },
}, {
{ path: "/old",
path: "/clueManagement", name: "old",
name: "clueManagement", component: () =>
component: clueManagement, import('./components/statistics/old.vue'),
meta: { meta: {
title: "线索管理" title: "客户年龄分布统计"
} }
}, },
{ {
path: "/contactsManagement", path: "/marital",
name: "contactsManagement", name: "marital",
component: contactsManagement, component: () =>
meta: { import('./components/statistics/marital.vue'),
title: "联系人管理" meta: {
} title: "客户婚姻状态统计"
}, }
{ },
path: "/watersManagement", {
name: "watersManagement", path: "/sex",
component: watersManagement, name: "sex",
meta: { component: () =>
title: "公海管理" import('./components/statistics/sex.vue'),
} meta: {
}, title: "客户性别统计"
{ }
path: "/waitMatter", },
name: "waitMatter", {
component: waitMatter, path: "/tourType",
meta: { name: "tourType",
title: "待办事项" component: () =>
} import('./components/statistics/tourType.vue'),
}, meta: {
{ title: "出游类型统计"
path: "/datasheet", }
name: "datasheet", },
component: datasheet, {
meta: { path: "/festivalOrderList",
title: "数据明细" name: "festivalOrderList",
} component: () =>
}, import('./components/statistics/festivalOrderList.vue'),
{ meta: {
path: "/old", title: "特殊节假日统计"
name: "old", }
component: () => },
import ('./components/statistics/old.vue'), {
meta: { path: "/marriage",
title: "客户年龄分布统计" name: "marriage",
} component: () =>
}, import('./components/statistics/marriage.vue'),
{ meta: {
path: "/marital", title: "婚姻统计"
name: "marital", }
component: () => },
import ('./components/statistics/marital.vue'), {
meta: { path: "/sellevent",
title: "客户婚姻状态统计" name: "sellevent",
} component: () =>
}, import('./components/sellevent/index.vue'),
{ meta: {
path: "/sex", title: "营销事件"
name: "sex", }
component: () => },
import ('./components/statistics/sex.vue'), {
meta: { path: "/birthdayEvent",
title: "客户性别统计" name: "birthdayEvent",
} component: () =>
}, import('./components/sellevent/brithday.vue'),
{ meta: {
path: "/tourType", title: "生日事件"
name: "tourType", }
component: () => },
import ('./components/statistics/tourType.vue'), {
meta: { path: "/graduationEvent",
title: "出游类型统计" name: "graduationEvent",
} component: () =>
}, import('./components/sellevent/graduation.vue'),
{ meta: {
path: "/festivalOrderList", title: "毕业季事件"
name: "festivalOrderList", }
component: () => },
import ('./components/statistics/festivalOrderList.vue'), {
meta: { path: "/festivalEvent",
title: "特殊节假日统计" name: "festivalEvent",
} component: () => import('./components/sellevent/festival.vue'),
}, meta: {
{ title: "节日事件"
path: "/marriage", }
name: "marriage", },
component: () => {
import ('./components/statistics/marriage.vue'), path: "/emergencyEvent",
meta: { name: "emergencyEvent",
title: "婚姻统计" component: () => import('./components/sellevent/emergency.vue'),
} meta: {
}, title: "突发事件"
{ }
path: "/sellevent", },
name: "sellevent", {
component: () => path: "/feedbackEvent",
import ('./components/sellevent/index.vue'), name: "feedbackEvent",
meta: { component: () => import('./components/sellevent/feedback.vue'),
title: "营销事件" meta: {
} title: "意见反馈事件"
}, }
{ },
path: "/birthdayEvent", {
name: "birthdayEvent", path: "/nexttimeEvent",
component: () => name: "nexttimeEvent",
import ('./components/sellevent/brithday.vue'), component: () => import('./components/sellevent/nexttime.vue'),
meta: { meta: {
title: "生日事件" title: "下次出行事件"
} }
}, },
{ {
path: "/graduationEvent", path: "/newlineEvent",
name: "graduationEvent", name: "newlineEvent",
component: () => component: () => import('./components/sellevent/newline.vue'),
import ('./components/sellevent/graduation.vue'), meta: {
meta: { title: "新线路推广事件"
title: "毕业季事件" }
} },
}, {
{ path: "/newseriesEvent",
path: "/festivalEvent", name: "newseriesEvent",
name: "festivalEvent", component: () => import('./components/sellevent/newseries.vue'),
component: ()=>import('./components/sellevent/festival.vue'), meta: {
meta: { title: "新系列推广事件"
title: "节日事件" }
} },
}, {
{ path: "/happyPassbook",
path: "/emergencyEvent", name: "happyPassbook",
name: "emergencyEvent", component: () => import('./components/sellevent/happyPassbook.vue'),
component: ()=>import('./components/sellevent/emergency.vue'), meta: {
meta: { title: "返佣、幸福存折通知事件"
title: "突发事件" }
} },
}, {
{ path: "/newfestivalEvent",
path: "/feedbackEvent", name: "newfestivalEvent",
name: "feedbackEvent", component: () => import('./components/sellevent/newfestival.vue'),
component: ()=>import('./components/sellevent/feedback.vue'), meta: {
meta: { title: "节日事件"
title: "意见反馈事件" }
} },
},
{
path: "/nexttimeEvent", {
name: "nexttimeEvent", path: "/gaoxiao",
component: ()=>import('./components/sellevent/nexttime.vue'), name: "gaoxiao",
meta: { component: () =>
title: "下次出行事件" import('./components/statistics/gaoxiao.vue'),
} meta: {
}, title: "高校在读/毕业统计"
{ }
path: "/newlineEvent", },
name: "newlineEvent", {
component: ()=>import('./components/sellevent/newline.vue'), path: "/job",
meta: { name: "job",
title: "新线路推广事件" component: () =>
} import('./components/statistics/job.vue'),
}, meta: {
{ title: "职业类型统计"
path: "/newseriesEvent", }
name: "newseriesEvent", },
component: ()=>import('./components/sellevent/newseries.vue'), {
meta: { path: "/assets",
title: "新系列推广事件" name: "assets",
} component: () =>
}, import('./components/statistics/assets.vue'),
{ meta: {
path: "/happyPassbook", title: "资产"
name: "happyPassbook", }
component: ()=>import('./components/sellevent/happyPassbook.vue'), },
meta: { {
title: "返佣、幸福存折通知事件" path: "/deving",
} name: "deving",
}, component: () =>
{ import('./components/dev/index.vue'),
path: "/newfestivalEvent", meta: {
name: "newfestivalEvent", title: "开发中..."
component: ()=>import('./components/sellevent/newfestival.vue'), }
meta: { },
title: "节日事件" {
} path: "/deving1",
}, name: "deving1",
component: () =>
import('./components/dev/index.vue'),
{ meta: {
path: "/gaoxiao", title: "开发中..."
name: "gaoxiao", }
component: () => },
import ('./components/statistics/gaoxiao.vue'), {
meta: { path: "/deving2",
title: "高校在读/毕业统计" name: "deving2",
} component: () =>
}, import('./components/dev/index.vue'),
{ meta: {
path: "/job", title: "开发中..."
name: "job", }
component: () => },
import ('./components/statistics/job.vue'), {
meta: { path: "/deving3",
title: "职业类型统计" name: "deving3",
} component: () =>
}, import('./components/dev/index.vue'),
{ meta: {
path: "/assets", title: "开发中..."
name: "assets", }
component: () => },
import ('./components/statistics/assets.vue'), {
meta: { path: "/deving4",
title: "资产" name: "deving4",
} component: () =>
}, import('./components/dev/index.vue'),
{ meta: {
path: "/deving", title: "开发中..."
name: "deving", }
component: () => },
import ('./components/dev/index.vue'), {
meta: { path: "/deving5",
title: "开发中..." name: "deving5",
} component: () =>
}, import('./components/dev/index.vue'),
{ meta: {
path: "/deving1", title: "开发中..."
name: "deving1", }
component: () => },
import ('./components/dev/index.vue'), {
meta: { path: "/dayStatistics",
title: "开发中..." name: "dayStatistics",
} component: () =>
}, import('./views/workstatistics/dayStatistics'),
{ meta: {
path: "/deving2", title: "每日引流统计"
name: "deving2", }
component: () => },
import ('./components/dev/index.vue'), {
meta: { path: "/monthStatistics",
title: "开发中..." name: "monthStatistics",
} component: () =>
}, import('./views/workstatistics/monthStatistics'),
{ meta: {
path: "/deving3", title: "月度引流统计"
name: "deving3", }
component: () => },
import ('./components/dev/index.vue'), {
meta: { path: "/roomStatistical",
title: "开发中..." name: "roomStatistical",
} component: () =>
}, import('./components/statistics/roomStatistical.vue'),
{ meta: {
path: "/deving4", title: "住房统计"
name: "deving4", }
component: () => },
import ('./components/dev/index.vue'), {
meta: { path: "/season",
title: "开发中..." name: "season",
} component: () =>
}, import('./components/statistics/season.vue'),
{ meta: {
path: "/deving5", title: "季节"
name: "deving5", }
component: () => },
import ('./components/dev/index.vue'), {
meta: { path: "/Opinionpolls",
title: "开发中..." name: "Opinionpolls",
} component: () =>
}, import('./components/statistics/Opinionpolls.vue'),
{ meta: {
path: "/roomStatistical", title: "意见调查"
name: "roomStatistical", }
component: () => },
import ('./components/statistics/roomStatistical.vue'),
meta: {
title: "住房统计"
}
},
{
path: "/season",
name: "season",
component: () =>
import ('./components/statistics/season.vue'),
meta: {
title: "季节"
}
},
{
path: "/Opinionpolls",
name: "Opinionpolls",
component: () =>
import ('./components/statistics/Opinionpolls.vue'),
meta: {
title: "意见调查"
}
},
{ {
path: "/unit", path: "/unit",
name: "unit", name: "unit",
component: () => component: () =>
import ('./components/statistics/unit.vue'), import('./components/statistics/unit.vue'),
meta: { meta: {
title: "单位" title: "单位"
} }
}, },
{ {
path: "/contractManagement", path: "/contractManagement",
name: "contractManagement", name: "contractManagement",
component: contractManagement, component: contractManagement,
meta: { meta: {
title: "合同管理" title: "合同管理"
}
},
{
path: "/guestManagement",
name: "guestManagement",
component: guestManagement,
meta: {
title: "直客管理"
}
},
{
path: "/customerApr",
name: "customerApr",
component: customerApr,
meta: {
title: "客户审批"
}
},
{
path: "/customerMap",
name: "customerMap",
component: customerMap,
meta: {
title: "客户地图"
}
},
{
path: "/customerConfiguration",
name: "customerConfiguration",
component: customerConfiguration,
meta: {
title: "客户配置"
}
},
{
path: "/customerOrder",
name: "customerOrder",
component: customerOrder,
meta: {
title: "订单统计"
}
},
{
path: "/myCustomerOrder",
name: "myCustomerOrder",
component: myCustomerOrder,
meta: {
title: "我的订单"
}
},
{
path: "/planeTicketOrder",
name: "planeTicketOrder",
component:planeTicketOrder,
meta: {
title: "订单核算统计"
}
}
]
},
{
path: '/table',
name: 'table',
component: resolve => require(['@/views/table.vue'], resolve),
meta: {
title: '表格测试'
} }
},
{
path: "/guestManagement",
name: "guestManagement",
component: guestManagement,
meta: {
title: "直客管理"
}
},
{
path: "/customerApr",
name: "customerApr",
component: customerApr,
meta: {
title: "客户审批"
}
},
{
path: "/customerMap",
name: "customerMap",
component: customerMap,
meta: {
title: "客户地图"
}
},
{
path: "/customerConfiguration",
name: "customerConfiguration",
component: customerConfiguration,
meta: {
title: "客户配置"
}
},
{
path: "/customerOrder",
name: "customerOrder",
component: customerOrder,
meta: {
title: "订单统计"
}
},
{
path: "/myCustomerOrder",
name: "myCustomerOrder",
component: myCustomerOrder,
meta: {
title: "我的订单"
}
},
{
path: "/planeTicketOrder",
name: "planeTicketOrder",
component: planeTicketOrder,
meta: {
title: "订单核算统计"
}
}
]
},
{
path: '/table',
name: 'table',
component: resolve => require(['@/views/table.vue'], resolve),
meta: {
title: '表格测试'
} }
}
] ]
}); });
\ No newline at end of file
src/views/workstatistics/dayStatistics.vue 0 → 100644
View file @ 832c6eb6
<template>
<div class="customerManage">
<div class="tools">
<div class="tools-item">
<h1>每日引流统计</h1>
</div>
<div style="width: 340px;">
<el-date-picker
v-model="msg.month"
type="month"
icon="el-icon-date"
slot="append"
class="input-with-select"
@change="changeMonthHandler"
placeholder="选择查询的月份">
</el-date-picker>
</div>
<div class="rightmenu">
<el-dropdown>
<el-button class="crm-btn crm-btn-more easy-btn margin-right0">
<i class="iconfont icongengduo"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item><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 prop="DateStr" label="">
</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>
</div>
</template>
<script>
export default {
data() {
return {
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: {
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 (
row.DateStr == "总数" ||
row.DateStr == "上期总数" ||
row.DateStr == "环比成长"
) {
cname += " xiaoji-row";
} else if (row.DateStr == "月总数") {
cname += " sum-row";
}
return cname;
},
tableCellClassName({ row, column }) {
if (
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.msg.MonthStr = val.getMonth() + 1;
console.log(this.msg);
this.init();
},
},
};
</script>
<style>
@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;
}
</style>
src/views/workstatistics/monthStatistics.vue 0 → 100644
View file @ 832c6eb6
<template>
<div class="customerManage" style="display:flex;height:calc(100% - 20px);flex-direction:column;">
<div class="tools" style="border:none;">
<div class="tools-item">
<h1>月度引流统计</h1>
</div>
<div style="width: 340px;">
<el-date-picker
v-model="msg.month"
type="year"
icon="el-icon-date"
slot="append"
class="input-with-select"
format="yyyy 年"
@change="changeMonthHandler"
placeholder="选择查询的月份">
</el-date-picker>
</div>
<div class="rightmenu">
<el-dropdown>
<el-button class="crm-btn crm-btn-more easy-btn margin-right0">
<i class="iconfont icongengduo"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item><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%;overflow: auto;" border :cell-class-name="tableCellClassName" :row-class-name="tableRowClassName">
<el-table-column prop="DateStr" label="">
</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%;overflow: auto;" 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>
</div>
</template>
<script>
export default {
data() {
return {
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: {
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].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] + "%";
},
},
};
</script>
<style>
@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;
}
</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