DEV_ZZ/rsxm-master
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

大屏修改

Browse Source
This commit is contained in:
王捷
2025-10-21 15:51:27 +08:00
parent b1fbb307dc
commit 52535df2fb
12 changed files with 123 additions and 110 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/assets/json/sichuan.json Normal file
View File

File diff suppressed because one or more lines are too long

18
src/views/recruitment/card/CollegeTalentsOne.vue
View File

@ -10,19 +10,22 @@
<li>
<div><span class="blockOne"></span><span>中职</span></div>
<div>
<span class="numb">5230</span><span class="proportion">50%</span>
<!-- <span class="numb">5230</span> -->
<span class="proportion">38%</span>
</div>
</li>
<li>
<div><span class="blockTwo"></span><span>高职</span></div>
<div>
<span class="numb">4230</span><span class="proportion">30%</span>
<!-- <span class="numb">4230</span> -->
<span class="proportion">41%</span>
</div>
</li>
<li>
<div><span class="blockThree"></span><span>高校</span></div>
<div>
<span class="numb">3230</span><span class="proportion">20%</span>
<!-- <span class="numb">3230</span> -->
<span class="proportion">21%</span>
</div>
</li>
</ul>
@ -36,7 +39,8 @@ const pieRef = ref(null);
const option = {
// 设置图形位置
tooltip: {
trigger: "item"
trigger: "item",
formatter: "{b} : ({c}%)"
},
series: [
@ -58,9 +62,9 @@ const option = {
show: false
},
data: [
{ value: 5230, name: "中职", itemStyle: { color: "#58A8FF" } },
{ value: 4230, name: "高职", itemStyle: { color: "#30DCFF" } },
{ value: 3230, name: "高校", itemStyle: { color: "#FFFFFF" } }
{ value: 38, name: "中职", itemStyle: { color: "#58A8FF" } },
{ value: 41, name: "高职", itemStyle: { color: "#30DCFF" } },
{ value: 21, name: "高校", itemStyle: { color: "#FFFFFF" } }
]
}
]

20
src/views/recruitment/card/CollegeTalentsTwo.vue
View File

@ -4,24 +4,16 @@
<div class="carcTitle">促就业⼈数清单</div>
<ul class="schoolLsit">
<li>
<div class="name">学校名称</div>
<div><span class="numb">71</span><span>人</span></div>
<div class="name">四川矿产机电技师学院</div>
<div><span class="numb">1593</span><span>人</span></div>
</li>
<li>
<div class="name">学校名称</div>
<div><span class="numb">71</span><span>人</span></div>
<div class="name">四川科华高级技工学校</div>
<div><span class="numb">705</span><span>人</span></div>
</li>
<li>
<div class="name">学校名称</div>
<div><span class="numb">71</span><span>人</span></div>
</li>
<li>
<div class="name">学校名称</div>
<div><span class="numb">71</span><span>人</span></div>
</li>
<li>
<div class="name">学校名称</div>
<div><span class="numb">71</span><span>人</span></div>
<div class="name">中国五冶高级学校崇州校区</div>
<div><span class="numb">652</span><span>人</span></div>
</li>
</ul>
</div>

12
src/views/recruitment/card/EnterpriseEmploymentOne.vue
View File

@ -7,11 +7,11 @@
<div class="flex just-between align-center col">
<div class="">
<div class="title">岗位种类数</div>
<div>480人</div>
<div>9人</div>
</div>
<div class="">
<div class="title">岗位人员数</div>
<div>480人</div>
<div>680人</div>
</div>
</div>
</div>
@ -22,11 +22,11 @@
<div class="flex just-between align-center col">
<div class="">
<div class="title">岗位种类数</div>
<div>480人</div>
<div>34人</div>
</div>
<div class="">
<div class="title">岗位人员数</div>
<div>480人</div>
<div>18920人</div>
</div>
</div>
</div>
@ -37,11 +37,11 @@
<div class="flex just-between align-center col">
<div class="">
<div class="title">岗位种类数</div>
<div>480人</div>
<div>14人</div>
</div>
<div class="">
<div class="title">岗位人员数</div>
<div>480人</div>
<div>5037人</div>
</div>
</div>
</div>

6
src/views/recruitment/card/EnterpriseEmploymentThree.vue
View File

