|
|
|
|
@ -11,7 +11,7 @@
|
|
|
|
|
type="bottom-button" |
|
|
|
|
> |
|
|
|
|
<datav-tab-item label="分县市局" name="1"> |
|
|
|
|
<el-scrollbar height="300px"> |
|
|
|
|
<el-scrollbar height="340px"> |
|
|
|
|
<datav-chart-bar |
|
|
|
|
:data="fxsjlist" |
|
|
|
|
size="large" |
|
|
|
|
@ -21,7 +21,7 @@
|
|
|
|
|
</el-scrollbar> |
|
|
|
|
</datav-tab-item> |
|
|
|
|
<datav-tab-item label="局属单位" name="2"> |
|
|
|
|
<el-scrollbar height="300px"> |
|
|
|
|
<el-scrollbar height="340px"> |
|
|
|
|
<datav-chart-bar |
|
|
|
|
:data="jsdwlist" |
|
|
|
|
:max="11" |
|
|
|
|
@ -34,12 +34,13 @@
|
|
|
|
|
</datav-card> |
|
|
|
|
<datav-card title="业务类型占比"> |
|
|
|
|
<v-charts |
|
|
|
|
style="height: 320px" |
|
|
|
|
style="height: 340px" |
|
|
|
|
:option="zfbaPieOption" |
|
|
|
|
autoresize |
|
|
|
|
/> |
|
|
|
|
</datav-card> |
|
|
|
|
</el-col> |
|
|
|
|
|
|
|
|
|
<el-col :span="12"> |
|
|
|
|
<datav-date-picker v-model="time"/> |
|
|
|
|
<div class="flex gap-42"> |
|
|
|
|
@ -61,7 +62,7 @@
|
|
|
|
|
<datav-statistic |
|
|
|
|
:value="overview.mailComplaintPro" |
|
|
|
|
title="信访投诉问题" |
|
|
|
|
style="width: 16.66%" |
|
|
|
|
style="width: 16.66%;" |
|
|
|
|
/> |
|
|
|
|
<datav-statistic |
|
|
|
|
:value="overview.policeValuationPro" |
|
|
|
|
@ -75,34 +76,56 @@
|
|
|
|
|
/> |
|
|
|
|
</div> |
|
|
|
|
<v-charts |
|
|
|
|
style="height: 450px" |
|
|
|
|
style="height: 360px" |
|
|
|
|
:option="option" |
|
|
|
|
autoresize |
|
|
|
|
/> |
|
|
|
|
<div> |
|
|
|
|
|
|
|
|
|
<datav-card title="问题趋势"> |
|
|
|
|
<v-charts |
|
|
|
|
style="height: 300px" |
|
|
|
|
style="height: 260px;" |
|
|
|
|
:option="proTrend" |
|
|
|
|
autoresize |
|
|
|
|
/> |
|
|
|
|
<div class="gobal-dropdown-container"> |
|
|
|
|
<el-dropdown class="test" @command="handleCommand"> |
|
|
|
|
<span class="el-dropdown-link my-gobal-yearselect"> |
|
|
|
|
{{ selectedYear + " 年" }} |
|
|
|
|
</span> |
|
|
|
|
<template #dropdown> |
|
|
|
|
<el-dropdown-menu style="width: 90px"> |
|
|
|
|
<el-dropdown-item v-for="year in years" :key="year" :command="year">{{ year + " 年" }} |
|
|
|
|
</el-dropdown-item> |
|
|
|
|
</el-dropdown-menu> |
|
|
|
|
</template> |
|
|
|
|
</el-dropdown> |
|
|
|
|
</div> |
|
|
|
|
</datav-card> |
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</el-col> |
|
|
|
|
|
|
|
|
|
<el-col :span="6"> |
|
|
|
|
<datav-card title="突出问题排名" sub-title="问题数"> |
|
|
|
|
<el-scrollbar height="300px"> |
|
|
|
|
<el-scrollbar height="390px"> |
|
|
|
|
<datav-chart-bar-pro |
|
|
|
|
:data="tcwtlist" |
|
|
|
|
size="small" |
|
|
|
|
/> |
|
|
|
|
</el-scrollbar> |
|
|
|
|
</datav-card> |
|
|
|
|
|
|
|
|
|
<datav-card title="问题类型占比"> |
|
|
|
|
<v-charts |
|
|
|
|
style="height: 300px" |
|
|
|
|
style="height: 350px" |
|
|
|
|
:option="wtlxPieOption" |
|
|
|
|
autoresize |
|
|
|
|
/> |
|
|
|
|
</datav-card> |
|
|
|
|
|
|
|
|
|
</el-col> |
|
|
|
|
</el-row> |
|
|
|
|
</main> |
|
|
|
|
@ -110,6 +133,7 @@
|
|
|
|
|
|
|
|
|
|
</el-scrollbar> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<script setup> |
|
|
|
|
import vCharts from "vue-echarts"; |
|
|
|
|
import changshaMap from "@/assets/data/changsha.json"; |
|
|
|
|
@ -125,16 +149,7 @@ const ywzblist = ref([]); // 业务类型占比
|
|
|
|
|
const wtlxlist = ref([]); // 问题类型占比 |
|
|
|
|
const tcwtlist = ref([]); // 突出问题排名 |
|
|
|
|
const mapData = ref([]); // 地图数据 |
|
|
|
|
const gobalTempMapVoList = ref([ |
|
|
|
|
{ |
|
|
|
|
"name": "芙蓉分局", |
|
|
|
|
"totalPro": 11, |
|
|
|
|
"supervisePro": 11, |
|
|
|
|
"caseVerifyPro": 11, |
|
|
|
|
"mailPro": 11, |
|
|
|
|
"policePro": 11, |
|
|
|
|
"reviewPro": 11 |
|
|
|
|
}, |
|
|
|
|
let gobalTempMapVoList = [ |
|
|
|
|
{ |
|
|
|
|
"name": "天心分局", |
|
|
|
|
"totalPro": 11, |
|
|
|
|
@ -143,122 +158,70 @@ const gobalTempMapVoList = ref([
|
|
|
|
|
"mailPro": 11, |
|
|
|
|
"policePro": 11, |
|
|
|
|
"reviewPro": 11 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
"name": "岳麓分局", |
|
|
|
|
"totalPro": 11, |
|
|
|
|
"supervisePro": 11, |
|
|
|
|
"caseVerifyPro": 11, |
|
|
|
|
"mailPro": 11, |
|
|
|
|
"policePro": 11, |
|
|
|
|
"reviewPro": 11 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
"name": "开福分局", |
|
|
|
|
"totalPro": 11, |
|
|
|
|
"supervisePro": 11, |
|
|
|
|
"caseVerifyPro": 11, |
|
|
|
|
"mailPro": 11, |
|
|
|
|
"policePro": 11, |
|
|
|
|
"reviewPro": 11 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
"name": "雨花分局", |
|
|
|
|
"totalPro": 11, |
|
|
|
|
"supervisePro": 11, |
|
|
|
|
"caseVerifyPro": 11, |
|
|
|
|
"mailPro": 11, |
|
|
|
|
"policePro": 11, |
|
|
|
|
"reviewPro": 11 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
"name": "长沙县局", |
|
|
|
|
"totalPro": 11, |
|
|
|
|
"supervisePro": 11, |
|
|
|
|
"caseVerifyPro": 11, |
|
|
|
|
"mailPro": 11, |
|
|
|
|
"policePro": 11, |
|
|
|
|
"reviewPro": 11 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
"name": "望城分局", |
|
|
|
|
"totalPro": 11, |
|
|
|
|
"supervisePro": 11, |
|
|
|
|
"caseVerifyPro": 11, |
|
|
|
|
"mailPro": 11, |
|
|
|
|
"policePro": 11, |
|
|
|
|
"reviewPro": 11 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
"name": "宁乡市局", |
|
|
|
|
"totalPro": 11, |
|
|
|
|
"supervisePro": 11, |
|
|
|
|
"caseVerifyPro": 11, |
|
|
|
|
"mailPro": 11, |
|
|
|
|
"policePro": 11, |
|
|
|
|
"reviewPro": 11 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
"name": "浏阳市局", |
|
|
|
|
"totalPro": 11, |
|
|
|
|
"supervisePro": 11, |
|
|
|
|
"caseVerifyPro": 11, |
|
|
|
|
"mailPro": 11, |
|
|
|
|
"policePro": 11, |
|
|
|
|
"reviewPro": 11 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
"name": "高新分局", |
|
|
|
|
"totalPro": 11, |
|
|
|
|
"supervisePro": 11, |
|
|
|
|
"caseVerifyPro": 11, |
|
|
|
|
"mailPro": 11, |
|
|
|
|
"policePro": 11, |
|
|
|
|
"reviewPro": 11 |
|
|
|
|
}, |
|
|
|
|
]); // 地图临时测试数据 |
|
|
|
|
} |
|
|
|
|
]; // 地图临时测试数据 |
|
|
|
|
// endregion |
|
|
|
|
const router = useRouter(); |
|
|
|
|
|
|
|
|
|
// region 地图相关 |
|
|
|
|
|
|
|
|
|
echarts.registerMap("changsha", changshaMap); |
|
|
|
|
const option = { |
|
|
|
|
const option = ref({ |
|
|
|
|
geo: { |
|
|
|
|
map: "changsha", |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
tooltip: { |
|
|
|
|
trigger: 'item', |
|
|
|
|
formatter: function (params) { |
|
|
|
|
if (typeof params.data === "undefined") { |
|
|
|
|
console.log(params); |
|
|
|
|
console.log(params) |
|
|
|
|
const dataItem = gobalTempMapVoList.find(item => item.name.includes(params.name.substring(0, 2))); |
|
|
|
|
if (dataItem) { |
|
|
|
|
return ` |
|
|
|
|
<div class="tooltip"> |
|
|
|
|
<div class="tooltip-title">${dataItem.name}</div> |
|
|
|
|
<div class="tooltip-content"> |
|
|
|
|
<ul class="tooltip-ul" > |
|
|
|
|
<li>问题总数 <span>${dataItem.totalPro}</span></li> |
|
|
|
|
<li>督察问题 <span>${dataItem.supervisePro}</span></li> |
|
|
|
|
<li>案件核查问题 <span>${dataItem.caseVerifyPro}</span></li> |
|
|
|
|
<li>信访投诉问题 <span>${dataItem.mailPro}</span></li> |
|
|
|
|
<li>警务评议问题 <span>${dataItem.policePro}</span></li> |
|
|
|
|
<li>审计监督问题 <span>${dataItem.reviewPro}</span></li> |
|
|
|
|
</ul> |
|
|
|
|
</div> |
|
|
|
|
</div>`; |
|
|
|
|
} else { |
|
|
|
|
console.log("================================") |
|
|
|
|
console.log(params); |
|
|
|
|
const res = params.data; |
|
|
|
|
return `<div class="tooltip"> |
|
|
|
|
<div class="tooltip-title">${res.name}</div> |
|
|
|
|
<div class="tooltip-title">${dataItem.name}</div> |
|
|
|
|
<div class="tooltip-content"> |
|
|
|
|
<ul class="tooltip-ul"> |
|
|
|
|
<li>问题总数 <span>${params.data.totalPro}</span></li> |
|
|
|
|
<li>督察问题 <span>${params.data.supervisePro}</span></li> |
|
|
|
|
<li>案件核查问题 <span>${params.data.caseVerifyPro}</span></li> |
|
|
|
|
<li>信访投诉问题 <span>${params.data.mailPro}</span></li> |
|
|
|
|
<li>警务评议问题 <span>${params.data.policePro}</span></li> |
|
|
|
|
<li>审计监督问题 <span>${params.data.reviewPro}</span></li> |
|
|
|
|
<ul class="tooltip-ul""> |
|
|
|
|
<li>问题总数 <span>0</span></li> |
|
|
|
|
<li>督察问题 <span>0</span></li> |
|
|
|
|
<li>案件核查问题 <span>0</span></li> |
|
|
|
|
<li>信访投诉问题 <span>0</span></li> |
|
|
|
|
<li>警务评议问题 <span>0</span></li> |
|
|
|
|
<li>审计监督问题 <span>0</span></li> |
|
|
|
|
</ul> |
|
|
|
|
</div> |
|
|
|
|
</div>`; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
// backgroundColor: "#031577", // |
|
|
|
|
// borderColor: "#0A2F86", |
|
|
|
|
// borderWidth: 0, // 设置边框宽度为1像素 |
|
|
|
|
// borderRadius: 3, // 设置边框半径为3像素 |
|
|
|
|
// shadowBlur: 0, // 设置阴影模糊程度为8像素 |
|
|
|
|
// shadowOffsetX: 0, // 设置水平阴影位移量为0像素 |
|
|
|
|
// shadowOffsetY: 0, // 设置垂直阴影位移量为6像素 |
|
|
|
|
}, |
|
|
|
|
visualMap: { |
|
|
|
|
|
|
|
|
|
type: "piecewise", |
|
|
|
|
bottom: 10, |
|
|
|
|
pieces: [ |
|
|
|
|
{gte: 0, lte: 500, label: "问题数低于500"}, |
|
|
|
|
{gte: 500, lte: 1000, label: "问题数介于500-1000"}, |
|
|
|
|
{gte: 1000, label: "问题数高于1000"}, |
|
|
|
|
{gte: 0, lte: 10, label: "问题数低于500"}, |
|
|
|
|
{gte: 10, lte: 20, label: "问题数介于500-1000"}, |
|
|
|
|
{gte: 30, label: "问题数高于1000"}, |
|
|
|
|
], |
|
|
|
|
right: 10, |
|
|
|
|
realtime: false, |
|
|
|
|
@ -287,20 +250,21 @@ const option = {
|
|
|
|
|
borderColor: "#1773c3", |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
data: gobalTempMapVoList.value.map(item => ({ |
|
|
|
|
emphasis: { |
|
|
|
|
areaColor: "#FFD700", // 高亮时区域颜色 |
|
|
|
|
borderColor: "#FF0000", // 高亮时边框颜色 |
|
|
|
|
borderWidth: 4 // 高亮时边框宽度 |
|
|
|
|
}, |
|
|
|
|
data: gobalTempMapVoList.map(item => ({ |
|
|
|
|
name: item.name, |
|
|
|
|
value: item.totalPro, |
|
|
|
|
todaysum: item.totalPro, |
|
|
|
|
allsum: item.supervisePro, |
|
|
|
|
completed: item.caseVerifyPro, |
|
|
|
|
completedrate: item.mailPro, |
|
|
|
|
resolvedrate: item.policePro, |
|
|
|
|
reviewrate: item.reviewPro |
|
|
|
|
value: item.totalPro // 将 totalPro 值映射到 value 字段 |
|
|
|
|
})) |
|
|
|
|
} |
|
|
|
|
], |
|
|
|
|
}; |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
// endregion |
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
* gobalTempMapVoList.value.map(item => ({ |
|
|
|
|
* name: item.name, |
|
|
|
|
@ -313,8 +277,15 @@ const option = {
|
|
|
|
|
* })) |
|
|
|
|
* @type {Ref<UnwrapRef<{yAxis: {splitLine: {lineStyle: {color: string}, show: boolean}, type: string}, xAxis: {data: *[], type: string, boundaryGap: boolean}, series: [{areaStyle: {color: LinearGradient}, lineStyle: {color: string, width: number}, data: *[], label: {show: boolean}, type: string, smooth: boolean}], tooltip: {axisPointer: {label: {backgroundColor: string}, type: string}, trigger: string}}>, UnwrapRef<{yAxis: {splitLine: {lineStyle: {color: string}, show: boolean}, type: string}, xAxis: {data: *[], type: string, boundaryGap: boolean}, series: [{areaStyle: {color: LinearGradient}, lineStyle: {color: string, width: number}, data: *[], label: {show: boolean}, type: string, smooth: boolean}], tooltip: {axisPointer: {label: {backgroundColor: string}, type: string}, trigger: string}}> | {yAxis: {splitLine: {lineStyle: {color: string}, show: boolean}, type: string}, xAxis: {data: *[], type: string, boundaryGap: boolean}, series: [{areaStyle: {color: LinearGradient}, lineStyle: {color: string, width: number}, data: *[], label: {show: boolean}, type: string, smooth: boolean}], tooltip: {axisPointer: {label: {backgroundColor: string}, type: string}, trigger: string}}>} |
|
|
|
|
*/ |
|
|
|
|
// 问题趋势线状图 |
|
|
|
|
// region问题趋势线状图 |
|
|
|
|
const proTrend = ref({ |
|
|
|
|
grid: { |
|
|
|
|
left: '10%', // 图表距离容器左边的距离 |
|
|
|
|
right: '10%', // 图表距离容器右边的距离 |
|
|
|
|
top: '10%', // 图表距离容器上边的距离 |
|
|
|
|
bottom: '20%', // 图表距离容器下边的距离 |
|
|
|
|
containLabel: false // 是否包含坐标轴的标签 |
|
|
|
|
}, |
|
|
|
|
xAxis: { |
|
|
|
|
type: "category", |
|
|
|
|
boundaryGap: false, |
|
|
|
|
@ -366,6 +337,14 @@ const proTrend = ref({
|
|
|
|
|
], |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const years = ref(['2024', '2023']); // 年份列表 |
|
|
|
|
const selectedYear = ref('2024年'); // 当前选中的年份 |
|
|
|
|
const handleCommand = (year) => { |
|
|
|
|
selectedYear.value = year; // 更新当前选中的年份 |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// endregion |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function go() { |
|
|
|
|
router.push("/datav/sub1") |
|
|
|
|
@ -422,7 +401,6 @@ const overview = ref({
|
|
|
|
|
policeValuationPro: 0, |
|
|
|
|
reviewPro: 0, |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const time = ref([ |
|
|
|
|
moment().startOf("year").format("YYYY-MM-DD"), |
|
|
|
|
moment().format("YYYY-MM-DD"), |
|
|
|
|
@ -436,20 +414,7 @@ function getData() {
|
|
|
|
|
ywzblist.value = res.ywzblist; |
|
|
|
|
wtlxlist.value = res.wtlxlist; |
|
|
|
|
tcwtlist.value = res.tcwtlist; |
|
|
|
|
console.log(res.gobalTempMapVoList); |
|
|
|
|
// gobalTempMapVoList.value = res.gobalTempMapVoList; |
|
|
|
|
// console.log(gobalTempMapVoList.value); |
|
|
|
|
/* option.value.series[0].data = gobalTempMapVoList.value.map(item => ({ |
|
|
|
|
name: item.name, |
|
|
|
|
totalPro: item.totalPro, |
|
|
|
|
supervisePro: item.supervisePro, |
|
|
|
|
caseVerifyPro: item.caseVerifyPro, |
|
|
|
|
mailPro: item.mailPro, |
|
|
|
|
policePro: item.policePro, |
|
|
|
|
reviewPro: item.reviewPro |
|
|
|
|
}));*/ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
gobalTempMapVoList = res.gobalTempMapVoList; |
|
|
|
|
}); |
|
|
|
|
getGobalRecentlyTrendByMonth(new Date().getFullYear()).then((res) => { |
|
|
|
|
proTrend.value.xAxis.data = res.monthList; |
|
|
|
|
@ -464,7 +429,6 @@ watch(time, () => {
|
|
|
|
|
onMounted(() => { |
|
|
|
|
getData(); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const colors = [ |
|
|
|
|
{ |
|
|
|
|
color: "linear-gradient( 270deg, #FB002D 0%, #822232 100%)", |
|
|
|
|
@ -479,7 +443,6 @@ const colors = [
|
|
|
|
|
percentage: 40, |
|
|
|
|
}, |
|
|
|
|
]; |
|
|
|
|
|
|
|
|
|
// endregion |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -490,46 +453,102 @@ const colors = [
|
|
|
|
|
@import "@/style/datav.scss"; |
|
|
|
|
|
|
|
|
|
:deep() { |
|
|
|
|
// 弹框整体 |
|
|
|
|
.tooltip { |
|
|
|
|
width: 110px; |
|
|
|
|
height: 120px; |
|
|
|
|
position: relative; |
|
|
|
|
width: 169.88px; |
|
|
|
|
height: 198px; |
|
|
|
|
background: linear-gradient(180deg, rgba(1, 4, 87, 0.8) 0%, rgba(3, 21, 119, 0.8) 100%); |
|
|
|
|
border: 1px solid #4E8FFF; |
|
|
|
|
margin: -10px -10px -10px -10px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
//浏阳市局 |
|
|
|
|
.tooltip-title { |
|
|
|
|
color: #fff; |
|
|
|
|
font-weight: bold; |
|
|
|
|
text-align: center; |
|
|
|
|
line-height: 30px; |
|
|
|
|
width: 110px; |
|
|
|
|
height: 30px; |
|
|
|
|
background: #031577; |
|
|
|
|
|
|
|
|
|
width: 169.88px; |
|
|
|
|
height: 43px; |
|
|
|
|
background: linear-gradient(180deg, rgba(1, 4, 87, 0.8) 0%, rgba(3, 21, 119, 0.8) 100%); |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: center; /* 水平居中 */ |
|
|
|
|
align-items: center; /* 垂直居中 */ |
|
|
|
|
text-align: center; /* 水平居中 */ |
|
|
|
|
font-weight: 400; |
|
|
|
|
font-size: 16px; |
|
|
|
|
color: #FFFFFF; |
|
|
|
|
line-height: 22px; |
|
|
|
|
border-bottom: 1px solid #253755; /* 设置下边框 */ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.tooltip-content { |
|
|
|
|
color: #fff; |
|
|
|
|
font-weight: bold; |
|
|
|
|
width: 110px; |
|
|
|
|
height: 120px; |
|
|
|
|
font-size: 12px; |
|
|
|
|
width: 170px; |
|
|
|
|
height: 155.8px; |
|
|
|
|
//font-size: 11px; |
|
|
|
|
margin-top: -12px; |
|
|
|
|
background: linear-gradient(180deg, #010457 0%, #031577 100%); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.tooltip-content ul { |
|
|
|
|
list-style-type: none; /* 移除默认的小圆点 */ |
|
|
|
|
padding: 0; |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.tooltip-content ul li { |
|
|
|
|
line-height: 20px; |
|
|
|
|
margin-left: 5px; |
|
|
|
|
font-family: SourceHanSansCN, SourceHanSansCN; |
|
|
|
|
height: 25px; |
|
|
|
|
color: #597AE9; |
|
|
|
|
font-size: 13px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 数字的span |
|
|
|
|
.tooltip-ul span { |
|
|
|
|
float: right; |
|
|
|
|
width: 50px; |
|
|
|
|
width: 30px; |
|
|
|
|
text-align: right; |
|
|
|
|
margin-right: 5px; |
|
|
|
|
margin-right: 15px; |
|
|
|
|
color: #fff; |
|
|
|
|
font-size: 13px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 小尖角 */ |
|
|
|
|
.tooltip::before { |
|
|
|
|
content: ''; |
|
|
|
|
position: absolute; |
|
|
|
|
top: 90px; /* 调整尖角的垂直位置 */ |
|
|
|
|
left: -10px; /* 调整尖角的水平位置 */ |
|
|
|
|
width: 0; |
|
|
|
|
height: 0; |
|
|
|
|
//border-top: 10px solid red; /* 顶边颜色 */ |
|
|
|
|
//border-bottom: 10px solid green; /* 底边颜色 */ |
|
|
|
|
//border-right: 10px solid blue; /* 右边颜色，与背景颜色相同 */ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.test { |
|
|
|
|
width: 95px; |
|
|
|
|
height: 25px; |
|
|
|
|
background: #1C3472; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.gobal-dropdown-container { |
|
|
|
|
position: absolute; |
|
|
|
|
right: 20px; |
|
|
|
|
top: 15px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.my-gobal-yearselect { |
|
|
|
|
font-size: 14px; |
|
|
|
|
padding-top: 6px; |
|
|
|
|
padding-left: 20px; |
|
|
|
|
width: 90px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</style> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
