|
|
@ -77,7 +77,10 @@ |
|
|
<div class="waringList"> |
|
|
<div class="waringList"> |
|
|
<div class="item" v-for="(item, index) in waringData" :key="index"> |
|
|
<div class="item" v-for="(item, index) in waringData" :key="index"> |
|
|
<div class="name"> |
|
|
<div class="name"> |
|
|
|
|
|
<div class="title"> |
|
|
|
|
|
<svg-icon icon-class="alarm" v-if="audioType === true && item.alertSwitch === '1'" /> |
|
|
<span>{{ item.deviceName }}</span> |
|
|
<span>{{ item.deviceName }}</span> |
|
|
|
|
|
</div> |
|
|
<span class="time">{{ item.alertTime }}</span> |
|
|
<span class="time">{{ item.alertTime }}</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="info"> |
|
|
<div class="info"> |
|
|
@ -114,6 +117,13 @@ |
|
|
</el-table-column> |
|
|
</el-table-column> |
|
|
<el-table-column fixed="right" label="操作" align="center"> |
|
|
<el-table-column fixed="right" label="操作" align="center"> |
|
|
<template #default="scope"> |
|
|
<template #default="scope"> |
|
|
|
|
|
<el-switch |
|
|
|
|
|
v-model="scope.row.alertSwitchBoolean" |
|
|
|
|
|
inline-prompt |
|
|
|
|
|
active-text="开" |
|
|
|
|
|
inactive-text="关" |
|
|
|
|
|
@change="alarrmChange($event, scope.row)" |
|
|
|
|
|
/> |
|
|
<el-button class="confirm" type="info" size="small" @click="waringConfirm(scope.row)">确认</el-button> |
|
|
<el-button class="confirm" type="info" size="small" @click="waringConfirm(scope.row)">确认</el-button> |
|
|
</template> |
|
|
</template> |
|
|
</el-table-column> |
|
|
</el-table-column> |
|
|
@ -132,19 +142,24 @@ |
|
|
</div> |
|
|
</div> |
|
|
</n-card> |
|
|
</n-card> |
|
|
</n-modal> |
|
|
</n-modal> |
|
|
|
|
|
<div class="alarm"> |
|
|
|
|
|
<audio loop autoplay muted ref="alarmRef" ebkit-playsinline="true" playsinline="true" :src="audioUrl"></audio> |
|
|
|
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
<script lang="ts" setup> |
|
|
<script setup> |
|
|
import { useRoute, useRouter } from 'vue-router'; |
|
|
import { useRoute, useRouter } from 'vue-router'; |
|
|
import { useUserStore } from '@/store/modules/user'; |
|
|
import { useUserStore } from '@/store/modules/user'; |
|
|
import { getWeather } from '@/api/user/index'; |
|
|
import { getWeather } from '@/api/user/index'; |
|
|
import { getWarList, process } from '@/api/waring/index'; |
|
|
import { getWarList, process, setAlarm } from '@/api/waring/index'; |
|
|
import { waringVo } from '@/api/waring/types'; |
|
|
// import { waringVo } from '@/api/waring/types'; |
|
|
import { Filter, Maximize, Settings, Power, Bell, ChartLine } from '@vicons/tabler'; |
|
|
import { Filter, Maximize, Settings, Power, Bell, ChartLine } from '@vicons/tabler'; |
|
|
import { CloseCircleOutline, ReturnDownBack } from '@vicons/ionicons5'; |
|
|
import { CloseCircleOutline, ReturnDownBack } from '@vicons/ionicons5'; |
|
|
import { useDateFormat, useNow } from '@vueuse/core'; |
|
|
import { useDateFormat, useNow } from '@vueuse/core'; |
|
|
import { uniqueArrayObject } from '@/utils/index'; |
|
|
// import { uniqueArrayObject } from '@/utils/index'; |
|
|
|
|
|
import canAutoPlay from 'can-autoplay'; |
|
|
import mitt from '@/plugins/bus'; |
|
|
import mitt from '@/plugins/bus'; |
|
|
import calendar from '@/utils/lunar'; |
|
|
import calendar from '@/utils/lunar'; |
|
|
|
|
|
import audioUrl from '@/assets/media/alarm.mp3'; |
|
|
|
|
|
|
|
|
const userStore = useUserStore(); |
|
|
const userStore = useUserStore(); |
|
|
const hoursNow = useNow().value.getHours(); |
|
|
const hoursNow = useNow().value.getHours(); |
|
|
@ -157,8 +172,10 @@ const timer = ref(); |
|
|
const isCurrentRoute = ref(true); |
|
|
const isCurrentRoute = ref(true); |
|
|
const waringDrawer = ref(false); |
|
|
const waringDrawer = ref(false); |
|
|
const waringModal = ref(false); |
|
|
const waringModal = ref(false); |
|
|
const waringData = ref<waringVo[]>([]); |
|
|
// const waringData = ref<waringVo[]>([]); |
|
|
const waringList = ref<waringVo[]>([]); |
|
|
// const waringList = ref<waringVo[]>([]); |
|
|
|
|
|
const waringData = ref([]); |
|
|
|
|
|
const waringList = ref([]); |
|
|
const routerType = ref(''); |
|
|
const routerType = ref(''); |
|
|
const deptId = ref(0); |
|
|
const deptId = ref(0); |
|
|
const params = reactive({ |
|
|
const params = reactive({ |
|
|
@ -167,9 +184,12 @@ const params = reactive({ |
|
|
pageNum: 1 |
|
|
pageNum: 1 |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
const alarmRef = ref(); |
|
|
|
|
|
const audioType = ref(false); |
|
|
|
|
|
|
|
|
const weatherData = ref({ city: '', weather: '', temperature: '', weatherImg: '' }); |
|
|
const weatherData = ref({ city: '', weather: '', temperature: '', weatherImg: '' }); |
|
|
|
|
|
|
|
|
const lunarDay: any = calendar.solarToLunar( |
|
|
const lunarDay = calendar.solarToLunar( |
|
|
useNow().value.getUTCFullYear(), |
|
|
useNow().value.getUTCFullYear(), |
|
|
useNow().value.getUTCMonth() + 1, |
|
|
useNow().value.getUTCMonth() + 1, |
|
|
useNow().value.getUTCDate() |
|
|
useNow().value.getUTCDate() |
|
|
@ -211,10 +231,41 @@ const timePeriod = computed(() => { |
|
|
} |
|
|
} |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
mitt.on('waringMessage', (res: any) => { |
|
|
mitt.on('waringMessage', res => { |
|
|
//监听报警信息 |
|
|
//监听报警信息 |
|
|
console.log('waringMessage--', res.data); |
|
|
console.log('waringMessage--', res.data); |
|
|
waringData.value = res.data; |
|
|
waringData.value = res.data; |
|
|
|
|
|
res.data.map(item => { |
|
|
|
|
|
// console.log(item.deviceName, item.alertSwitch); |
|
|
|
|
|
if (item.alertSwitch === '1') { |
|
|
|
|
|
canAutoPlay.audio().then(({ result }) => { |
|
|
|
|
|
if (result === true) { |
|
|
|
|
|
audioType.value = true; |
|
|
|
|
|
alarmRef.value.play(); |
|
|
|
|
|
alarmRef.value.muted = false; |
|
|
|
|
|
} else { |
|
|
|
|
|
ElMessageBox.alert('检测到您的浏览器不支持媒体自动播放，是否同意播放测试音?', '提示', { |
|
|
|
|
|
// if you want to disable its autofocus |
|
|
|
|
|
// autofocus: false, |
|
|
|
|
|
showclose: false, |
|
|
|
|
|
confirmButtonText: '同意', |
|
|
|
|
|
callback: action => { |
|
|
|
|
|
audioType.value = true; |
|
|
|
|
|
alarmRef.value.play(); |
|
|
|
|
|
alarmRef.value.muted = false; |
|
|
|
|
|
} |
|
|
|
|
|
}); |
|
|
|
|
|
// this.$alert('检测到您的浏览器不支持媒体自动播放，是否同意播放测试音', '提示', { |
|
|
|
|
|
// confirmButtonText: '确定', |
|
|
|
|
|
// callback: action => { |
|
|
|
|
|
// alarmRef.value.play(); |
|
|
|
|
|
// } |
|
|
|
|
|
// }); |
|
|
|
|
|
} |
|
|
|
|
|
}); |
|
|
|
|
|
return; |
|
|
|
|
|
} |
|
|
|
|
|
}); |
|
|
// waringData.value.push(res.data) |
|
|
// waringData.value.push(res.data) |
|
|
// console.log("waringData--", waringData.value); |
|
|
// console.log("waringData--", waringData.value); |
|
|
// waringData.value = uniqueArrayObject(waringData.value, "id") |
|
|
// waringData.value = uniqueArrayObject(waringData.value, "id") |
|
|
@ -257,7 +308,7 @@ function lineClick() { |
|
|
}); |
|
|
}); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
function handleCurrentChange(val: any) { |
|
|
function handleCurrentChange(val) { |
|
|
//点击分页 |
|
|
//点击分页 |
|
|
params.pageNum = val; |
|
|
params.pageNum = val; |
|
|
getwaringList(); |
|
|
getwaringList(); |
|
|
@ -265,7 +316,7 @@ function handleCurrentChange(val: any) { |
|
|
|
|
|
|
|
|
function getWeatherData() { |
|
|
function getWeatherData() { |
|
|
//获取天气 |
|
|
//获取天气 |
|
|
getWeather().then((res: any) => { |
|
|
getWeather().then(res => { |
|
|
if (res.code === 200) { |
|
|
if (res.code === 200) { |
|
|
if (isCurrentRoute.value) { |
|
|
if (isCurrentRoute.value) { |
|
|
timer.value = setTimeout(async () => { |
|
|
timer.value = setTimeout(async () => { |
|
|
@ -294,7 +345,7 @@ function getwaringList() { |
|
|
orgCode: sessionStorage.getItem('deptId') === null ? 0 : Number(sessionStorage.getItem('deptId')), |
|
|
orgCode: sessionStorage.getItem('deptId') === null ? 0 : Number(sessionStorage.getItem('deptId')), |
|
|
params |
|
|
params |
|
|
}; |
|
|
}; |
|
|
getWarList(paramsr).then((res: any) => { |
|
|
getWarList(paramsr).then(res => { |
|
|
if (res.code === 200) { |
|
|
if (res.code === 200) { |
|
|
waringList.value = res.rows; |
|
|
waringList.value = res.rows; |
|
|
params.total = res.total; |
|
|
params.total = res.total; |
|
|
@ -303,7 +354,23 @@ function getwaringList() { |
|
|
} |
|
|
} |
|
|
}); |
|
|
}); |
|
|
} |
|
|
} |
|
|
function waringConfirm(item: any) { |
|
|
function alarrmChange(val, row) { |
|
|
|
|
|
//关闭报警 |
|
|
|
|
|
const paramsr = { |
|
|
|
|
|
id: row.id, |
|
|
|
|
|
flag: val === true ? '1' : '0' |
|
|
|
|
|
}; |
|
|
|
|
|
setAlarm(paramsr).then(res => { |
|
|
|
|
|
if (res.code === 200) { |
|
|
|
|
|
if (val === false) { |
|
|
|
|
|
audioType.value = false; |
|
|
|
|
|
alarmRef.value.pause(); |
|
|
|
|
|
alarmRef.value.muted = true; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
}); |
|
|
|
|
|
} |
|
|
|
|
|
function waringConfirm(item) { |
|
|
//报警确认 |
|
|
//报警确认 |
|
|
ElMessageBox.confirm('是否确认操作?', '提示', { |
|
|
ElMessageBox.confirm('是否确认操作?', '提示', { |
|
|
confirmButtonText: '确认', |
|
|
confirmButtonText: '确认', |
|
|
@ -312,7 +379,7 @@ function waringConfirm(item: any) { |
|
|
}) |
|
|
}) |
|
|
.then(() => { |
|
|
.then(() => { |
|
|
const params = item.id; |
|
|
const params = item.id; |
|
|
process(params).then((res: any) => { |
|
|
process(params).then(res => { |
|
|
if (res.code === 200) { |
|
|
if (res.code === 200) { |
|
|
waringList.value = res.data; |
|
|
waringList.value = res.data; |
|
|
// waringDrawer.value = false |
|
|
// waringDrawer.value = false |
|
|
|
fuguobin
11 months ago
