diff --git a/public/img/arrow-left-blue.png b/public/img/arrow-left-blue.png new file mode 100644 index 0000000..4f3f435 Binary files /dev/null and b/public/img/arrow-left-blue.png differ diff --git a/public/img/companyicon/activeCustomer.png b/public/img/companyicon/activeCustomer.png new file mode 100644 index 0000000..e54fd79 Binary files /dev/null and b/public/img/companyicon/activeCustomer.png differ diff --git a/public/img/companyicon/activeEquipmentQuantity.png b/public/img/companyicon/activeEquipmentQuantity.png new file mode 100644 index 0000000..8269d0a Binary files /dev/null and b/public/img/companyicon/activeEquipmentQuantity.png differ diff --git a/public/img/companyicon/activeHouseQuantity.png b/public/img/companyicon/activeHouseQuantity.png new file mode 100644 index 0000000..e9b5487 Binary files /dev/null and b/public/img/companyicon/activeHouseQuantity.png differ diff --git a/public/img/companyicon/avgFration.png b/public/img/companyicon/avgFration.png new file mode 100644 index 0000000..5be5525 Binary files /dev/null and b/public/img/companyicon/avgFration.png differ diff --git a/public/img/companyicon/down.png b/public/img/companyicon/down.png new file mode 100644 index 0000000..27cd2d0 Binary files /dev/null and b/public/img/companyicon/down.png differ diff --git a/public/img/companyicon/prohibitedCount.png b/public/img/companyicon/prohibitedCount.png new file mode 100644 index 0000000..8d5b70f Binary files /dev/null and b/public/img/companyicon/prohibitedCount.png differ diff --git a/public/img/companyicon/receptionCount.png b/public/img/companyicon/receptionCount.png new file mode 100644 index 0000000..4cc8897 Binary files /dev/null and b/public/img/companyicon/receptionCount.png differ diff --git a/public/img/companyicon/receptionTimeWithAvg.png b/public/img/companyicon/receptionTimeWithAvg.png new file mode 100644 index 0000000..193be5d Binary files /dev/null and b/public/img/companyicon/receptionTimeWithAvg.png differ diff --git a/public/img/companyicon/sumLevelFraction.png b/public/img/companyicon/sumLevelFraction.png new file mode 100644 index 0000000..75a11e6 Binary files /dev/null and b/public/img/companyicon/sumLevelFraction.png differ diff --git a/public/img/companyicon/up.png b/public/img/companyicon/up.png new file mode 100644 index 0000000..a42c447 Binary files /dev/null and b/public/img/companyicon/up.png differ diff --git a/public/img/companyicon/wordFinishFraction.png b/public/img/companyicon/wordFinishFraction.png new file mode 100644 index 0000000..2f8342c Binary files /dev/null and b/public/img/companyicon/wordFinishFraction.png differ diff --git a/public/img/companyicon/wordFraction.png b/public/img/companyicon/wordFraction.png new file mode 100644 index 0000000..ceb8d22 Binary files /dev/null and b/public/img/companyicon/wordFraction.png differ diff --git a/public/img/down_icon.png b/public/img/down_icon.png new file mode 100644 index 0000000..a720446 Binary files /dev/null and b/public/img/down_icon.png differ diff --git a/public/img/up_icon.png b/public/img/up_icon.png new file mode 100644 index 0000000..8865779 Binary files /dev/null and b/public/img/up_icon.png differ diff --git a/src/api/modules/api.js b/src/api/modules/api.js index 1697533..38be2f8 100644 --- a/src/api/modules/api.js +++ b/src/api/modules/api.js @@ -1026,6 +1026,16 @@ export function waitingForOperation(data) { data }) } + + +// 首页公司数据 接待趋势 销讲趋势 +export function companyBackendData(data) { + return request({ + url: 'autoSR/cusStageStatistics/companyBackendData', + method: 'post', + data + }) +} // 设备绑定 export function scheduling(query) { return request({ diff --git a/src/api/modules/http.js b/src/api/modules/http.js index ffb6bc5..6a49925 100644 --- a/src/api/modules/http.js +++ b/src/api/modules/http.js @@ -1303,3 +1303,33 @@ export function allHousePage(params) { params }) } + + +// 客户意向等级列表 +export function customerLevelList(params) { + return request({ + url: 'autoSR/zk/keywords/customerLevelList', + method: 'get', + params + }) +} + +// 保存客户意向等级列表 +export function customerLevelUpdate(data) { + return request({ + url: 'autoSR/zk/keywords/customerLevelUpdate', + method: 'post', + data + }) +} + + + +// 公司后台用户洞察 +export function findmatchdataByOrgCode(data) { + return request({ + url: 'autoSR/cusStageStatistics/findmatchdataByOrgCode', + method: 'post', + data + }) +} \ No newline at end of file diff --git a/src/page/wel.vue b/src/page/wel.vue index fe87522..39d9e04 100644 --- a/src/page/wel.vue +++ b/src/page/wel.vue @@ -1,5 +1,6 @@ +
- - -
+
转写消费
-
+
购买小时
{{ paraphraseObj.rechargeSum || 0 }} @@ -91,7 +92,10 @@
剩余小时
-
+
{{ paraphraseObj.surplusSum || 0 }}
@@ -99,7 +103,10 @@
-
+
正在接待
@@ -1007,23 +1014,12 @@
-
+
数据简报
-
@@ -1476,787 +1472,956 @@
+
+
- + + + +
+ +
import { getStore, setStore } from "@/util/store"; import { mapGetters } from "vuex"; + +import * as echarts from "echarts"; + export default { name: "Wel", data() { @@ -2311,6 +2479,247 @@ export default { templateList: [], // 销讲业务列表 marketingBusiness: [], // 选中的销讲业务 paraphraseObj: {}, // 剩余转写时长 + + projectRankingList: [ + // 项目排名 + { + title: "有效接待", + unit: "次", // 单位 + paramsName: "activeCustomer", + }, + { + title: "违禁接待次数", + unit: "次", // 单位 + paramsName: "prohibitedCustomer", + }, + { + title: "平均接待时长", + unit: "分", // 单位 + paramsName: "avgDuration", + }, + { + title: "平均销讲执行", + unit: "%", // 单位 + paramsName: "fraction", + }, + { + title: "平均挖掘执行", + unit: "%", // 单位 + paramsName: "wordFraction", + }, + { + title: "平均挖掘成功", + unit: "%", // 单位 + paramsName: "wordFinishFraction", + }, + { + title: "平均客户意向度", + unit: "%", // 单位 + paramsName: "sumLevelFraction", + }, + ], + projectRankingValue: "activeCustomer", + + tendencyDataA: [ + { + title: "接待量", + value: "receptionCount", + + itemStyle: { + normal: { + color: "#4458FE", + lineStyle: { + color: "#4458FE", + }, + }, + }, + }, + { + title: "有效接待", + value: "activeCustomer", + + itemStyle: { + normal: { + color: "#33CAAE", + lineStyle: { + color: "#33CAAE", + }, + }, + }, + }, + { + title: "违禁接待", + value: "prohibitedCustomer", + + itemStyle: { + normal: { + color: "#FEA017", + lineStyle: { + color: "#FEA017", + }, + }, + }, + }, + ], + + tendencyDataB: [ + { + title: "销讲执行", + value: "fraction", + + itemStyle: { + normal: { + color: "#B556E2", + lineStyle: { + color: "#B556E2", + }, + }, + }, + }, + { + title: "挖掘执行", + value: "wordFraction", + + itemStyle: { + normal: { + color: "#3E50E8", + lineStyle: { + color: "#3E50E8", + }, + }, + }, + }, + { + title: "挖掘成功", + value: "wordFinishFraction", + + itemStyle: { + normal: { + color: "#2DBB5D", + lineStyle: { + color: "#2DBB5D", + }, + }, + }, + }, + ], + + companyHouseList: [], // 处理后的项目列表 + + companyElCardList: [ + { + name: "接待量", + unit: '', + tooltip: "筛选时间内，已经结束的接待条数，不包含待接单；", // 描述name文字的 + path: "/building/Count", + pathName: "项目统计", + paramsName: "receptionCount", // 接待量变量名称 + data1Name: "sysSec", // 变量名称1 + data2Name: "sysCompare", // 环比 + data3Name: "orderBy", // 变量名称1 + }, + { + name: "有效接待", + unit: '', + tooltip: "筛选时间内，标记为有效的接待数，不包含待接单；", // 描述name文字的 + path: "/building/Count", + pathName: "项目统计", + paramsName: "activeCustomer", // 接待量变量名称 + data1Name: "sysSec", // 变量名称1 + data2Name: "sysCompare", // 环比 + data3Name: "orderBy", // 变量名称1 + }, + { + name: "平均销讲执行率", + unit: '%', + tooltip: "筛选时间内，有效接待（不包含待接单）的平均执行率；", // 描述name文字的 + path: "/building/Count", + pathName: "项目统计", + paramsName: "avgFration", // 接待量变量名称 + data1Name: "sysSec", // 变量名称1 + data2Name: "sysCompare", // 环比 + data3Name: "orderBy", // 变量名称1 + }, + { + name: "平均挖掘执行率", + unit: '%', + tooltip: "筛选时间内，已标记的有效接待挖掘执行的平均值；", // 描述name文字的 + path: "/building/Count", + pathName: "项目统计", + paramsName: "wordFraction", // 接待量变量名称 + data1Name: "sysSec", // 变量名称1 + data2Name: "sysCompare", // 环比 + data3Name: "orderBy", // 变量名称1 + }, + { + name: "平均挖掘成功率", + unit: '%', + tooltip: "筛选时间内，已标记的有效接待挖掘成功的平均值；", // 描述name文字的 + path: "/building/Count", + pathName: "项目统计", + paramsName: "wordFinishFraction", // 接待量变量名称 + data1Name: "sysSec", // 变量名称1 + data2Name: "sysCompare", // 环比 + data3Name: "orderBy", // 变量名称1 + }, + { + name: "违禁接待次数", + unit: '', + tooltip: + "筛选时间内，出现违禁的接待次数，不包含待接单/无效接待/无效违禁；", // 描述name文字的 + path: "/building/Count", + pathName: "项目统计", + paramsName: "prohibitedCount", // 接待量变量名称 + data1Name: "sysSec", // 变量名称1 + data2Name: "sysCompare", // 环比 + data3Name: "orderBy", // 变量名称1 + }, + { + name: "平均接待时长(分钟)", + unit: '', + tooltip: + "筛选时间内，有效接待（不包含待接单）的平均录音时长，单位分钟；", // 描述name文字的 + path: "/building/Count", + pathName: "项目统计", + paramsName: "receptionTimeWithAvg", // 接待量变量名称 + data1Name: "sysSec", // 变量名称1 + data2Name: "sysCompare", // 环比 + data3Name: "orderBy", // 变量名称1 + }, + { + name: "平均客户意向度", + unit: '%', + tooltip: "", // 描述name文字的 + path: "/building/Count", + pathName: "项目统计", + paramsName: "sumLevelFraction", // 接待量变量名称 + data1Name: "sysSec", // 变量名称1 + data2Name: "sysCompare", // 环比 + data3Name: "orderBy", // 变量名称1 + }, + { + name: "活跃项目", + unit: '', + tooltip: "", // 描述name文字的 + path: "/building/Count", + pathName: "项目统计", + paramsName: "activeHouseQuantity", // 接待量变量名称 + data1Name: "sysSec", // 变量名称1 + data2Name: "sysCompare", // 环比 + data3Name: "orderBy", // 变量名称1 + }, + { + name: "活跃设备", + unit: '', + tooltip: "筛选时间内，有接待并上传录音的设备;", // 描述name文字的 + path: "/Equipment/state", + pathName: "设备监控", + paramsName: "activeEquipmentQuantity", // 接待量变量名称 + data1Name: "sysSec", // 变量名称1 + data2Name: "sysCompare", // 环比 + data3Name: "orderBy", // 变量名称1 + }, + ], // 公司首页选项卡展示列表 }; }, @@ -2384,6 +2793,16 @@ export default { } }; }, + + // 获取项目排名数据单位 + getUnit() { + return (name) => { + let obj = this.projectRankingList.find( + (item) => name == item.paramsName + ); + return obj.unit; + }; + }, }, mounted() { @@ -2402,19 +2821,293 @@ export default { this.findAllZkEquipment(); this.getMarketingBusiness(); - this.findByHouseIdForRecharge() + this.findByHouseIdForRecharge(); } else { // 公司 this.waitingForOperation(); + this.companyBackendData(); + this.findmatchdataByOrgCode(); } }, methods: { - // 转写充值剩余 - findByHouseIdForRecharge() { - this.$api.http.homeFindByHouseIdForRecharge({houseId: this.houseId}).then(res => { - this.paraphraseObj = res.data.list - }) - }, + // 项目排名指标发生改变 + changeProjectRanking() { + console.log(this.projectRankingValue); + this.companyHouseList.sort((a, b) => { + return b[this.projectRankingValue] - a[this.projectRankingValue]; + }); + }, + + // 公司后台用户洞察 + findmatchdataByOrgCode() { + let obj = { + dateType: this.TimetoAhoose == 5 ? null : this.TimetoAhoose, + orderBy: 1, + startDate: this.statDateStart, + endDate: this.statDateEnd, + orgType: localStorage.getItem("orgType"), + marketingBusiness: this.marketingBusiness.join(","), + }; + if (this.role == 1) { + obj.agentId = localStorage.getItem("agentId") / 1; + } + if (this.role == 2) { + obj.orgCode = localStorage.getItem("orgCode"); + } + this.$api.http.findmatchdataByOrgCode(obj).then((res) => { + console.log(res.data, "findmatchdataByOrgCode"); + if (res.data) { + let obj = { + id: "userInsight", + series: [], // 二级数据 + }; + + res.data.forEach((item) => { + obj.series.push({ + value: item.total, + name: item.endName ? `${item.name}-${item.endName}` : item.name, + id: item.id, // + children: [], // + }); + }); + obj.series.forEach((item) => { + let serobj = res.data.find((items) => item.id == items.id); + serobj.children.forEach((arr) => { + item.children.push({ + value: arr.total, + pName: item.name, + name: arr.endName ? `${arr.name}-${arr.endName}` : arr.name, + id: arr.id, // + }); + }); + }); + console.log(obj); + this.creatTreeMap(obj); + } + }); + }, + + // 创建树图 + creatTreeMap(data) { + let chartDom = document.getElementById(data.id); + let myChart = echarts.init(chartDom); + myChart.clear(); + + let option = { + color: [ + "#556FC6", + "#FBC85B", + "#91CD77", + "#EE6666", + "#73C0DE", + "#FC8452", + "#EE66C8", + "#556FC6", + "#F8CA59", + ], + tooltip: { + trigger: "item", // 触发类型，默认数据触发，见下图，可选为：'item' ¦ 'axis' + formatter: (e) => { + console.log(e); + return `${e.data.pName}->${e.name}
${e.marker}命中：${e.value}个`; + }, + }, + grid: { + left: "2%", + right: "2%", + bottom: "3%", + containLabel: true, + }, + series: [ + { + type: "treemap", + width: '95%', + height: '95%', + data: data.series, + name: "用户洞察", + breadcrumb: { + show: false, + }, + roam: false, + // silent: true, + }, + ], + }; + option && myChart.setOption(option); + window.addEventListener("resize", () => { + myChart.resize(); + }); + }, + + // 获取公司数据 + companyBackendData() { + let obj = { + dateType: this.TimetoAhoose == 5 ? null : this.TimetoAhoose, + orderBy: 1, + startDate: this.statDateStart, + endDate: this.statDateEnd, + orgType: localStorage.getItem("orgType"), + marketingBusiness: this.marketingBusiness.join(","), + }; + if (this.role == 1) { + obj.agentId = localStorage.getItem("agentId") / 1; + } + if (this.role == 2) { + obj.orgCode = localStorage.getItem("orgCode"); + } + this.$api.api.companyBackendData(obj).then((res) => { + console.log(res, "companyBackendData"); + if (res.data.tendencyData) { + this.formatterLineEcharts(res); + } + if (res.data.resultA) { + this.formatterHouseListData(res.data); + } + }); + }, + + // 格式化列表数据 + formatterHouseListData(res) { + let arr = []; + res.resultA.map((item) => { + let obj = res.resultB.find((items) => items.houseId == item.houseId); + console.log(obj); + arr.push({ + ...item, + activeCustomerPk: obj.activeCustomer || 0, + prohibitedCustomerPk: obj.prohibitedCustomer || 0, + avgDurationPk: obj.avgDuration || 0, + fractionPk: obj.fraction || 0, + wordFractionPk: obj.wordFraction || 0, + wordFinishFractionPk: obj.wordFinishFraction || 0, + sumLevelFractionPk: obj.sumLevelFraction || 0, + }); + }); + console.log(arr); + this.companyHouseList = arr; + this.changeProjectRanking(); + }, + + // 处理echarts折线图的数据 + formatterLineEcharts(res) { + let lineBox1 = { + id: "lineBox1", + showUnit: "单位（次）", + unit: "次", + legend: [], + xAxis: [], // 坐标轴日期 + series: [], // 数据 + + receptionCount: [], + activeCustomer: [], + prohibitedCustomer: [], + }; + + let lineBox2 = { + id: "lineBox2", + showUnit: "单位（%）", + unit: "%", + legend: [], + xAxis: [], // 坐标轴日期 + series: [], // 数据 + fraction: [], + wordFraction: [], + wordFinishFraction: [], + }; + + res.data.tendencyData.forEach((item) => { + // 销讲趋势 + lineBox1.xAxis.push(item.statDate); + lineBox1.receptionCount.push(item.receptionCount || 0); + lineBox1.activeCustomer.push(item.activeCustomer || 0); + lineBox1.prohibitedCustomer.push(item.prohibitedCustomer || 0); + + // 接待趋势 + lineBox2.xAxis.push(item.statDate); + lineBox2.fraction.push(item.fraction || 0); + lineBox2.wordFraction.push(item.wordFraction || 0); + lineBox2.wordFinishFraction.push(item.wordFinishFraction || 0); + }); + + this.tendencyDataA.forEach((item) => { + lineBox1.legend.push(item.title.split(' ')[0]); + lineBox1.series.push({ + name: item.title, + type: "line", + smooth: true, + data: lineBox1[item.value], + itemStyle: item.itemStyle, + }); + }); + + this.tendencyDataB.forEach((item) => { + lineBox2.legend.push(item.title.split(' ')[0]); + lineBox2.series.push({ + name: item.title, + type: "line", + smooth: true, + data: lineBox2[item.value], + itemStyle: item.itemStyle, + }); + }); + console.log(lineBox1, lineBox2); + this.$nextTick(() => { + this.createEchartsLine(lineBox1); + this.createEchartsLine(lineBox2); + }); + }, + + // 创建折线统计图 + createEchartsLine(data) { + console.log(data, 'data') + let chartDom = document.getElementById(data.id); + let myChart = echarts.init(chartDom); + myChart.clear(); + let option = { + title: { + text: data.showUnit, + }, + tooltip: { + trigger: "axis", + }, + legend: { + data: data.legend, + }, + grid: { + left: "7%", + right: "7%", + bottom: "3%", + containLabel: true, + }, + xAxis: { + type: "category", + boundaryGap: false, + data: data.xAxis, + }, + yAxis: { + type: "value", + }, + series: data.series, + }; + if (data.unit == '%') { + option.yAxis.max = 100 + } + + option && myChart.setOption(option); + + window.addEventListener("resize", () => { + myChart.resize(); + }); + }, + + // 转写充值剩余 + findByHouseIdForRecharge() { + this.$api.http + .homeFindByHouseIdForRecharge({ houseId: this.houseId }) + .then((res) => { + this.paraphraseObj = res.data.list; + }); + }, // 当前选中时间类型之接待记录 /** @@ -2706,7 +3399,7 @@ export default { this.$api.http .marketingBusiness({ houseId: this.houseId }) .then((res) => { - console.log(res, '的萨克角度看待'); + console.log(res, "的萨克角度看待"); if (res.code == 10000) { this.templateList = res.data; } @@ -2820,6 +3513,8 @@ export default { this.findProhibitedRecord(); } else { this.waitingForOperation(); + this.companyBackendData(); + this.findmatchdataByOrgCode(); } }, //切换时间 @@ -2835,6 +3530,9 @@ export default { this.findProhibitedRecord(); } else { this.waitingForOperation(); + + this.companyBackendData(); + this.findmatchdataByOrgCode(); } }, @@ -2847,8 +3545,7 @@ export default { } else { this.waitingForOperation(); } - } - + }, }, }; @@ -3187,6 +3884,298 @@ export default { line-height: 44px; } } + + // 公司后台选项卡样式 + .pageitem { + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + background: #fff; + box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.08); + border-radius: 8px; + + .p-stitle { + padding: 0 24px; + display: flex; + justify-content: space-between; + align-items: center; + + p { + flex-shrink: 0; + } + + .t-name { + display: flex; + align-items: center; + font-size: 16px; + font-weight: 500; + color: #666666; + } + + .t-val { + margin: 0; + color: #333333; + font-weight: bold; + font-size: 32px; + } + } + + .sys-box { + padding: 0 0 0 0; + width: 100%; + flex-grow: 1; + display: flex; + align-items: flex-end; + font-size: 14px; + + .l-img { + margin: 0 60px 0 4px; + flex-shrink: 0; + width: 88px; + height: 88px; + } + + .syc { + padding: 0 0 24px 0; + flex-grow: 1; + display: flex; + align-items: center; + + .syc-bi { + line-height: 20px; + font-weight: 400; + font-size: 14px; + color: #333333; + } + + .imgitem { + margin-right: 6px; + width: 16px; + height: 10px; + } + + .sys-vals { + font-size: 14px; + &.up { + color: #e7483c; + } + &.down { + color: #11b041; + } + } + + .sys-val { + margin-right: 12px; + } + } + } + } +} + +// 公司折线统计图部分 +.company-line { + margin: 20px 0 0 0; + width: 100%; + height: 946px; + display: grid; + grid-gap: 20px; + + .items { + flex-shrink: 0; + padding: 0 20px 10px; + border-radius: 4px; + background: #fff; + display: flex; + flex-direction: column; + + .title { + flex-shrink: 0; + display: flex; + align-items: center; + justify-content: space-between; + + p { + font-size: 18px; + font-weight: bold; + line-height: 24px; + } + } + + .line-box { + flex-grow: 1; + } + } + + .items1 { + width: 970px; + height: 463px; + grid-column: 1 / 3; + grid-column-start: span 2; + } + + .items2 { + width: 970px; + height: 463px; + grid-column: 1 / 3; + grid-column-start: span 2; + } + + .items3 { + width: 643px; + height: 946px; + grid-row: 1 / 3; + grid-column: 3; + + .scroll-box { + flex-grow: 1; + overflow-y: scroll; + display: grid; + grid-template-columns: 1fr; + grid-template-rows: 212px; + grid-row-gap: 20px; + align-content: start; + + .s-items { + margin: 0 auto; + width: 98%; + height: 212px; + border-radius: 8px; + overflow: hidden; + background: #fff; + box-shadow: 0px 2px 8px 0px rgba(62, 80, 232, 0.1); + + .s-title { + padding: 0 24px; + width: 100%; + height: 60px; + display: grid; + grid-template-columns: repeat(3, 1fr); + background: rgba(62, 80, 232, 0.04); + border-radius: 8px 8px 0 0; + border: 1px solid #3e50e8; + color: #111111; + + .housename { + font-weight: bold; + color: #111111; + line-height: 22px; + font-size: 16; + } + + .value { + justify-content: center; + font-size: 20px; + font-weight: 600; + color: #111111; + line-height: 22px; + } + .imgbox { + justify-content: flex-end; + font-size: 16px; + font-weight: 600; + } + .tit-item { + flex-shrink: 0; + align-items: center; + display: flex; + + .img { + margin-left: 4px; + width: 16px; + height: 22px; + } + + .down { + color: #11b041; + } + + .up { + color: #e7483c; + } + } + } + + .grid-box { + width: 100%; + height: 152px; + display: grid; + grid-template-columns: repeat(3, 1fr); + grid-template-rows: 50%; + + .grid-box-item { + width: 100%; + height: 100%; + display: inline-flex; + flex-direction: column; + justify-content: center; + align-items: center; + + .bignum { + font-size: 20px; + font-weight: 600; + line-height: 28px; + } + } + } + } + + /*滚动条宽 长,滚动条整体部分，其中的属性有width,height,background,border等。*/ + &::-webkit-scrollbar { + width: 7px; + } + + /*滚动条的滑轨背景颜色,可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果。*/ + &::-webkit-scrollbar-track { + background-color: #f5f5f5; + + -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.1); + + border-radius: 5px; + } + + /*滑块颜色 */ + &::-webkit-scrollbar-thumb { + background-color: rgba(0, 0, 0, 0.2); + + border-radius: 5px; + } + + /*滚动条两端的按钮。可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果。*/ + &::-webkit-scrollbar-button { + background-color: #eee; + + display: none; + } + + /*横向滚动条和纵向滚动条相交处尖角的颜色 */ + &::-webkit-scrollbar-corner { + background-color: black; + } + } + } +} + +// 用户洞察 +.userInsights { + margin: 20px 0 0 0; + width: 100%; + height: 650px; + background: #ffffff; + border-radius: 4px; + + .u-title { + padding: 24px 24px 20px; + font-size: 18px; + color: #111111; + font-weight: 500; + line-height: 24px; + } + + .treeMapBox { + width: 100%; + height: 585px; + } } .colostyle { diff --git a/src/router/page/index.js b/src/router/page/index.js index dff9b19..122ebf2 100644 --- a/src/router/page/index.js +++ b/src/router/page/index.js @@ -56,10 +56,12 @@ export default [{ }, { path: '/Statistics/createReport', + name: '创建报告', component: () => import(/* webpackChunkName: "views" */"@/views/Statistics/createReport") }, { path: '/Statistics/reportDetail', + name: '报告详情', component: () => import(/* webpackChunkName: "views" */"@/views/Statistics/reportDetail") } diff --git a/src/util/util.js b/src/util/util.js index f1a1f73..04ff305 100644 --- a/src/util/util.js +++ b/src/util/util.js @@ -411,3 +411,46 @@ export function exportMethodPost(url, name, data = {}) { console.log(error); }); } + + +// 导出.Excel公用方法 +export function exportMethodPostTxt(url, name, data = {}) { + axios({ + method: "get", + url: url, + params:data, + responseType: "blob", + }) + .then((res) => { + console.log(res,'数据'); + if(res.size==0){ + this.$message.warning('当前报表没数据') + console.log('没数据'); + return + } + let blob = new Blob([res], { type: "application/vnd.ms-excel" }); + let date = new Date(); + let time = date.toLocaleDateString(); + // console.log(time, "时间"); + if ("download" in document.createElement("a")) { + const link = document.createElement("a"); + link.style.display = "none"; + link.href = URL.createObjectURL(blob); + // link.download = res.headers['content-disposition'] //下载后文件名 + link.download = (name || "导出文件") + time + ".txt"; //下载的文件名 + document.body.appendChild(link); + link.click(); + document.body.removeChild(link); + } else { + // console.log("--------------------jingla") + let fileName = (name || "导出文件") + time + ".txt"; //下载的文件名 + navigator.msSaveBlob(blob, fileName); + } + }) + .catch((error) => { + // Message.error({ + // message: '网络连接错误' + // }) + console.log(error); + }); +} diff --git a/src/views/Customer/label.vue b/src/views/Customer/label.vue index 2f52fc8..13b83a4 100644 --- a/src/views/Customer/label.vue +++ b/src/views/Customer/label.vue @@ -142,6 +142,10 @@ > + + + +
+ +
+
权重：
+ +
+