修改大屏数据处理
This commit is contained in:
@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div class="carcTitle">合作社位置撒点</div>
|
<div class="carcTitle">省内区域劳务协作撒点</div>
|
||||||
<div ref="map" style="width: 17vw; height: 14.5vw"></div>
|
<div ref="map" style="width: 17vw; height: 14.5vw"></div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@ -4,9 +4,10 @@
|
|||||||
<!-- 表头保持固定 -->
|
<!-- 表头保持固定 -->
|
||||||
<ul class="header-list">
|
<ul class="header-list">
|
||||||
<li class="singleBackground topLi">
|
<li class="singleBackground topLi">
|
||||||
<div> 序号</div>
|
<!-- <div> 序号</div>-->
|
||||||
<div>区域</div>
|
<div>区域</div>
|
||||||
<div>入职人数</div>
|
<div>入职人数</div>
|
||||||
|
<div>占比</div>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<!-- 滚动区域 -->
|
<!-- 滚动区域 -->
|
||||||
@ -15,9 +16,10 @@
|
|||||||
<div ref="scrollItemBox">
|
<div ref="scrollItemBox">
|
||||||
<li v-for="(item, index) in pieData" :key="index" @click="visible = true"
|
<li v-for="(item, index) in pieData" :key="index" @click="visible = true"
|
||||||
:class="{ 'singleBackground': index % 2 == 0, 'evenBackground': index % 2 == 1 }">
|
:class="{ 'singleBackground': index % 2 == 0, 'evenBackground': index % 2 == 1 }">
|
||||||
<div>{{ `${index + 1 >= 10 ? index + 1 : '0' + (index + 1)}` }}</div>
|
<!-- <div>{{ `${index + 1 >= 10 ? index + 1 : '0' + (index + 1)}` }}</div>-->
|
||||||
<div>{{ item.zone }}</div>
|
<div>{{ item.zone }}</div>
|
||||||
<div>{{ item.count }}人</div>
|
<div>{{ item.count }}人</div>
|
||||||
|
<div>{{ item.proportion }}</div>
|
||||||
<div></div>
|
<div></div>
|
||||||
</li>
|
</li>
|
||||||
</div>
|
</div>
|
||||||
@ -81,98 +83,120 @@ import * as echarts from "echarts";
|
|||||||
const pieRef = ref(null);
|
const pieRef = ref(null);
|
||||||
const pieData = [
|
const pieData = [
|
||||||
{
|
{
|
||||||
zone: "四川 - 成都",
|
"zone": "四川 - 成都",
|
||||||
count: 2920
|
"count": 2920,
|
||||||
|
"proportion": 29.87
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "省外",
|
"zone": "省外",
|
||||||
count: 1490
|
"count": 1490,
|
||||||
|
"proportion": 15.24
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 南充",
|
"zone": "四川 - 南充",
|
||||||
count: 598
|
"count": 598,
|
||||||
|
"proportion": 6.12
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 内江",
|
"zone": "四川 - 内江",
|
||||||
count: 473
|
"count": 473,
|
||||||
|
"proportion": 4.84
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 乐山",
|
"zone": "四川 - 乐山",
|
||||||
count: 421
|
"count": 421,
|
||||||
|
"proportion": 4.31
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 眉山",
|
"zone": "四川 - 眉山",
|
||||||
count: 386
|
"count": 386,
|
||||||
|
"proportion": 3.95
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 巴中",
|
"zone": "四川 - 巴中",
|
||||||
count: 373
|
"count": 373,
|
||||||
|
"proportion": 3.82
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 宜宾",
|
"zone": "四川 - 宜宾",
|
||||||
count: 313
|
"count": 313,
|
||||||
|
"proportion": 3.2
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 达州",
|
"zone": "四川 - 达州",
|
||||||
count: 313
|
"count": 313,
|
||||||
|
"proportion": 3.2
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 广元",
|
"zone": "四川 - 广元",
|
||||||
count: 300
|
"count": 300,
|
||||||
|
"proportion": 3.07
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 泸州",
|
"zone": "四川 - 泸州",
|
||||||
count: 294
|
"count": 294,
|
||||||
|
"proportion": 3.01
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 遂宁",
|
"zone": "四川 - 遂宁",
|
||||||
count: 278
|
"count": 278,
|
||||||
|
"proportion": 2.84
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 自贡",
|
"zone": "四川 - 自贡",
|
||||||
count: 276
|
"count": 276,
|
||||||
|
"proportion": 2.82
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 资阳",
|
"zone": "四川 - 资阳",
|
||||||
count: 272
|
"count": 272,
|
||||||
|
"proportion": 2.78
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 绵阳",
|
"zone": "四川 - 绵阳",
|
||||||
count: 231
|
"count": 231,
|
||||||
|
"proportion": 2.36
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 德阳",
|
"zone": "四川 - 德阳",
|
||||||
count: 222
|
"count": 222,
|
||||||
|
"proportion": 2.27
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 凉山",
|
"zone": "四川 - 凉山",
|
||||||
count: 177
|
"count": 177,
|
||||||
|
"proportion": 1.81
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 雅安",
|
"zone": "四川 - 雅安",
|
||||||
count: 166
|
"count": 166,
|
||||||
|
"proportion": 1.7
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 广安",
|
"zone": "四川 - 广安",
|
||||||
count: 162
|
"count": 162,
|
||||||
|
"proportion": 1.66
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 攀枝花",
|
"zone": "四川 - 攀枝花",
|
||||||
count: 54
|
"count": 54,
|
||||||
|
"proportion": 0.55
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 阿坝",
|
"zone": "四川 - 阿坝",
|
||||||
count: 47
|
"count": 47,
|
||||||
|
"proportion": 0.48
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
zone: "四川 - 甘孜",
|
"zone": "四川 - 甘孜",
|
||||||
count: 9
|
"count": 9,
|
||||||
|
"proportion": 0.09
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
const visible = ref(false);
|
const visible = ref(false);
|
||||||
// 滚动相关变量
|
// 滚动相关变量
|
||||||
const scrollTop = ref(0); // 列表滚动高度
|
const scrollTop = ref(0); // 列表滚动高度
|
||||||
const speed = ref(15); // 滚动速度
|
const speed = ref(120); // 滚动速度
|
||||||
const copyHtml = ref(''); // 复制的HTML内容
|
const copyHtml = ref(''); // 复制的HTML内容
|
||||||
const scrollItemBox = ref(null); // 滚动项容器引用
|
const scrollItemBox = ref(null); // 滚动项容器引用
|
||||||
let timer = null;
|
let timer = null;
|
||||||
@ -308,13 +332,13 @@ function closeModal() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
>div:first-child {
|
>div:first-child {
|
||||||
width: 20%;
|
width: 50%;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
>div:nth-child(2) {
|
>div:nth-child(2) {
|
||||||
width: 50%;
|
width: 25%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -153,17 +153,17 @@ const cardTwoInfo = {
|
|||||||
title: "兴蜀就业生态数据",
|
title: "兴蜀就业生态数据",
|
||||||
type1: {
|
type1: {
|
||||||
title: "第一产业",
|
title: "第一产业",
|
||||||
count: "1.2",
|
count: "1.01",
|
||||||
class: "modelItem3 first"
|
class: "modelItem3 first"
|
||||||
},
|
},
|
||||||
type2: {
|
type2: {
|
||||||
title: "第二产业",
|
title: "第二产业",
|
||||||
count: "1.6",
|
count: "1.36",
|
||||||
class: "modelItem3 seconed"
|
class: "modelItem3 seconed"
|
||||||
},
|
},
|
||||||
type3: {
|
type3: {
|
||||||
title: "第三产业",
|
title: "第三产业",
|
||||||
count: "1.4",
|
count: "1.29",
|
||||||
class: "modelItem3 third"
|
class: "modelItem3 third"
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@ -176,7 +176,7 @@ const cardThreeInfo = {
|
|||||||
class: "modelItem2"
|
class: "modelItem2"
|
||||||
},
|
},
|
||||||
type2: {
|
type2: {
|
||||||
title: "企业总人数",
|
title: "企业总人数(2025/10/25)",
|
||||||
count: "38448",
|
count: "38448",
|
||||||
class: "modelItem2"
|
class: "modelItem2"
|
||||||
}
|
}
|
||||||
@ -185,13 +185,13 @@ const cardFourInfo = {
|
|||||||
title: "三级劳务体系建设",
|
title: "三级劳务体系建设",
|
||||||
description: "198名平台劳务经纪人",
|
description: "198名平台劳务经纪人",
|
||||||
type1: {
|
type1: {
|
||||||
title: "合作社",
|
title: "区域劳务协作",
|
||||||
count: "5",
|
count: "19个区县",
|
||||||
class: "modelItem2"
|
class: "modelItem2"
|
||||||
},
|
},
|
||||||
type2: {
|
type2: {
|
||||||
title: "劳务经纪人",
|
title: "劳务经纪人",
|
||||||
count: "198",
|
count: "198名",
|
||||||
class: "modelItem2"
|
class: "modelItem2"
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|||||||
@ -162,18 +162,41 @@
|
|||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="hjrkDialogBox topSchoolsDialog" v-show="isactive == 5">
|
<div class="hjrkDialogBox" v-show="isactive == 5">
|
||||||
<div class="titleBox">
|
<div class="titleBox">
|
||||||
<div class="title">合作学校TOP5</div>
|
<div class="title">部分合作学校</div>
|
||||||
<div class="close" @click="isactive = -1"></div>
|
<div class="close" @click="isactive = -1"></div>
|
||||||
</div>
|
</div>
|
||||||
<ul class="cooperateSchoolList">
|
<div class="schoolEmploymentBox">
|
||||||
<li v-for="(item, index) in topSchools" :key="index">
|
<table class="employmentTable">
|
||||||
<img :src="schoolIcon" alt="学校" class="schoolIcon" />
|
<thead>
|
||||||
<div class="schoolName">{{ item.name }}</div>
|
<tr>
|
||||||
</li>
|
<!-- <th>序号</th>-->
|
||||||
</ul>
|
<th colspan="2">部分合作学校</th>
|
||||||
|
<!-- <th>当年就业人数</th>-->
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr v-for="(item, idx) in topSchools" :key="idx">
|
||||||
|
<td>{{ item.name }}</td>
|
||||||
|
<td>{{ item.name1 }}</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- <div class="hjrkDialogBox topSchoolsDialog" v-show="isactive == 5">-->
|
||||||
|
<!-- <div class="titleBox">-->
|
||||||
|
<!-- <div class="title">合作学校TOP5</div>-->
|
||||||
|
<!-- <div class="close" @click="isactive = -1"></div>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <ul class="cooperateSchoolList">-->
|
||||||
|
<!-- <li v-for="(item, index) in topSchools" :key="index">-->
|
||||||
|
<!-- <img :src="schoolIcon" alt="学校" class="schoolIcon" />-->
|
||||||
|
<!-- <div class="schoolName">{{ item.name }}</div>-->
|
||||||
|
<!-- </li>-->
|
||||||
|
<!-- </ul>-->
|
||||||
|
<!-- </div>-->
|
||||||
<div class="hjrkDialogBox" v-show="isactive == 6">
|
<div class="hjrkDialogBox" v-show="isactive == 6">
|
||||||
<div class="titleBox">
|
<div class="titleBox">
|
||||||
<div class="title">合作社TOP5</div>
|
<div class="title">合作社TOP5</div>
|
||||||
@ -326,11 +349,15 @@ const schoolEmploymentList = ref([
|
|||||||
{ name: "四川文化传媒职业技术学校", count: 1200 }
|
{ name: "四川文化传媒职业技术学校", count: 1200 }
|
||||||
]);
|
]);
|
||||||
const topSchools = ref([
|
const topSchools = ref([
|
||||||
{ name: "成都工业职业技术学院" },
|
// { name: "成都工业职业技术学院" },
|
||||||
{ name: "成都工贸职业技术学院" },
|
// { name: "成都工贸职业技术学院" },
|
||||||
{ name: "四川师范大学" },
|
// { name: "四川师范大学" },
|
||||||
{ name: "崇州市职业教育培训中心(成都市技师学院南校区)" },
|
// { name: "崇州市职业教育培训中心(成都市技师学院南校区)" },
|
||||||
{ name: "成都矿产机电技师学院" }
|
// { name: "成都矿产机电技师学院" }
|
||||||
|
{ name: "成都工贸职业技术学院", name1: '成都工业职业技术学院' },
|
||||||
|
{ name: "四川师范大学", name1: '四川水利职业技术学校' },
|
||||||
|
{ name: "四川文化传媒职业技术学校", name1: '甘孜州职业技术学院' },
|
||||||
|
{ name: "四川矿产机电技师学院", name1: '成都职业技术学院' },
|
||||||
]);
|
]);
|
||||||
const topCoops = ref([
|
const topCoops = ref([
|
||||||
{ name: "绵阳市游仙区鑫众达劳务信息咨询农民专业合作社" },
|
{ name: "绵阳市游仙区鑫众达劳务信息咨询农民专业合作社" },
|
||||||
|
|||||||
Reference in New Issue
Block a user