Commit 9ccd942b authored by 小费同学阿's avatar 小费同学阿 💬

Merge remote-tracking branch 'origin/develop' into develop

parents c6cc6d6b 07969539
...@@ -14,6 +14,8 @@ enum Api { ...@@ -14,6 +14,8 @@ enum Api {
// 形象进度占比 // 形象进度占比
progress= '/pro/gateway/progress', progress= '/pro/gateway/progress',
// 企业项目数量排行
comapnyList= '/pro/gateway/company-list',
} }
export const getList = (params?: ProjectParams) => export const getList = (params?: ProjectParams) =>
...@@ -44,6 +46,10 @@ export const getProgress = (params?: ProjectParams) => ...@@ -44,6 +46,10 @@ export const getProgress = (params?: ProjectParams) =>
defHttp.get<ProjectListGetResultModel>( defHttp.get<ProjectListGetResultModel>(
{ url: Api.progress,params }) { url: Api.progress,params })
export const getComapnyList = (params?: ProjectParams) =>
defHttp.get<ProjectListGetResultModel>(
{ url: Api.comapnyList })
......
...@@ -79,10 +79,7 @@ onMounted( async ()=>{ ...@@ -79,10 +79,7 @@ onMounted( async ()=>{
// show: true, // show: true,
// top: '40%', // top: '40%',
// right: 'right', // right: 'right',
show: true, bottom:10,
orient: 'vertical',
top: 'center',
right: '7%',
icon: 'rect', icon: 'rect',
itemGap: 30, itemGap: 30,
itemWidth: 20, itemWidth: 20,
...@@ -98,7 +95,7 @@ onMounted( async ()=>{ ...@@ -98,7 +95,7 @@ onMounted( async ()=>{
{ {
type: "pie", type: "pie",
radius: [80, 100], radius: [80, 100],
center: ["35%", "60%"], center: ["50%", "50%"],
itemStyle: { itemStyle: {
color: (params) => { color: (params) => {
return colorList[params.dataIndex]; return colorList[params.dataIndex];
......
...@@ -6,9 +6,139 @@ ...@@ -6,9 +6,139 @@
</Card> </Card>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { Ref, ref, watch } from 'vue'; import { Ref, ref, watch ,onMounted} from 'vue';
import { Card } from 'ant-design-vue'; import { Card } from 'ant-design-vue';
import { useECharts } from '@/hooks/web/useECharts'; import { useECharts } from '@/hooks/web/useECharts';
import {getComapnyList} from "@/api/dashboard/dashboard"
const loading=ref(true)
onMounted( async ()=>{
const data = await getComapnyList()
console.log(data,"企业项目数量排行")
if(data){
loading.value=false
}
let number=data.number
let title=data.title
// 将 number 和 title 组合成一个对象数组
let arr = number.map((num, index) => ({ num, title: title[index] }));
// 对数组按照 num 从大到小排序
arr.sort((a, b) => b.num - a.num);
// 提取排序后的 title 数组
let sortedTitle = arr.map(item => item.title);
let sortedNumber = arr.map(item => item.num);
setOptions({
backgroundColor:"#fff",
grid: {
left: '2%',
right: '2%',
bottom: '2%',
top: '2%',
containLabel: true
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'none'
},
formatter: function(params) {
return params[0].name + ' : ' + params[0].value
}
},
xAxis: {
show: false,
type: 'value'
},
yAxis: [{
type: 'category',
inverse: true,
axisLabel: {
//设置字体大小
show: true,
formatter: function (value) {
const charPerLine = 6; // 每行显示的字符数
let result = '';
for (let i = 0; i < value.length; i += charPerLine) {
if (i + charPerLine < value.length) {
result += value.substring(i, i + charPerLine) + '\n';
} else {
result += value.substring(i);
}
}
return result;
},
textStyle: {
//设置字体大小
fontSize: 10,
color: '#000'
},
},
splitLine: {
show: false
},
axisTick: {
show: false
},
axisLine: {
show: false
},
data:sortedTitle
// data:['1','2','3','4','5','6','7','8','9','10']
}, {
type: 'category',
inverse: true,
axisTick: 'none',
axisLine: 'none',
show: true,
axisLabel: {
textStyle: {
color: '#ffffff',
fontSize: '12'
},
},
data:sortedNumber
}],
series: [{
name: '值',
type: 'bar',
zlevel: 1,
itemStyle: {
normal: {
barBorderRadius: 30,
color: '#FF7A8C',
//设置字体颜色
// color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
// offset: 0,
// color: 'rgb(57,89,255,1)'
// }, {
// offset: 1,
// color: 'rgb(46,200,207,1)'
// }]),
},
},
barWidth: 20,
data:sortedNumber
},
{
name: '背景',
type: 'bar',
barWidth: 20,
barGap: '-100%',
data: sortedNumber,
itemStyle: {
normal: {
color: '#fff',
barBorderRadius: 30,
}
},
},
]
});
})
const props = defineProps({ const props = defineProps({
loading: Boolean, loading: Boolean,
...@@ -24,106 +154,4 @@ const props = defineProps({ ...@@ -24,106 +154,4 @@ const props = defineProps({
const chartRef = ref<HTMLDivElement | null>(null); const chartRef = ref<HTMLDivElement | null>(null);
const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>); const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
watch(
() => props.loading,
() => {
if (props.loading) {
return;
}
setOptions({
backgroundColor:"#fff",
grid: {
left: '2%',
right: '2%',
bottom: '2%',
top: '2%',
containLabel: true
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'none'
},
formatter: function(params) {
return params[0].name + ' : ' + params[0].value
}
},
xAxis: {
show: false,
type: 'value'
},
yAxis: [{
type: 'category',
inverse: true,
axisLabel: {
show: true,
textStyle: {
color: '#000'
},
},
splitLine: {
show: false
},
axisTick: {
show: false
},
axisLine: {
show: false
},
data: ["A公司","B公司","C公司","D公司","E公司","F公司","H公司","G公司","K公司","W公司"]
}, {
type: 'category',
inverse: true,
axisTick: 'none',
axisLine: 'none',
show: true,
axisLabel: {
textStyle: {
color: '#ffffff',
fontSize: '12'
},
},
data:[239,181,154,144,135,117,74,72,67,55]
}],
series: [{
name: '值',
type: 'bar',
zlevel: 1,
itemStyle: {
normal: {
barBorderRadius: 30,
color: '#FF7A8C',
//设置字体颜色
// color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
// offset: 0,
// color: 'rgb(57,89,255,1)'
// }, {
// offset: 1,
// color: 'rgb(46,200,207,1)'
// }]),
},
},
barWidth: 20,
data: [239,181,154,144,135,117,74,72,67,55]
},
{
name: '背景',
type: 'bar',
barWidth: 20,
barGap: '-100%',
data: [239,239,239,239,239,239,239,239,239,239],
itemStyle: {
normal: {
color: '#fff',
barBorderRadius: 30,
}
},
},
]
});
},
{ immediate: true },
);
</script> </script>
...@@ -197,6 +197,7 @@ function getPercentage(nowNumber:number,laetNumer:number) { ...@@ -197,6 +197,7 @@ function getPercentage(nowNumber:number,laetNumer:number) {
dataShow.content= (Math.abs(nowNumber -laetNumer)) / nowNumber * 100 dataShow.content= (Math.abs(nowNumber -laetNumer)) / nowNumber * 100
dataShow.state=1 dataShow.state=1
} }
dataShow.content=dataShow.content.toFixed(2)
return dataShow; return dataShow;
} }
......
...@@ -100,9 +100,10 @@ onMounted( async ()=>{ ...@@ -100,9 +100,10 @@ onMounted( async ()=>{
chat.setOption({ chat.setOption({
legend: { legend: {
show: true, show: true,
orient: 'vertical', // orient: 'vertical',
top: 'center', // top: 'center',
right: '7%', // right: '7%',
bottom:10,
icon: 'rect', icon: 'rect',
itemGap: 30, itemGap: 30,
itemWidth: 20, itemWidth: 20,
...@@ -118,7 +119,7 @@ onMounted( async ()=>{ ...@@ -118,7 +119,7 @@ onMounted( async ()=>{
{ {
type: "pie", type: "pie",
radius: [80, 100], radius: [80, 100],
center: ["30%", "60%"], center: ["50%", "40%"],
itemStyle: { itemStyle: {
color: (params) => { color: (params) => {
return colorList[params.dataIndex]; return colorList[params.dataIndex];
......
...@@ -25,7 +25,6 @@ ...@@ -25,7 +25,6 @@
import Adderss from "@/views/dashboard/analysis/components/Adderss.vue"; import Adderss from "@/views/dashboard/analysis/components/Adderss.vue";
import EnterpriseProject from "@/views/dashboard/analysis/components/EnterpriseProject.vue"; import EnterpriseProject from "@/views/dashboard/analysis/components/EnterpriseProject.vue";
const loading = ref(true); const loading = ref(true);
setTimeout(() => { setTimeout(() => {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment