diff --git a/package-lock.json b/package-lock.json index b1aa6cd..934ca93 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15010,6 +15010,34 @@ } } }, +<<<<<<< HEAD + "vue-loader-v16": { + "version": "npm:vue-loader@16.8.3", + "resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-16.8.3.tgz", + "integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==", + "dev": true, + "optional": true, + "requires": { + "chalk": "^4.1.0", + "hash-sum": "^2.0.0", + "loader-utils": "^2.0.0" + }, + "dependencies": { + "chalk": { + "version": "4.1.2", + "resolved": "https://registry.npmmirror.com/chalk/-/chalk-4.1.2.tgz", + "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "dev": true, + "optional": true, + "requires": { + "ansi-styles": "^4.1.0", + "supports-color": "^7.1.0" + } + } + } + }, +======= +>>>>>>> ac9e27d045b841a3a3a2a3dca10cce199d7f3c77 "vue-router": { "version": "4.5.1", "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.5.1.tgz", diff --git a/src/assets/recruitment/plghlhsg.svg b/src/assets/recruitment/plghlhsg.svg new file mode 100644 index 0000000..35e5687 --- /dev/null +++ b/src/assets/recruitment/plghlhsg.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/assets/recruitment/plghlhsg3.svg b/src/assets/recruitment/plghlhsg3.svg new file mode 100644 index 0000000..1a824f0 --- /dev/null +++ b/src/assets/recruitment/plghlhsg3.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/assets/recruitment/plghlhsg4.svg b/src/assets/recruitment/plghlhsg4.svg new file mode 100644 index 0000000..a01487f --- /dev/null +++ b/src/assets/recruitment/plghlhsg4.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/assets/recruitment/plghlhsg5.svg b/src/assets/recruitment/plghlhsg5.svg new file mode 100644 index 0000000..e7053af --- /dev/null +++ b/src/assets/recruitment/plghlhsg5.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/views/recruitment/card/EnterpriseEmploymentTwo.vue b/src/views/recruitment/card/EnterpriseEmploymentTwo.vue index 3e886b3..cf7c448 100644 --- a/src/views/recruitment/card/EnterpriseEmploymentTwo.vue +++ b/src/views/recruitment/card/EnterpriseEmploymentTwo.vue @@ -9,114 +9,84 @@ import { ref, reactive, computed, onMounted } from "vue"; import * as echarts from "echarts"; const enterpriseTwoRef = ref(null); const option = { + // 添加标题 + title: { + text: '重点保供企业分布', + left: 'center', + top: '5%', + textStyle: { + color: '#30DCFF', + fontSize: 16, + fontWeight: 'normal' + } + }, // 设置图形位置 grid: { - top: "15%", - left: "15%", - right: "5%", - bottom: "20%" - }, - // 设置图例 - legend: { - itemWidth: 10, // 方块宽度 - itemHeight: 10, // 方块高度 - textStyle: { - color: "#B2D9DF" // 文字颜色 - }, - x: "center", // 图例在左（left）、右（right）、居中（center）、100px - y: "top", // 图例在上（top）、下（bottom）、居中（center、100px）、100px - padding: [15, 50, 0, 0] // 图例[距上右下左方距离 + top: '20%', + left: '15%', + right: '5%', + bottom: '25%' }, xAxis: { - axisLine: { + show: true, + + axisTick: { + show: true, lineStyle: { - color: "#CBF2FA" // 文字颜色 + color: '#CBF2FA' } }, axisLabel: { - fontSize: 22, // 设置 x 轴文字大小 - color: "#CBF2FA", // 可以同时设置文字颜色 - rotate: 20, // 文字倾斜45度 - margin: 20 // 增加文字与轴线的距离 + fontSize: 14, + color: '#CBF2FA', + rotate: 0, + margin: 15 }, type: "category", - data: ["微型企业", "小型企业", "中型企业", "大型企业"] + data: ["第一产业", "第二产业", "第三产业"] }, yAxis: { - //网格线 + interval: 50, // 设置刻度间隔 + //显示网格线 splitLine: { show: true, lineStyle: { - color: ["#A1C7CD"], // 线颜色 - opacity: 0.2 // 透明度 + color: ['#A1C7CD'], + opacity: 0.2, + type: 'solid' } }, axisLine: { - lineStyle: { - color: "#CBF2FA" // 文字颜色 - } + show: false + }, + axisTick: { + show: false }, axisLabel: { - fontSize: 20, // 设置 x 轴文字大小 - color: "#CBF2FA" // 可以同时设置文字颜色 + show: false }, type: "value" }, series: [ { - name: "岗位种类数", + name: "企业数", type: "bar", - showBackground: true, - barWidth: 8, - data: [93, 231, 413, 451], + showBackground: false, + barWidth: 25, + data: [6, 581, 41], // 设置柱状图的数值 label: { show: true, position: "top", - color: "#30DCFF", - fontSize: 22 + color: '#30DCFF', + fontSize: 14, + formatter: function(params) { + return params.value + '家'; + } }, itemStyle: { - //渐变色 - color: { - type: "linear", - x: 1, - y: 0, - x2: 0, - y2: 1, - colorStops: [ - { offset: 0, color: "rgba(48, 220, 255, 1)" }, - { offset: 1, color: "rgba(48, 220, 255, 0.06)" } - ] - } - } - }, - { - name: "岗位人员数", - type: "bar", - showBackground: true, - barWidth: 8, - data: [451, 2110, 19356, 57083], - // 设置柱状图的数值 - label: { - show: true, - position: "top", - color: "#CBF2FA", - fontSize: 22 - }, - itemStyle: { - //渐变色 - color: { - type: "linear", - x: 1, - y: 0, - x2: 0, - y2: 1, - colorStops: [ - { offset: 0, color: "rgba(203, 242, 250, 1)" }, - { offset: 1, color: "rgba(203, 242, 250, 0.08)" } - ] - } + //纯色 + color: '#30DCFF' } } ] diff --git a/src/views/recruitment/card/ListView.vue b/src/views/recruitment/card/ListView.vue new file mode 100644 index 0000000..60a1870 --- /dev/null +++ b/src/views/recruitment/card/ListView.vue @@ -0,0 +1,442 @@ + + + + + diff --git a/src/views/recruitment/index.vue b/src/views/recruitment/index.vue index 05e170f..42d2d15 100644 --- a/src/views/recruitment/index.vue +++ b/src/views/recruitment/index.vue @@ -20,9 +20,10 @@ indicator-position="none" :autoplay="true" > - - + + + @@ -51,26 +52,7 @@ :style="{ right: isOpen_R ? '1vw' : '-22.369vw' }" > - - - - - - - - - --> + + + + + + +
@@ -115,7 +109,8 @@ import Carousel from "@/views/recruitment/components/carousel.vue"; import EnterpriseEmploymentOne from "./card/EnterpriseEmploymentOne.vue"; import EnterpriseEmploymentTwo from "./card/EnterpriseEmploymentTwo.vue"; import EnterpriseEmploymentThree from "./card/EnterpriseEmploymentThree.vue"; -import CollegeTalentsOne from "./card/CollegeTalentsOne.vue"; +// import CollegeTalentsOne from "./card/CollegeTalentsOne.vue"; +import ListView from "./card/ListView.vue"; import CollegeTalentsTwo from "./card/CollegeTalentsTwo.vue"; import CollegeTalentsThree from "./card/CollegeTalentsThree.vue"; import LaborSystemOne from "./card/LaborSystemOne.vue"; @@ -141,8 +136,8 @@ const asideMeun = reactive({ ] }); const cardOneInfo = { - title: "企业用工结构分布", - description: "7万家企业(含个体工商户)", + title: "服务企业用工机构分布", + description: "", type1: { title: "岗位种类数", count: "765个", @@ -173,16 +168,16 @@ const cardTwoInfo = { } }; const cardThreeInfo = { - title: "高校人才供给能力", - description: "4000+毕业生", + title: "重点企业保供案例(比亚迪)", + // description: "4000+毕业生", type1: { - title: "学校数", - count: "7", + title: "招募总人数", + count: "9775", class: "modelItem2" }, type2: { - title: "促就业人数", - count: "2980", + title: "企业总人数", + count: "38448", class: "modelItem2" } };