hanzhengzheng/screenFront
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改危废品箱大屏

Browse Source
This commit is contained in:
hzz 2023-10-08 08:49:13 +08:00
parent 00f79619f9
commit 0c497a0b8f
2 changed files with 37 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/views/Hazardous/components/Card.vue
View File

@ -6,7 +6,8 @@
<div class="card-content" :class="{ noborder,'red-bg':prop.config.value>=prop.config.limit }">
<div v-if="prop.config.type == 1" class="type1">
<div class="img">
<img :src="prop.config.image">
<img :src="prop.config.image" v-if="prop.config.value<prop.config.limit">
<img :src="prop.config.image1" v-else>
</div>
<div class="text">
{{ prop.config.value }}{{ prop.config.unit }}
@ -18,7 +19,7 @@
</div>
<div class="text2">
<div class="text2-l " :class="[prop.config.value == 0?'grey':'green']"></div>
<div class="text2-r">{{ prop.config.value == 0?'关闭':'开启' }}</div>
<div class="text2-r" :class="[prop.config.value == 0?'grey':'green']">{{ prop.config.value == 0?'关闭':'开启' }}</div>
</div>
</div>
<div v-if="prop.config.type == 3" class="type3">
@ -94,7 +95,7 @@ const porptitle = computed(() => {
box-sizing: border-box;
}
.red-bg {
background-color: #2C273A;
background-color: rgba(228, 57, 97, 0.1411764705882353);
}
.noborder {
@ -160,6 +161,15 @@ const porptitle = computed(() => {
.text2-l.green {
background-color: #53FFC3;
}
.text2-r.grey {
color: #A7A6BD;
/* background-color: #A7A6BD; */
}
.text2-r.green {
color: #53FFC3;
/* background-color: #53FFC3; */
}
.text2-r {
font-size: 14px;
}

35
src/views/Hazardous/index.vue
View File

@ -40,21 +40,26 @@
<div class="box2">
<Border :title="'报警记录'">
<ZdScrollBoard ref="devList" :config="board_config" :style="{
width: '100%',
height: '100%',
}" />
width: '100%',
height: '100%',
}" v-show="!isempty" />
<div v-show="isempty"
style="display: flex; align-items: center;width: 100%;height: 100%;justify-content: center;">
<el-empty :image-size="120" />
</div>
</Border>
</div>
</div>
</div>
<HDialog :tableData="dialogdata" :title="DialogTitle" v-model:dialogTableVisible="dialogTableVisible" :dialogLoading="dialogLoading"
@getDialogdatafun="getDialogdatafun" :total="dialogtotal" :type="dialogType"></HDialog>
<HDialog :tableData="dialogdata" :title="DialogTitle" v-model:dialogTableVisible="dialogTableVisible"
:dialogLoading="dialogLoading" @getDialogdatafun="getDialogdatafun" :total="dialogtotal" :type="dialogType">
</HDialog>
</div>
</template>
<script setup lang='ts'>
import { ref, reactive, onMounted, onUnmounted,computed } from 'vue';
import { ref, reactive, onMounted, onUnmounted, computed } from 'vue';
import header2 from '@/components/headerBox/header2.vue'
@ -64,7 +69,8 @@ import LineChart from './components/LineChart.vue';
import ZdScrollBoard from "@/components/data-view/index.vue";
import HDialog from './components/HDialog.vue';
import { getGuoJian24Trend, getAirWind,getGuoJianAlarmRecord } from '@/http/guojian/index'
import { getGuoJian24Trend, getAirWind, getGuoJianAlarmRecord } from '@/http/guojian/index'
import { update } from '@tweenjs/tween.js';
let timer = null
let titleTip = [
@ -88,7 +94,7 @@ const config = reactive({
type: 1,
classArr: [],
value: 0,
limit: 70,
limit: 80,
unit: '%RH'
},
wendu: {
@ -97,7 +103,7 @@ const config = reactive({
type: 1,
classArr: [],
value: 0,
limit: 30,
limit: 40,
unit: '℃'
},
kongtiao: {
@ -153,6 +159,7 @@ const calc = reactive({
xAxis: [],
})
let devList = ref()
let isempty = ref(false)
let board_config = reactive({
header: ['报警时间', '名称', '状态', '持续时长'],
headerBGC: '#081B56',
@ -230,7 +237,7 @@ let DialogTitle = computed(() => {
});
function showDialog(type) {
if (dialogTableVisible.value == false) {
dialogType.value = type;
dialogType.value = type;
getDialogdatafun({
type: type,
pageSize: 10,
@ -269,7 +276,12 @@ async function getGuoJianAlarmRecordList() {
items.sum + '分钟',
]
})
devList.value.updateRows(updateList,board_config)
if (updateList.length == 0) {
isempty.value = true
} else {
isempty.value = false
}
devList.value.updateRows(updateList, board_config)
}
}
onMounted((() => {
@ -277,6 +289,7 @@ onMounted((() => {
getGuoJianAlarmRecordList()
timer = setInterval(() => {
getGuoJian24TrendData()
getGuoJianAlarmRecordList()
}, 1000 * 60)
}))