内容提交

longyvfengyun

2024-03-28 e688c5abc5f87c3ce00afb094376053643fe3857

内容提交

 src/assets/images/outline_car.png

 src/components/carInfoList.vue

@@ -10,7 +10,8 @@
                lat: 0,
                createTime: "",
                updateTime: "",
                uploadTime: ""
                uploadTime: "",
                online: 0
            }
        }
    },
@@ -37,6 +38,14 @@
        </div>
        <div class="info-item">
            <div class="info-label">
                当前状态：
            </div>
            <div class="info-value">
                <el-tag :type="infos.online===1?'primary':'info'">{{infos.online===1?'在线':'离线'}}</el-tag>
            </div>
        </div>
        <div class="info-item">
            <div class="info-label">
                经度：
            </div>
            <div class="info-value">

 src/views/analysis/hdAnalysis.vue

@@ -153,6 +153,17 @@
                sampling: "lttb",
                smooth: false,
                symbolSize: 0,
                markPoint: {
                    data: [
                        {
                            type: 'max',
                            name: 'Max',
                            itemStyle: {
                                color: '#ff0000'
                            }
                        },
                    ]
                },
                data: item,
            }
        });
@@ -180,6 +191,17 @@
                sampling: "lttb",
                smooth: false,
                symbolSize: 0,
                markPoint: {
                    data: [
                        {
                            type: 'max',
                            name: 'Max',
                            itemStyle: {
                                color: '#ff0000'
                            }
                        },
                    ]
                },
                data: item,
            }
        });
@@ -244,13 +266,12 @@
            left: '1%',
            right: '4%',
            bottom: '3%',
            top: "6%",
            containLabel: true
        }
    });
    chart3Option.tooltip.show = false;
    chart3Option.xAxis.axisLabel.show = false;
    chart3Option.xAxis.axisLine.show = false;
    chart3Option.xAxis.axisLabel.show = true;
    chart3Option.xAxis.axisLine.show = true;

    title4.value = "图表4";
    chart4Option = getNormalLine({
@@ -260,13 +281,12 @@
            left: '1%',
            right: '4%',
            bottom: '3%',
            top: "6%",
            containLabel: true
        }
    });
    chart4Option.tooltip.show = false;
    chart4Option.xAxis.axisLabel.show = false;
    chart4Option.xAxis.axisLine.show = false;
    chart4Option.xAxis.axisLabel.show = true;
    chart4Option.xAxis.axisLine.show = true;
}

const setChart = ()=>{

 src/views/battShow.vue

@@ -16,7 +16,7 @@

const carName = ref("");
const timeRange = ref("");
timeRange.value = [new Date("2020-01-01 00:00:00"), new Date("2023-01-01 00:00:00")];
timeRange.value = [new Date("2020-01-01 00:00:00"), new Date()];
const tempBar = ref(null);
const volBar = ref(null);
const alarmLine = ref(null);

 src/views/home.vue

@@ -13,6 +13,7 @@
import getRadiusBarOption from "@/components/echarts/options/radiusBar";
import getHorizontalTechnologyOption from "@/components/echarts/options/horizontalTechnologyBar";
import carPng from "@/assets/images/car.png";
import outlineCarPng from "@/assets/images/outline_car.png";
import ChartBox from "@/components/chartBox.vue";
const isFullScreen = ref(false);
const mapStyle = ref({styleJson: mapJson});
@@ -45,7 +46,8 @@
        lon: 0,
        lat: 0,
        createTime: "",
        updateTime: ""
        updateTime: "",
        online: 0
    },
});

@@ -116,7 +118,7 @@
                coordinates: [item.lon, item.lat]
            },
            properties: {
                icon: carPng,
                icon: item.online === 1?carPng:outlineCarPng,
                text: item.boxName,
                info: item
            }

 src/views/moudle/carInfo/apis.js

@@ -12,6 +12,21 @@
}

/**
 * 根据汽车名字 模糊查询
 * @param name  汽车名字
 * @return {Promise<AxiosResponse<any>> | *}
 */
export const searchCarListByNameApi= (name)=>{
  return axios({
    method: "GET",
    url: "/monitor/boxGPS/select",
    params: {
      name
    }
  });
}

/**
 * 统计最近7日在线的车辆
 * @return {Promise<axios.AxiosResponse<any>> | *}
 */

 src/views/moudle/driveInf/driveInf.js

@@ -4,7 +4,7 @@
  searchTodayDriveAlarm,
  searchAllDrives
} from "./apis"
import {reactive, ref} from "vue";
import {reactive, ref, watch} from "vue";

import pageModule from "@/views/moudle/pageInfo";
export const recentDaysDriveAlarmModule = ()=>{

 src/views/user/boxList.vue

@@ -1,5 +1,5 @@
<script setup>
import {ref, onMounted} from "vue";
import {ref, onMounted, watch} from "vue";
import {ElMessage, ElMessageBox} from "element-plus";
import {
    allDrivesModule, changeDriveInfoModule,
@@ -41,6 +41,10 @@
    // 关闭等待框
    loading.value = false;
}

watch(carName, ()=>{
    searchDriveList();
});

/**
 * 每页查询个数变更
@@ -91,9 +95,19 @@
    }).catch(()=>{});
}

import useBoxListSearch from "@/views/user/hooks/useBoxListSearch";

// 模糊查询模块
const {loading: boxSearchLoading, selectBox, boxList, boxListSearch} = useBoxListSearch();
watch(selectBox, (name)=>{
    carName.value = name;
    console.log(carName.value);
})

onMounted(()=>{
    searchDriveList();
    searchAllDrives();
    boxListSearch();
});
</script>

@@ -115,6 +129,24 @@
<!--                        </div>-->
<!--                    </div>-->
                    <div class="input-item">
                        <el-select
                            v-model="selectBox"
                            clearable
                            filterable
                            remote
                            reserve-keyword
                            placeholder="请输入车辆名称"
                            remote-show-suffix
                            :remote-method="boxListSearch"
                            :loading="boxSearchLoading">
                            <el-option
                                v-for="(item, key) in boxList"
                                :key="'key'+key"
                                :label="item.label"
                                :value="item.value"
                            />
                        </el-select>
                        <span class="w16-block"></span>
                        <el-button type="success" icon="Plus" @click="addVisible=true">添加</el-button>
                        <el-button type="primary" icon="Search" @click="searchDriveList">查询</el-button>
                    </div>
@@ -227,4 +259,8 @@
        margin-right: 8px;
    }
}
span.w16-block {
    display: inline-block;
    width: 16px;
}
</style>

 src/views/user/hooks/useBoxListSearch.js

New file
@@ -0,0 +1,38 @@
import {ref} from "vue";
import {searchCarListByNameApi} from "@/views/moudle/carInfo/apis";

export default function useBoxListSearch() {
  const loading = ref(false);
  const selectBox = ref('');
  let boxList = ref([]);

  async function boxListSearch(carName) {
    loading.value = true;
    try {
      let res = await searchCarListByNameApi(carName);
      let rs =res.data;
      let list = [];
      if(rs.code === 1) {
        list = rs.data;
      }
      boxList.value = list.map(item=>{
        return {
          label: item.boxName,
          value: item.boxName
        }
      });
      loading.value = false;
    }catch (e) {
      boxList.value = [];
      loading.value = false;
    }

  }

  return {
    loading,
    selectBox,
    boxList,
    boxListSearch
  }
}