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

lcw

Browse Source
This commit is contained in:
lcw
2025-10-25 10:29:09 +08:00
parent 35583f52d4
commit ddea6d7c97
6 changed files with 660 additions and 460 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/assets/recruitment/bjtl.svg Normal file
View File

@ -0,0 +1,33 @@
<svg width="1920" height="1080" viewBox="0 0 1920 1080" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_9_2545)">
<rect width="1920" height="1080" fill="url(#paint0_linear_9_2545)" fill-opacity="0.75"/>
<rect width="1920" height="1080" fill="url(#paint1_linear_9_2545)" fill-opacity="0.75"/>
</g>
<defs>
<linearGradient id="paint0_linear_9_2545" x1="960" y1="0" x2="960" y2="1080" gradientUnits="userSpaceOnUse">
<stop stop-color="#0078A4"/>
<stop offset="0.120509" stop-color="#0078A4" stop-opacity="0.545518"/>
<stop offset="0.179314" stop-color="#0078A4" stop-opacity="0.268142"/>
<stop offset="0.286458" stop-color="#0078A4" stop-opacity="0.0154769"/>
<stop offset="0.671875" stop-color="#0078A4" stop-opacity="0"/>
<stop offset="0.790323" stop-color="#0078A4" stop-opacity="0.221651"/>
<stop offset="0.863472" stop-color="#0078A4" stop-opacity="0.503942"/>
<stop offset="1" stop-color="#0078A4"/>
</linearGradient>
<linearGradient id="paint1_linear_9_2545" x1="1920" y1="592.5" x2="3.32107e-06" y2="592.5" gradientUnits="userSpaceOnUse">
<stop stop-color="#0078A4"/>
<stop offset="0.0924192" stop-color="#0078A4" stop-opacity="0.441093"/>
<stop offset="0.147393" stop-color="#0078A4" stop-opacity="0.212322"/>
<stop offset="0.194418" stop-color="#0078A4" stop-opacity="0.0732132"/>
<stop offset="0.249495" stop-color="#0078A4" stop-opacity="0"/>
<stop offset="0.756487" stop-color="#0078A4" stop-opacity="0"/>
<stop offset="0.815023" stop-color="#0078A4" stop-opacity="0.0812947"/>
<stop offset="0.870659" stop-color="#0078A4" stop-opacity="0.224653"/>
<stop offset="0.92232" stop-color="#0078A4" stop-opacity="0.463412"/>
<stop offset="1" stop-color="#0078A4"/>
</linearGradient>
<clipPath id="clip0_9_2545">
<rect width="1920" height="1080" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

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

@ -1,8 +1,10 @@
<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 ref="map" style="width: 20vw; height: 17vw;left: -2vw;top: -2vw;"></div>
</div> </div>
</template> </template>
<script setup> <script setup>

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

@ -70,7 +70,7 @@
<el-carousel-item> <el-carousel-item>
<div class="carousel-item-content"> <div class="carousel-item-content">
<div class="carousel-item-title"> <div class="carousel-item-title">
仁寿县劳务合作社联合送工 农民工返乡慰问现场
</div> </div>
<div style="height:20vw;"> <div style="height:20vw;">
<img src="@/assets/images/ms/fxww.jpg" class="carousel-image"> <img src="@/assets/images/ms/fxww.jpg" class="carousel-image">

1
src/views/recruitment/components/enterpriseEmploymentCard.vue
View File

