兴蜀大屏轮播组件部分提交
This commit is contained in:
109
src/views/recruitment/card/CollegeTalentsOne.vue
Normal file
109
src/views/recruitment/card/CollegeTalentsOne.vue
Normal file
@ -0,0 +1,109 @@
|
||||
<template>
|
||||
<!-- 页面的 HTML 模板部分 -->
|
||||
<div class="custom-slide">
|
||||
<div class="custom-slide-inner">
|
||||
<div class="custom-slide-content tc">
|
||||
<div>第一产业需求</div>
|
||||
<div class="flex just-between align-center col">
|
||||
<div class="">
|
||||
<div class="title">岗位种类数</div>
|
||||
<div>480人</div>
|
||||
</div>
|
||||
<div class="">
|
||||
<div class="title">岗位人员数</div>
|
||||
<div>480人</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="custom-slide-inner">
|
||||
<div class="custom-slide-content tc">
|
||||
<div>第二产业需求</div>
|
||||
<div class="flex just-between align-center col">
|
||||
<div class="">
|
||||
<div class="title">岗位种类数</div>
|
||||
<div>480人</div>
|
||||
</div>
|
||||
<div class="">
|
||||
<div class="title">岗位人员数</div>
|
||||
<div>480人</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="custom-slide-inner">
|
||||
<div class="custom-slide-content tc">
|
||||
<div>第三产业需求</div>
|
||||
<div class="flex just-between align-center col">
|
||||
<div class="">
|
||||
<div class="title">岗位种类数</div>
|
||||
<div>480人</div>
|
||||
</div>
|
||||
<div class="">
|
||||
<div class="title">岗位人员数</div>
|
||||
<div>480人</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
// Vue 3 Composition API 的 setup 语法糖
|
||||
// 在这里直接编写响应式数据和方法，无需返回
|
||||
import { ref, reactive, computed, onMounted } from "vue";
|
||||
|
||||
// 响应式数据
|
||||
const count = ref(0);
|
||||
const state = reactive({
|
||||
name: "Vue 3"
|
||||
});
|
||||
|
||||
// 计算属性
|
||||
const doubledCount = computed(() => count.value * 2);
|
||||
|
||||
// 方法
|
||||
const increment = () => {
|
||||
count.value++;
|
||||
};
|
||||
|
||||
// 生命周期钩子
|
||||
onMounted(() => {
|
||||
console.log("组件已挂载");
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.custom-slide {
|
||||
padding: 0.9vw 0.521vw;
|
||||
|
||||
.custom-slide-inner {
|
||||
width: 15.99vw;
|
||||
height: 4.323vw;
|
||||
background: url("~@/assets/recruitment/card_item_bg.svg") no-repeat center
|
||||
center;
|
||||
background-size: cover;
|
||||
margin-bottom: 1.042vw;
|
||||
|
||||
.custom-slide-content {
|
||||
color: #cbf2fa;
|
||||
font-size: 0.625vw;
|
||||
height: 4.323vw;
|
||||
padding: 0.417vw 1.25vw 0 5.677vw;
|
||||
|
||||
.title {
|
||||
margin-bottom: 0.26vw;
|
||||
}
|
||||
|
||||
.col {
|
||||
margin-top: 0.78125vw;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
124
src/views/recruitment/card/CollegeTalentsThree.vue
Normal file
124
src/views/recruitment/card/CollegeTalentsThree.vue
Normal file
@ -0,0 +1,124 @@
|
||||
<template>
|
||||
<div ref="enterpriseThreeRef" style="width: 17vw; height: 17vw"></div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
// Vue 3 Composition API 的 setup 语法糖
|
||||
// 在这里直接编写响应式数据和方法，无需返回
|
||||
import { ref, reactive, computed, onMounted } from "vue";
|
||||
import * as echarts from "echarts";
|
||||
const enterpriseThreeRef = ref(null);
|
||||
const option = {
|
||||
// 设置图形位置
|
||||
grid: {
|
||||
top: "17%",
|
||||
left: "15%",
|
||||
right: "5%",
|
||||
bottom: "10%"
|
||||
},
|
||||
// 设置图例
|
||||
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] // 图例[距上右下左方距离
|
||||
},
|
||||
xAxis: {
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#CBF2FA" // 文字颜色
|
||||
}
|
||||
},
|
||||
|
||||
type: "category",
|
||||
data: ["制造业", "服务业", "建筑业", "批发和零售业"]
|
||||
},
|
||||
yAxis: {
|
||||
//网格线
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: ["#A1C7CD"], // 线颜色
|
||||
opacity: 0.2 // 透明度
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#CBF2FA" // 文字颜色
|
||||
}
|
||||
},
|
||||
type: "value"
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: "岗位种类数",
|
||||
type: "line",
|
||||
showBackground: true,
|
||||
barWidth: 8,
|
||||
data: [70, 62, 52, 41],
|
||||
// 设置柱状图的数值
|
||||
label: {
|
||||
show: true,
|
||||
position: "top",
|
||||
color: "#30DCFF"
|
||||
},
|
||||
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: "line",
|
||||
showBackground: true,
|
||||
barWidth: 8,
|
||||
data: [54, 32, 45, 18],
|
||||
// 设置柱状图的数值
|
||||
label: {
|
||||
show: true,
|
||||
position: "top",
|
||||
color: "#CBF2FA"
|
||||
},
|
||||
itemStyle: {
|
||||
//渐变色
|
||||
color: {
|
||||
type: "linear",
|
||||
x: 1,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{ offset: 0, color: "rgba(178, 217, 223, 1)" }
|
||||
// { offset: 1, color: "rgba(203, 242, 250, 0.08)" }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
// 生命周期钩子
|
||||
onMounted(() => {
|
||||
if (enterpriseThreeRef.value) {
|
||||
const chart = echarts.init(enterpriseThreeRef.value);
|
||||
// 设置option
|
||||
chart.setOption(option);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
124
src/views/recruitment/card/CollegeTalentsTwo.vue
Normal file
124
src/views/recruitment/card/CollegeTalentsTwo.vue
Normal file
@ -0,0 +1,124 @@
|
||||
<template>
|
||||
<div ref="enterpriseTwoRef" style="width: 17vw; height: 17vw"></div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
// Vue 3 Composition API 的 setup 语法糖
|
||||
// 在这里直接编写响应式数据和方法，无需返回
|
||||
import { ref, reactive, computed, onMounted } from "vue";
|
||||
import * as echarts from "echarts";
|
||||
const enterpriseTwoRef = ref(null);
|
||||
const option = {
|
||||
// 设置图形位置
|
||||
grid: {
|
||||
top: "15%",
|
||||
left: "15%",
|
||||
right: "5%",
|
||||
bottom: "10%"
|
||||
},
|
||||
// 设置图例
|
||||
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] // 图例[距上右下左方距离
|
||||
},
|
||||
xAxis: {
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#CBF2FA" // 文字颜色
|
||||
}
|
||||
},
|
||||
|
||||
type: "category",
|
||||
data: ["微型企业", "小型企业", "中型企业", "大型企业"]
|
||||
},
|
||||
yAxis: {
|
||||
//网格线
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: ["#A1C7CD"], // 线颜色
|
||||
opacity: 0.2 // 透明度
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#CBF2FA" // 文字颜色
|
||||
}
|
||||
},
|
||||
type: "value"
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: "岗位种类数",
|
||||
type: "bar",
|
||||
showBackground: true,
|
||||
barWidth: 8,
|
||||
data: [76, 32, 87, 65],
|
||||
// 设置柱状图的数值
|
||||
label: {
|
||||
show: true,
|
||||
position: "top",
|
||||
color: "#30DCFF"
|
||||
},
|
||||
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: [34, 15, 45, 24],
|
||||
// 设置柱状图的数值
|
||||
label: {
|
||||
show: true,
|
||||
position: "top",
|
||||
color: "#CBF2FA"
|
||||
},
|
||||
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)" }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
// 生命周期钩子
|
||||
onMounted(() => {
|
||||
if (enterpriseTwoRef.value) {
|
||||
const chart = echarts.init(enterpriseTwoRef.value);
|
||||
// 设置option
|
||||
chart.setOption(option);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
109
src/views/recruitment/card/EnterpriseEmploymentOne.vue
Normal file
109
src/views/recruitment/card/EnterpriseEmploymentOne.vue
Normal file
@ -0,0 +1,109 @@
|
||||
<template>
|
||||
<!-- 页面的 HTML 模板部分 -->
|
||||
<div class="custom-slide">
|
||||
<div class="custom-slide-inner">
|
||||
<div class="custom-slide-content tc">
|
||||
<div>第一产业需求</div>
|
||||
<div class="flex just-between align-center col">
|
||||
<div class="">
|
||||
<div class="title">岗位种类数</div>
|
||||
<div>480人</div>
|
||||
</div>
|
||||
<div class="">
|
||||
<div class="title">岗位人员数</div>
|
||||
<div>480人</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="custom-slide-inner">
|
||||
<div class="custom-slide-content tc">
|
||||
<div>第二产业需求</div>
|
||||
<div class="flex just-between align-center col">
|
||||
<div class="">
|
||||
<div class="title">岗位种类数</div>
|
||||
<div>480人</div>
|
||||
</div>
|
||||
<div class="">
|
||||
<div class="title">岗位人员数</div>
|
||||
<div>480人</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="custom-slide-inner">
|
||||
<div class="custom-slide-content tc">
|
||||
<div>第三产业需求</div>
|
||||
<div class="flex just-between align-center col">
|
||||
<div class="">
|
||||
<div class="title">岗位种类数</div>
|
||||
<div>480人</div>
|
||||
</div>
|
||||
<div class="">
|
||||
<div class="title">岗位人员数</div>
|
||||
<div>480人</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
// Vue 3 Composition API 的 setup 语法糖
|
||||
// 在这里直接编写响应式数据和方法，无需返回
|
||||
import { ref, reactive, computed, onMounted } from "vue";
|
||||
|
||||
// 响应式数据
|
||||
const count = ref(0);
|
||||
const state = reactive({
|
||||
name: "Vue 3"
|
||||
});
|
||||
|
||||
// 计算属性
|
||||
const doubledCount = computed(() => count.value * 2);
|
||||
|
||||
// 方法
|
||||
const increment = () => {
|
||||
count.value++;
|
||||
};
|
||||
|
||||
// 生命周期钩子
|
||||
onMounted(() => {
|
||||
console.log("组件已挂载");
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.custom-slide {
|
||||
padding: 0.9vw 0.521vw;
|
||||
|
||||
.custom-slide-inner {
|
||||
width: 15.99vw;
|
||||
height: 4.323vw;
|
||||
background: url("~@/assets/recruitment/card_item_bg.svg") no-repeat center
|
||||
center;
|
||||
background-size: cover;
|
||||
margin-bottom: 1.042vw;
|
||||
|
||||
.custom-slide-content {
|
||||
color: #cbf2fa;
|
||||
font-size: 0.625vw;
|
||||
height: 4.323vw;
|
||||
padding: 0.417vw 1.25vw 0 5.677vw;
|
||||
|
||||
.title {
|
||||
margin-bottom: 0.26vw;
|
||||
}
|
||||
|
||||
.col {
|
||||
margin-top: 0.78125vw;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
124
src/views/recruitment/card/EnterpriseEmploymentThree.vue
Normal file
124
src/views/recruitment/card/EnterpriseEmploymentThree.vue
Normal file
@ -0,0 +1,124 @@
|
||||
<template>
|
||||
<div ref="enterpriseThreeRef" style="width: 17vw; height: 17vw"></div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
// Vue 3 Composition API 的 setup 语法糖
|
||||
// 在这里直接编写响应式数据和方法，无需返回
|
||||
import { ref, reactive, computed, onMounted } from "vue";
|
||||
import * as echarts from "echarts";
|
||||
const enterpriseThreeRef = ref(null);
|
||||
const option = {
|
||||
// 设置图形位置
|
||||
grid: {
|
||||
top: "17%",
|
||||
left: "15%",
|
||||
right: "5%",
|
||||
bottom: "10%"
|
||||
},
|
||||
// 设置图例
|
||||
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] // 图例[距上右下左方距离
|
||||
},
|
||||
xAxis: {
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#CBF2FA" // 文字颜色
|
||||
}
|
||||
},
|
||||
|
||||
type: "category",
|
||||
data: ["制造业", "服务业", "建筑业", "批发和零售业"]
|
||||
},
|
||||
yAxis: {
|
||||
//网格线
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: ["#A1C7CD"], // 线颜色
|
||||
opacity: 0.2 // 透明度
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#CBF2FA" // 文字颜色
|
||||
}
|
||||
},
|
||||
type: "value"
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: "岗位种类数",
|
||||
type: "line",
|
||||
showBackground: true,
|
||||
barWidth: 8,
|
||||
data: [70, 62, 52, 41],
|
||||
// 设置柱状图的数值
|
||||
label: {
|
||||
show: true,
|
||||
position: "top",
|
||||
color: "#30DCFF"
|
||||
},
|
||||
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: "line",
|
||||
showBackground: true,
|
||||
barWidth: 8,
|
||||
data: [54, 32, 45, 18],
|
||||
// 设置柱状图的数值
|
||||
label: {
|
||||
show: true,
|
||||
position: "top",
|
||||
color: "#CBF2FA"
|
||||
},
|
||||
itemStyle: {
|
||||
//渐变色
|
||||
color: {
|
||||
type: "linear",
|
||||
x: 1,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{ offset: 0, color: "rgba(178, 217, 223, 1)" }
|
||||
// { offset: 1, color: "rgba(203, 242, 250, 0.08)" }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
// 生命周期钩子
|
||||
onMounted(() => {
|
||||
if (enterpriseThreeRef.value) {
|
||||
const chart = echarts.init(enterpriseThreeRef.value);
|
||||
// 设置option
|
||||
chart.setOption(option);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
124
src/views/recruitment/card/EnterpriseEmploymentTwo.vue
Normal file
124
src/views/recruitment/card/EnterpriseEmploymentTwo.vue
Normal file
@ -0,0 +1,124 @@
|
||||
<template>
|
||||
<div ref="enterpriseTwoRef" style="width: 17vw; height: 17vw"></div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
// Vue 3 Composition API 的 setup 语法糖
|
||||
// 在这里直接编写响应式数据和方法，无需返回
|
||||
import { ref, reactive, computed, onMounted } from "vue";
|
||||
import * as echarts from "echarts";
|
||||
const enterpriseTwoRef = ref(null);
|
||||
const option = {
|
||||
// 设置图形位置
|
||||
grid: {
|
||||
top: "15%",
|
||||
left: "15%",
|
||||
right: "5%",
|
||||
bottom: "10%"
|
||||
},
|
||||
// 设置图例
|
||||
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] // 图例[距上右下左方距离
|
||||
},
|
||||
xAxis: {
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#CBF2FA" // 文字颜色
|
||||
}
|
||||
},
|
||||
|
||||
type: "category",
|
||||
data: ["微型企业", "小型企业", "中型企业", "大型企业"]
|
||||
},
|
||||
yAxis: {
|
||||
//网格线
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: ["#A1C7CD"], // 线颜色
|
||||
opacity: 0.2 // 透明度
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#CBF2FA" // 文字颜色
|
||||
}
|
||||
},
|
||||
type: "value"
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: "岗位种类数",
|
||||
type: "bar",
|
||||
showBackground: true,
|
||||
barWidth: 8,
|
||||
data: [76, 32, 87, 65],
|
||||
// 设置柱状图的数值
|
||||
label: {
|
||||
show: true,
|
||||
position: "top",
|
||||
color: "#30DCFF"
|
||||
},
|
||||
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: [34, 15, 45, 24],
|
||||
// 设置柱状图的数值
|
||||
label: {
|
||||
show: true,
|
||||
position: "top",
|
||||
color: "#CBF2FA"
|
||||
},
|
||||
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)" }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
// 生命周期钩子
|
||||
onMounted(() => {
|
||||
if (enterpriseTwoRef.value) {
|
||||
const chart = echarts.init(enterpriseTwoRef.value);
|
||||
// 设置option
|
||||
chart.setOption(option);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
Reference in New Issue
Block a user