Merge remote-tracking branch 'origin/master'
13 files modified
5 files renamed
7 files added
1 files deleted
| | |
| | | import request from '@/axios' |
| | | |
| | | // 字典查询 行业 算法 工单类型 |
| | | export const getDictionary = params => { |
| | | return request({ |
| | | url: `/blade-system/dict-biz/listByCodes?codes=${params}`, |
| | | method: 'get', |
| | | }) |
| | | } |
| | | |
| | | // 区域 |
| | | export const deptsByAreaCode = params => { |
| | | return request({ |
| New file |
| | |
| | | import request from '@/axios' |
| | | |
| | | // 大屏首页=>行业数据分析(行业类型) |
| | | export const getEventIndustryData = data => { |
| | | return request({ |
| | | url: '/drone-device-core/jobEvent/industryData', |
| | | method: 'post', |
| | | data, |
| | | }) |
| | | } |
| | | |
| | | // 大屏首页=>事件趋势分析(事件日期数量折线) |
| | | export const getEventTrend = data => { |
| | | return request({ |
| | | url: '/drone-device-core/jobEvent/eventData', |
| | | method: 'post', |
| | | data, |
| | | }) |
| | | } |
| | | |
| | | // 大屏首页=>同类事件top5(事件数量) |
| | | export const getEventTopFive = data => { |
| | | return request({ |
| | | url: '/drone-device-core/jobEvent/topFive', |
| | | method: 'post', |
| | | data, |
| | | }) |
| | | } |
| | | |
| | | // 大屏首页=>事件分页列表 |
| | | export const getEventPage = data => { |
| | | return request({ |
| | | url: '/drone-device-core/jobEvent/eventPage', |
| | | method: 'post', |
| | | data, |
| | | }) |
| | | } |
| | | |
| | | |
| | | // 大屏首页=>事件状态数量 |
| | | export const getEventStatusNum = data => { |
| | | return request({ |
| | | url: '/drone-device-core/jobEvent/eventStatusNum', |
| | | method: 'post', |
| | | data, |
| | | }) |
| | | } |
| | |
| | | params, |
| | | }) |
| | | } |
| | | // 多个字典查询 |
| | | export const getMultipleDictionary = params => { |
| | | return request({ |
| | | url: `/blade-system/dict-biz/listByCodes?codes=${params}`, |
| | | method: 'get', |
| | | }) |
| | | } |
| | |
| | | }; |
| | | |
| | | const change = value => { |
| | | // todo 我对接 |
| | | // todo 待对接 |
| | | // emit('change', value); |
| | | }; |
| | | |
| | |
| | | const props = defineProps({ |
| | | title: { |
| | | type: String, |
| | | default: '机巢概况', |
| | | default: '标题', |
| | | }, |
| | | text: { |
| | | type: String, |
| | |
| | | state: { |
| | | machineNestDetail: false, // 机巢详情 |
| | | singleUavHome: {}, |
| | | isEventOverviewDetail: false,//是事件概述详细信息 |
| | | singleTotal: {}, // 统计单个机巢数据 |
| | | // 项目id |
| | | selectedWorkSpaceId: window.localStorage.getItem('bs_workspace_id'), |
| | |
| | | }, |
| | | actions: {}, |
| | | mutations: { |
| | | setIsEventOverviewDetail: (state, data) => { |
| | | state.isEventOverviewDetail = data; |
| | | }, |
| | | setMachineNestDetail: (state, data) => { |
| | | state.machineNestDetail = data; |
| | | }, |
| New file |
| | |
| | | <template> |
| | | <EventOverviewDetailLeft /> |
| | | <EventOverviewDetailRight/> |
| | | </template> |
| | | <script setup> |
| | | import EventOverviewDetailLeft from './EventOverviewDetailLeft/EventOverviewDetailLeft.vue' |
| | | import EventOverviewDetailRight from '@/views/Home/EventOverviewDetail/EventOverviewDetailRight.vue' |
| | | </script> |
| | | <style scoped lang="scss"></style> |
| New file |
| | |
| | | <template> |
| | | <common-title title="行业数据分析" /> |
| | | <div class="chart" ref="echartsRef"></div> |
| | | </template> |
| | | <script setup> |
| | | import CommonTitle from '@/components/CommonTitle.vue' |
| | | import { getEventIndustryData } from '@/api/home/event' |
| | | import * as echarts from 'echarts' |
| | | |
| | | const echartsRef = ref(null) |
| | | let chart = null |
| | | |
| | | const echartsOption = { |
| | | tooltip: { |
| | | trigger: 'axis', |
| | | axisPointer: { |
| | | type: 'shadow', |
| | | }, |
| | | }, |
| | | grid: { |
| | | top: '5%', |
| | | left: 0, |
| | | right: 0, |
| | | bottom: 0, |
| | | containLabel: true, |
| | | }, |
| | | xAxis: { |
| | | type: 'category', |
| | | axisLabel: { |
| | | rotate: -45, // 旋转角度 |
| | | interval: 0, // 显示所有标签 |
| | | color: '#FFFFFF', |
| | | fontFamily: 'Source Han Sans CN, Source Han Sans CN', |
| | | fontWeight: 400, |
| | | fontSize: 10, |
| | | }, |
| | | data: [], |
| | | }, |
| | | yAxis: [ |
| | | { |
| | | type: 'value', |
| | | axisLabel: { |
| | | interval: 0, // 显示所有标签 |
| | | color: '#FFFFFF', |
| | | fontFamily: 'Source Han Sans CN, Source Han Sans CN', |
| | | fontWeight: 400, |
| | | fontSize: 10, |
| | | }, |
| | | axisLine: { |
| | | lineStyle: { |
| | | color: '#ffffff', |
| | | }, |
| | | }, |
| | | splitLine: { |
| | | lineStyle: { |
| | | color: 'rgba(255, 255, 255, 0.1)', |
| | | type: 'dashed', // 设置为虚线 |
| | | }, |
| | | }, |
| | | }, |
| | | ], |
| | | series: [], |
| | | } |
| | | |
| | | const testObj = color => ({ |
| | | type: 'bar', |
| | | emphasis: { |
| | | focus: 'series', |
| | | }, |
| | | itemStyle: { color }, |
| | | data: [], |
| | | }) |
| | | |
| | | const eventType = [ |
| | | { name: '事件', ...testObj('#6FCAFF') }, |
| | | { name: '任务', ...testObj('#8EFFAC') }, |
| | | ] |
| | | const params = inject('eventOverviewParams') |
| | | |
| | | watch(params, () => { |
| | | getData() |
| | | }) |
| | | |
| | | // 获取数据 |
| | | const getData = async () => { |
| | | const res = await getEventIndustryData(params.value) |
| | | const list = res?.data?.data || [] |
| | | echartsOption.xAxis.data = list.map(item => item.name) |
| | | // |
| | | eventType.forEach(item => { |
| | | item.data = [] |
| | | }) |
| | | list.forEach(item => { |
| | | item.data.forEach(item1 => { |
| | | eventType.forEach(item2 => { |
| | | item2.name === item1.name && item2.data.push(item1.value) |
| | | }) |
| | | }) |
| | | }) |
| | | echartsOption.series = eventType |
| | | chart.setOption(echartsOption) |
| | | } |
| | | |
| | | onMounted(() => { |
| | | chart = echarts.init(echartsRef.value) |
| | | window.addEventListener('resize', chart.resize) |
| | | getData() |
| | | }) |
| | | </script> |
| | | <style scoped lang="scss"> |
| | | .chart { |
| | | width: 356px; |
| | | height: 190px; |
| | | } |
| | | </style> |
| New file |
| | |
| | | <template> |
| | | <div class="left"> |
| | | <div class="do-return" @click="goBack"> |
| | | <img src="@/assets/images/signMachineNest/return.png" alt="" /> |
| | | </div> |
| | | <common-title title="事件数据分析" /> |
| | | <CommonDateTime class="dateTime" v-model="timeArr" @change="timeChange" /> |
| | | <EventDataAnalysis /> |
| | | <EventTrendAnalysis /> |
| | | <EventTop5 /> |
| | | </div> |
| | | </template> |
| | | <script setup> |
| | | import EventDataAnalysis from './EventDataAnalysis.vue' |
| | | import CommonTitle from '@/components/CommonTitle.vue' |
| | | import CommonDateTime from '@/components/CommonDateTime.vue' |
| | | import dayjs from 'dayjs' |
| | | import { useStore } from 'vuex' |
| | | import EventTrendAnalysis from '@/views/Home/EventOverviewDetail/EventOverviewDetailLeft/EventTrendAnalysis.vue' |
| | | import EventTop5 from '@/views/Home/EventOverviewDetail/EventOverviewDetailLeft/EventTop5.vue' |
| | | |
| | | const today = dayjs().format('YYYY-MM-DD') |
| | | const timeArr = ref([today, today]) |
| | | const store = useStore() |
| | | |
| | | const params = ref({ |
| | | date_enum: 'TODAY', |
| | | end_date: undefined, |
| | | start_date: undefined, |
| | | }) |
| | | provide('eventOverviewParams', params) |
| | | |
| | | // 时间变化 |
| | | const timeChange = (value, date_enum) => { |
| | | params.value = { |
| | | ...params.value, |
| | | date_enum, |
| | | } |
| | | } |
| | | const goBack = () => { |
| | | store.commit('setIsEventOverviewDetail', false) |
| | | } |
| | | </script> |
| | | <style scoped lang="scss"> |
| | | .left { |
| | | position: absolute; |
| | | top: 88px; |
| | | color: #e7f5ff; |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: center; |
| | | |
| | | .dateTime { |
| | | width: 356px; |
| | | margin: 0 0 8px 0; |
| | | } |
| | | |
| | | .do-return { |
| | | position: absolute; |
| | | top: 50px; |
| | | right: -50px; |
| | | cursor: pointer; |
| | | |
| | | img { |
| | | width: 40px; |
| | | height: 40px; |
| | | } |
| | | } |
| | | } |
| | | </style> |
| New file |
| | |
| | | <template> |
| | | <common-title title="同类事件TOP5统计" /> |
| | | <div class="chart" ref="echartsRef"></div> |
| | | </template> |
| | | <script setup> |
| | | import CommonTitle from '@/components/CommonTitle.vue' |
| | | import { getEventTopFive, getEventTrend } from '@/api/home/event' |
| | | import * as echarts from 'echarts' |
| | | |
| | | const echartsRef = ref(null) |
| | | let chart = null |
| | | |
| | | const echartsOption = { |
| | | tooltip: { |
| | | trigger: 'axis', |
| | | axisPointer: { |
| | | type: 'shadow', |
| | | }, |
| | | }, |
| | | grid: { |
| | | top: '5%', |
| | | left: 0, |
| | | right: 0, |
| | | bottom: 0, |
| | | containLabel: true, |
| | | }, |
| | | xAxis: { |
| | | type: 'category', |
| | | axisLabel: { |
| | | rotate: -45, // 旋转角度 |
| | | interval: 0, // 显示所有标签 |
| | | color: '#FFFFFF', |
| | | fontFamily: 'Source Han Sans CN, Source Han Sans CN', |
| | | fontWeight: 400, |
| | | fontSize: 10, |
| | | }, |
| | | data: [], |
| | | }, |
| | | yAxis: [ |
| | | { |
| | | type: 'value', |
| | | axisLabel: { |
| | | interval: 0, // 显示所有标签 |
| | | color: '#FFFFFF', |
| | | fontFamily: 'Source Han Sans CN, Source Han Sans CN', |
| | | fontWeight: 400, |
| | | fontSize: 10, |
| | | }, |
| | | axisLine: { |
| | | lineStyle: { |
| | | color: '#ffffff', |
| | | }, |
| | | }, |
| | | splitLine: { |
| | | lineStyle: { |
| | | color: 'rgba(255, 255, 255, 0.1)', |
| | | type: 'dashed', // 设置为虚线 |
| | | }, |
| | | }, |
| | | }, |
| | | ], |
| | | series: { |
| | | type: 'bar', |
| | | emphasis: { |
| | | focus: 'series', |
| | | }, |
| | | itemStyle: { color:'#6FCAFF' }, |
| | | data: [], |
| | | }, |
| | | } |
| | | |
| | | const params = inject('eventOverviewParams') |
| | | |
| | | watch(params, () => { |
| | | getData() |
| | | }) |
| | | |
| | | // 获取数据 |
| | | const getData = async () => { |
| | | const res = await getEventTopFive(params.value) |
| | | const list = res?.data?.data || [] |
| | | echartsOption.xAxis.data = list.map(item => item.name) |
| | | echartsOption.series.data = list.map(item => item.value) |
| | | chart.setOption(echartsOption) |
| | | } |
| | | |
| | | onMounted(() => { |
| | | chart = echarts.init(echartsRef.value) |
| | | window.addEventListener('resize', chart.resize) |
| | | getData() |
| | | }) |
| | | </script> |
| | | <style scoped lang="scss"> |
| | | .chart { |
| | | width: 356px; |
| | | height: 190px; |
| | | } |
| | | </style> |
| New file |
| | |
| | | <template> |
| | | <common-title title="事件趋势分析" /> |
| | | <div class="chart" ref="echartsRef"></div> |
| | | </template> |
| | | <script setup> |
| | | import CommonTitle from '@/components/CommonTitle.vue' |
| | | import { getEventTrend } from '@/api/home/event' |
| | | import * as echarts from 'echarts' |
| | | |
| | | const echartsRef = ref(null) |
| | | let chart = null |
| | | |
| | | const echartsOption = { |
| | | tooltip: { |
| | | trigger: 'axis', |
| | | axisPointer: { |
| | | type: 'shadow', |
| | | }, |
| | | }, |
| | | grid: { |
| | | top: '5%', |
| | | left: 0, |
| | | right: 0, |
| | | bottom: 0, |
| | | containLabel: true, |
| | | }, |
| | | xAxis: { |
| | | type: 'category', |
| | | axisLabel: { |
| | | rotate: -45, // 旋转角度 |
| | | interval: 0, // 显示所有标签 |
| | | color: '#FFFFFF', |
| | | fontFamily: 'Source Han Sans CN, Source Han Sans CN', |
| | | fontWeight: 400, |
| | | fontSize: 10, |
| | | }, |
| | | data: [], |
| | | }, |
| | | yAxis: [ |
| | | { |
| | | type: 'value', |
| | | axisLabel: { |
| | | interval: 0, // 显示所有标签 |
| | | color: '#FFFFFF', |
| | | fontFamily: 'Source Han Sans CN, Source Han Sans CN', |
| | | fontWeight: 400, |
| | | fontSize: 10, |
| | | }, |
| | | axisLine: { |
| | | lineStyle: { |
| | | color: '#ffffff', |
| | | }, |
| | | }, |
| | | splitLine: { |
| | | lineStyle: { |
| | | color: 'rgba(255, 255, 255, 0.1)', |
| | | type: 'dashed', // 设置为虚线 |
| | | }, |
| | | }, |
| | | }, |
| | | ], |
| | | series: { |
| | | type: 'line', |
| | | itemStyle: { |
| | | color: '#0CEBF7', // 设置颜色 |
| | | }, |
| | | lineStyle: { |
| | | width: 2, // 线条宽度 |
| | | type: 'solid', // 线条类型 |
| | | }, |
| | | symbol: 'circle', // 数据点符号 |
| | | symbolSize: 6, // 数据点符号大小 |
| | | emphasis: { |
| | | focus: 'series', |
| | | }, |
| | | data: [], // 示例数据,根据实际完成率计算 |
| | | }, |
| | | } |
| | | |
| | | const params = inject('eventOverviewParams') |
| | | |
| | | watch(params, () => { |
| | | getData() |
| | | }) |
| | | |
| | | // 获取数据 |
| | | const getData = async () => { |
| | | const res = await getEventTrend(params.value) |
| | | const list = res?.data?.data || [] |
| | | echartsOption.xAxis.data = list.map(item => item.name) |
| | | echartsOption.series.data = list.map(item => item.value) |
| | | chart.setOption(echartsOption) |
| | | } |
| | | |
| | | onMounted(() => { |
| | | chart = echarts.init(echartsRef.value) |
| | | window.addEventListener('resize', chart.resize) |
| | | getData() |
| | | }) |
| | | </script> |
| | | <style scoped lang="scss"> |
| | | .chart { |
| | | width: 356px; |
| | | height: 190px; |
| | | } |
| | | </style> |
| New file |
| | |
| | | <template> |
| | | <div class="right"> |
| | | <div>工单列表</div> |
| | | |
| | | <div> |
| | | <el-date-picker |
| | | v-model="timeArr" |
| | | type="daterange" |
| | | value-format="YYYY-MM-DD" |
| | | range-separator="-" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | @change="change" |
| | | disabled |
| | | /> |
| | | <el-select v-model="params.device_sn" placeholder="请选择" size="large" filterable clearable> |
| | | <el-option |
| | | v-for="item in deviceList" |
| | | :label="item.nickname" |
| | | :value="item.device_sn" |
| | | :key="item.device_sn" |
| | | /> |
| | | </el-select> |
| | | |
| | | <el-select |
| | | v-model="params.word_order_type" |
| | | placeholder="请选择" |
| | | size="large" |
| | | filterable |
| | | clearable |
| | | > |
| | | <el-option |
| | | v-for="item in workOrderType" |
| | | :label="item.dictValue" |
| | | :value="item.dictKey" |
| | | :key="item.dictKey" |
| | | /> |
| | | </el-select> |
| | | <div> |
| | | <div v-for="item in statusList"> |
| | | <div>{{ item.name }}</div> |
| | | <div>{{ item.num || 0 }}</div> |
| | | </div> |
| | | </div> |
| | | |
| | | <el-checkbox-group v-model="params.SFType"> |
| | | <el-checkbox v-for="item in SFDictList" :label="item.dictValue":value="item.dictKey" :key="item.dictKey"/> |
| | | </el-checkbox-group> |
| | | |
| | | </div> |
| | | </div> |
| | | </template> |
| | | <script setup> |
| | | import dayjs from 'dayjs' |
| | | import { selectDevicePage } from '@/api/home/machineNest' |
| | | import { getMultipleDictionary } from '@/api/system/dictbiz' |
| | | import { getEventStatusNum } from '@/api/home/event' |
| | | |
| | | const timeFormat = 'YYYY-MM-DD HH:mm:ss' |
| | | const today = dayjs().format(timeFormat) |
| | | const oneWeekAgo = dayjs().subtract(7, 'day').format(timeFormat) |
| | | const timeArr = ref([oneWeekAgo, today]) |
| | | const deviceList = ref([]) |
| | | |
| | | const params = ref({ |
| | | device_sn: '', |
| | | word_order_type: '', |
| | | SFType:[] |
| | | }) |
| | | |
| | | const getDeviceList = async () => { |
| | | const res = await selectDevicePage({ current: 1, size: 99999, type: 1 }) |
| | | deviceList.value = res.data?.data?.records || [] |
| | | } |
| | | |
| | | const workOrderType = ref([]) |
| | | const SFDictList = ref([]) |
| | | const getDictList = () => { |
| | | getMultipleDictionary('WORK_ORDER_TYPE,SF').then(res => { |
| | | workOrderType.value = res.data.data?.['WORK_ORDER_TYPE'] || [] |
| | | SFDictList.value = res.data.data?.['SF'] || [] |
| | | }) |
| | | } |
| | | |
| | | const statusList = ref([]) |
| | | const getEventStatusNumFun = () => { |
| | | const [start_date, end_date] = timeArr.value |
| | | getEventStatusNum({ start_date, end_date }).then(res => { |
| | | statusList.value = res.data?.data || [] |
| | | }) |
| | | } |
| | | |
| | | const change = value => {} |
| | | |
| | | onMounted(() => { |
| | | getDeviceList() |
| | | getDictList() |
| | | getEventStatusNumFun() |
| | | }) |
| | | </script> |
| | | <style scoped lang="scss"> |
| | | .right { |
| | | position: absolute; |
| | | right: 0; |
| | | top: 88px; |
| | | color: black; |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: center; |
| | | height: 900px; |
| | | width: 400px; |
| | | background: white; |
| | | } |
| | | </style> |
| | |
| | | <template> |
| | | <template v-if="!singleUavHome?.device_sn"> |
| | | <SearchBox /> |
| | | <HomeLeft /> |
| | | <HomeRight /> |
| | | </template> |
| | | <template v-else> |
| | | <SignMachineNest /> |
| | | </template> |
| | | <RSide /> |
| | | <Footer /> |
| | | <template v-if="singleUavHome?.device_sn"> |
| | | <SignMachineNest /> |
| | | </template> |
| | | <template v-else> |
| | | <EventOverviewDetail v-if="isEventOverviewDetail" /> |
| | | <template v-else> |
| | | <SearchBox /> |
| | | <HomeLeft /> |
| | | <HomeRight /> |
| | | </template> |
| | | </template> |
| | | <RSide /> |
| | | <Footer /> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import HomeRight from '@/views/Home/HomeRight/HomeRight.vue'; |
| | | import HomeLeft from '@/views/Home/HomeLeft/HomeLeft.vue'; |
| | | import SearchBox from '@/views/Home/SearchBox.vue'; |
| | | import SignMachineNest from '@/views/SignMachineNest/SignMachineNest.vue'; |
| | | import { useStore } from 'vuex'; |
| | | import Footer from '@/views/Home/Footer.vue'; |
| | | import RSide from '@/views/Home/RSide.vue'; |
| | | import { onMounted } from 'vue'; |
| | | import cesiumOperation from '@/utils/cesium-tsa'; |
| | | import MeasuringDistance from '@/components/MeasuringDistance.vue'; |
| | | const store = useStore(); |
| | | const { _init,viewerDestory } = cesiumOperation(); |
| | | import HomeRight from '@/views/Home/HomeRight/HomeRight.vue' |
| | | import HomeLeft from '@/views/Home/HomeLeft/HomeLeft.vue' |
| | | import SearchBox from '@/views/Home/SearchBox.vue' |
| | | import SignMachineNest from '@/views/SignMachineNest/SignMachineNest.vue' |
| | | import { useStore } from 'vuex' |
| | | import Footer from '@/views/Home/Footer.vue' |
| | | import RSide from '@/views/Home/RSide.vue' |
| | | import { onMounted } from 'vue' |
| | | import cesiumOperation from '@/utils/cesium-tsa' |
| | | import EventOverviewDetail from '@/views/Home/EventOverviewDetail/EventOverviewDetail.vue' |
| | | |
| | | const singleUavHome = computed(() => store.state.home.singleUavHome); |
| | | const store = useStore() |
| | | const { _init, viewerDestory } = cesiumOperation() |
| | | |
| | | onUnmounted(()=>{ |
| | | store.commit('setSingleUavHome',null); |
| | | const singleUavHome = computed(() => store.state.home.singleUavHome) |
| | | const isEventOverviewDetail = computed(() => store.state.home.isEventOverviewDetail) |
| | | |
| | | onUnmounted(() => { |
| | | store.commit('setSingleUavHome', null) |
| | | console.log('home销毁') |
| | | viewerDestory() |
| | | viewerDestory() |
| | | }) |
| | | |
| | | onMounted(() => { |
| | | _init('cesium'); |
| | | }); |
| | | _init('cesium') |
| | | }) |
| | | </script> |
| | |
| | | <template> |
| | | <CommonTitle title="事件概况" /> |
| | | <CommonTitle title="事件概况" @Details="details"/> |
| | | <div :style="{ marginLeft: pxToRem(14) }"> |
| | | <div class="eventOverview"> |
| | | <div class="overviewData"> |
| | |
| | | import { getJobEventBrokerLine, getJobEventByStatus, getJobEventTotal } from '@/api/home'; |
| | | import dayjs from 'dayjs'; |
| | | import { selectDevicePage } from '@/api/home/machineNest'; |
| | | import { useStore } from 'vuex' |
| | | |
| | | const echartsOption = { |
| | | tooltip: { |
| | |
| | | start_date: undefined, |
| | | }); |
| | | |
| | | const store = useStore() |
| | | const details = () =>{ |
| | | store.commit('setIsEventOverviewDetail',true) |
| | | } |
| | | |
| | | // 远程查询 |
| | | const remoteMethod = nickname => { |
| | | devicePageParams.value.nickname = nickname; |
| | |
| | | getJobEventBrokerLine(params.value).then(res => { |
| | | const list = res?.data?.data || []; |
| | | echartsOption.xAxis.data = list.map(item => item.name); |
| | | // 赋值前清空数据 |
| | | Object.keys(seriesObj).forEach(key => {seriesObj[key].data = []}) |
| | | list.forEach(item => { |
| | | item.data.forEach((item1, index) => { |
| | | seriesObj[item1.status].data.push(item1.value); |
| | |
| | | |
| | | onMounted(() => { |
| | | chart = echarts.init(echartsRef.value); |
| | | window.addEventListener('resize', () => { |
| | | chart.resize(); |
| | | }); |
| | | window.addEventListener('resize', chart.resize); |
| | | getJobEventTotal().then(res => { |
| | | eventTotal.value = res?.data?.data || 0; |
| | | }); |
| | |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="任务算法"> |
| | | <!-- <el-select v-model="searchForm.ai_type" placeholder="请选择算法" clearable> |
| | | <!-- <el-select v-model="searchForm.ai_types" placeholder="请选择算法" clearable> |
| | | <el-option v-for="item in taskAlgorithm" :key="item.id" :label="item.dictValue" :value="item.dictKey" /> |
| | | </el-select> --> |
| | | <TaskAlgorithmBusiness :showAlgorithm="true" @algorithmChange="algorithmChange"/> |
| | |
| | | |
| | | const dateRange = ref([]); |
| | | const searchForm = reactive({ |
| | | ai_type: '', // 算法类型 |
| | | ai_types: [], // 算法类型 |
| | | area_code: '', // 区域code |
| | | create_dept: '', // 创建部门 |
| | | date_enum: '', // 日期枚举,可用值:TODAY,CURRENT_WEEK,CURRENT_MONTH,CURRENT_YEAR |
| | |
| | | const handleSearch = () => { |
| | | emit('search', { |
| | | ...searchForm, |
| | | start_date: `${dateRange.value[0]} 00:00:00`, |
| | | end_date: `${dateRange.value[1]} 23:59:59` |
| | | start_date: dateRange.value.length ? `${dateRange.value[0]} 00:00:00` : '', |
| | | end_date: dateRange.value.length ? `${dateRange.value[1]} 23:59:59` : '' |
| | | }); |
| | | }; |
| | | |
| | |
| | | // }); |
| | | // }; |
| | | const algorithmChange = (val) => { |
| | | searchForm.ai_type = val; |
| | | searchForm.ai_types = val; |
| | | }; |
| | | |
| | | const businessChange = (val) => { |
| | |
| | | <style lang="scss" scoped> |
| | | .search-box { |
| | | position: absolute; |
| | | top: 120px; |
| | | left: 450px; |
| | | width: calc(100% - 400px - 400px - 100px); |
| | | top: 340px; |
| | | left: 40px; |
| | | width: calc(100% - 80px); |
| | | height: 60px; |
| | | line-height: 60px; |
| | | background: rgba(31, 62, 122, 0.95); |
| | | // padding: 10px 20px; |
| | | transition: all 0.3s; |
| | |
| | | } |
| | | .search-row { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | // justify-content: space-between; |
| | | align-items: center; |
| | | |
| | | .search-items { |
| | |
| | | z-index: 10; |
| | | border-top: 1px solid rgba(255, 255, 255, 0.1); |
| | | box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); |
| | | margin-bottom: 60px; // 为分页预留空间 |
| | | } |
| | | |
| | | :deep(.el-form) { |
| | |
| | | line-height: 18px; |
| | | } |
| | | } |
| | | :deep(.el-pagination) { |
| | | position: fixed; |
| | | bottom: 20px; |
| | | left: 50%; |
| | | transform: translateX(-50%); |
| | | background: rgba(31, 62, 122, 0.95); |
| | | padding: 15px 20px; |
| | | border-radius: 4px; |
| | | box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3); |
| | | } |
| | | } |
| | | </style> |
| | |
| | | <div class="left"> |
| | | <div class="search"> |
| | | <div class="item">任务名称:<el-input v-model="searchForm.name" placeholder="请输入任务名称"></el-input></div> |
| | | <div class="item">任务日期: |
| | | <div class="item"><span style="color: red;">*</span>任务日期: |
| | | <el-date-picker |
| | | v-model="searchForm.begin_time" |
| | | format="YYYY-MM-DD" |
| | |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { ElMessage } from 'element-plus'; |
| | | import { pxToRem } from '@/utils/rem'; |
| | | import { getWaylineList, createTask } from '@/api/home/task'; |
| | | import TaskAlgorithmBusiness from '../components/TaskAlgorithmBusiness.vue'; |
| | |
| | | |
| | | const searchForm = reactive({ |
| | | name: '', |
| | | ai_type: [], |
| | | ai_types: [], |
| | | file_id: '', |
| | | begin_time: '', |
| | | end_time: '', |
| | |
| | | } |
| | | }; |
| | | const algorithmChange = (val) => { |
| | | searchForm.ai_type = val; |
| | | searchForm.ai_types = val; |
| | | }; |
| | | |
| | | // 获取航线文件 |
| | |
| | | const emit = defineEmits(['refresh']); |
| | | // 提交 |
| | | const submitClick = () => { |
| | | if (!searchForm.begin_time) { |
| | | ElMessage({ |
| | | message: '请选择任务日期', |
| | | type: 'warning' |
| | | }); |
| | | return; |
| | | } |
| | | searchForm.end_time = `${searchForm.begin_time} 23:59:59`; |
| | | searchForm.begin_time = `${searchForm.begin_time} 00:00:00`; |
| | | |
| | | createTask(searchForm).then((res) => { |
| | | console.log(res); |
| | | if (res.code === 0) { |
| | | if (res.data.code === 0) { |
| | | ElMessage.success('任务创建成功'); |
| | | // 关闭当前窗口,刷新任务管理列表 |
| | | isShowAddTask.value = false; |
| | |
| | | isShowAddTask.value = false; |
| | | // 清除搜索数据 |
| | | searchForm.name = ''; |
| | | searchForm.ai_type = []; |
| | | searchForm.ai_types = []; |
| | | searchForm.file_id = ''; |
| | | searchForm.begin_time = ''; |
| | | searchForm.end_time = ''; |
| | |
| | | :deep(.el-date-picker), |
| | | :deep(.el-time-picker) { |
| | | width: 240px; |
| | | margin-left: 10px; |
| | | // margin-left: 10px; |
| | | } |
| | | :deep(.el-date-editor.el-input__wrapper) { |
| | | width: 200px; // 调整日期选择器宽度 |
| | |
| | | } |
| | | .right { |
| | | width: 30%; |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: space-between; |
| | | |
| | | .btn { |
| | | margin-top: 20px; |
| | | text-align: center; |
| | | |
| | | .el-button { |
| | | margin: 0 10px; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </style> |
| | |
| | | }; |
| | | // 状态文字 |
| | | const getStatusText = (status) => { |
| | | console.log('哒哒哒',status) |
| | | const statusMap = { |
| | | 1: '待执行', |
| | | 2: '执行中', |
| | |
| | | <style lang="scss" scoped> |
| | | .task-intermediate-content { |
| | | position: absolute; |
| | | top: 200px; |
| | | width: calc(100% - 400px - 400px - 100px); |
| | | left: 450px; |
| | | height: 760px; |
| | | top: 400px; |
| | | width: calc(100% - 80px); |
| | | left: 40px; |
| | | height: 500px; |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: space-between; |
| | |
| | | <template> |
| | | <el-table :data="tableData" style="width: 100%" height="400" @selection-change="handleSelectionChange"> |
| | | <el-table-column type="selection" width="55" /> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="nickname" label="机巢名称" /> |
| | | <el-table-column prop="estimated_arrival_time" label="预计到达时间" /> |
| | | <el-table-column prop="exe_distance" label="执行里程" /> |
| | | </el-table> |
| | | <div class="pagination"> |
| | | <el-pagination |
| | | v-model:current-page="pageParams.page" |
| | | v-model:page-size="pageParams.limit" |
| | | :page-sizes="[10, 20, 30]" |
| | | layout="total, sizes, prev, pager, next" |
| | | :total="total" |
| | | @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange" |
| | | /> |
| | | <div class="table-container"> |
| | | <el-table :data="tableData" style="width: 100%" height="400" @selection-change="handleSelectionChange"> |
| | | <el-table-column type="selection" width="55" /> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="nickname" label="机巢名称" /> |
| | | <el-table-column prop="estimated_arrival_time" label="预计到达时间" /> |
| | | <el-table-column prop="exe_distance" label="执行里程" /> |
| | | </el-table> |
| | | <div class="pagination"> |
| | | <el-pagination |
| | | v-model:current-page="pageParams.page" |
| | | v-model:page-size="pageParams.limit" |
| | | :page-sizes="[10, 20, 30]" |
| | | layout="total, sizes, prev, pager, next" |
| | | :total="total" |
| | | @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange" |
| | | /> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | const getNestList = async () => { |
| | | tableData.value = []; |
| | | const res = await getFlyingNestBy(pageParams); |
| | | |
| | | if (res.data.code === 0) { |
| | | console.log(res.data.data, '哒哒哒'); |
| | | tableData.value = res.data.data; |
| | | } |
| | | }; |
| | |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .table-container { |
| | | height: 500px; |
| | | // display: flex; |
| | | // flex-direction: column; |
| | | |
| | | .pagination { |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | // :deep(.el-table) { |
| | | // flex: 1; |
| | | // background-color: transparent; |
| | | // --el-table-border-color: rgba(255, 255, 255, 0.1); |
| | | // --el-table-header-bg-color: rgba(31, 62, 122, 0.5); |
| | | // --el-table-header-text-color: #fff; |
| | | // --el-table-text-color: #fff; |
| | | // } |
| | | } |
| | | </style> |
| | |
| | | <script setup> |
| | | import TaskLeft from "@/views/TaskManage/TaskLeft/TaskLeft.vue"; |
| | | import TaskRight from "@/views/TaskManage/TaskRight/TaskRight.vue"; |
| | | import TaskTop from "@/views/TaskManage/TaskTop/TaskTop.vue"; |
| | | import TaskIntermediateContent from "@/views/TaskManage/TaskIntermediateContent/TaskIntermediateContent.vue"; |
| | | </script> |
| | | |
| | | <template> |
| | | <TaskLeft/> |
| | | <TaskTop/> |
| | | <TaskIntermediateContent /> |
| | | <TaskRight/> |
| | | </template> |
| | | |
| | | |
| File was renamed from src/views/TaskManage/TaskRight/TaskEvent.vue |
| | |
| | | <!-- 任务事件统计 --> |
| | | <template> |
| | | <common-title title="任务事件统计"></common-title> |
| | | <!-- <common-title title="任务事件统计"></common-title> --> |
| | | <div class="task-event"> |
| | | <div class="chart" ref="chartRef"></div> |
| | | </div> |
| | |
| | | <style lang="scss" scoped> |
| | | .task-event { |
| | | font-family: YouSheBiaoTiHei, YouSheBiaoTiHei; |
| | | margin-left: 29px; |
| | | padding: 16px 16px; |
| | | // margin-left: 29px; |
| | | // padding: 16px 16px; |
| | | width: 340px; |
| | | height: 400px; |
| | | height: 200px; |
| | | background: linear-gradient( |
| | | 270deg, |
| | | rgba(31, 62, 122, 0) 0%, |
| File was renamed from src/views/TaskManage/TaskLeft/TaskIndustry.vue |
| | |
| | | <!-- 业务统计 --> |
| | | <template> |
| | | <common-title title="行业统计" :style="{ marginLeft: pxToRem(14) }"></common-title> |
| | | <!-- <common-title title="行业统计" :style="{ marginLeft: pxToRem(14) }"></common-title> --> |
| | | <div class="task-industry"> |
| | | <div class="chart" ref="chartRef"></div> |
| | | </div> |
| | |
| | | <style lang="scss" scoped> |
| | | .task-industry { |
| | | font-family: YouSheBiaoTiHei, YouSheBiaoTiHei; |
| | | margin-left: 29px; |
| | | padding: 16px 16px; |
| | | // margin-left: 29px; |
| | | // padding: 16px 16px; |
| | | width: 340px; |
| | | height: 400px; |
| | | height: 200px; |
| | | background: linear-gradient( |
| | | 270deg, |
| | | rgba(31, 62, 122, 0) 0%, |
| File was renamed from src/views/TaskManage/TaskRight/TaskTime.vue |
| | |
| | | <!-- 任务事件统计 --> |
| | | <template> |
| | | <common-title title="任务时间统计"></common-title> |
| | | <!-- <common-title title="任务时间统计"></common-title> --> |
| | | <div class="task-time"> |
| | | <div class="chart" ref="chartRef"></div> |
| | | </div> |
| | |
| | | <style lang="scss" scoped> |
| | | .task-time { |
| | | font-family: YouSheBiaoTiHei, YouSheBiaoTiHei; |
| | | margin-left: 29px; |
| | | padding: 16px 16px; |
| | | // margin-left: 29px; |
| | | // padding: 16px 16px; |
| | | width: 340px; |
| | | height: 400px; |
| | | height: 200px; |
| | | background: linear-gradient( |
| | | 270deg, |
| | | rgba(31, 62, 122, 0) 0%, |
| File was renamed from src/views/TaskManage/TaskLeft/TaskLeft.vue |
| | |
| | | <div class="task-left"> |
| | | <TaskTotal /> |
| | | <TaskIndustry /> |
| | | <TaskTime /> |
| | | <TaskEvent /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import TaskTotal from './TaskTotal.vue'; |
| | | import TaskIndustry from './TaskIndustry.vue'; |
| | | import TaskTime from './TaskTime.vue'; |
| | | import TaskEvent from './TaskEvent.vue'; |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .task-left { |
| | | // width: 300px; |
| | | position: relative; |
| | | top: 20px; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | margin: 40px; |
| | | } |
| | | </style> |
| File was renamed from src/views/TaskManage/TaskLeft/TaskTotal.vue |
| | |
| | | <!-- 任务统计 --> |
| | | <template> |
| | | <common-title title="任务统计" :style="{ marginLeft: pxToRem(14) }"></common-title> |
| | | <!-- <common-title title="任务统计" :style="{ marginLeft: pxToRem(14) }"></common-title> --> |
| | | <div class="task-total"> |
| | | <div class="card" v-for="item in list"> |
| | | <div> |
| | |
| | | <style lang="scss" scoped> |
| | | .task-total { |
| | | font-family: YouSheBiaoTiHei, YouSheBiaoTiHei; |
| | | margin-left: 29px; |
| | | padding: 16px 16px; |
| | | // margin-left: 29px; |
| | | // padding: 16px 16px; |
| | | width: 340px; |
| | | height: 400px; |
| | | height: 200px; |
| | | left: 40px; |
| | | background: linear-gradient( |
| | | 270deg, |
| | | rgba(31, 62, 122, 0) 0%, |
| | |
| | | display: grid; |
| | | grid-template-columns: repeat(2, 1fr); |
| | | grid-template-rows: repeat(3, 1fr); |
| | | gap: 20px; |
| | | gap: 10px; |
| | | padding: 20px; |
| | | .card { |
| | | /* position: absolute; |
| | |
| | | <!-- 关联算法和综合业务 --> |
| | | <template> |
| | | <div class="task-algorithm" v-if="showAlgorithm"> |
| | | <el-select v-model="ai_type" multiple collapse-tags collapse-tags-tooltip placeholder="请选择算法" clearable @change="handleAlgorithmChange"> |
| | | <el-select v-model="ai_types" multiple collapse-tags collapse-tags-tooltip placeholder="请选择算法" clearable @change="handleAlgorithmChange"> |
| | | <el-option v-for="item in taskAlgorithm" :key="item.id" :label="item.dictValue" :value="item.dictKey" /> |
| | | </el-select> |
| | | </div> |
| | |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { getDictionary } from '@/api/home/common'; |
| | | |
| | | import { getMultipleDictionary } from '@/api/system/dictbiz' |
| | | |
| | | // 接收父组件传参 |
| | | const props = defineProps({ |
| | |
| | | }); |
| | | |
| | | // 算法 |
| | | let ai_type = ref(''); |
| | | let ai_types = ref(''); |
| | | let taskAlgorithm = ref([]); |
| | | // 综合业务 |
| | | let industry_type = ref(''); |
| | |
| | | |
| | | // 请求字典字段 |
| | | const requestDictionary = () => { |
| | | getDictionary('SF,HYLB').then((res) => { |
| | | getMultipleDictionary('SF,HYLB').then((res) => { |
| | | if (res.code !== 0) { |
| | | // 处理数据 |
| | | taskAlgorithm.value = res.data.data['SF']; |
| | |
| | | onMounted(() => { |
| | | requestDictionary(); |
| | | }); |
| | | </script> |
| | | </script> |