|
|
@@ -8,7 +8,7 @@ import ChartPf from "./Screen/ChartPf.vue"
|
|
|
import { useRouter } from "vue-router"
|
|
|
import Rs from "@/core/services/RequestService"
|
|
|
const router = useRouter()
|
|
|
-const themeClass="dark01"
|
|
|
+const themeClass = "dark01"
|
|
|
const title = "餐饮油烟在线监测平台"
|
|
|
const baseInfo = ref({
|
|
|
company: {
|
|
|
@@ -37,33 +37,32 @@ const today = ref({
|
|
|
week: "",
|
|
|
time: { hour: "00", minute: "00", second: "00" },
|
|
|
})
|
|
|
-const chartData = ref({ areaOverChartData: {chartData:{}} })
|
|
|
+const chartData = ref({ areaOverChartData: { chartData: {} } })
|
|
|
|
|
|
const theme = ref({
|
|
|
color: ["rgba(56, 164, 90, 0.9)", "rgba(19, 165, 165, 0.9)", "rgba(236, 90, 90, 0.9)", "rgba(223, 148, 83, 0.9)"],
|
|
|
- legend:
|
|
|
- {
|
|
|
+ legend: {
|
|
|
show: true,
|
|
|
- type: 'scroll',
|
|
|
- orient: 'vertical',
|
|
|
- x: '60%',
|
|
|
- y: 'center',
|
|
|
- icon:"circle",
|
|
|
+ type: "scroll",
|
|
|
+ orient: "vertical",
|
|
|
+ x: "60%",
|
|
|
+ y: "center",
|
|
|
+ icon: "circle",
|
|
|
itemWidth: 7,
|
|
|
itemHeight: 7,
|
|
|
textStyle: {
|
|
|
- fontSize: 18
|
|
|
+ fontSize: 18,
|
|
|
},
|
|
|
},
|
|
|
pieRadius: ["59%", "88%"],
|
|
|
pieCenter: ["30%", "50%"],
|
|
|
titleText: "净化设施数量",
|
|
|
- titleUnit:"家",
|
|
|
+ titleUnit: "家",
|
|
|
title: {
|
|
|
x: "29%",
|
|
|
y: "35%",
|
|
|
show: true,
|
|
|
- textAlign: 'center',
|
|
|
+ textAlign: "center",
|
|
|
textStyle: {
|
|
|
rich: {
|
|
|
title: {
|
|
|
@@ -86,12 +85,12 @@ const theme = ref({
|
|
|
},
|
|
|
},
|
|
|
})
|
|
|
-const theme2= computed( ()=> {
|
|
|
+const theme2 = computed(() => {
|
|
|
return Object.assign({}, theme.value, {
|
|
|
titleText: "监控仪数量",
|
|
|
pieCenter: ["30%", "54%"],
|
|
|
color: ["rgba(56, 164, 90, 0.8)", "rgba(236, 90, 90, 0.8)"],
|
|
|
- });
|
|
|
+ })
|
|
|
})
|
|
|
const barTheme = ref({
|
|
|
legend: {},
|
|
|
@@ -113,7 +112,7 @@ const barTheme = ref({
|
|
|
// params: {},
|
|
|
// })
|
|
|
|
|
|
-const getChartData2= computed( ()=> {
|
|
|
+const getChartData2 = computed(() => {
|
|
|
const data = {
|
|
|
chartData: {
|
|
|
title: "净化设施数量",
|
|
|
@@ -136,10 +135,10 @@ const getChartData2= computed( ()=> {
|
|
|
},
|
|
|
],
|
|
|
},
|
|
|
- };
|
|
|
- return data;
|
|
|
+ }
|
|
|
+ return data
|
|
|
})
|
|
|
-const getChartData3= computed( ()=> {
|
|
|
+const getChartData3 = computed(() => {
|
|
|
const data = {
|
|
|
chartData: {
|
|
|
title: "监控仪数量",
|
|
|
@@ -154,78 +153,76 @@ const getChartData3= computed( ()=> {
|
|
|
},
|
|
|
],
|
|
|
},
|
|
|
- };
|
|
|
- return data;
|
|
|
+ }
|
|
|
+ return data
|
|
|
})
|
|
|
|
|
|
-
|
|
|
-const companyPer=(val:number)=> {
|
|
|
+const companyPer = (val: number) => {
|
|
|
// if (!baseInfo.value.company.total) {
|
|
|
// return 50;
|
|
|
// }
|
|
|
// return (val * 100) / baseInfo.value.company.total;
|
|
|
- console.debug(val);
|
|
|
- return 50;
|
|
|
+ console.debug(val)
|
|
|
+ return 50
|
|
|
}
|
|
|
|
|
|
-const facilitiesPer=(val:number)=> {
|
|
|
+const facilitiesPer = (val: number) => {
|
|
|
// if (!baseInfo.value.facilities.total) {
|
|
|
// return 50;
|
|
|
// }
|
|
|
// return (val * 100) / baseInfo.value.facilities.total;
|
|
|
- console.debug(val);
|
|
|
- return 25;
|
|
|
+ console.debug(val)
|
|
|
+ return 25
|
|
|
}
|
|
|
|
|
|
-const monitorPer=(val:number) =>{
|
|
|
+const monitorPer = (val: number) => {
|
|
|
// if (!baseInfo.value.facilities.total) {
|
|
|
// return 50;
|
|
|
// }
|
|
|
// return (val * 100) / baseInfo.value.monitor.total
|
|
|
- console.debug(val);
|
|
|
- return 50;
|
|
|
+ console.debug(val)
|
|
|
+ return 50
|
|
|
}
|
|
|
|
|
|
-function jump(type:number) {
|
|
|
+function jump(type: number) {
|
|
|
switch (type) {
|
|
|
- case 0:
|
|
|
- router.push({
|
|
|
- path: "/",
|
|
|
- })
|
|
|
- break
|
|
|
+ case 0:
|
|
|
+ router.push({
|
|
|
+ path: "/",
|
|
|
+ })
|
|
|
+ break
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function initCurrentDateTime() {
|
|
|
- let date = new Date();
|
|
|
- today.value.date = `${date.getFullYear()}年${date.getMonth()}月${date.getDate()}日`;
|
|
|
- today.value.week = `星期${"日一二三四五六".charAt(date.getDay())}`;
|
|
|
+ let date = new Date()
|
|
|
+ today.value.date = `${date.getFullYear()}年${date.getMonth()}月${date.getDate()}日`
|
|
|
+ today.value.week = `星期${"日一二三四五六".charAt(date.getDay())}`
|
|
|
setInterval(() => {
|
|
|
- date = new Date();
|
|
|
- today.value.time.hour = (date.getHours() + "").padStart(2, "0");
|
|
|
- today.value.time.minute = (date.getMinutes() + "").padStart(2, "0");
|
|
|
- today.value.time.second = (date.getSeconds() + "").padStart(2, "0");
|
|
|
- }, 1000);
|
|
|
+ date = new Date()
|
|
|
+ today.value.time.hour = (date.getHours() + "").padStart(2, "0")
|
|
|
+ today.value.time.minute = (date.getMinutes() + "").padStart(2, "0")
|
|
|
+ today.value.time.second = (date.getSeconds() + "").padStart(2, "0")
|
|
|
+ }, 1000)
|
|
|
}
|
|
|
|
|
|
function getBaseInfo() {
|
|
|
- Rs.get("sys/dataBoard/selectBaseInfo").then(
|
|
|
- (res:any) => {
|
|
|
- const bsInfo = res.data;
|
|
|
- baseInfo.value.company.operate = bsInfo.operate_num;
|
|
|
- baseInfo.value.company.rest = bsInfo.company_num - bsInfo.operate_num;
|
|
|
- baseInfo.value.company.total = bsInfo.company_num;
|
|
|
- baseInfo.value.company.outlet = bsInfo.outlet_num;
|
|
|
- baseInfo.value.company.stove = bsInfo.stove_num;
|
|
|
- baseInfo.value.facilities.normal = bsInfo.facilities_normal;
|
|
|
- baseInfo.value.facilities.rest = bsInfo.facilities_rest;
|
|
|
- baseInfo.value.facilities.over = bsInfo.facilities_over;
|
|
|
- baseInfo.value.facilities.abnormal = bsInfo.facilities_abnormal;
|
|
|
- baseInfo.value.facilities.total = bsInfo.facilities;
|
|
|
- baseInfo.value.monitor.normal = bsInfo.monitor_normal;
|
|
|
- baseInfo.value.monitor.abnormal = bsInfo.monitor_abnormal;
|
|
|
- baseInfo.value.monitor.total = bsInfo.monitor_normal + bsInfo.monitor_abnormal;
|
|
|
- /*
|
|
|
+ Rs.get("sys/dataBoard/selectBaseInfo").then((res: any) => {
|
|
|
+ const bsInfo = res.data
|
|
|
+ baseInfo.value.company.operate = bsInfo.operate_num
|
|
|
+ baseInfo.value.company.rest = bsInfo.company_num - bsInfo.operate_num
|
|
|
+ baseInfo.value.company.total = bsInfo.company_num
|
|
|
+ baseInfo.value.company.outlet = bsInfo.outlet_num
|
|
|
+ baseInfo.value.company.stove = bsInfo.stove_num
|
|
|
+ baseInfo.value.facilities.normal = bsInfo.facilities_normal
|
|
|
+ baseInfo.value.facilities.rest = bsInfo.facilities_rest
|
|
|
+ baseInfo.value.facilities.over = bsInfo.facilities_over
|
|
|
+ baseInfo.value.facilities.abnormal = bsInfo.facilities_abnormal
|
|
|
+ baseInfo.value.facilities.total = bsInfo.facilities
|
|
|
+ baseInfo.value.monitor.normal = bsInfo.monitor_normal
|
|
|
+ baseInfo.value.monitor.abnormal = bsInfo.monitor_abnormal
|
|
|
+ baseInfo.value.monitor.total = bsInfo.monitor_normal + bsInfo.monitor_abnormal
|
|
|
+ /*
|
|
|
company_num: 3 公司商户
|
|
|
facilities: 105 净化设施
|
|
|
facilities_abnormal: 25 异常
|
|
|
@@ -238,19 +235,18 @@ function getBaseInfo() {
|
|
|
outlet_num: 4 排口
|
|
|
stove_num: 4 灶头
|
|
|
*/
|
|
|
- }
|
|
|
- );
|
|
|
+ })
|
|
|
}
|
|
|
|
|
|
-function getBarChart(type:number) {
|
|
|
- Rs.get("sys/dataBoard/selectOverdueByOrg?type="+type).then((res:any) => {
|
|
|
+function getBarChart(type: number) {
|
|
|
+ Rs.get("sys/dataBoard/selectOverdueByOrg?type=" + type).then((res: any) => {
|
|
|
chartData.value.areaOverChartData = {
|
|
|
chartData: res.data.chartData,
|
|
|
- };
|
|
|
- });
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
function fullScreen() {
|
|
|
- //全屏状态下刷新会退出全屏 F11全屏没有此bug
|
|
|
+ //全屏状态下刷新会退出全屏 F11全屏没有此bug
|
|
|
document.documentElement.requestFullscreen()
|
|
|
}
|
|
|
|
|
|
@@ -2898,7 +2894,7 @@ onMounted(() => {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
overflow: hidden;
|
|
|
- background: url("./media/screen/bg.png");
|
|
|
+ background: url("/media/screen/bg.png");
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
flex: 1;
|