forked from drone/command-center-dashboard

chenyao
2025-03-28 a080bc96952bff153be3fc1e8de9b080d942886c
feat:调整头部组件
3 files modified
24 ■■■■ changed files
src/views/Home/components/HomeLeft/HomeLeft.vue 5 ●●●● patch | view | raw | blame | history
src/views/Home/components/HomeLeft/InspectionRaskDetails.vue 10 ●●●●● patch | view | raw | blame | history
src/views/Home/components/HomeLeft/OverviewNext.vue 9 ●●●● patch | view | raw | blame | history
src/views/Home/components/HomeLeft/HomeLeft.vue
@@ -11,16 +11,13 @@
            </div>
        </div>
        <!--机巢概况-->
        <common-title style="margin-left: 14px;"></common-title>
        <overview-next></overview-next>
        <!--巡检任务情况-->
        <common-title title="巡检任务情况" style="margin-left: 14px;"></common-title>
        <inspection-rask-details></inspection-rask-details>
    </div>
</template>
<script setup>
import CommonTitle from '@/components/CommonTitle.vue';
import OverviewNext from './OverviewNext.vue';
import InspectionRaskDetails from './InspectionRaskDetails.vue';
@@ -34,7 +31,7 @@
    color: #E7F5FF;
    .time-weather {
        margin-left: 45px;
        width: 260px;
        width: 310px;
        font-size: 14px;
        height: 36px;
        line-height: 36px;
src/views/Home/components/HomeLeft/InspectionRaskDetails.vue
@@ -1,5 +1,6 @@
<!-- 巡检任务详情 -->
<template>
    <common-title title="巡检任务情况" style="margin-left: 14px;" @details="detailsFun"></common-title>
    <div class="inspection-rask-details">
        <div class="inspection-num">
            <div class="total">
@@ -20,6 +21,7 @@
<script setup>
import * as echarts from 'echarts';
import CommonTitle from '@/components/CommonTitle.vue';
import CommonDateTime from '@/components/CommonDateTime.vue';
const list = ref([
@@ -30,7 +32,12 @@
  { name: '执行失败', value: 10, color: '#FF8E8E' },
]);
const detailsFun = () => {
  console.log('details');
};
const chartRef = ref(null);
onMounted(() => {
    const chart = echarts.init(chartRef.value);
@@ -129,11 +136,12 @@
        .total {
            position: absolute;
            left: 34px;
            top: 34px;
            top: 44px;
            font-weight: 500;
            font-size: 14px;
            color: #FFFFFF;
            font-family: Source Han Sans CN, Source Han Sans CN;
            line-height: 19px;
            .value {
                font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
                margin-left: 8px;
src/views/Home/components/HomeLeft/OverviewNext.vue
@@ -1,5 +1,6 @@
<!-- 机巢概况 -->
<template>
    <common-title style="margin-left: 14px;" @details="detailsFun"></common-title>
    <div class="overview-next">
        <div class="next-num">
            <div class="total">
@@ -41,6 +42,7 @@
</template>
<script setup>
import { Search } from '@element-plus/icons-vue';
import CommonTitle from '@/components/CommonTitle.vue';
const list = ref([
  { name: '执行中', value: 89, color: '#FFA768' },
@@ -55,6 +57,10 @@
  { name: '小兰工业园3号', status: '预计执行' },
  { name: '小兰工业园3号', status: '预计执行' },
]);
const detailsFun = () => {
  console.log('details');
};
</script>
<style scoped lang="scss">
.overview-next {
@@ -74,11 +80,12 @@
        .total {
            position: absolute;
            left: 22px;
            top: 18px;
            top: 28px;
            font-weight: 500;
            font-size: 14px;
            color: #FFFFFF;
            font-family: Source Han Sans CN, Source Han Sans CN;
            line-height: 19px;
            .value {
                font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
                margin-left: 8px;