From 18e4df43f79f51539474b2918544a9d2d4c5c4e0 Mon Sep 17 00:00:00 2001 From: wangfei <3597712270@qq.com> Date: 星期三, 13 十一月 2024 15:43:52 +0800 Subject: [PATCH] 前端页面适配 --- UI-Project/src/views/largescreen/largescreen.vue | 69 ++++++++++++++++++---------------- 1 files changed, 37 insertions(+), 32 deletions(-) diff --git a/UI-Project/src/views/largescreen/largescreen.vue b/UI-Project/src/views/largescreen/largescreen.vue index 024ff7a..3f105fa 100644 --- a/UI-Project/src/views/largescreen/largescreen.vue +++ b/UI-Project/src/views/largescreen/largescreen.vue @@ -1,15 +1,16 @@ -<template> - <el-card style="flex: 1;margin-left: 1px;margin-top: 10px;margin-right: 1px;" v-loading="loading"> - <el-scrollbar height="800px"> - <div style="font-size: 20px;font-weight: bold;">{{ $t('large.loading') }}{{ temperingtotal }} </div> - <div id="top" style="height: 150px;display: flex; justify-content: center; align-items: center;"> - <div class="echarts-container"> - <div v-for="(processData, index) in processesData" :key="index" class="echarts-item" @click="showDialog"> - <div :id="'pieChart_' + index" class="pie-chart"></div> - </div> -</div> -</div> -<div style="display: flex;"> +<template> + <div style="height: 500px;"> + <el-card style="flex: 1;margin-left: 1px;margin-top: 10px;margin-right: 1px;" v-loading="loading"> + <el-scrollbar height="800px"> + <div style="font-size: 20px;font-weight: bold;">{{ $t('large.loading') }}{{ temperingtotal }}</div> + <div id="top" style="height: 150px;display: flex; justify-content: center; align-items: center;"> + <div class="echarts-container"> + <div v-for="(processData, index) in processesData" :key="index" class="echarts-item" @click="showDialog"> + <div :id="'pieChart_' + index" class="pie-chart"></div> + </div> + </div> + </div> + <div style="display: flex;"> <div class="parter" style="margin-top: 10px;margin-left: 150px; height: 240px;width: 1000px;"> <img src="../../assets/dpxsa.png" style="margin-left: -10px; width: 100%;height: 100%;" alt="Your Image"> <div class="moving-rect lipiana" v-show="woshia"></div> @@ -104,33 +105,37 @@ </template> </el-dialog> <el-dialog v-model="blind" top="10vh" width="70%" > - <el-date-picker style="margin-left: 1px;" v-model="timeRange" type="daterange" format="YYYY/MM/DD" value-format="YYYY-MM-DD" - :start-placeholder="$t('large.starttime')" :end-placeholder="$t('large.endtime')" :default-time="defaultTime" /> - <el-button type="primary" style="margin-left: 10px;margin-top: -6px;" @click="selectReportData()">{{ $t('large.inquire') }}</el-button> - <div style="height: 550px;display: flex;margin-top: 10px;justify-content: center; align-items: center;"> - <div class="echarts-container"> - <div v-for="(processData, index) in dialogprocesses" :key="index" class="echarts-item"> - <div :id="'dialogPieChart_' + index" class="pie-chart"></div> + <el-date-picker style="margin-left: 1px;" v-model="timeRange" type="daterange" format="YYYY/MM/DD" value-format="YYYY-MM-DD" + :start-placeholder="$t('large.starttime')" :end-placeholder="$t('large.endtime')" + :default-time="defaultTime"/> + <el-button type="primary" style="margin-left: 10px;margin-top: -6px;" @click="selectReportData()"> + {{ $t('large.inquire') }} + </el-button> + <div style="height: 550px;display: flex;margin-top: 10px;justify-content: center; align-items: center;"> + <div class="echarts-container"> + <div v-for="(processData, index) in dialogprocesses" :key="index" class="echarts-item"> + <div :id="'dialogPieChart_' + index" class="pie-chart"></div> + </div> + </div> </div> +</el-dialog> </div> - </div> - </el-dialog> -</template> -<script setup> -import { Delete, Upload } from '@element-plus/icons-vue' -import { ElMessage, ElMessageBox } from 'element-plus' -import { ref, onMounted , onBeforeUnmount, reactive, computed, shallowRef, onUnmounted, watchEffect,nextTick } from "vue"; +</template> +<script setup> +import {ElMessage} from 'element-plus' +import {nextTick, onBeforeUnmount, onMounted, onUnmounted, ref} from "vue"; import request from "@/utils/request" -import { WebSocketHost ,host} from '@/utils/constants' -import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService'; -import { useI18n } from 'vue-i18n' -const { t } = useI18n() +import {host, WebSocketHost} from '@/utils/constants' +import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService'; +import {useI18n} from 'vue-i18n' import * as echarts from 'echarts'; + +const {t} = useI18n() const tableData = ref([]) const tableDatab = ref([]) const tableDatac = ref([]) -const adjustedRects = ref([]); -const chartRefs = ref([]); +const adjustedRects = ref([]); +const chartRefs = ref([]); const timeRange = ref([]) const flake = ref(false) const flakeb = ref(false) -- Gitblit v1.8.0