@ -104,6 +104,7 @@ const props = defineProps({
color: #ffffff; color: #ffffff;
margin-bottom: 0.46875vw; margin-bottom: 0.46875vw;
font-size: 0.729vw; font-size: 0.729vw;
font-weight:700 ;
} }
.modelItem1 { .modelItem1 {

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

@ -276,8 +276,8 @@ function getWebSocketData() {
width: 100%; width: 100%;
height: 100%; height: 100%;
z-index: 1; z-index: 1;
background: url('~@/assets/recruitment/mbc.svg') no-repeat center center; background: url('~@/assets/recruitment/bjtl.svg') no-repeat center center;
background-size: 130% 100%; background-size: 102% 100%;
// background: url("~@/assets/recruitment/mbc.png") no-repeat center center; // background: url("~@/assets/recruitment/mbc.png") no-repeat center center;
// background-size: 100% 100%; // background-size: 100% 100%;
} }

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

@ -2,22 +2,15 @@
<div class="contentWrapper"> <div class="contentWrapper">
<div class="rowContent"> <div class="rowContent">
<div class="modelWrapper"> <div class="modelWrapper">
<div <div class="modelContent" v-for="(item, index) in modelContentList" :key="index"
class="modelContent" :class="selectedIndex == index ? 'active' : ''" @click="onacitve(index, item.label)">
v-for="(item, index) in modelContentList"
:key="index"
:class="selectedIndex == index ? 'active' : ''"
@click="onacitve(index, item.label)"
>
<div class="num">{{ item.num }}</div> <div class="num">{{ item.num }}</div>
<div class="label">{{ item.label }}</div> <div class="label">{{ item.label }}</div>
</div> </div>
</div> </div>
</div> </div>
<div <div class="content"
class="content" v-show="isactive != 0 && isactive != 1 && isactive != 2 && isactive != 3 && isactive != 4 && isactive != 5 && isactive != 6">
v-show="isactive != 0 && isactive != 1 && isactive != 2 && isactive != 3 && isactive != 4 && isactive != 5 && isactive != 6"
>
<div class="num">{{ centerInfoMap[activeView].num }}</div> <div class="num">{{ centerInfoMap[activeView].num }}</div>
<div class="label">{{ centerInfoMap[activeView].label }}</div> <div class="label">{{ centerInfoMap[activeView].label }}</div>
</div> </div>
@ -36,12 +29,8 @@
> >
{{ item }} {{ item }}
</li> --> </li> -->
<li <li v-for="(item, index) in tabsDate.tabs" :key="index" :class="tabsActive == index ? 'active' : ''"
v-for="(item, index) in tabsDate.tabs" @click="tabsActive = 0">
:key="index"
:class="tabsActive == index ? 'active' : ''"
@click="tabsActive = 0"
>
{{ item }} {{ item }}
</li> </li>
</ul> </ul>
@ -62,8 +51,7 @@
<span>{{ item.title }}</span> <span>{{ item.title }}</span>
</div> </div>
<div class="count"> <div class="count">
<span class="numb">{{ item.count }}</span <span class="numb">{{ item.count }}</span>（{{ item.unit }}）
>（{{ item.unit }}）
</div> </div>
</div> </div>
</li> </li>
@ -83,15 +71,13 @@
<li> <li>
<div><span class="blockOne"></span><span>城镇新增就业</span></div> <div><span class="blockOne"></span><span>城镇新增就业</span></div>
<div> <div>
<span class="numb">目标7200人</span <span class="numb">目标7200人</span><span class="proportion">完成5445人</span>
><span class="proportion">完成5445人</span>
</div> </div>
</li> </li>
<li> <li>
<div><span class="blockTwo"></span><span>失业人员再就业</span></div> <div><span class="blockTwo"></span><span>失业人员再就业</span></div>
<div> <div>
<span class="numb">目标1900人</span <span class="numb">目标1900人</span><span class="proportion">完成1528人</span>
><span class="proportion">完成1528人</span>
</div> </div>
</li> </li>
<li> <li>
@ -99,8 +85,7 @@
<span class="blockThree"></span><span>就业困难人员再就业</span> <span class="blockThree"></span><span>就业困难人员再就业</span>
</div> </div>
<div> <div>
<span class="numb">目标190人</span <span class="numb">目标190人</span><span class="proportion">完成125人</span>
><span class="proportion">完成125人</span>
</div> </div>
</li> </li>
</ul> </ul>
@ -120,15 +105,10 @@
> >
{{ item }} {{ item }}
</li> --> </li> -->
<li <li v-for="(item, index) in tabsDate2.tabs" :key="index" :class="tabsActive == index ? 'active' : ''" @click="
v-for="(item, index) in tabsDate2.tabs"
:key="index"
:class="tabsActive == index ? 'active' : ''"
@click="
tabsDate2.activeIndex = index; tabsDate2.activeIndex = index;
tabsActive = index; tabsActive = index;
" ">
>
{{ item }} {{ item }}
</li> </li>
</ul> </ul>
@ -167,13 +147,26 @@
<div class="title">部分合作学校</div> <div class="title">部分合作学校</div>
<div class="close" @click="isactive = -1"></div> <div class="close" @click="isactive = -1"></div>
</div> </div>
<div class="schoolEmploymentBox"> <div class="schoolEmploymentBoxs">
<table class="employmentTable"> <div v-for="(item, idx) in topSchools" :key="idx" class="schoolItem">
<div class="schoolContent">
<img src="@/assets/images/recruitment/xuexiao.png" alt="学校" class="schoolIcon" />
<div class="schoolName">
<div class="bane"> {{ item.name }}</div>
</div>
</div>
</div>
<!-- <div v-for="(item, idx) in topSchools" :key="idx" style="display: flex;">
<div>
<img src="@/assets/images/recruitment/xuexiao.png" alt="学校" class="schoolIcon" />
{{ item.name }}
</div>
<div>{{ item.name1 }}</div>
</div> -->
<!-- <table class="employmentTable">
<thead> <thead>
<tr> <tr>
<!-- <th>序号</th>-->
<th colspan="2">部分合作学校</th> <th colspan="2">部分合作学校</th>
<!-- <th>当年就业人数</th>-->
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@ -182,7 +175,7 @@
<td>{{ item.name1 }}</td> <td>{{ item.name1 }}</td>
</tr> </tr>
</tbody> </tbody>
</table> </table> -->
</div> </div>
</div> </div>
<!-- <div class="hjrkDialogBox topSchoolsDialog" v-show="isactive == 5">--> <!-- <div class="hjrkDialogBox topSchoolsDialog" v-show="isactive == 5">-->
@ -210,7 +203,8 @@
</ul> </ul>
</div> </div>
<div class="bottomSwitch"> <div class="bottomSwitch">
<button data-type="overview" :class="{active: activeView === 'overview'}" @click="switchView('overview')">崇州概况</button> <button data-type="overview" :class="{ active: activeView === 'overview' }"
@click="switchView('overview')">崇州概况</button>
<button data-type="work" :class="{ active: activeView === 'work' }" @click="switchView('work')">兴蜀工作</button> <button data-type="work" :class="{ active: activeView === 'work' }" @click="switchView('work')">兴蜀工作</button>
</div> </div>
</div> </div>
@ -349,15 +343,20 @@ 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: "成都职业技术学院" },
// { name: "崇州市职业教育培训中心（成都市技师学院南校区）" }, // { name: "崇州市职业教育培训中心（成都市技师学院南校区）" },
// { name: "成都矿产机电技师学院" } // { name: "成都矿产机电技师学院" }
{ name: "成都工贸职业技术学院", name1: '成都工业职业技术学院' }, // { name: "成都工贸职业技术学院", name1: '成都工业职业技术学院' },
{ name: "四川师范大学", name1: '四川水利职业技术学校' }, // { name: "四川师范大学", name1: '四川水利职业技术学校' },
{ name: "四川文化传媒职业技术学校", name1: '甘孜州职业技术学院' }, // { name: "四川文化传媒职业技术学校", name1: '甘孜州职业技术学院' },
{ name: "四川矿产机电技师学院", name1: '成都职业技术学院' }, // { name: "四川矿产机电技师学院", name1: '成都职业技术学院' },
]); ]);
const topCoops = ref([ const topCoops = ref([
{ name: "绵阳市游仙区鑫众送劳务信息咨询农民专业合作社" }, { name: "绵阳市游仙区鑫众送劳务信息咨询农民专业合作社" },
@ -546,10 +545,12 @@ onMounted(() => {
color: #cbf2fa; color: #cbf2fa;
} }
} }
.modelWrapper { .modelWrapper {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
.modelContent { .modelContent {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -562,6 +563,7 @@ onMounted(() => {
padding: 0.625vw 0; padding: 0.625vw 0;
margin: 0 1.5vw 1.2vw; margin: 0 1.5vw 1.2vw;
cursor: pointer; cursor: pointer;
.num { .num {
font-family: PingFang SC, PingFang SC; font-family: PingFang SC, PingFang SC;
font-size: 1.667vw; font-size: 1.667vw;
@ -584,9 +586,9 @@ onMounted(() => {
// margin-left: 8vw; // margin-left: 8vw;
// } // }
&.active { &.active {
background: url("~@/assets/images/recruitment/model-active-bg.png") background: url("~@/assets/images/recruitment/model-active-bg.png") no-repeat;
no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
.num { .num {
background: -webkit-linear-gradient(#fff4b3, #ffd901); background: -webkit-linear-gradient(#fff4b3, #ffd901);
-webkit-background-clip: text; -webkit-background-clip: text;
@ -595,6 +597,7 @@ onMounted(() => {
} }
} }
} }
.hjrkDialogBox { .hjrkDialogBox {
top: 15.2vw; top: 15.2vw;
left: 50%; left: 50%;
@ -605,10 +608,12 @@ onMounted(() => {
background-size: 100% 100%; background-size: 100% 100%;
margin-left: -26.302vw; margin-left: -26.302vw;
z-index: 9999; z-index: 9999;
.titleBox { .titleBox {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
height: 2.604vw; height: 2.604vw;
.title { .title {
font-size: 1vw; font-size: 1vw;
height: 100%; height: 100%;
@ -616,20 +621,22 @@ onMounted(() => {
padding: 0 0 0 1.042vw; padding: 0 0 0 1.042vw;
font-weight: bold; font-weight: bold;
} }
.close { .close {
width: 1.5625vw; width: 1.5625vw;
height: 1.5625vw; height: 1.5625vw;
background: url("~@/assets/images/recruitment/hjrk-dialog-close.png") background: url("~@/assets/images/recruitment/hjrk-dialog-close.png") no-repeat;
no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
margin: 0.5vw; margin: 0.5vw;
cursor: pointer; cursor: pointer;
} }
} }
ul.tabsBox { ul.tabsBox {
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
padding: 1vw 7vw; padding: 1vw 7vw;
li { li {
width: 3.958vw; width: 3.958vw;
height: 1.354vw; height: 1.354vw;
@ -640,11 +647,13 @@ onMounted(() => {
background-size: 100% 100%; background-size: 100% 100%;
cursor: pointer; cursor: pointer;
} }
li.active { li.active {
background: url("~@/assets/images/recruitment/tabs-active-bg.png") no-repeat center; background: url("~@/assets/images/recruitment/tabs-active-bg.png") no-repeat center;
background-size: 100% 100%; background-size: 100% 100%;
} }
} }
.barBox { .barBox {
width: 40vw; width: 40vw;
height: 20vw; height: 20vw;
@ -652,15 +661,18 @@ onMounted(() => {
} }
} }
} }
ul.statisticOne { ul.statisticOne {
display: flex; display: flex;
justify-content: center; justify-content: center;
flex-wrap: wrap; flex-wrap: wrap;
padding-top: 3vw; padding-top: 3vw;
li { li {
// width: 450px; // width: 450px;
height: 9vw; height: 9vw;
margin: 0 0; margin: 0 0;
// 第一排的前2个元素（第一排显示2个） // 第一排的前2个元素（第一排显示2个）
&:nth-child(-n + 2) { &:nth-child(-n + 2) {
width: 20vw; // 减去margin值 width: 20vw; // 减去margin值
@ -677,13 +689,16 @@ ul.statisticOne {
height: 7vw; height: 7vw;
float: left; float: left;
} }
.infoBox { .infoBox {
float: left; float: left;
padding: 0 0 0 0.5vw; padding: 0 0 0 0.5vw;
.title { .title {
height: 2vw; height: 2vw;
line-height: 2vw; line-height: 2vw;
margin-top: 1vw; margin-top: 1vw;
span { span {
background: -webkit-linear-gradient(#ffffff, #75e8ff); background: -webkit-linear-gradient(#ffffff, #75e8ff);
-webkit-background-clip: text; -webkit-background-clip: text;
@ -692,9 +707,11 @@ ul.statisticOne {
font-weight: 400; font-weight: 400;
} }
} }
.count { .count {
font-size: 1.4vw; font-size: 1.4vw;
padding: 0.5vw 0 0 0; padding: 0.5vw 0 0 0;
span.numb { span.numb {
font-size: 2.2vw; font-size: 2.2vw;
display: inline-block; display: inline-block;
@ -704,24 +721,27 @@ ul.statisticOne {
} }
} }
} }
.pieBigBox { .pieBigBox {
width: 40vw; width: 40vw;
margin: 1vw auto 0; margin: 1vw auto 0;
// height: 274px; // height: 274px;
.pieMain { .pieMain {
position: relative; position: relative;
border: 1px solid transparent; border: 1px solid transparent;
float: left; float: left;
.pieBox { .pieBox {
margin: 0 auto; margin: 0 auto;
margin-top: 3vw; margin-top: 3vw;
width: 15vw; width: 15vw;
height: 15vw; height: 15vw;
background: url("~@/assets/images/recruitment/pie-bg@2x.png") no-repeat background: url("~@/assets/images/recruitment/pie-bg@2x.png") no-repeat center;
center;
background-size: 100%; background-size: 100%;
border: 1px solid transparent; border: 1px solid transparent;
} }
.pieTitle { .pieTitle {
position: absolute; position: absolute;
top: 50%; top: 50%;
@ -732,12 +752,14 @@ ul.statisticOne {
font-size: 1vw; font-size: 1vw;
} }
} }
ul.pieLsit { ul.pieLsit {
float: left; float: left;
margin: 2.6vw 0 0 2vw; margin: 2.6vw 0 0 2vw;
border: 1px solid transparent; border: 1px solid transparent;
padding: 1vw 0 0 0; padding: 1vw 0 0 0;
width: 20vw; width: 20vw;
li { li {
// font-size: 16px; // font-size: 16px;
display: flex; display: flex;
@ -750,10 +772,12 @@ ul.statisticOne {
border: 1px solid rgba(203, 242, 250, 0.2); border: 1px solid rgba(203, 242, 250, 0.2);
margin-top: 1vw; margin-top: 1vw;
font-size: 0.7vw; font-size: 0.7vw;
>div { >div {
height: 100%; height: 100%;
line-height: 3vw; line-height: 3vw;
} }
.blockOne, .blockOne,
.blockTwo, .blockTwo,
.blockThree, .blockThree,
@ -763,18 +787,23 @@ ul.statisticOne {
height: 0.8vw; height: 0.8vw;
margin-right: 1vw; margin-right: 1vw;
} }
.blockOne { .blockOne {
background-color: #58a8ff; background-color: #58a8ff;
} }
.blockTwo { .blockTwo {
background-color: #30dcff; background-color: #30dcff;
} }
.blockThree { .blockThree {
background-color: #ffffff; background-color: #ffffff;
} }
.blockFour { .blockFour {
background-color: #dd7d4d; background-color: #dd7d4d;
} }
.proportion { .proportion {
display: inline-block; display: inline-block;
width: 4.5vw; width: 4.5vw;
@ -783,11 +812,79 @@ ul.statisticOne {
} }
} }
} }
/* 在崇学校就业人数列表样式 */ /* 在崇学校就业人数列表样式 */
.schoolEmploymentBox { .schoolEmploymentBoxs {
width: 40vw; width: 100%;
margin: 1.6vw auto 0; padding: 1vw;
display: flex;
align-items: center;
flex-wrap: wrap;
justify-content:space-between;
/* 学校项目容器 */
.schoolItem {
width: 50%;
margin-bottom: 0vw;
} }
/* 学校内容容器 */
.schoolContent {
display: flex;
align-items: center;
width: 100%;
line-height: 5vw;
justify-content:space-between;
.schoolIcon {
height: 5vw;
width: 5vw;
}
}
.schoolName {
width: 100%;
position: relative;
height: 5vw;
line-height: 5vw;
/* 创建模糊背景 */
&::before {
content: '';
position: absolute;
width: 50%;
height: 1.5vw;
top: 2vw;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 221, 255, 0.45);
border-radius: 0px;
filter: blur(50px);
z-index: 0;
}
.bane {
position: relative;
z-index: 1;
/* 确保文字在模糊背景上方 */
width: 100%;
height: 5vw;
font-family: PingFang SC, PingFang SC;
font-weight: 500;
font-size: 1.5vw;
line-height: 5vw;
letter-spacing: 3px;
text-align: left;
font-style: normal;
text-transform: none;
background: linear-gradient(270deg, #FFFFFF 0%, #75E8FF 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
}
}
.employmentTable { .employmentTable {
width: 100%; width: 100%;
border-collapse: separate; border-collapse: separate;
@ -795,6 +892,7 @@ ul.statisticOne {
color: #cbf2fa; color: #cbf2fa;
font-size: 0.8vw; font-size: 0.8vw;
} }
.employmentTable thead th { .employmentTable thead th {
height: 2vw; height: 2vw;
line-height: 2vw; line-height: 2vw;
@ -803,6 +901,7 @@ ul.statisticOne {
border-radius: 0.26vw; border-radius: 0.26vw;
text-align: center; text-align: center;
} }
.employmentTable tbody td { .employmentTable tbody td {
height: 2vw; height: 2vw;
line-height: 2vw; line-height: 2vw;
@ -811,9 +910,11 @@ ul.statisticOne {
border-radius: 0.26vw; border-radius: 0.26vw;
text-align: center; text-align: center;
} }
.employmentTable tbody tr:nth-child(odd) td { .employmentTable tbody tr:nth-child(odd) td {
background: linear-gradient(180deg, rgba(48, 220, 255, 0.16) 0%, rgba(48, 220, 255, 0.06) 100%); background: linear-gradient(180deg, rgba(48, 220, 255, 0.16) 0%, rgba(48, 220, 255, 0.06) 100%);
} }
.bottomSwitch { .bottomSwitch {
position: fixed; position: fixed;
left: 50%; left: 50%;
@ -823,6 +924,7 @@ ul.statisticOne {
gap: 0.8vw; gap: 0.8vw;
z-index: 100; // 保持在内容之上但不遮挡弹窗 z-index: 100; // 保持在内容之上但不遮挡弹窗
pointer-events: auto; pointer-events: auto;
button { button {
min-width: 7vw; min-width: 7vw;
height: 2vw; height: 2vw;
@ -836,12 +938,14 @@ ul.statisticOne {
padding: 0 1.2vw; padding: 0 1.2vw;
border-radius: 0.26vw; border-radius: 0.26vw;
} }
button.active { button.active {
color: #fff; color: #fff;
background: url("~@/assets/images/recruitment/tabs-active-bg2.png") no-repeat center; background: url("~@/assets/images/recruitment/tabs-active-bg2.png") no-repeat center;
background-size: auto 100%; background-size: auto 100%;
} }
} }
/* 合作社TOP5 样式 */ /* 合作社TOP5 样式 */
.cooperateOrgList { .cooperateOrgList {
width: 42vw; width: 42vw;
@ -852,16 +956,19 @@ ul.statisticOne {
border: 1px solid rgba(48, 220, 255, 0.15); border: 1px solid rgba(48, 220, 255, 0.15);
border-radius: 0.4vw; border-radius: 0.4vw;
} }
.cooperateOrgList li { .cooperateOrgList li {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.cooperateOrgList .coopIcon { .cooperateOrgList .coopIcon {
width: 3.6vw; width: 3.6vw;
height: 3.6vw; height: 3.6vw;
margin-right: 1.2vw; margin-right: 1.2vw;
filter: drop-shadow(0 0 0.6vw rgba(48, 220, 255, 0.5)); filter: drop-shadow(0 0 0.6vw rgba(48, 220, 255, 0.5));
} }
.cooperateOrgList .coopName { .cooperateOrgList .coopName {
font-size: 1.1vw; font-size: 1.1vw;
font-weight: 600; font-weight: 600;
@ -873,6 +980,7 @@ ul.statisticOne {
text-shadow: 0 0 0.3vw rgba(48, 220, 255, 0.8), 0 0 0.8vw rgba(48, 220, 255, 0.4); text-shadow: 0 0 0.3vw rgba(48, 220, 255, 0.8), 0 0 0.8vw rgba(48, 220, 255, 0.4);
word-break: break-word; word-break: break-word;
} }
.cooperateOrgList .coopName { .cooperateOrgList .coopName {
font-size: 1.2vw; font-size: 1.2vw;
font-weight: 600; font-weight: 600;
@ -884,6 +992,7 @@ ul.statisticOne {
text-shadow: 0 0 0.3vw rgba(48, 220, 255, 0.8), text-shadow: 0 0 0.3vw rgba(48, 220, 255, 0.8),
0 0 0.8vw rgba(48, 220, 255, 0.4); 0 0 0.8vw rgba(48, 220, 255, 0.4);
} }
.employmentTable thead th { .employmentTable thead th {
height: 2vw; height: 2vw;
line-height: 2vw; line-height: 2vw;
@ -892,6 +1001,7 @@ ul.statisticOne {
border-radius: 0.26vw; border-radius: 0.26vw;
text-align: center; text-align: center;
} }
.employmentTable tbody td { .employmentTable tbody td {
height: 2vw; height: 2vw;
line-height: 2vw; line-height: 2vw;
@ -900,9 +1010,11 @@ ul.statisticOne {
border-radius: 0.26vw; border-radius: 0.26vw;
text-align: center; text-align: center;
} }
.employmentTable tbody tr:nth-child(odd) td { .employmentTable tbody tr:nth-child(odd) td {
background: linear-gradient(180deg, rgba(48, 220, 255, 0.16) 0%, rgba(48, 220, 255, 0.06) 100%); background: linear-gradient(180deg, rgba(48, 220, 255, 0.16) 0%, rgba(48, 220, 255, 0.06) 100%);
} }
.bottomSwitch { .bottomSwitch {
position: fixed; position: fixed;
left: 50%; left: 50%;
@ -912,6 +1024,7 @@ ul.statisticOne {
gap: 0.8vw; gap: 0.8vw;
z-index: 100; // 保持在内容之上但不遮挡弹窗 z-index: 100; // 保持在内容之上但不遮挡弹窗
pointer-events: auto; pointer-events: auto;
button { button {
min-width: 7vw; min-width: 7vw;
height: 2vw; height: 2vw;
@ -925,12 +1038,14 @@ ul.statisticOne {
padding: 0 1.2vw; padding: 0 1.2vw;
border-radius: 0.26vw; border-radius: 0.26vw;
} }
button.active { button.active {
color: #fff; color: #fff;
background: url("~@/assets/images/recruitment/tabs-active-bg2.png") no-repeat center; background: url("~@/assets/images/recruitment/tabs-active-bg2.png") no-repeat center;
background-size: auto 100%; background-size: auto 100%;
} }
} }
/* 合作学校TOP5 样式 */ /* 合作学校TOP5 样式 */
.cooperateSchoolList { .cooperateSchoolList {
width: 42vw; width: 42vw;
@ -944,16 +1059,19 @@ ul.statisticOne {
border: 1px solid rgba(48, 220, 255, 0.15); border: 1px solid rgba(48, 220, 255, 0.15);
border-radius: 0.4vw; border-radius: 0.4vw;
} }
.cooperateSchoolList li { .cooperateSchoolList li {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.cooperateSchoolList .schoolIcon { .cooperateSchoolList .schoolIcon {
width: 3.6vw; width: 3.6vw;
height: 3.6vw; height: 3.6vw;
margin-right: 1.2vw; margin-right: 1.2vw;
filter: drop-shadow(0 0 0.6vw rgba(48, 220, 255, 0.5)); filter: drop-shadow(0 0 0.6vw rgba(48, 220, 255, 0.5));
} }
.cooperateSchoolList .schoolName { .cooperateSchoolList .schoolName {
font-size: 1.2vw; font-size: 1.2vw;
font-weight: 600; font-weight: 600;
@ -974,6 +1092,7 @@ ul.statisticOne {
gap: 0.8vw; gap: 0.8vw;
z-index: 100; // 保持在内容之上但不遮挡弹窗 z-index: 100; // 保持在内容之上但不遮挡弹窗
pointer-events: auto; pointer-events: auto;
button { button {
min-width: 7vw; min-width: 7vw;
height: 2vw; height: 2vw;
@ -987,12 +1106,14 @@ ul.statisticOne {
padding: 0 1.2vw; padding: 0 1.2vw;
border-radius: 0.26vw; border-radius: 0.26vw;
} }
button.active { button.active {
color: #fff; color: #fff;
background: url("~@/assets/images/recruitment/tabs-active-bg2.png") no-repeat center; background: url("~@/assets/images/recruitment/tabs-active-bg2.png") no-repeat center;
background-size: auto 100%; background-size: auto 100%;
} }
} }
.bottomSwitch { .bottomSwitch {
position: fixed; position: fixed;
left: 50%; left: 50%;
@ -1002,6 +1123,7 @@ ul.statisticOne {
gap: 0.8vw; gap: 0.8vw;
z-index: 999; // 保持在内容之上但不遮挡弹窗 z-index: 999; // 保持在内容之上但不遮挡弹窗
pointer-events: auto; pointer-events: auto;
button { button {
min-width: 7vw; min-width: 7vw;
height: 2vw; height: 2vw;
@ -1015,6 +1137,7 @@ ul.statisticOne {
padding: 0 1.2vw; padding: 0 1.2vw;
border-radius: 0.26vw; border-radius: 0.26vw;
} }
button.active { button.active {
color: #fff; color: #fff;
background: url("~@/assets/images/recruitment/tabs-active-bg2.png") no-repeat center; background: url("~@/assets/images/recruitment/tabs-active-bg2.png") no-repeat center;
@ -1024,21 +1147,23 @@ ul.statisticOne {
.pieBigBox { .pieBigBox {
width: 40vw; width: 40vw;
margin: 1vw auto 0; margin: 1vw auto 0;
// height: 274px; // height: 274px;
.pieMain { .pieMain {
position: relative; position: relative;
border: 1px solid transparent; border: 1px solid transparent;
float: left; float: left;
.pieBox { .pieBox {
margin: 0 auto; margin: 0 auto;
margin-top: 3vw; margin-top: 3vw;
width: 15vw; width: 15vw;
height: 15vw; height: 15vw;
background: url("~@/assets/images/recruitment/pie-bg@2x.png") no-repeat background: url("~@/assets/images/recruitment/pie-bg@2x.png") no-repeat center;
center;
background-size: 100%; background-size: 100%;
border: 1px solid transparent; border: 1px solid transparent;
} }
.pieTitle { .pieTitle {
position: absolute; position: absolute;
top: 50%; top: 50%;
@ -1049,12 +1174,14 @@ ul.statisticOne {
font-size: 1vw; font-size: 1vw;
} }
} }
ul.pieLsit { ul.pieLsit {
float: left; float: left;
margin: 2.6vw 0 0 2vw; margin: 2.6vw 0 0 2vw;
border: 1px solid transparent; border: 1px solid transparent;
padding: 1vw 0 0 0; padding: 1vw 0 0 0;
width: 20vw; width: 20vw;
li { li {
// font-size: 16px; // font-size: 16px;
display: flex; display: flex;
@ -1067,10 +1194,12 @@ ul.statisticOne {
border: 1px solid rgba(203, 242, 250, 0.2); border: 1px solid rgba(203, 242, 250, 0.2);
margin-top: 1vw; margin-top: 1vw;
font-size: 0.7vw; font-size: 0.7vw;
>div { >div {
height: 100%; height: 100%;
line-height: 3vw; line-height: 3vw;
} }
.blockOne, .blockOne,
.blockTwo, .blockTwo,
.blockThree, .blockThree,
@ -1080,18 +1209,23 @@ ul.statisticOne {
height: 0.8vw; height: 0.8vw;
margin-right: 1vw; margin-right: 1vw;
} }
.blockOne { .blockOne {
background-color: #58a8ff; background-color: #58a8ff;
} }
.blockTwo { .blockTwo {
background-color: #30dcff; background-color: #30dcff;
} }
.blockThree { .blockThree {
background-color: #ffffff; background-color: #ffffff;
} }
.blockFour { .blockFour {
background-color: #dd7d4d; background-color: #dd7d4d;
} }
.proportion { .proportion {
display: inline-block; display: inline-block;
width: 4.5vw; width: 4.5vw;
@ -1100,11 +1234,13 @@ ul.statisticOne {
} }
} }
} }
/* 在崇学校就业人数列表样式 */ /* 在崇学校就业人数列表样式 */
.schoolEmploymentBox { .schoolEmploymentBox {
width: 40vw; width: 40vw;
margin: 1.6vw auto 0; margin: 1.6vw auto 0;
} }
.employmentTable { .employmentTable {
width: 100%; width: 100%;
border-collapse: separate; border-collapse: separate;
@ -1112,6 +1248,7 @@ ul.statisticOne {
color: #cbf2fa; color: #cbf2fa;
font-size: 0.8vw; font-size: 0.8vw;
} }
.employmentTable thead th { .employmentTable thead th {
height: 2vw; height: 2vw;
line-height: 2vw; line-height: 2vw;
@ -1120,6 +1257,7 @@ ul.statisticOne {
border-radius: 0.26vw; border-radius: 0.26vw;
text-align: center; text-align: center;
} }
.employmentTable tbody td { .employmentTable tbody td {
height: 2vw; height: 2vw;
line-height: 2vw; line-height: 2vw;
@ -1128,9 +1266,11 @@ ul.statisticOne {
border-radius: 0.26vw; border-radius: 0.26vw;
text-align: center; text-align: center;
} }
.employmentTable tbody tr:nth-child(odd) td { .employmentTable tbody tr:nth-child(odd) td {
background: linear-gradient(180deg, rgba(48, 220, 255, 0.16) 0%, rgba(48, 220, 255, 0.06) 100%); background: linear-gradient(180deg, rgba(48, 220, 255, 0.16) 0%, rgba(48, 220, 255, 0.06) 100%);
} }
.bottomSwitch { .bottomSwitch {
position: fixed; position: fixed;
left: 50%; left: 50%;
@ -1140,6 +1280,7 @@ ul.statisticOne {
gap: 0.8vw; gap: 0.8vw;
z-index: 100; // 保持在内容之上但不遮挡弹窗 z-index: 100; // 保持在内容之上但不遮挡弹窗
pointer-events: auto; pointer-events: auto;
button { button {
min-width: 7vw; min-width: 7vw;
height: 2vw; height: 2vw;
@ -1153,12 +1294,14 @@ ul.statisticOne {
padding: 0 1.2vw; padding: 0 1.2vw;
border-radius: 0.26vw; border-radius: 0.26vw;
} }
button.active { button.active {
color: #fff; color: #fff;
background: url("~@/assets/images/recruitment/tabs-active-bg2.png") no-repeat center; background: url("~@/assets/images/recruitment/tabs-active-bg2.png") no-repeat center;
background-size: auto 100%; background-size: auto 100%;
} }
} }
/* 合作社TOP5 样式 */ /* 合作社TOP5 样式 */
.cooperateOrgList { .cooperateOrgList {
width: 42vw; width: 42vw;
@ -1169,16 +1312,19 @@ ul.statisticOne {
border: 1px solid rgba(48, 220, 255, 0.15); border: 1px solid rgba(48, 220, 255, 0.15);
border-radius: 0.4vw; border-radius: 0.4vw;
} }
.cooperateOrgList li { .cooperateOrgList li {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.cooperateOrgList .coopIcon { .cooperateOrgList .coopIcon {
width: 3.6vw; width: 3.6vw;
height: 3.6vw; height: 3.6vw;
margin-right: 1.2vw; margin-right: 1.2vw;
filter: drop-shadow(0 0 0.6vw rgba(48, 220, 255, 0.5)); filter: drop-shadow(0 0 0.6vw rgba(48, 220, 255, 0.5));
} }
.cooperateOrgList .coopName { .cooperateOrgList .coopName {
font-size: 1.1vw; font-size: 1.1vw;
font-weight: 600; font-weight: 600;
@ -1189,6 +1335,7 @@ ul.statisticOne {
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
text-shadow: 0 0 0.3vw rgba(48, 220, 255, 0.8), 0 0 0.8vw rgba(48, 220, 255, 0.4); text-shadow: 0 0 0.3vw rgba(48, 220, 255, 0.8), 0 0 0.8vw rgba(48, 220, 255, 0.4);
} }
.cooperateOrgList .coopName { .cooperateOrgList .coopName {
font-size: 1.2vw; font-size: 1.2vw;
font-weight: 600; font-weight: 600;
@ -1200,6 +1347,7 @@ ul.statisticOne {
text-shadow: 0 0 0.3vw rgba(48, 220, 255, 0.8), text-shadow: 0 0 0.3vw rgba(48, 220, 255, 0.8),
0 0 0.8vw rgba(48, 220, 255, 0.4); 0 0 0.8vw rgba(48, 220, 255, 0.4);
} }
.employmentTable thead th { .employmentTable thead th {
height: 2vw; height: 2vw;
line-height: 2vw; line-height: 2vw;
@ -1208,6 +1356,7 @@ ul.statisticOne {
border-radius: 0.26vw; border-radius: 0.26vw;
text-align: center; text-align: center;
} }
.employmentTable tbody td { .employmentTable tbody td {
height: 2vw; height: 2vw;
line-height: 2vw; line-height: 2vw;
@ -1216,9 +1365,11 @@ ul.statisticOne {
border-radius: 0.26vw; border-radius: 0.26vw;
text-align: center; text-align: center;
} }
.employmentTable tbody tr:nth-child(odd) td { .employmentTable tbody tr:nth-child(odd) td {
background: linear-gradient(180deg, rgba(48, 220, 255, 0.16) 0%, rgba(48, 220, 255, 0.06) 100%); background: linear-gradient(180deg, rgba(48, 220, 255, 0.16) 0%, rgba(48, 220, 255, 0.06) 100%);
} }
.bottomSwitch { .bottomSwitch {
position: fixed; position: fixed;
left: 50%; left: 50%;
@ -1228,6 +1379,7 @@ ul.statisticOne {
gap: 0.8vw; gap: 0.8vw;
z-index: 100; // 保持在内容之上但不遮挡弹窗 z-index: 100; // 保持在内容之上但不遮挡弹窗
pointer-events: auto; pointer-events: auto;
button { button {
min-width: 7vw; min-width: 7vw;
height: 2vw; height: 2vw;
@ -1241,12 +1393,14 @@ ul.statisticOne {
padding: 0 1.2vw; padding: 0 1.2vw;
border-radius: 0.26vw; border-radius: 0.26vw;
} }
button.active { button.active {
color: #fff; color: #fff;
background: url("~@/assets/images/recruitment/tabs-active-bg2.png") no-repeat center; background: url("~@/assets/images/recruitment/tabs-active-bg2.png") no-repeat center;
background-size: auto 100%; background-size: auto 100%;
} }
} }
/* 合作学校TOP5 样式 */ /* 合作学校TOP5 样式 */
.cooperateSchoolList { .cooperateSchoolList {
width: 42vw; width: 42vw;
@ -1260,16 +1414,19 @@ ul.statisticOne {
border: 1px solid rgba(48, 220, 255, 0.15); border: 1px solid rgba(48, 220, 255, 0.15);
border-radius: 0.4vw; border-radius: 0.4vw;
} }
.cooperateSchoolList li { .cooperateSchoolList li {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.cooperateSchoolList .schoolIcon { .cooperateSchoolList .schoolIcon {
width: 3.6vw; width: 3.6vw;
height: 3.6vw; height: 3.6vw;
margin-right: 1.2vw; margin-right: 1.2vw;
filter: drop-shadow(0 0 0.6vw rgba(48, 220, 255, 0.5)); filter: drop-shadow(0 0 0.6vw rgba(48, 220, 255, 0.5));
} }
.cooperateSchoolList .schoolName { .cooperateSchoolList .schoolName {
font-size: 1.2vw; font-size: 1.2vw;
font-weight: 600; font-weight: 600;
@ -1280,6 +1437,7 @@ ul.statisticOne {
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
text-shadow: 0 0 0.3vw rgba(48, 220, 255, 0.8), 0 0 0.8vw rgba(48, 220, 255, 0.4); text-shadow: 0 0 0.3vw rgba(48, 220, 255, 0.8), 0 0 0.8vw rgba(48, 220, 255, 0.4);
} }
.bottomSwitch { .bottomSwitch {
position: fixed; position: fixed;
left: 50%; left: 50%;
@ -1289,6 +1447,7 @@ ul.statisticOne {
gap: 1.2vw; gap: 1.2vw;
z-index: 10001; z-index: 10001;
} }
.bottomSwitch button { .bottomSwitch button {
min-width: 11vw; min-width: 11vw;
height: 2.8vw; height: 2.8vw;
@ -1303,16 +1462,19 @@ ul.statisticOne {
position: relative; position: relative;
clip-path: polygon(8% 0, 92% 0, 100% 50%, 92% 100%, 8% 100%, 0 50%); clip-path: polygon(8% 0, 92% 0, 100% 50%, 92% 100%, 8% 100%, 0 50%);
} }
.bottomSwitch button[data-type="overview"] { .bottomSwitch button[data-type="overview"] {
background: linear-gradient(180deg, rgba(255, 208, 96, 0.85) 0%, rgba(204, 160, 61, 0.78) 100%); background: linear-gradient(180deg, rgba(255, 208, 96, 0.85) 0%, rgba(204, 160, 61, 0.78) 100%);
text-shadow: 0 0 0.5vw rgba(241, 207, 104, 0.6), 0 0 0.2vw rgba(241, 207, 104, 0.8); text-shadow: 0 0 0.5vw rgba(241, 207, 104, 0.6), 0 0 0.2vw rgba(241, 207, 104, 0.8);
box-shadow: 0 0 0.6vw rgba(241, 207, 104, 0.35) inset, 0 0 0.6vw rgba(241, 207, 104, 0.3); box-shadow: 0 0 0.6vw rgba(241, 207, 104, 0.35) inset, 0 0 0.6vw rgba(241, 207, 104, 0.3);
} }
.bottomSwitch button[data-type="work"] { .bottomSwitch button[data-type="work"] {
background: linear-gradient(180deg, rgba(64, 196, 255, 0.85) 0%, rgba(24, 142, 196, 0.78) 100%); background: linear-gradient(180deg, rgba(64, 196, 255, 0.85) 0%, rgba(24, 142, 196, 0.78) 100%);
text-shadow: 0 0 0.5vw rgba(48, 220, 255, 0.7), 0 0 0.2vw rgba(48, 220, 255, 0.9); text-shadow: 0 0 0.5vw rgba(48, 220, 255, 0.7), 0 0 0.2vw rgba(48, 220, 255, 0.9);
box-shadow: 0 0 0.6vw rgba(48, 220, 255, 0.35) inset, 0 0 0.6vw rgba(48, 220, 255, 0.3); box-shadow: 0 0 0.6vw rgba(48, 220, 255, 0.35) inset, 0 0 0.6vw rgba(48, 220, 255, 0.3);
} }
.bottomSwitch button::before { .bottomSwitch button::before {
content: ""; content: "";
position: absolute; position: absolute;
@ -1322,6 +1484,7 @@ ul.statisticOne {
pointer-events: none; pointer-events: none;
filter: drop-shadow(0 0 0.4vw rgba(48, 220, 255, 0.45)); filter: drop-shadow(0 0 0.4vw rgba(48, 220, 255, 0.45));
} }
.bottomSwitch button::after { .bottomSwitch button::after {
content: ""; content: "";
position: absolute; position: absolute;
@ -1336,6 +1499,7 @@ ul.statisticOne {
opacity: 0.9; opacity: 0.9;
pointer-events: none; pointer-events: none;
} }
.bottomSwitch button.active::before { .bottomSwitch button.active::before {
border-color: rgba(48, 220, 255, 0.55); border-color: rgba(48, 220, 255, 0.55);
} }