diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..2bdbcf7 --- /dev/null +++ "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..2bdbcf7 --- /dev/null +++ "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..36086e7 --- /dev/null +++ "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..2bdbcf7 --- /dev/null +++ "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..36086e7 --- /dev/null +++ "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/supplier-panel.svg b/src/icons/svg/supplier-panel.svg index 5552981..8d990d0 100644 --- a/src/icons/svg/supplier-panel.svg +++ b/src/icons/svg/supplier-panel.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..2bdbcf7 --- /dev/null +++ "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..36086e7 --- /dev/null +++ "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/supplier-panel.svg b/src/icons/svg/supplier-panel.svg index 5552981..8d990d0 100644 --- a/src/icons/svg/supplier-panel.svg +++ b/src/icons/svg/supplier-panel.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index d562e12..54b62db 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -167,7 +167,7 @@ path: 'index', name: 'index', hidden: true, - component: () => import('@/views/dashboard/welcome'), // 跳转的页面 + component: () => import('@/views/dashboard/index'), // 跳转的页面 meta: { title: '首页', icon: '首页', noCache: true } }] } diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..2bdbcf7 --- /dev/null +++ "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..36086e7 --- /dev/null +++ "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/supplier-panel.svg b/src/icons/svg/supplier-panel.svg index 5552981..8d990d0 100644 --- a/src/icons/svg/supplier-panel.svg +++ b/src/icons/svg/supplier-panel.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index d562e12..54b62db 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -167,7 +167,7 @@ path: 'index', name: 'index', hidden: true, - component: () => import('@/views/dashboard/welcome'), // 跳转的页面 + component: () => import('@/views/dashboard/index'), // 跳转的页面 meta: { title: '首页', icon: '首页', noCache: true } }] } diff --git a/src/views/dashboard/components/commonSelectChart.vue b/src/views/dashboard/components/commonSelectChart.vue new file mode 100644 index 0000000..327de62 --- /dev/null +++ b/src/views/dashboard/components/commonSelectChart.vue @@ -0,0 +1,265 @@ + + + + + \ No newline at end of file diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..2bdbcf7 --- /dev/null +++ "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..36086e7 --- /dev/null +++ "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/supplier-panel.svg b/src/icons/svg/supplier-panel.svg index 5552981..8d990d0 100644 --- a/src/icons/svg/supplier-panel.svg +++ b/src/icons/svg/supplier-panel.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index d562e12..54b62db 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -167,7 +167,7 @@ path: 'index', name: 'index', hidden: true, - component: () => import('@/views/dashboard/welcome'), // 跳转的页面 + component: () => import('@/views/dashboard/index'), // 跳转的页面 meta: { title: '首页', icon: '首页', noCache: true } }] } diff --git a/src/views/dashboard/components/commonSelectChart.vue b/src/views/dashboard/components/commonSelectChart.vue new file mode 100644 index 0000000..327de62 --- /dev/null +++ b/src/views/dashboard/components/commonSelectChart.vue @@ -0,0 +1,265 @@ + + + + + \ No newline at end of file diff --git a/src/views/dashboard/components/dashboardHeader.vue b/src/views/dashboard/components/dashboardHeader.vue index 1bf1aa9..a4262ae 100644 --- a/src/views/dashboard/components/dashboardHeader.vue +++ b/src/views/dashboard/components/dashboardHeader.vue @@ -1,7 +1,7 @@ @@ -23,13 +23,26 @@ \ No newline at end of file diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..2bdbcf7 --- /dev/null +++ "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..36086e7 --- /dev/null +++ "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/supplier-panel.svg b/src/icons/svg/supplier-panel.svg index 5552981..8d990d0 100644 --- a/src/icons/svg/supplier-panel.svg +++ b/src/icons/svg/supplier-panel.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index d562e12..54b62db 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -167,7 +167,7 @@ path: 'index', name: 'index', hidden: true, - component: () => import('@/views/dashboard/welcome'), // 跳转的页面 + component: () => import('@/views/dashboard/index'), // 跳转的页面 meta: { title: '首页', icon: '首页', noCache: true } }] } diff --git a/src/views/dashboard/components/commonSelectChart.vue b/src/views/dashboard/components/commonSelectChart.vue new file mode 100644 index 0000000..327de62 --- /dev/null +++ b/src/views/dashboard/components/commonSelectChart.vue @@ -0,0 +1,265 @@ + + + + + \ No newline at end of file diff --git a/src/views/dashboard/components/dashboardHeader.vue b/src/views/dashboard/components/dashboardHeader.vue index 1bf1aa9..a4262ae 100644 --- a/src/views/dashboard/components/dashboardHeader.vue +++ b/src/views/dashboard/components/dashboardHeader.vue @@ -1,7 +1,7 @@ @@ -23,13 +23,26 @@ \ No newline at end of file diff --git a/src/views/dashboard/components/deviceList.vue b/src/views/dashboard/components/deviceList.vue index d8e2e1e..a7c11e1 100644 --- a/src/views/dashboard/components/deviceList.vue +++ b/src/views/dashboard/components/deviceList.vue @@ -17,17 +17,53 @@ @@ -46,7 +82,7 @@ height: 40px; color: rgb(64, 158, 255); } - .content{ + .content { margin-left: 10px; } } diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..2bdbcf7 --- /dev/null +++ "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..36086e7 --- /dev/null +++ "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/supplier-panel.svg b/src/icons/svg/supplier-panel.svg index 5552981..8d990d0 100644 --- a/src/icons/svg/supplier-panel.svg +++ b/src/icons/svg/supplier-panel.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index d562e12..54b62db 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -167,7 +167,7 @@ path: 'index', name: 'index', hidden: true, - component: () => import('@/views/dashboard/welcome'), // 跳转的页面 + component: () => import('@/views/dashboard/index'), // 跳转的页面 meta: { title: '首页', icon: '首页', noCache: true } }] } diff --git a/src/views/dashboard/components/commonSelectChart.vue b/src/views/dashboard/components/commonSelectChart.vue new file mode 100644 index 0000000..327de62 --- /dev/null +++ b/src/views/dashboard/components/commonSelectChart.vue @@ -0,0 +1,265 @@ + + + + + \ No newline at end of file diff --git a/src/views/dashboard/components/dashboardHeader.vue b/src/views/dashboard/components/dashboardHeader.vue index 1bf1aa9..a4262ae 100644 --- a/src/views/dashboard/components/dashboardHeader.vue +++ b/src/views/dashboard/components/dashboardHeader.vue @@ -1,7 +1,7 @@ @@ -23,13 +23,26 @@ \ No newline at end of file diff --git a/src/views/dashboard/components/deviceList.vue b/src/views/dashboard/components/deviceList.vue index d8e2e1e..a7c11e1 100644 --- a/src/views/dashboard/components/deviceList.vue +++ b/src/views/dashboard/components/deviceList.vue @@ -17,17 +17,53 @@ @@ -46,7 +82,7 @@ height: 40px; color: rgb(64, 158, 255); } - .content{ + .content { margin-left: 10px; } } diff --git a/src/views/dashboard/components/layoutChartDoughnu.vue b/src/views/dashboard/components/layoutChartDoughnu.vue index d06ab18..7906430 100644 --- a/src/views/dashboard/components/layoutChartDoughnu.vue +++ b/src/views/dashboard/components/layoutChartDoughnu.vue @@ -1,4 +1,5 @@ diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..2bdbcf7 --- /dev/null +++ "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..36086e7 --- /dev/null +++ "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/supplier-panel.svg b/src/icons/svg/supplier-panel.svg index 5552981..8d990d0 100644 --- a/src/icons/svg/supplier-panel.svg +++ b/src/icons/svg/supplier-panel.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index d562e12..54b62db 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -167,7 +167,7 @@ path: 'index', name: 'index', hidden: true, - component: () => import('@/views/dashboard/welcome'), // 跳转的页面 + component: () => import('@/views/dashboard/index'), // 跳转的页面 meta: { title: '首页', icon: '首页', noCache: true } }] } diff --git a/src/views/dashboard/components/commonSelectChart.vue b/src/views/dashboard/components/commonSelectChart.vue new file mode 100644 index 0000000..327de62 --- /dev/null +++ b/src/views/dashboard/components/commonSelectChart.vue @@ -0,0 +1,265 @@ + + + + + \ No newline at end of file diff --git a/src/views/dashboard/components/dashboardHeader.vue b/src/views/dashboard/components/dashboardHeader.vue index 1bf1aa9..a4262ae 100644 --- a/src/views/dashboard/components/dashboardHeader.vue +++ b/src/views/dashboard/components/dashboardHeader.vue @@ -1,7 +1,7 @@ @@ -23,13 +23,26 @@ \ No newline at end of file diff --git a/src/views/dashboard/components/deviceList.vue b/src/views/dashboard/components/deviceList.vue index d8e2e1e..a7c11e1 100644 --- a/src/views/dashboard/components/deviceList.vue +++ b/src/views/dashboard/components/deviceList.vue @@ -17,17 +17,53 @@ @@ -46,7 +82,7 @@ height: 40px; color: rgb(64, 158, 255); } - .content{ + .content { margin-left: 10px; } } diff --git a/src/views/dashboard/components/layoutChartDoughnu.vue b/src/views/dashboard/components/layoutChartDoughnu.vue index d06ab18..7906430 100644 --- a/src/views/dashboard/components/layoutChartDoughnu.vue +++ b/src/views/dashboard/components/layoutChartDoughnu.vue @@ -1,4 +1,5 @@ diff --git a/src/views/dashboard/components/layoutChartRadar.vue b/src/views/dashboard/components/layoutChartRadar.vue index e7f6e1a..9665720 100644 --- a/src/views/dashboard/components/layoutChartRadar.vue +++ b/src/views/dashboard/components/layoutChartRadar.vue @@ -4,7 +4,7 @@ 用户分布统计 -
+
@@ -13,6 +13,7 @@ diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..2bdbcf7 --- /dev/null +++ "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..36086e7 --- /dev/null +++ "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/supplier-panel.svg b/src/icons/svg/supplier-panel.svg index 5552981..8d990d0 100644 --- a/src/icons/svg/supplier-panel.svg +++ b/src/icons/svg/supplier-panel.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index d562e12..54b62db 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -167,7 +167,7 @@ path: 'index', name: 'index', hidden: true, - component: () => import('@/views/dashboard/welcome'), // 跳转的页面 + component: () => import('@/views/dashboard/index'), // 跳转的页面 meta: { title: '首页', icon: '首页', noCache: true } }] } diff --git a/src/views/dashboard/components/commonSelectChart.vue b/src/views/dashboard/components/commonSelectChart.vue new file mode 100644 index 0000000..327de62 --- /dev/null +++ b/src/views/dashboard/components/commonSelectChart.vue @@ -0,0 +1,265 @@ + + + + + \ No newline at end of file diff --git a/src/views/dashboard/components/dashboardHeader.vue b/src/views/dashboard/components/dashboardHeader.vue index 1bf1aa9..a4262ae 100644 --- a/src/views/dashboard/components/dashboardHeader.vue +++ b/src/views/dashboard/components/dashboardHeader.vue @@ -1,7 +1,7 @@ @@ -23,13 +23,26 @@ \ No newline at end of file diff --git a/src/views/dashboard/components/deviceList.vue b/src/views/dashboard/components/deviceList.vue index d8e2e1e..a7c11e1 100644 --- a/src/views/dashboard/components/deviceList.vue +++ b/src/views/dashboard/components/deviceList.vue @@ -17,17 +17,53 @@ @@ -46,7 +82,7 @@ height: 40px; color: rgb(64, 158, 255); } - .content{ + .content { margin-left: 10px; } } diff --git a/src/views/dashboard/components/layoutChartDoughnu.vue b/src/views/dashboard/components/layoutChartDoughnu.vue index d06ab18..7906430 100644 --- a/src/views/dashboard/components/layoutChartDoughnu.vue +++ b/src/views/dashboard/components/layoutChartDoughnu.vue @@ -1,4 +1,5 @@ diff --git a/src/views/dashboard/components/layoutChartRadar.vue b/src/views/dashboard/components/layoutChartRadar.vue index e7f6e1a..9665720 100644 --- a/src/views/dashboard/components/layoutChartRadar.vue +++ b/src/views/dashboard/components/layoutChartRadar.vue @@ -4,7 +4,7 @@ 用户分布统计
-
+
@@ -13,6 +13,7 @@ diff --git a/src/views/dashboard/components/layoutChartVerticalBar.vue b/src/views/dashboard/components/layoutChartVerticalBar.vue index 89b57f7..8b2dc23 100644 --- a/src/views/dashboard/components/layoutChartVerticalBar.vue +++ b/src/views/dashboard/components/layoutChartVerticalBar.vue @@ -1,18 +1,22 @@ diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..2bdbcf7 --- /dev/null +++ "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..36086e7 --- /dev/null +++ "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/supplier-panel.svg b/src/icons/svg/supplier-panel.svg index 5552981..8d990d0 100644 --- a/src/icons/svg/supplier-panel.svg +++ b/src/icons/svg/supplier-panel.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index d562e12..54b62db 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -167,7 +167,7 @@ path: 'index', name: 'index', hidden: true, - component: () => import('@/views/dashboard/welcome'), // 跳转的页面 + component: () => import('@/views/dashboard/index'), // 跳转的页面 meta: { title: '首页', icon: '首页', noCache: true } }] } diff --git a/src/views/dashboard/components/commonSelectChart.vue b/src/views/dashboard/components/commonSelectChart.vue new file mode 100644 index 0000000..327de62 --- /dev/null +++ b/src/views/dashboard/components/commonSelectChart.vue @@ -0,0 +1,265 @@ + + + + + \ No newline at end of file diff --git a/src/views/dashboard/components/dashboardHeader.vue b/src/views/dashboard/components/dashboardHeader.vue index 1bf1aa9..a4262ae 100644 --- a/src/views/dashboard/components/dashboardHeader.vue +++ b/src/views/dashboard/components/dashboardHeader.vue @@ -1,7 +1,7 @@ @@ -23,13 +23,26 @@ \ No newline at end of file diff --git a/src/views/dashboard/components/deviceList.vue b/src/views/dashboard/components/deviceList.vue index d8e2e1e..a7c11e1 100644 --- a/src/views/dashboard/components/deviceList.vue +++ b/src/views/dashboard/components/deviceList.vue @@ -17,17 +17,53 @@ @@ -46,7 +82,7 @@ height: 40px; color: rgb(64, 158, 255); } - .content{ + .content { margin-left: 10px; } } diff --git a/src/views/dashboard/components/layoutChartDoughnu.vue b/src/views/dashboard/components/layoutChartDoughnu.vue index d06ab18..7906430 100644 --- a/src/views/dashboard/components/layoutChartDoughnu.vue +++ b/src/views/dashboard/components/layoutChartDoughnu.vue @@ -1,4 +1,5 @@ diff --git a/src/views/dashboard/components/layoutChartRadar.vue b/src/views/dashboard/components/layoutChartRadar.vue index e7f6e1a..9665720 100644 --- a/src/views/dashboard/components/layoutChartRadar.vue +++ b/src/views/dashboard/components/layoutChartRadar.vue @@ -4,7 +4,7 @@ 用户分布统计
-
+
@@ -13,6 +13,7 @@ diff --git a/src/views/dashboard/components/layoutChartVerticalBar.vue b/src/views/dashboard/components/layoutChartVerticalBar.vue index 89b57f7..8b2dc23 100644 --- a/src/views/dashboard/components/layoutChartVerticalBar.vue +++ b/src/views/dashboard/components/layoutChartVerticalBar.vue @@ -1,18 +1,22 @@ diff --git a/src/views/dashboard/components/layoutStackAreaChart.vue b/src/views/dashboard/components/layoutStackAreaChart.vue index b100ad3..42bd139 100644 --- a/src/views/dashboard/components/layoutStackAreaChart.vue +++ b/src/views/dashboard/components/layoutStackAreaChart.vue @@ -1,18 +1,24 @@ diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..2bdbcf7 --- /dev/null +++ "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..36086e7 --- /dev/null +++ "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/supplier-panel.svg b/src/icons/svg/supplier-panel.svg index 5552981..8d990d0 100644 --- a/src/icons/svg/supplier-panel.svg +++ b/src/icons/svg/supplier-panel.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index d562e12..54b62db 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -167,7 +167,7 @@ path: 'index', name: 'index', hidden: true, - component: () => import('@/views/dashboard/welcome'), // 跳转的页面 + component: () => import('@/views/dashboard/index'), // 跳转的页面 meta: { title: '首页', icon: '首页', noCache: true } }] } diff --git a/src/views/dashboard/components/commonSelectChart.vue b/src/views/dashboard/components/commonSelectChart.vue new file mode 100644 index 0000000..327de62 --- /dev/null +++ b/src/views/dashboard/components/commonSelectChart.vue @@ -0,0 +1,265 @@ + + + + + \ No newline at end of file diff --git a/src/views/dashboard/components/dashboardHeader.vue b/src/views/dashboard/components/dashboardHeader.vue index 1bf1aa9..a4262ae 100644 --- a/src/views/dashboard/components/dashboardHeader.vue +++ b/src/views/dashboard/components/dashboardHeader.vue @@ -1,7 +1,7 @@ @@ -23,13 +23,26 @@ \ No newline at end of file diff --git a/src/views/dashboard/components/deviceList.vue b/src/views/dashboard/components/deviceList.vue index d8e2e1e..a7c11e1 100644 --- a/src/views/dashboard/components/deviceList.vue +++ b/src/views/dashboard/components/deviceList.vue @@ -17,17 +17,53 @@ @@ -46,7 +82,7 @@ height: 40px; color: rgb(64, 158, 255); } - .content{ + .content { margin-left: 10px; } } diff --git a/src/views/dashboard/components/layoutChartDoughnu.vue b/src/views/dashboard/components/layoutChartDoughnu.vue index d06ab18..7906430 100644 --- a/src/views/dashboard/components/layoutChartDoughnu.vue +++ b/src/views/dashboard/components/layoutChartDoughnu.vue @@ -1,4 +1,5 @@ diff --git a/src/views/dashboard/components/layoutChartRadar.vue b/src/views/dashboard/components/layoutChartRadar.vue index e7f6e1a..9665720 100644 --- a/src/views/dashboard/components/layoutChartRadar.vue +++ b/src/views/dashboard/components/layoutChartRadar.vue @@ -4,7 +4,7 @@ 用户分布统计
-
+
@@ -13,6 +13,7 @@ diff --git a/src/views/dashboard/components/layoutChartVerticalBar.vue b/src/views/dashboard/components/layoutChartVerticalBar.vue index 89b57f7..8b2dc23 100644 --- a/src/views/dashboard/components/layoutChartVerticalBar.vue +++ b/src/views/dashboard/components/layoutChartVerticalBar.vue @@ -1,18 +1,22 @@ diff --git a/src/views/dashboard/components/layoutStackAreaChart.vue b/src/views/dashboard/components/layoutStackAreaChart.vue index b100ad3..42bd139 100644 --- a/src/views/dashboard/components/layoutStackAreaChart.vue +++ b/src/views/dashboard/components/layoutStackAreaChart.vue @@ -1,18 +1,24 @@ diff --git a/src/views/dashboard/components/layoutStackAreaChartTrend.vue b/src/views/dashboard/components/layoutStackAreaChartTrend.vue new file mode 100644 index 0000000..8a665d2 --- /dev/null +++ b/src/views/dashboard/components/layoutStackAreaChartTrend.vue @@ -0,0 +1,92 @@ + + + + + \ No newline at end of file diff --git a/package.json b/package.json index 9928fd9..26a6470 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "@riophae/vue-treeselect": "^0.4.0", "axios": "^0.21.4", "clipboard": "^2.0.8", diff --git a/src/api/cockpit/cockpit.js b/src/api/cockpit/cockpit.js index 625e638..0cf5eef 100644 --- a/src/api/cockpit/cockpit.js +++ b/src/api/cockpit/cockpit.js @@ -9,32 +9,174 @@ } // 设备总数、IOT设备数量、IOT设备在线率 export function getDeviceInfo() { - return request({ - url: 'statistic/deviceCount', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount', + method: 'get', + }) } // 近一月设备数量统计 export function getDeviceStatistics() { - return request({ - url: 'statistic/deviceCount/montht', - method: 'get', - }) + return request({ + url: 'statistic/deviceCount/month', + method: 'get', + }) } // 设备品类统计 export function getDeviceCategory() { - return request({ - url: 'statistic/deviceCategory', - method: 'get', - }) + return request({ + url: 'statistic/deviceCategory', + method: 'get', + }) } // 区域设备排行 -// export function getRegionalRank() { -// return request({ -// url: 'statistic/deviceCategory', -// method: 'get', -// }) -// } \ No newline at end of file +export function getRegionalRank() { + return request({ + url: 'statistic/deviceRegion', + method: 'get', + }) +} + +// 经营面板 +// 各分类用户数量 +export function getUserCount() { + return request({ + url: 'statistic/userCount', + method: 'get', + }) +} + +// 用户数量变化趋势 +export function getUserTrend() { + return request({ + url: 'statistic/userTrend', + method: 'get', + }) +} + +// 订单统计 +export function getUserCountStatistic(time) { + return request({ + url: time === 'year' ? 'statistic/order/year' : 'statistic/order/month', + method: 'get', + }) +} + +// 经销商订单同比/环比统计 +export function getOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/orderRatio/year' : 'statistic/orderRatio/month', + method: 'get', + }) +} + +// 分子公司订单同比/环比统计 +export function getBranchOrderRatio(time) { + return request({ + url: time === 'year' ? 'statistic/branchOrderRatio/year' : 'statistic/branchOrderRatio/month', + method: 'get', + }) +} + +// 商机统计 +export function getOpportunityStatistics(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunity/year' : 'statistic/businessOpportunity/month', + method: 'get', + }) +} + +// 商机同比/环比统计 +export function getBusinessOpportunityRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityRatio/year' : 'statistic/businessOpportunityRatio/month', + method: 'get', + }) +} + +// 商机转订单同比/环比统计 +export function getBusinessOpportunityTurnRatio(time) { + return request({ + url: time === 'year' ? 'statistic/businessOpportunityTurnRatio/year' : 'statistic/businessOpportunityTurnRatio/month', + method: 'get', + }) +} + +// 供应商面板 +// 供应商注册、审核通过、注册设备数量 +export function getSupplierCount() { + return request({ + url: 'statistic/supplierCount', + method: 'get', + }) +} + +// 供应商注册统计 +export function getRegisterCount() { + return request({ + url: 'statistic/supplierRegister', + method: 'get', + }) +} + +// 供应商状态统计 +export function getSupplierStatus() { + return request({ + url: 'statistic/supplierStatus', + method: 'get', + }) +} + +// 供应商资料预审统计 +export function getPreReview(time) { + return request({ + url: time === 'year' ? 'statistic/preReview/year' : 'statistic/preReview/month', + method: 'get', + }) +} + +// 供应商录库评审统计 +export function getInputReview(time) { + return request({ + url: time === 'year' ? 'statistic/inputReview/year' : 'statistic/inputReview/month', + method: 'get', + }) +} +// sys/dict/code/{code} +// 供应商季度评价统计下拉框内容 +export function getSelectContent() { + return request({ + url: 'sys/dict/code/assessAnnual', + method: 'get', + }) +} +// 供应商季度评价统计 +export function getEvaluate(code) { + return request({ + url: `statistic/quarterlyEvaluate/${code}`, + method: 'get', + }) +} +// 供应商年度考核统计 +export function getAnnualAssess() { + return request({ + url: `statistic/annualAssess`, + method: 'get', + }) +} +// 设备注册数量统计 +export function getDeviceCount() { + return request({ + url: 'statistic/supplierDevice/month', + method: 'get', + }) +} +// 设备注册排行榜 +export function getDeviceRank() { + return request({ + url: 'statistic/supplierDevice/rank', + method: 'get', + }) +} \ No newline at end of file diff --git a/src/components/echart/barChart/MixChart.vue b/src/components/echart/barChart/MixChart.vue index 14b069e..7dadfd8 100644 --- a/src/components/echart/barChart/MixChart.vue +++ b/src/components/echart/barChart/MixChart.vue @@ -1,5 +1,5 @@ + legend(newVal) { + this.option.legend[0].data = newVal; + // this.refreshEchart() + }, + unit(newVal) { + this.option.yAxis[0].name = newVal; + // this.refreshEchart() + }, + seriesData: { + handler(newVal) { + const newSeries = []; + for (const item of newVal) { + const series = { + name: item.name, + type: "line", + symbol: "none", // 去掉折线节点 + smooth: this.smooth, // 曲线变平滑 + lineStyle: { + width: 1, + }, + areaStyle: { + opacity: 0.5, + }, + data: item.data, + }; + newSeries.push(series); + } + this.$set(this.option, "series", newSeries); + // this.refreshChart() + }, + deep: true, + }, + }, + // mounted() { + // this.refreshChart() + // }, + // methods: { + // refreshChart() { + // this.unit && (this.option.yAxis[0].name = this.unit) + // if (this.xAxisData.length) { + // this.option.legend.data = this.legend + // this.option.xAxis[0].data = this.xAxisData + // const newSeries = [] + // for (const item of this.seriesData) { + // const series = { + // name: item.name, + // type: 'line', + // symbol: 'none', // 去掉折线节点 + // smooth: this.smooth, // 曲线变平滑 + // itemStyle: { + // color: `rgb(${item.color})` + // }, + // lineStyle: { + // width: 1 + // }, + // areaStyle: { + // color: new this.$echarts.graphic.LinearGradient( + // 0, 0, 0, 1, // 变化度 //三种由深及浅的颜色 + // [ + // { + // offset: 0.1, + // color: `rgba(${item.color},.6)` + // }, + // { + // offset: 1, + // color: 'rgba(0,0,0,.0)' + // } + // ] + // ) + // }, + // data: item.data + // } + // newSeries.push(series) + // } + // this.$set(this.option, 'series', newSeries) + // } + // } + // } +}; + + \ No newline at end of file diff --git a/src/components/echart/lineChart/gradientLineChart.vue b/src/components/echart/lineChart/gradientLineChart.vue index 5b758a1..dc58f77 100644 --- a/src/components/echart/lineChart/gradientLineChart.vue +++ b/src/components/echart/lineChart/gradientLineChart.vue @@ -67,25 +67,26 @@ curHeight: this.height, option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { - orient: 'horizontal', - data: [], - align: 'left', - right: '5%', + orient: "horizontal", + // data:[], + type:'scroll', + left:'center', + top:'bottom', itemWidth: 12, itemHeight: 12, - icon: 'rect', + icon: "rect", textStyle: { - width: '300', - color: '#000', - fontSize: 12 - } + width: "300", + color: "#000", + fontSize: 12, + }, }, tooltip: { trigger: 'axis', @@ -105,13 +106,13 @@ boundaryGap: true, data: [], axisLine: { - show:false, + show:true, lineStyle: { - color: this.axisLineColor // 轴线的颜色 + color: '#000' // 轴线的颜色 } }, axisLabel: { - color: this.fontColor, // X轴名称颜色 + color: '#000', // X轴名称颜色 fontSize: 14 }, axisTick:{ @@ -122,7 +123,6 @@ yAxis: [ { name: this.unit, - show:false, type: 'value', color: '#000', nameTextStyle: { @@ -131,23 +131,24 @@ verticalAlign: 'middle' }, splitLine: { - show: false, + show: true, lineStyle: { - color: ['#101641'], - type: 'dashed' + color: ['#D7D9E0'], + type: 'solid' } }, - max: function(value) { - return value.max + 2 - }, + // max: function(value) { + // return value.max + // }, minIntermal: 1, axisLine: { + show:false, lineStyle: { - color: this.axisLineColor + color: '#000' } }, axisLabel: { - color: this.fontColor, + color: '#000', fontSize: 12 } } diff --git a/src/components/echart/lineChart/lineChart.vue b/src/components/echart/lineChart/lineChart.vue new file mode 100644 index 0000000..73de2e3 --- /dev/null +++ b/src/components/echart/lineChart/lineChart.vue @@ -0,0 +1,179 @@ + + + + + \ No newline at end of file diff --git a/src/components/echart/lineChart/simpleLineChart.vue b/src/components/echart/lineChart/simpleLineChart.vue index a365dbb..a065510 100644 --- a/src/components/echart/lineChart/simpleLineChart.vue +++ b/src/components/echart/lineChart/simpleLineChart.vue @@ -65,11 +65,11 @@ return { option: { grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 20, - containLabel: true + bottom: 30, + top: 10, + containLabel: true, }, legend: { orient: 'horizontal', diff --git a/src/components/echart/pieChart/doughnutChart.vue b/src/components/echart/pieChart/doughnutChart.vue index 7f3cac2..b33e797 100644 --- a/src/components/echart/pieChart/doughnutChart.vue +++ b/src/components/echart/pieChart/doughnutChart.vue @@ -33,15 +33,31 @@ return []; }, }, + title:{ + type:String, + default:'' + } }, data() { return { curWidth: this.width, curHeight: this.height, option: { + title:{ + text:'', + textStyle:{ + color:'#000', + fontSize:14, + fontWeight:500 + }, + left:'center', + top:'center' + }, legend: { orient: "horizontal", + type:'plain', bottom: "auto", + // data:[], top: "bottom", itemWidth: 12, itemHeight: 12, @@ -53,14 +69,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +100,10 @@ this.option.legend.data = newVal; // this.refreshEchart(); }, + title(newVal) { + this.option.title.text = newVal; + // this.refreshEchart(); + }, seriesData: { handler(newVal) { const series = { @@ -92,7 +112,23 @@ radius: ["40%", "60%"], labelLine: { show: true, + length2: 0 }, + emphasis:{ + scale:false, + focus:'self', + itemStyle:{ + borderColor:'#000', + borderWidth:1, + borderType:'solid' + } + }, + label:{ + show:true, + formatter: '{d}%' + }, + selectedOffset:0, // 选中时移动的距离 + avoidLabelOverlap: true, }; this.$set(this.option, "series", series); // this.refreshChart(); diff --git a/src/components/echart/radarChart/baseRadarChart.vue b/src/components/echart/radarChart/baseRadarChart.vue index 15b7124..bd590d6 100644 --- a/src/components/echart/radarChart/baseRadarChart.vue +++ b/src/components/echart/radarChart/baseRadarChart.vue @@ -64,14 +64,14 @@ }, }, grid: { - left: 10, + left: 30, right: 30, - bottom: 5, - top: 30, + bottom: 30, + top: 10, containLabel: true, }, tooltip: { - trigger: "axis", + trigger: "item", textStyle: { fontSize: "16", }, @@ -84,6 +84,18 @@ }, radar: { shape: "circle", + axisLine:{ + show:false + }, + axisLabel:{ + // show:true + }, + splitArea:{ + // show:false, + areaStyle:{ + color:'#fff' + } + }, indicator: [], }, series: [], @@ -103,6 +115,7 @@ name: item.name, type: "radar", data: item.data, + areaStyle:{} }; newSeries.push(series); } diff --git a/src/components/guadMap/circle.vue b/src/components/guadMap/circle.vue new file mode 100644 index 0000000..5953d4d --- /dev/null +++ b/src/components/guadMap/circle.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/src/components/guadMap/index.vue b/src/components/guadMap/index.vue new file mode 100644 index 0000000..cb2c58d --- /dev/null +++ b/src/components/guadMap/index.vue @@ -0,0 +1,164 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/svg/icon-user-man.svg b/src/icons/svg/icon-user-man.svg new file mode 100644 index 0000000..cfdc5ef --- /dev/null +++ b/src/icons/svg/icon-user-man.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..2bdbcf7 --- /dev/null +++ "b/src/icons/svg/icon-\347\247\273\345\212\250\347\253\257\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git "a/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" new file mode 100644 index 0000000..36086e7 --- /dev/null +++ "b/src/icons/svg/icon-\347\273\217\351\224\200\345\225\206\347\224\250\346\210\267.svg" @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/supplier-panel.svg b/src/icons/svg/supplier-panel.svg index 5552981..8d990d0 100644 --- a/src/icons/svg/supplier-panel.svg +++ b/src/icons/svg/supplier-panel.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index d562e12..54b62db 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -167,7 +167,7 @@ path: 'index', name: 'index', hidden: true, - component: () => import('@/views/dashboard/welcome'), // 跳转的页面 + component: () => import('@/views/dashboard/index'), // 跳转的页面 meta: { title: '首页', icon: '首页', noCache: true } }] } diff --git a/src/views/dashboard/components/commonSelectChart.vue b/src/views/dashboard/components/commonSelectChart.vue new file mode 100644 index 0000000..327de62 --- /dev/null +++ b/src/views/dashboard/components/commonSelectChart.vue @@ -0,0 +1,265 @@ + + + + + \ No newline at end of file diff --git a/src/views/dashboard/components/dashboardHeader.vue b/src/views/dashboard/components/dashboardHeader.vue index 1bf1aa9..a4262ae 100644 --- a/src/views/dashboard/components/dashboardHeader.vue +++ b/src/views/dashboard/components/dashboardHeader.vue @@ -1,7 +1,7 @@ @@ -23,13 +23,26 @@ \ No newline at end of file diff --git a/src/views/dashboard/components/deviceList.vue b/src/views/dashboard/components/deviceList.vue index d8e2e1e..a7c11e1 100644 --- a/src/views/dashboard/components/deviceList.vue +++ b/src/views/dashboard/components/deviceList.vue @@ -17,17 +17,53 @@ @@ -46,7 +82,7 @@ height: 40px; color: rgb(64, 158, 255); } - .content{ + .content { margin-left: 10px; } } diff --git a/src/views/dashboard/components/layoutChartDoughnu.vue b/src/views/dashboard/components/layoutChartDoughnu.vue index d06ab18..7906430 100644 --- a/src/views/dashboard/components/layoutChartDoughnu.vue +++ b/src/views/dashboard/components/layoutChartDoughnu.vue @@ -1,4 +1,5 @@ diff --git a/src/views/dashboard/components/layoutChartRadar.vue b/src/views/dashboard/components/layoutChartRadar.vue index e7f6e1a..9665720 100644 --- a/src/views/dashboard/components/layoutChartRadar.vue +++ b/src/views/dashboard/components/layoutChartRadar.vue @@ -4,7 +4,7 @@ 用户分布统计
-
+
@@ -13,6 +13,7 @@ diff --git a/src/views/dashboard/components/layoutChartVerticalBar.vue b/src/views/dashboard/components/layoutChartVerticalBar.vue index 89b57f7..8b2dc23 100644 --- a/src/views/dashboard/components/layoutChartVerticalBar.vue +++ b/src/views/dashboard/components/layoutChartVerticalBar.vue @@ -1,18 +1,22 @@ diff --git a/src/views/dashboard/components/layoutStackAreaChart.vue b/src/views/dashboard/components/layoutStackAreaChart.vue index b100ad3..42bd139 100644 --- a/src/views/dashboard/components/layoutStackAreaChart.vue +++ b/src/views/dashboard/components/layoutStackAreaChart.vue @@ -1,18 +1,24 @@ diff --git a/src/views/dashboard/components/layoutStackAreaChartTrend.vue b/src/views/dashboard/components/layoutStackAreaChartTrend.vue new file mode 100644 index 0000000..8a665d2 --- /dev/null +++ b/src/views/dashboard/components/layoutStackAreaChartTrend.vue @@ -0,0 +1,92 @@ + + + + + \ No newline at end of file diff --git a/src/views/dashboard/components/managementList.vue b/src/views/dashboard/components/managementList.vue index e6000f1..88c7827 100644 --- a/src/views/dashboard/components/managementList.vue +++ b/src/views/dashboard/components/managementList.vue @@ -1,14 +1,11 @@