admin/smart-village-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

数据大屏

Browse Source
This commit is contained in:
jiayu 2025-05-28 16:53:52 +08:00
parent 5955e02a77
commit 7b6ef37fe2
10 changed files with 108 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.env.development
View File

@ -1,5 +1,6 @@
NODE_ENV=development
VITE_APP_TITLE='数字乡村云平台'
VITE_APP_API_URL='http://192.168.34.155:1024'
# VITE_APP_API_URL='http://192.168.34.155:1024'
VITE_APP_API_URL='http://jxjzw.zhgdyun.com:10248/village'
# VITE_APP_API_URL='http://jxjzw.zhgdyun.com:11026'
VITE_MQTT_URL='ws://jxj.zhgdyun.com:8083/mqtt'

3
.env.production
View File

@ -1,4 +1,5 @@
NODE_ENV=production
VITE_APP_TITLE='数字乡村云平台'
VITE_APP_API_URL='http://jxjzw.zhgdyun.com:11026'
# VITE_APP_API_URL='http://jxjzw.zhgdyun.com:11026'
VITE_APP_API_URL='http://jxjzw.zhgdyun.com:10248/village'
VITE_MQTT_URL='ws://jxj.zhgdyun.com:8083/mqtt'

17
src/views/business/bigdata/components/alarm-info.vue
View File

