修改项目级大屏

This commit is contained in:
shi
2025-09-12 19:33:07 +08:00
parent 9fbabd2b6a
commit aa1f2e8fdb
4 changed files with 23 additions and 21 deletions

View File

@ -11,20 +11,16 @@
</div> </div>
</div> </div>
<div class="title"> <div class="title">
<div>新能源项目级管理平台</div> <div>{{ currentProjectName }}</div>
<div>Coal Science Construction Management - New Energy Project Level Management Platform</div> <div>施工现场数智化管理</div>
</div> </div>
<div class="header_right"> <div class="header_right">
<div class="top-bar"> <div class="top-bar">
<!-- 左侧天气图标 + 日期文字 --> <!-- 左侧天气图标 + 日期文字 -->
<div class="left-section"> <div class="left-section">
<div class="weather-list" @mouseenter="requestPause" @mouseleave="resumeScroll"> <div class="weather-list" @mouseenter="requestPause" @mouseleave="resumeScroll">
<div <div v-for="(item, i) in weatherList" :key="i" class="weather-item"
v-for="(item, i) in weatherList" :style="{ transform: `translateY(-${offsetY}px)`, transition: transition }">
:key="i"
class="weather-item"
:style="{ transform: `translateY(-${offsetY}px)`, transition: transition }"
>
<img :src="`/assets/demo/${item.icon}.png`" alt="" /> <img :src="`/assets/demo/${item.icon}.png`" alt="" />
<div>{{ item.weather }}{{ item.tempMin }}°/{{ item.tempMax }}°</div> <div>{{ item.weather }}{{ item.tempMin }}°/{{ item.tempMax }}°</div>
<div>{{ item.week }}({{ item.date }})</div> <div>{{ item.week }}({{ item.date }})</div>
@ -63,6 +59,10 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, onUnmounted } from 'vue'; import { ref, onMounted, onUnmounted } from 'vue';
import { getScreenSafetyDay, getScreenWeather } from '@/api/projectScreen'; import { getScreenSafetyDay, getScreenWeather } from '@/api/projectScreen';
import { useUserStoreHook } from '@/store/modules/user';
const userStore = useUserStoreHook();
const currentProjectName = computed(() => userStore.selectedProject?.name);
interface Weather { interface Weather {
week: string; week: string;
@ -230,13 +230,13 @@ onUnmounted(() => {
text-align: center; text-align: center;
} }
.title > div:first-child { .title>div:first-child {
/* 第一个子元素的样式 */ /* 第一个子元素的样式 */
font-size: 38px; font-size: 38px;
letter-spacing: 0.1em; letter-spacing: 0.1em;
} }
.title > div:last-child { .title>div:last-child {
/* 最后一个子元素的样式 */ /* 最后一个子元素的样式 */
font-size: 14px; font-size: 14px;
} }
@ -269,7 +269,7 @@ onUnmounted(() => {
display: flex; display: flex;
align-items: center; align-items: center;
& > div:last-child { &>div:last-child {
margin-left: 10px; margin-left: 10px;
} }

View File

@ -70,7 +70,8 @@
<div class="attendance_item_title">{{ item.teamName }}</div> <div class="attendance_item_title">{{ item.teamName }}</div>
<div class="attendance_item_number">{{ item.attendanceNumber }} <span class="subfont">/{{ item.allNumber <div class="attendance_item_number">{{ item.attendanceNumber }} <span class="subfont">/{{ item.allNumber
}}</span></div> }}</span></div>
<div class="attendance_item_rate">{{ item.attendanceRate.toFixed(2) }} %</div> <div class="attendance_item_rate">{{ item.attendanceRate != '0' ? item.attendanceRate :
`${item.attendanceRate}.00` }} %</div>
<div class="attendance_item_date subfont">{{ item.attendanceTime }}</div> <div class="attendance_item_date subfont">{{ item.attendanceTime }}</div>
</div> </div>
</div> </div>
@ -101,9 +102,7 @@ const newId = ref('')
const attendanceCount = ref(0) const attendanceCount = ref(0)
const attendanceRate = ref(0) const attendanceRate = ref(0)
const peopleCount = ref(0) const peopleCount = ref(0)
const teamAttendanceList = ref([ const teamAttendanceList = ref([])
{ id: "", teamName: "", attendanceNumber: 0, allNumber: 0, attendanceRate: 0, attendanceTime: "" },
])
/** /**
* 显示新闻详情 * 显示新闻详情
@ -124,6 +123,7 @@ const getPeopleData = async () => {
const res = await getScreenPeople(props.projectId); const res = await getScreenPeople(props.projectId);
const { data, code } = res const { data, code } = res
if (code === 200) { if (code === 200) {
console.log(data)
attendanceCount.value = data.attendanceCount attendanceCount.value = data.attendanceCount
attendanceRate.value = data.attendanceRate attendanceRate.value = data.attendanceRate
peopleCount.value = data.peopleCount peopleCount.value = data.peopleCount
@ -306,7 +306,9 @@ onUnmounted(() => {
} }
.attendance_list { .attendance_list {
padding: 0px 30px; width: calc(100% - 30px);
padding: 0px 15px;
margin: 0 auto;
font-size: 14px; font-size: 14px;
.attendance_item { .attendance_item {

View File

@ -4,7 +4,7 @@ export let pieOption = {
{ {
type: 'text', type: 'text',
left: 'center', left: 'center',
top: '40%', top: '43%',
style: { style: {
// 需要从接口替换 // 需要从接口替换
text: '70%', text: '70%',
@ -16,7 +16,7 @@ export let pieOption = {
{ {
type: 'text', type: 'text',
left: 'center', left: 'center',
top: '50%', top: '55%',
style: { style: {
text: '总进度', text: '总进度',
fontSize: 14, fontSize: 14,

View File

@ -104,6 +104,7 @@ const getScreenImgProcessData = async () => {
pieData.forEach((item: any) => { pieData.forEach((item: any) => {
item.value = data[item.label] item.value = data[item.label]
}) })
console.log(pieData)
initPieChart() initPieChart()
} }
} }
@ -113,9 +114,9 @@ const getScreenImgProcessData = async () => {
*/ */
const getScreenGeneralizeData = async () => { const getScreenGeneralizeData = async () => {
const res = await getScreenGeneralize(props.projectId); const res = await getScreenGeneralize(props.projectId);
const { data, code } = res const { data, code, msg } = res
if (code === 200) { if (code === 200) {
generalize.value = data generalize.value = msg
} }
} }
@ -183,7 +184,6 @@ onUnmounted(() => {
height: 100px; height: 100px;
margin: 0 15px; margin: 0 15px;
padding: 0 10px; padding: 0 10px;
margin-top: 15px;
box-sizing: border-box; box-sizing: border-box;
overflow-y: auto; overflow-y: auto;