@ -35,7 +35,7 @@ const option = {
},
type: "category",
data: ["制造业", "服务业", "建筑业", "批发和零售业"]
data: ["制造业", "服务业", "建筑业"]
},
yAxis: {
//网格线
@ -59,7 +59,7 @@ const option = {
type: "line",
showBackground: true,
barWidth: 8,
data: [70, 62, 52, 41],
data: [42, 7, 15],
// 设置柱状图的数值
label: {
show: true,
@ -86,7 +86,7 @@ const option = {
type: "line",
showBackground: true,
barWidth: 8,
data: [54, 32, 45, 18],
data: [10230, 4509, 3201],
// 设置柱状图的数值
label: {
show: true,

4
src/views/recruitment/card/EnterpriseEmploymentTwo.vue
View File

@ -59,7 +59,7 @@ const option = {
type: "bar",
showBackground: true,
barWidth: 8,
data: [76, 32, 87, 65],
data: [31, 37, 45, 46],
// 设置柱状图的数值
label: {
show: true,
@ -86,7 +86,7 @@ const option = {
type: "bar",
showBackground: true,
barWidth: 8,
data: [34, 15, 45, 24],
data: [190, 2106, 8910, 13431],
// 设置柱状图的数值
label: {
show: true,

2
src/views/recruitment/card/LaborSystemOne.vue
View File

@ -78,7 +78,7 @@ const option = {
]
}
},
data: [123, 60, 125, 80],
data: [0, 0, 0, 0],
z: 10
},
{

49
src/views/recruitment/card/LaborSystemTwo.vue
View File

@ -10,50 +10,54 @@ import { ref, reactive, computed, onMounted } from "vue";
// 引入Echarts
import * as echarts from "echarts";
// 引入崇州市地图json数据
import chongzhouJSON from "@/assets/json/510184.json";
import sichuanJSON from "@/assets/json/sichuan.json";
// 引入本地撒点图片
import pointImage from "@/assets/images/recruitment/map-point1.png";
// 获取地图DOM元素
let map = ref();
// 注册崇州地图
echarts.registerMap("chongzhou", chongzhouJSON);
echarts.registerMap("sichuan", sichuanJSON);
const initialPoints = [
{
name: "崇州市政府",
value: [103.679548, 30.63669, 150],
address: "北京市朝阳区"
name: "绵阳",
value: [104.684185, 31.473263, 0],
count: 0
},
{
name: "万达广场",
value: [103.692545, 30.629371, 200],
address: "上海市浦东新区"
name: "崇州",
value: [103.68055, 30.634619, 0],
count: 0
},
{
name: "北溪湿地",
value: [103.696859, 30.663888, 180],
address: "广州市天河区"
name: "武侯",
value: [104.04777, 30.648289, 0],
count: 0
},
{
name: "白塔湖景区",
value: [103.591696, 30.671858, 160],
address: "深圳市南山区"
},
{
name: "崇州市公安局",
value: [103.674729, 30.649677, 140],
address: "成都市锦江区"
name: "成华",
value: [104.108719, 30.665854, 0],
count: 0
}
];
// 地图参数设置
let option = {
tooltip: {
trigger: "item",
formatter: function (params) {
if (params.seriesType === "scatter") {
return `${params.name}<br/>合作社数量：${params.data.count}`;
}
return params.name;
}
},
geo: [
{
type: "map",
map: "chongzhou",
map: "sichuan",
roam: true,
zoom: 1,
label: {
show: true,
// show: true,
color: "#fff",
fontSize: 12,
fontWeight: "bold",
@ -86,7 +90,8 @@ let option = {
data: initialPoints,
symbolSize: function (val) {
// 根据数值大小动态调整点的大小
return val[2] / 6;
// return val[2] / 6;
return 30;
},
label: {
show: false,

14
src/views/recruitment/components/costomCaed.vue
View File

@ -46,13 +46,13 @@ import { ref, reactive, onMounted } from "vue";
import NetworkMap from "../card/NetworkMap.vue";
const state = reactive({
tabs: [
"公共服务站点 300",
"培训机构 130",
"咨询机构 220",
"劳务公司 300",
"招聘与猎头机构 300",
"⼈⼒资源服务外包机构（HRO）300",
"职业中介与公共就业服务机构 300"
"公共服务站点 40",
// "培训机构 130",
// "咨询机构 220",
"劳务公司 13",
"招聘与猎头机构 5",
"⼈⼒资源服务外包机构（HRO）3",
"职业中介与公共就业服务机构 8"
],
activeIndex: 0
});

38
src/views/recruitment/index.vue
View File

@ -60,7 +60,7 @@
>
<el-carousel-item><CollegeTalentsOne /></el-carousel-item>
<el-carousel-item><CollegeTalentsTwo /></el-carousel-item>
<el-carousel-item><CollegeTalentsThree /></el-carousel-item>
<!-- <el-carousel-item><CollegeTalentsThree /></el-carousel-item> -->
</el-carousel>
</enterprise-employment-card>
<!-- 右2 -->
@ -136,57 +136,57 @@ const asideMeun = reactive({
});
const cardOneInfo = {
title: "企业用工结构分布",
description: "7万 家企业注册",
description: "7万家企业(含个体工商户)",
type1: {
title: "岗位种类数",
count: "约2509",
count: "57",
class: "modelItem1"
},
type2: {
title: "岗位人员数",
count: "约12万",
title: "岗位人数",
count: "24637",
class: "modelItem2"
}
};
const cardTwoInfo = {
title: "服务网络覆盖情况",
description: "5000 家人力资源行业机构",
description: "17家人力资源费机构",
type1: {
title: "公共服务站点",
count: "200",
class: "modelItem1"
},
type2: {
title: "其他服务机构",
count: "200",
count: "40",
class: "modelItem1"
}
// type2: {
// title: "其他服务机构",
// count: "200",
// class: "modelItem1"
// }
};
const cardThreeInfo = {
title: "高校人才供给能力",
description: "10000 毕业生",
description: "4000+毕业生",
type1: {
title: "高校数",
count: "23",
title: "学校数",
count: "7",
class: "modelItem2"
},
type2: {
title: "促就业人数",
count: "100000",
count: "2980",
class: "modelItem2"
}
};
const cardFourInfo = {
title: "三级劳务体系建设",
description: "10000 名平台劳务经纪人",
description: "198名平台劳务经纪人",
type1: {
title: "合作社",
count: "400",
count: "5",
class: "modelItem2"
},
type2: {
title: "劳务经纪人",
count: "100000",
count: "198",
class: "modelItem2"
}
};

59
src/views/recruitment/layout/centerModel.vue
View File

@ -7,7 +7,7 @@
v-for="(item, index) in modelContentList"
:key="index"
:class="isactive == index ? 'active' : ''"
@click="onacitve(index)"
@click="onacitve(index, item.label)"
>
<div class="num">{{ item.num }}</div>
<div class="label">{{ item.label }}</div>
@ -21,17 +21,25 @@
<transition name="fade">
<div class="hjrkDialogBox" v-show="isactive != -1">
<div class="titleBox">
<div class="title">户籍人口</div>
<div class="title">{{ dialogTitle }}</div>
<div class="close" @click="isactive = -1"></div>
</div>
<ul class="tabsBox">
<li
<!-- <li
v-for="(item, index) in tabsDate.tabs"
:key="index"
:class="tabsActive == index ? 'active' : ''"
@click="tabsActive = index"
>
{{ item }}
</li> -->
<li
v-for="(item, index) in tabsDate.tabs"
:key="index"
:class="tabsActive == index ? 'active' : ''"
@click="tabsActive = 0"
>
{{ item }}
</li>
</ul>
@ -46,10 +54,12 @@ import { ref, reactive, onMounted } from "vue";
const isactive = ref(-1);
const tabsActive = ref(0);
const onacitve = (index) => {
const dialogTitle = ref("户籍人口");
const onacitve = (index, label) => {
console.log(index, "index");
//将点击的元素的索引赋值给isactive变量 , 每次点击都更改变量的值
isactive.value = index;
dialogTitle.value = label;
console.log(isactive.value, "isactive");
};
@ -66,20 +76,21 @@ const modelContentList = ref([
num: "约27万",
label: "就业人群"
},
// {
// num: "13000",
// label: "待就业人群"
// },
{
num: "13000",
label: "待就业人群"
},
{
num: "11209",
label: "新增就业群体"
},
{
num: "28000",
num: "10.06万",
label: "灵活就业群体"
},
{
num: "6500",
num: "0.54万",
label: "新增就业群体"
},
{
num: "0.76万",
label: "领金人员"
}
]);
@ -126,7 +137,7 @@ const option = {
},
type: "category",
data: ["小学", "初中", "高中", "大专", "本科", "硕士", "博士及以上"]
data: ["国家级领军人才", "地方级领军型人才", "博士", "硕士", "本科"]
},
yAxis: {
//网格线
@ -150,7 +161,7 @@ const option = {
type: "bar",
showBackground: true,
barWidth: 20,
data: [480, 340, 570, 230, 340, 120, 90],
data: [18, 45, 133, 1012, 20792],
// 设置柱状图的数值
label: {
show: true,
@ -227,7 +238,7 @@ onMounted(() => {
.modelWrapper {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
justify-content: center;
.modelContent {
display: flex;
flex-direction: column;
@ -238,7 +249,7 @@ onMounted(() => {
width: 10.729vw;
height: 6.667vw;
padding: 0.625vw 0;
margin: 0 0.7vw 1.2vw;
margin: 0 1.1vw 1.2vw;
cursor: pointer;
.num {
font-family: PingFang SC, PingFang SC;
@ -254,13 +265,13 @@ onMounted(() => {
color: #cbf2fa;
}
&:nth-last-child(1) {
margin-right: 8vw;
}
// &:nth-last-child(1) {
// margin-right: 8vw;
// }
&:nth-last-child(3) {
margin-left: 8vw;
}
// &:nth-last-child(3) {
// margin-left: 8vw;
// }
&.active {
background: url("~@/assets/images/recruitment/model-active-bg.png")
no-repeat;

10
src/views/threeLaborService/components/statistic.vue
View File

@ -12,11 +12,11 @@ import { ref } from "vue";
const statisticsData = ref([
{
title: "合作社总数",
value: 57
value: 5
},
{
title: "经纪⼈数",
value: 74
value: 198
},
{
title: "服务企业数",
@ -24,15 +24,15 @@ const statisticsData = ref([
},
{
title: "服务求职者数",
value: 2754
value: "20000+"
},
{
title: "挖掘岗位数",
value: 348
value: 24637
},
{
title: "网点数",
value: 28
value: 40
}
]);
</script>