Bladeren bron

样式修改

SunZehao 6 dagen geleden
bovenliggende
commit
44666dfc8e

+ 3 - 2
src/views/IntegratedAlarm/earlyWarning/index.vue

@@ -66,8 +66,8 @@
       <el-table
         size="mini"
         :data="tableData"
-        height="calc(100% - 55px)"
-        style="width: 100%;calc(100% - 55px)"
+        height="calc(100% - 110px)"
+        style="width: 100%;"
         @selection-change="handleSelectionChange"
         stripe
         border
@@ -342,6 +342,7 @@ export default {
   },
 
   created() {
+    
     this.init();
   },
 

+ 15 - 2
src/views/IntegratedAlarm/reliability/customAnalyse/index.vue

@@ -150,8 +150,7 @@
       <!--     @cell-click="handle" -->
       <el-table
         :data="state.tableData"
-        height="calc(100% - 30px)"
-        style="height: calc(100% - 30px)"
+        :style="isFullScreen ? 'height: 75vh' : 'height: 85vh'"
         stripe
         @sort-change="handleSortChange"
       >
@@ -292,7 +291,21 @@ import {
   getWpList,
 } from "@/api/zhbj/index.js";
 import dayjs from "dayjs";
+const isFullScreen = ref(false)
 onMounted(() => {
+const clientHeight =
+        document.documentElement.clientHeight || document.body.clientHeight;
+        if (clientHeight === 1080) {
+        isFullScreen.value = true;
+        } else {
+        isFullScreen.value = false;
+        }
+ window.onresize = () => {
+            const clientHeight =
+                document.documentElement.clientHeight || document.body.clientHeight;
+            isFullScreen.value = window.screen.height == clientHeight;
+            };
+
   getWpArray();
   getequipmentmodel_list();
   getfetchRelatePart();

+ 17 - 2
src/views/IntegratedAlarm/reliability/historyAnalyse/index.vue

@@ -159,8 +159,7 @@
       <el-table
         :data="state.tableData"
         stripe
-        height="calc(100% - 50px)"
-        style="height: calc(100% - 50px)"
+        :style="isFullScreen ? 'height: 75vh' : 'height: 85vh'"
         @sort-change="handleSortChange"
       >
         <el-table-column
@@ -321,7 +320,22 @@ import {
   getWpList,
 } from "@/api/zhbj/index.js";
 import dayjs from "dayjs";
+
+const isFullScreen = ref(false)
 onMounted(() => {
+const clientHeight =
+        document.documentElement.clientHeight || document.body.clientHeight;
+        if (clientHeight === 1080) {
+        isFullScreen.value = true;
+        } else {
+        isFullScreen.value = false;
+        }
+ window.onresize = () => {
+            const clientHeight =
+                document.documentElement.clientHeight || document.body.clientHeight;
+            isFullScreen.value = window.screen.height == clientHeight;
+            };
+
   getWpArray();
   getequipmentmodel_list();
   getfetchRelatePart();
@@ -332,6 +346,7 @@ const store = useStore();
 const changZhanArray = ref([]);
 const windName = ref([]);
 
+
 const query = reactive({
   page: 1,
   limit: 10,

+ 18 - 1
src/views/IntegratedAlarm/safe/customWarning/index.vue

@@ -180,7 +180,8 @@
         size="mini"
         :data="state.tableData"
         class="warpperTable"
-        style="width: 100%; height: calc(100% - 35px - 55px)"
+        style="width: 100%;"
+        :style="isFullScreen ? 'height: 72vh' : 'height: 85vh'"
         stripe
       >
         <template v-if="state.isshowwindturbineName">
@@ -337,7 +338,22 @@ const pageTitle = "预警查询";
 const store = useStore();
 const route = useRoute();
 
+const isFullScreen = ref(false)
+
 onMounted(() => {
+    const clientHeight =
+        document.documentElement.clientHeight || document.body.clientHeight;
+        if (clientHeight === 1080) {
+        isFullScreen.value = true;
+        } else {
+        isFullScreen.value = false;
+        }
+ window.onresize = () => {
+            const clientHeight =
+                document.documentElement.clientHeight || document.body.clientHeight;
+            isFullScreen.value = window.screen.height == clientHeight;
+            };
+
   state.dateTime = [
     dayjs().startOf("day").format("YYYY-MM-DD HH:mm:ss"),
     dayjs().format("YYYY-MM-DD HH:mm:ss"),
@@ -355,6 +371,7 @@ onMounted(() => {
   getAlarmHistoryt();
 });
 
+
 // 机型
 const getequipmentmodel_list = async () => {
   const { data } = await fetchModel();

+ 17 - 1
src/views/IntegratedAlarm/safe/historyWarning/index.vue

@@ -176,7 +176,8 @@
         size="mini"
         :data="state.tableData"
         class="warpperTable"
-        style="width: 100%; height: calc(100% - 35px - 55px)"
+        style="width: 100%;"
+        :style="isFullScreen ? 'height: 72vh' : 'height: 85vh'"
         stripe
       >
         <template v-if="state.isshowwindturbineName">
@@ -344,7 +345,22 @@ const getComponentsName = (components) => {
   return listItem?.name || "";
 };
 
+const isFullScreen = ref(false)
+
 onMounted(() => {
+const clientHeight =
+        document.documentElement.clientHeight || document.body.clientHeight;
+        if (clientHeight === 1080) {
+        isFullScreen.value = true;
+        } else {
+        isFullScreen.value = false;
+        }
+ window.onresize = () => {
+            const clientHeight =
+                document.documentElement.clientHeight || document.body.clientHeight;
+            isFullScreen.value = window.screen.height == clientHeight;
+            };
+
   state.dateTime = [
     dayjs().startOf("day").format("YYYY-MM-DD HH:mm:ss"),
     dayjs().format("YYYY-MM-DD HH:mm:ss"),

+ 35 - 6
src/views/IntegratedAlarm/safe/realWarning/index.vue

@@ -2,14 +2,14 @@
   <div class="safe">
     <div class="bottomCard">
       <div class="cardLine">
-        <div class="lineItem card">
+        <div class="lineItem card" :style="isFullScreen ? 'height: 45vh' : 'height: 47vh'">
           <Safecom
             title="风机报警"
             deviceType="windturbine"
             alarmType="windturbine"
           />
         </div>
-        <div class="lineItem card">
+        <div class="lineItem card" :style="isFullScreen ? 'height: 45vh' : 'height: 47vh'">
           <Safecom
             title="风机预警"
             deviceType="windturbine"
@@ -38,7 +38,7 @@
         </div> -->
       </div>
       <div class="cardLine">
-        <div class="lineItem card" style="height: 100%">
+        <div class="lineItem card"  :style="isFullScreen ? 'height: 90vh' : 'height: 95vh'">
           <Safecom
             title="升压站报警"
             deviceType="booststation"
@@ -56,9 +56,37 @@
     </div>
   </div>
 </template>
-<script setup>
+<script>
 import dayjs from "dayjs";
 import Safecom from "@/views/IntegratedAlarm/safe/components/safecomponent.vue";
+export default {
+    data() {
+        return {
+            isFullScreen: false
+        }
+    },
+    components: {
+        Safecom
+    },
+    created() {
+        const clientHeight =
+        document.documentElement.clientHeight || document.body.clientHeight;
+        if (clientHeight === 1080) {
+        this.isFullScreen = true;
+        } else {
+        this.isFullScreen = false;
+        }
+    },
+    mounted() {
+        window.onresize = () => {
+        const clientHeight =
+            document.documentElement.clientHeight || document.body.clientHeight;
+        this.isFullScreen = window.screen.height == clientHeight;
+        };
+
+        console.log("isFullScreen=====>>>>", this.isFullScreen)
+    }
+}
 </script>
 
 <style lang="less" scoped>
@@ -76,10 +104,11 @@ import Safecom from "@/views/IntegratedAlarm/safe/components/safecomponent.vue";
     .cardLine {
       // width: calc(100% / 3 - 15px);
       width: calc(100% / 2 - 15px);
-      height: 100%;
+    //   height: 100%;
+      height: 95vh;
       display: flex;
       flex-direction: column;
-      justify-content: space-between;
+    //   justify-content: space-between;
       align-items: center;
       .lineItem {
         width: 100%;

+ 1 - 1
src/views/IntegratedAlarm/yhjyReport/index.vue

@@ -733,7 +733,7 @@
 
 <style lang="less" scoped>
     .optimizationSuggestions {
-        height: 100%;
+        height: 96%;
         display: flex;
         flex-direction: column;
         justify-content: flex-start;