@ -300,14 +300,21 @@
alarmTabValue.value = value;
};
const initHeight = () => {
let height = document.querySelector('.bigdata-right').clientHeight;
let height1 = document.querySelector('.bigdata-right-1').clientHeight;
let height3 = document.querySelector('.bigdata-right-3').clientHeight;
let otherHeight = 76;
let gapHeight = 40;
contentMaxHeight.value = `${height - otherHeight - gapHeight - height1 - height3}px`;
};
onMounted(async () => {
await getTableList();
await queryConfigPage();
nextTick(() => {
let height = document.querySelector('.bigdata-right-2').clientHeight;
let otherHeight = 76;
contentMaxHeight.value = `${height - otherHeight}px`;
});
initHeight();
window.addEventListener('resize', initHeight);
});
const handleEdit = () => {
alarmInfoDialogRef.value.showModal(isEdit.value ? alarmInfoData.value : null);

10
src/views/business/bigdata/components/bigdata-left.vue
View File

@ -21,15 +21,21 @@
const left1Height = ref();
const left2Height = ref();
const left3Height = ref();
onMounted(() => {
const initHeight = () => {
let height = document.documentElement.clientHeight;
let topHeight = 170;
let bottomHeight = 30;
contentHeight.value = height - topHeight - bottomHeight;
left1Height.value = Number(contentHeight.value * 0.3189).toFixed(2);
left2Height.value = Number(contentHeight.value * 0.2054).toFixed(2);
left3Height.value = Number(contentHeight.value * 0.4245).toFixed(2);
};
onMounted(() => {
initHeight();
window.addEventListener('resize', initHeight);
});
</script>

12
src/views/business/bigdata/components/bigdata-right.vue
View File

@ -3,7 +3,7 @@
<div class="bigdata-right-1" style="width: 100%" :style="{ height: left1Height + 'px', minHeight: '250px' }">
<Weather />
</div>
<div class="bigdata-right-2" style="width: 100%" :style="{ height: left2Height + 'px'}">
<div class="bigdata-right-2" style="width: 100%" :style="{ height: left2Height + 'px' }">
<AlarmInfo />
</div>
<div class="bigdata-right-3" style="width: 100%" :style="{ height: left3Height + 'px', minHeight: '180px' }">
@ -21,7 +21,8 @@
const left1Height = ref();
const left2Height = ref();
const left3Height = ref();
onMounted(() => {
const initHeight = () => {
let height = document.documentElement.clientHeight;
let topHeight = 170;
let bottomHeight = 30;
@ -30,6 +31,13 @@
left1Height.value = Number(contentHeight.value * 0.3189).toFixed(2);
left2Height.value = Number(contentHeight.value * 0.4245).toFixed(2);
left3Height.value = Number(contentHeight.value * 0.2054).toFixed(2);
console.log(left1Height.value, left2Height.value, left3Height.value);
};
onMounted(() => {
initHeight();
window.addEventListener('resize', initHeight);
});
</script>

16
src/views/business/bigdata/components/party-member.vue
View File

@ -104,14 +104,20 @@
}
};
const initHeight = () => {
let height = document.querySelector('.bigdata-left').clientHeight;
let height1 = document.querySelector('.bigdata-left-1').clientHeight;
let height2 = document.querySelector('.bigdata-left-2').clientHeight;
let otherHeight = 76;
let gapHeight = 40;
contentMaxHeight.value = `${height - otherHeight - height1 - height2 - gapHeight}px`;
};
onMounted(async () => {
// await getPartyMember();
await queryConfigPage();
nextTick(() => {
let height = document.querySelector('.bigdata-left-3').clientHeight;
let otherHeight = 76;
contentMaxHeight.value = `${height - otherHeight}px`;
});
initHeight();
window.addEventListener('resize', initHeight);
});
const handleEdit = () => {
partyMemberDialogRef.value.showModal(isEdit.value ? partyMemberData.value : null);

11
src/views/business/bigdata/components/village-info-small.vue
View File

@ -56,11 +56,18 @@
const res = await bigdataApi.queryVillage();
villageInfo.value = res.data;
};
onMounted(async () => {
await getVillageInfo();
const initHeight = () => {
let height = document.querySelector('.bigdata-left-1').clientHeight;
let otherHeight = 76;
contentMaxHeight.value = `${height - otherHeight}px`;
};
onMounted(async () => {
await getVillageInfo();
initHeight();
window.addEventListener('resize', initHeight);
});
const handleEdit = () => {
villageInfoDialogRef.value.showModal(villageInfo.value);

11
src/views/business/bigdata/components/village-info.vue
View File

@ -68,14 +68,21 @@
villageInfo.value = res.data;
villageInfo.value.villageImageList = villageInfo.value?.imageUrl?.split(',') || [];
};
onMounted(async () => {
await getVillageInfo();
const initHeight = () => {
let height = document.documentElement.clientHeight;
let topHeight = 170;
let bottomHeight = 30;
let otherHeight = 76;
contentHeight.value = `${height - topHeight - bottomHeight}px`;
contentMaxHeight.value = `${height - topHeight - bottomHeight - otherHeight}px`;
};
onMounted(async () => {
await getVillageInfo();
initHeight();
window.addEventListener('resize', initHeight);
});
const handleEdit = () => {
villageInfoDialogRef.value.showModal(villageInfo.value);

40
src/views/business/bigdata/components/village-news.vue
View File

@ -2,7 +2,17 @@
<div class="bigdata-village-news">
<BCard title="乡村新闻" :isEdit="false" style="height: 100%">
<div class="info-content" :style="{ maxHeight: contentMaxHeight }">
<a-carousel :autoplay="true">
<a-carousel :autoplay="true" :dots="false" arrows>
<template #prevArrow>
<div class="custom-slick-arrow" style="left: 10px; z-index: 1">
<left-circle-outlined />
</div>
</template>
<template #nextArrow>
<div class="custom-slick-arrow" style="right: 10px">
<right-circle-outlined />
</div>
</template>
<div class="news" v-for="(item, index) in newsList" :key="item.id">
<div class="news-title">
<span class="index">{{ index + 1 }}</span>
@ -15,9 +25,7 @@
</div>
</div>
</div>
<div class="empty-news" v-if="newsList.length === 0">
暂无乡村新闻
</div>
<div class="empty-news" v-if="newsList.length === 0">暂无乡村新闻</div>
</a-carousel>
</div>
</BCard>
@ -33,7 +41,7 @@
() => useUserStore().getCurrentVillageId,
(value) => {
getList();
},
}
);
const newsList = ref([]);
@ -138,4 +146,26 @@
font-size: 16px;
color: #ffffff;
}
:deep(.slick-arrow.custom-slick-arrow) {
width: 25px;
height: 25px;
font-size: 25px;
color: #fff;
background-color: rgba(31, 45, 61, 0.11);
transition: ease all 0.3s;
opacity: 0.3;
z-index: 1;
}
:deep(.slick-arrow.custom-slick-arrow:before) {
display: none;
}
:deep(.slick-arrow.custom-slick-arrow:hover) {
color: #fff;
opacity: 0.5;
}
:deep(.slick-slide h3) {
color: #fff;
}
</style>

14
src/views/business/bigdata/components/weather.vue
View File

@ -182,14 +182,18 @@
}
};
onMounted(async () => {
await queryCapacity();
await queryConfigPage();
nextTick(() => {
const initHeight = () => {
let height = document.querySelector('.bigdata-right-1').clientHeight;
let otherHeight = 76;
contentMaxHeight.value = `${height - otherHeight}px`;
});
};
onMounted(async () => {
await queryCapacity();
await queryConfigPage();
initHeight();
window.addEventListener('resize', initHeight);
});
const handleEdit = () => {
weatherDialogRef.value.showModal(isEdit.value ? weatherData.value : null);