修改项目级大屏
This commit is contained in:
@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -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 {
|
||||||
|
@ -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,
|
||||||
|
@ -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;
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user