From eeb99eafbfb86410f1501545483bf4256cb8e5d9 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期二, 04 三月 2025 10:11:49 +0800
Subject: [PATCH] 首页修改
---
src/views/index.vue | 523 +++++++++++++++++++++++----------------------------------
1 files changed, 214 insertions(+), 309 deletions(-)
diff --git a/src/views/index.vue b/src/views/index.vue
index db59dcc..b540921 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -10,121 +10,122 @@
</div>
</div>
</div>
- <div v-loading="workLoading" class="left-2 card" style="overflow: hidden;">
- <div v-for="(item,index) in workDay" :key="index" class="left-2-item">
+ <div class="left-2 card" v-loading="workLoading" style="overflow: hidden;">
+ <div class="left-2-item" v-for="(item,index) in workDay" :key="index">
<div class="left-item-title">
<span style="font-size: 18px;">{{ item }}</span>
<span style="font-size: 14px;color: #999999;">{{ weekdays[index] }}</span>
+ <el-tag style="margin-top: 6px;" size="small">{{workList[index].length}} 鏉�</el-tag>
</div>
<div class="left-item-body">
- <div v-for="(m,i) in workList[index]" :key="i" :class="{color0:m.type==0,color1:m.type==1,color2:m.type==2}" class="body-item">
+ <div class="body-item" v-for="(m,i) in workList[index]" :key="i" :class="{color0:m.type==0,color1:m.type==1,color2:m.type==2}" @click="goAddList(m)">
<div>
- <span style="font-size: 12px;margin-bottom: 17px;">{{ m.text }}</span>
- <div style="display: flex">
- <span class="body-item-name">{{ m.name }}</span>
- <span v-if="m.insState == 0" class="body-item-insState" style="background-color: #909399;font-size: 12px;">寰呮楠�</span>
- <span v-if="m.insState == 1" class="body-item-insState" style="background-color: #E6A23C;font-size: 12px;">妫�楠屼腑</span>
- <span v-if="m.insState == 2" class="body-item-insState" style="background-color: #67C23A;font-size: 12px;">宸叉楠�</span>
- <span v-if="m.insState == 3" class="body-item-insState" style="background-color: #E6A23C;font-size: 12px;">寰呭鏍�</span>
- <span v-if="m.insState == 4" class="body-item-insState" style="background-color: #F56C6C;font-size: 9px;">澶嶆牳鏈�氳繃</span>
- <span v-if="m.insState == 5" class="body-item-insState" style="background-color: #67C23A;font-size: 10px;">澶嶆牳閫氳繃</span>
+ <span style="font-size: 12px;margin-bottom: 8px;">{{ m.text }}</span>
+ <div class="tags" style="display: flex;align-items: end;flex-wrap: wrap;margin-bottom: 8px;">
+ <el-tooltip class="item" effect="dark" :content="item" placement="top" v-for="(item,index) in m.sample?m.sample.split(','):[]"
+ :key="index">
+ <el-tag
+ :color="m.type==0?'#70A090':(m.type==1?'#EBD476':'#FF3838')"
+ effect="dark" size="mini" style="margin: 2px;" class="single-line-ellipsis">
+ {{ item }}
+ </el-tag>
+ </el-tooltip>
</div>
+ <span style="display: inline-block;height: 22px;width: 70px;border-radius: 10px;line-height: 22px;text-align: center;background: #C0C4CC;color: #fff;font-size: 14px;">{{ m.name }}</span>
</div>
</div>
</div>
</div>
</div>
+<!-- <div v-loading="workLoading" class="left-2 card" style="overflow: hidden;">-->
+<!-- <div v-for="(item,index) in workDay" :key="index" class="left-2-item">-->
+<!-- <div class="left-item-title">-->
+<!-- <span style="font-size: 18px;">{{ item }}</span>-->
+<!-- <span style="font-size: 14px;color: #999999;">{{ weekdays[index] }}</span>-->
+<!-- </div>-->
+<!-- <div class="left-item-body">-->
+<!-- <div v-for="(m,i) in workList[index]" :key="i" :class="{color0:m.type==0,color1:m.type==1,color2:m.type==2}" class="body-item">-->
+<!-- <div>-->
+<!-- <span style="font-size: 12px;margin-bottom: 17px;">{{ m.text }}</span>-->
+<!-- <div style="display: flex">-->
+<!-- <span class="body-item-name">{{ m.name }}</span>-->
+<!-- <span v-if="m.insState == 0" class="body-item-insState" style="background-color: #909399;font-size: 12px;">寰呮楠�</span>-->
+<!-- <span v-if="m.insState == 1" class="body-item-insState" style="background-color: #E6A23C;font-size: 12px;">妫�楠屼腑</span>-->
+<!-- <span v-if="m.insState == 2" class="body-item-insState" style="background-color: #67C23A;font-size: 12px;">宸叉楠�</span>-->
+<!-- <span v-if="m.insState == 3" class="body-item-insState" style="background-color: #E6A23C;font-size: 12px;">寰呭鏍�</span>-->
+<!-- <span v-if="m.insState == 4" class="body-item-insState" style="background-color: #F56C6C;font-size: 9px;">澶嶆牳鏈�氳繃</span>-->
+<!-- <span v-if="m.insState == 5" class="body-item-insState" style="background-color: #67C23A;font-size: 10px;">澶嶆牳閫氳繃</span>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- </div>-->
</el-col>
<el-col :lg="10" :md="10" :sm="24" :xl="10" :xs="24">
- <div class="right-1 card">
- <div class="right-1-item">
- <div class="img">
- <img alt="" src="@/assets/index_image/index-0.svg">
- </div>
- <div class="mun">
- <p style="font-size: 20px;">{{getNumberFourTypes.totalNumberOfMessages}}</p>
- <p style="font-size: 14px;margin-bottom: 10px;">鎴戠殑寰呭姙</p>
- </div>
- </div>
- <div class="right-1-item">
- <div class="img">
- <img alt="" src="@/assets/index_image/index-1.svg">
- </div>
- <div class="mun">
- <p style="font-size: 20px;">{{ getNumberFourTypes.totalNumberOfReadMessages }}</p>
- <p style="font-size: 14px;margin-bottom: 10px;">宸插姙浜嬪疁</p>
- </div>
- </div>
- <div class="right-1-item">
- <div class="img">
- <img alt="" src="@/assets/index_image/index-2.svg">
- </div>
- <div class="mun">
- <p style="font-size: 20px;">{{ getNumberFourTypes.remainingToDo }}</p>
- <p style="font-size: 14px;margin-bottom: 10px;">鍓╀綑寰呭姙</p>
- </div>
- </div>
- <div class="right-1-item">
- <div class="img">
- <img alt="" src="@/assets/index_image/index-3.svg">
- </div>
- <div class="mun">
- <p style="font-size: 20px;">{{ getNumberFourTypes.totalNumberOfMessagesInThePastSevenDays }}</p>
- <p style="font-size: 14px;margin-bottom: 10px;">杩戞湡浜嬪疁</p>
- </div>
+ <div class="right-2 card">
+ <span style="color: #333333;font-size: 16px;">宸ユ椂缁熻</span>
+ <div>
+ <el-select v-model="sonLaboratory" placeholder="绔欑偣" size="mini" style="width: 100px;" @change="initEchart">
+ <el-option
+ v-for="item in dict.type.sys_sub_lab"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value">
+ </el-option>
+ </el-select>
+ <el-radio-group v-model="type" size="mini">
+ <el-radio-button label="鍛�" ></el-radio-button>
+ <el-radio-button label="鏈�"></el-radio-button>
+ <el-radio-button label="骞�"></el-radio-button>
+ </el-radio-group>
+ <el-date-picker
+ v-model="time.week"
+ type="week"
+ format="yyyy 绗� WW 鍛�"
+ placeholder="閫夋嫨鍛�" size="mini" v-if="type=='鍛�'" @change="m=>changeTime(type,m)" style="width: 130px;">
+ </el-date-picker>
+ <el-date-picker
+ v-model="time.month"
+ type="month"
+ placeholder="閫夋嫨鏈�" size="mini" v-if="type=='鏈�'" @change="m=>changeTime(type,m)" style="width: 130px;">
+ </el-date-picker>
+ <el-date-picker
+ v-model="time.year"
+ type="year"
+ placeholder="閫夋嫨骞�" size="mini" v-if="type=='骞�'" @change="m=>changeTime(type,m)" style="width: 130px;">
+ </el-date-picker>
</div>
</div>
- <div class="right-2 card">
- <div class="right-2-title">
- <span style="color: #333333;font-size: 16px;">鎴戠殑鏃ョ▼</span>
- <span style="cursor: pointer;font-size: 12px;
-color: #3A7BFA;" @click="dialogVisible=true">娣诲姞鎴戠殑鏃ョ▼</span>
- </div>
- <div class="right-2-body">
- <div class="calendar" style="width: 49%;">
- <div class="control">
- <el-button class="prevm" icon="el-icon-arrow-left" @click="prevMonth(calendarValue)"></el-button>
- <span>{{ calendarValue.getFullYear()+'骞�'+(calendarValue.getMonth() + 1)+'鏈�' }}</span>
- <el-button class="nextm" icon="el-icon-arrow-right" @click="nextMonth(calendarValue)"></el-button>
+ <div class="right-2-body">
+ <el-row :gutter="10" style="width: 100%;height: 80px;">
+ <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
+ <div style="height: 100%;background: url(~@/assets/images/bg1.png) no-repeat;background-size: 100% 100%;padding: 12px 0;box-sizing: border-box;">
+ <p style="text-align: center;font-size: 14px;color: #606266;line-height: 20px;margin-bottom: 4px;">鎬诲伐鏃�(灏忔椂)</p>
+ <p style="text-align: center;font-family: DIN Alternate, DIN Alternate;font-weight: 700;font-size: 30px;color: #3D3D3D;line-height: 35px;">{{chartData0.total}}</p>
</div>
- <el-calendar v-model="calendarValue">
- <template
- slot="dateCell"
- slot-scope="{date, data}">
- <span>
- {{ data.day.split('-').slice(2)+'' }}
- </span>
- <!-- <el-badge v-if="data.isSelected" is-dot class="item">
- </el-badge> -->
- </template>
- </el-calendar>
- </div>
- <div v-loading="scheduleLoading" class="right-2-list" style="width: 49%;height: 286px;">
- <div v-for="(m,i) in listScheduleByMe" :key="i" class="list2-item">
- <span>{{ m.scheduleTimes }}</span>
- <el-tooltip :content="m.text" effect="dark" placement="top" style="margin-left: 10px;">
- <p class="ellipsis-multiline" >{{ m.text }}</p>
- </el-tooltip>
+ </el-col>
+ <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
+ <div style="height: 100%;background: url(~@/assets/images/bg2.png) no-repeat;background-size: 100% 100%;padding: 12px 0;box-sizing: border-box;">
+ <p style="text-align: center;font-size: 14px;color: #606266;line-height: 20px;margin-bottom: 4px;">妫�楠屽憳(涓�)</p>
+ <p style="text-align: center;font-family: DIN Alternate, DIN Alternate;font-weight: 700;font-size: 30px;color: #3D3D3D;line-height: 35px;">{{chartData0.personNum}}</p>
</div>
- <span v-if="listScheduleByMe.length==0" style="color:rgb(144, 147, 153);font-size: 14px;text-align: center;margin: 120px 0;display: inline-block;width: 100%;">鏆傛棤鏁版嵁</span>
- </div>
- </div>
+ </el-col>
+ </el-row>
+ <echart-module :id="'index-1'" :config="chartConfig0" :datas="chartData0" style="height: 250px;width: 100%;"></echart-module>
</div>
<div class="right-3 card" style="overflow: hidden;">
<div class="right-3-tab">
- <!-- <div :class="{active:currentIndex==4}" class="tab-item" style="cursor: pointer;" @click="currentIndex=4">棰勮鎻愰啋</div>-->
- <div :class="{active:currentIndex==5}" class="tab-item" style="cursor: pointer;" @click="currentIndexChange">CNAS閫氱煡閫氬憡</div>
+ <div :class="{active:currentIndex==5}" class="tab-item">寰呭姙浜嬮」</div>
</div>
<div v-loading="listLoading" class="right-3-list">
<scroll-pagination v-if="list.length>0||listLoading" :finishLoding="finishLoding" :list="list" @load="getList">
<div v-for="(m,i) in list" :key="i" class="list3-item">
<div class="list3-item-title">
- <!-- <img alt="" src="../../../static/img/index-tip.svg">-->
<p style="color: #FF7756">{{ m.theme }}</p>
</div>
<div class="list3-item-info">
<p class="ellipsis-multiline" style="width: 73%;-webkit-line-clamp: 1;cursor: pointer;" @click="goNoticeDetail(m)">
- <!-- 缂栧彿<span style="color:#3A7BFA;"> SB20240101-001 </span>鐨勮澶囧皢浜�2023-09-09 11:11:11杩囨湡 -->
{{ m.content }}
</p>
<p>{{ m.createTime }}</p>
@@ -136,59 +137,26 @@
</div>
</el-col>
</el-row>
- <el-dialog :visible.sync="dialogVisible" title="鏃ョ▼娣诲姞" width="400px">
- <div class="body" style="max-height: 60vh;">
- <el-row>
- <el-col :span="22" class="search_thing">
- <div class="search_label"><span style="color: red;margin-right: 4px;">*</span>鏃堕棿锛�</div>
- <div class="search_input">
- <el-date-picker
- v-model="query.time"
- format="yyyy-MM-dd HH:mm:ss"
- placeholder="閫夋嫨鏃ユ湡鏃堕棿"
- size="small"
- style="width: 100%;" type="datetime" value-format="yyyy-MM-dd HH:mm:ss">
- </el-date-picker>
- </div>
- </el-col>
- <el-col :span="22" class="search_thing">
- <div class="search_label"><span style="color: red;margin-right: 4px;">*</span>鍐呭锛�</div>
- <div class="search_input">
- <el-input v-model="query.text" :rows="2"
- placeholder="璇疯緭鍏ュ唴瀹�" size="small" type="textarea"></el-input>
- </div>
- </el-col>
- </el-row>
- </div>
- <span slot="footer" class="dialog-footer">
- <el-row>
- <el-button @click="handleCancel">鍙� 娑�</el-button>
- <el-button :loading="loading" type="primary" @click="submit">纭� 瀹�</el-button>
- </el-row>
- </span>
- </el-dialog>
</div>
</template>
<script>
import {getYearAndMonthAndDays} from '@/utils/date.js'
import ScrollPagination from '@/components/index/scroll-paging.vue'
+import {calendarWorkByWeek, manHourByPerson, manHourByStation} from "@/api/index/report";
+import EchartModule from '@/components/echarts/echart.vue'
export default {
components: {
- ScrollPagination
+ ScrollPagination,
+ EchartModule
},
+ dicts: ['sys_sub_lab'],
data() {
return {
user: {},
now: null,
calendarValue: new Date(),
currentIndex:5,
- dialogVisible:false,
- query:{
- time:'',
- text:''
- },
- loading:false,
workLoading:false,
workList:[],
workDay:[],
@@ -203,13 +171,26 @@
finishLoding: false, // 鍔犺浇瀹屾垚锛屾樉绀哄凡缁忔病鏈夋洿澶氫簡
timer:null,
keyMap:{},
- getNumberFourTypes: {},
+ sonLaboratory:null,
+ chartData0:{
+ total:0,
+ personNum:0,
+ data:[]
+ },
+ chartConfig0:{
+ height: '',
+ isLoading:false,
+ type:'pie0'
+ },
+ type:'鏈�',
+ time:{
+ week:'',
+ month:'',
+ year:'',
+ },
}
},
watch:{
- calendarValue(val){
- this.getScheduleByMe()
- },
currentIndex(){
this.keyMap = {}
this.currentPage = 1;
@@ -218,7 +199,7 @@
}
},
mounted() {
- this.user = JSON.parse(localStorage.getItem('user'))
+ // this.user = JSON.parse(localStorage.getItem('user'))
this.nowTime()
setInterval(() => {
this.nowTime()
@@ -229,7 +210,6 @@
this.keyMap = {}
this.list = [];
this.getList();
- this.getScheduleByMe()
this.timer&&clearInterval(this.timer)
this.timer = setInterval(() => {
this.init();
@@ -237,26 +217,17 @@
this.keyMap = {}
this.list = [];
this.getList();
- this.getScheduleByMe()
},1000*60*10)
- this.getNumberFourTypesFun()
},
methods: {
+ // 璺宠浆椤甸潰
+ goAddList() {
+
+ },
changeState (val) {
if (val == 0) {
return '寰呮楠�'
}
- },
- currentIndexChange () {
- this.keyMap = {}
- this.currentPage = 1;
- this.list = [];
- this.getList();
- },
- getNumberFourTypesFun() {
- this.$axios.get(this.$api.informationNotification.getNumberFourTypesMessagesHomePage).then(res => {
- this.getNumberFourTypes = res.data
- })
},
getList(){
const key = `_${this.currentPage}`
@@ -273,26 +244,25 @@
if(this.list.length==0){
this.finishLoding = false;
}
- this.$axios.get(this.$api.informationNotification.page+'?size='+this.pageSize+'¤t='+this.currentPage+'&messageType='+this.currentIndex).then(res => {
- if(res.code === 201){
- return
- }
- let list = res.data.records;
- this.total = res.data.total;
- if(list.length==0){
- this.finishLoding = true;
- }else{
- if(list.length<this.pageSize){
- this.finishLoding = true;
- }
- this.list = this.list.concat(list)
- if(this.total==this.list.length){
- this.finishLoding = true;
- }
- this.currentPage++;
- }
- this.listLoading = false
- })
+ // this.$axios.get(this.$api.informationNotification.page+'?size='+this.pageSize+'¤t='+this.currentPage+'&messageType='+this.currentIndex).then(res => {
+ // this.listLoading = false
+ // let list = res.data.records;
+ // this.total = res.data.total;
+ // if(list.length==0){
+ // this.finishLoding = true;
+ // }else{
+ // if(list.length<this.pageSize){
+ // this.finishLoding = true;
+ // }
+ // this.list = this.list.concat(list)
+ // if(this.total==this.list.length){
+ // this.finishLoding = true;
+ // }
+ // this.currentPage++;
+ // }
+ // }).catch(err => {
+ // this.listLoading = false
+ // })
},
nowTime() {
var date = new Date();
@@ -320,94 +290,10 @@
}
this.now = y + "-" + m + "-" + d + " " + h + ":" + min + ":" + s;
},
- nextMonth(value) {
- let year = this.calendarValue.getFullYear();// 褰撳墠骞翠唤
- let month = this.calendarValue.getMonth() + 1;// 褰撳墠鏈堜唤
- let day = this.calendarValue.getDate();// 褰撳墠澶╂暟
- let nextyear = year;
- let nextmonth = parseInt(month) + 1;
- // 鍒ゆ柇涓嬩竴鏈堟槸鍚︿細杩涘叆涓嬩竴骞�
- if (nextmonth === 13) {
- nextyear = parseInt(year) + 1;
- nextmonth = 1;
- }
- // 璁＄畻涓嬩竴骞翠笅涓�涓湀鏈夊灏戝ぉ
- let nextday = new Date(nextyear, nextmonth, 0);
- let nextdays = nextday.getDate();
- if (day > nextdays) {
- day = nextdays;
- if (day < 10) {
- day = '0' + day;
- }
- }
- if (nextmonth < 10) {
- nextmonth = '0' + nextmonth;
- }
- let nexttime = nextyear + '-' + nextmonth + '-' + day;
-
- // 灏嗗緱鍒扮殑骞存湀鏃ユ牸寮忚浆鎹负鏍囧噯鏃堕棿锛屼笌楗夸簡涔堟椂闂存牸寮忕浉鍚屾墠鑳借仈鍔�
- this.calendarValue = new Date(nexttime);
- },
- prevMonth(time) {
- let year = this.calendarValue.getFullYear();// 褰撳墠骞翠唤
- let month = this.calendarValue.getMonth() + 1;// 褰撳墠鏈堜唤
- let day = this.calendarValue.getDate();// 褰撳墠澶╂暟
- let prevyear = year;
- let prevmonth = parseInt(month) - 1;
- // 鍒ゆ柇涓婁竴鏈堟槸鍚︿細杩涘叆涓婁竴骞�
- if (prevmonth === 0) {
- prevyear = parseInt(year) - 1;
- prevmonth = 12;
- }
- // 璁＄畻涓婁竴骞翠笂涓�涓湀鏈夊灏戝ぉ
- let prevday = new Date(prevyear, prevmonth, 0);
- let prevdays = prevday.getDate();
- if (day > prevdays) {
- day = prevdays;
- if (day < 10) {
- day = '0' + day;
- }
- }
- if (prevmonth < 10) {
- prevmonth = '0' + prevmonth;
- }
- let prevtime = prevyear + '-' + prevmonth + '-' + day;
-
- // 灏嗗緱鍒扮殑骞存湀鏃ユ牸寮忚浆鎹负鏍囧噯鏃堕棿锛屼笌楗夸簡涔堟椂闂存牸寮忕浉鍚屾墠鑳借仈鍔�
- this.calendarValue = new Date(prevtime);
- },
- handleCancel(){
- this.dialogVisible = false;
- this.query = {
- time:'',
- text:''
- }
- },
- submit(){
- if(!this.query.time){
- this.$message.error('鏃堕棿鏈～鍐�')
- return
- }
- if(!this.query.text){
- this.$message.error('鍐呭鏈～鍐�')
- return
- }
- this.loading = true;
- this.$axios.post(this.$api.report.addSchedule, this.query).then(res => {
- this.loading = false;
- if (res.code == 201) {
- this.$message.error('鎿嶄綔澶辫触')
- return
- }
- this.$message.success('淇濆瓨鎴愬姛')
- this.handleCancel()
- this.getScheduleByMe()
- })
- },
+ // 鑾峰彇鏃ュ巻浠诲姟鍥�
init(){
this.workLoading = true;
- this.$axios.get(this.$api.report.calendarWorkByWeek).then(res => {
- if (res.code == 201) return
+ calendarWorkByWeek().then(res => {
this.workLoading = false;
this.workList = [];
for(let i=0;i<7;i++){
@@ -417,6 +303,8 @@
let arr = m.split('-')
return arr[2]
})
+ }).catch(err=>{
+ this.workLoading = false;
})
},
getWeekdaysForNextWeek() {
@@ -457,27 +345,6 @@
})
return weekdays;
},
- getScheduleByMe(){
- this.scheduleLoading = true;
- this.$axios.post(this.$api.report.ScheduleByMe, {
- date:getYearAndMonthAndDays(this.calendarValue)
- }).then(res => {
- this.loading = false;
- this.scheduleLoading = false;
- if (res.code == 201) {
- return
- }
- this.listScheduleByMe = res.data.map(m=>{
- if(m.scheduleTime){
- let time = m.scheduleTime.split(' ')[1].split(':')
- m.scheduleTimes = time[0] + ':' + time[1]
- }else{
- m.scheduleTimes = ''
- }
- return m
- })
- })
- },
goNoticeDetail(row){
this.$axios.put(this.$api.informationNotification.triggerModificationStatusToRead+'/'+row.id).then(res => {
row.num = Math.random(100);
@@ -491,6 +358,65 @@
},29);
})
},
+ changeTime(type,m){
+ if(m){
+ switch(type){
+ case '鍛�':
+ this.startTime = getYearAndMonthAndDays(new Date(this.time.week.getTime() - 24 * 60 * 60 * 1000))
+ this.endTime = getYearAndMonthAndDays(new Date(this.time.week.getTime() + 24 * 60 * 60 * 1000 * 5))
+ break;
+ case '鏈�':
+ const year = new Date(this.time.month).getFullYear();
+ const month = new Date(this.time.month).getMonth();
+ const day = new Date(year, month + 1, 0).getDate(); //
+ // 璁剧疆璧峰鏃ユ湡鍜岀粨鏉熸棩鏈�
+ this.startTime = `${year}-${month + 1}-01`
+ this.endTime = `${year}-${month + 1}-${day}` // 鏈堟湯
+ break;
+ case '骞�':
+ const year0 = new Date(this.time.year).getFullYear();
+ this.startTime = `${year0}-01-01`; // 骞村垵
+ this.endTime = `${year0}-12-31`; // 骞存湯
+ break;
+ }
+ }else{
+ const year = new Date().getFullYear();
+ const month = new Date().getMonth();
+
+ // 璁剧疆璧峰鏃ユ湡鍜岀粨鏉熸棩鏈�
+ this.startTime = new Date(year, month, 1).toISOString().slice(0, 10); // 鏈堝垵
+ this.endTime = new Date(year, month + 1, 0).toISOString().slice(0, 10); // 鏈堟湯
+ this.time.month = new Date()
+ }
+ this.initEchart()
+ },
+ async initEchart(){
+ this.chartConfig0.isLoading = false
+ const params = {
+ startTime: this.startTime,
+ endTime: this.endTime,
+ sonLaboratory: this.sonLaboratory,
+ }
+ let res0 = await manHourByStation(params)
+ if (res0.code == 500) return
+ this.chartData0.total = res0.message
+ let res1 = await manHourByPerson(params)
+ if (res1.code == 500) return
+ this.chartData0.personNum = 0
+ this.chartData0.data = []
+ if(res1.data){
+ for(let m in res1.data){
+ this.chartData0.personNum ++
+ let obj = {
+ name:m,
+ value:res1.data[m],
+ penl:this.chartData0.total>0?((res1.data[m]/this.chartData0.total)*100).toFixed(2):0
+ }
+ this.chartData0.data.push(obj)
+ }
+ }
+ this.chartConfig0.isLoading = true
+ },
},
deactivated(){
this.timer&&clearInterval(this.timer)
@@ -498,13 +424,13 @@
}
</script>
-<style scoped lang="scss">
+<style scoped>
.index {
width: 100%;
height: calc(100% - 50px);
overflow-y: auto;
- padding: 20px 10px 10px;
- background: rgb(245, 247, 251);
+ padding: 14px;
+ background: #F5F7FB;
}
.left-1 {
@@ -565,6 +491,7 @@
display: flex;
align-items: center;
justify-content: center;
+ cursor: pointer;
}
.right-1-item .mun{
@@ -586,9 +513,9 @@
.right-2-body{
width: 100%;
margin-top: 20px;
- display: flex;
- align-items: flex-start;
- justify-content: space-between;
+ /* display: flex;
+ align-items: start;
+ justify-content: space-between; */
}
>>>.el-calendar__header {
display: none;
@@ -634,23 +561,17 @@
font-size: 14px;
}
.right-3-tab{
- display: flex;
- align-items: center;
+ padding: 20px 0 0 20px;
+ margin-bottom: 16px;
}
.tab-item{
- width: 50%;
- box-sizing: border-box;
- text-align: center;
- padding: 14px 0;
- font-size: 20px;
- background: #F5F7FB;
- color: #333333;
-}
-.tab-item.active{
- background: #fff;
- color: #FF3838;
- padding-left: 16px;
+ font-weight: 500;
+ font-size: 18px;
+ color: #3D3D3D;
+ line-height: 25px;
text-align: left;
+ font-style: normal;
+ text-transform: none;
}
.right-3-list{
padding: 0 12px 8px;
@@ -667,7 +588,7 @@
}
.list3-item-title{
display: flex;
- align-items: flex-start;
+ align-items: start;
margin-bottom: 10px;
}
.list3-item-info{
@@ -714,6 +635,7 @@
border-radius: 16px;
overflow: hidden;
margin-bottom: 8px;
+ cursor: pointer;
}
.body-item.color0{
background: #70A090;
@@ -768,24 +690,7 @@
background: #3A7BFA !important;
color: #fff !important;
}
-.body-item-name {
- display: inline-block;
- height: 22px;width: 60px;
- border-radius: 10px;
- line-height: 22px;
- text-align: center;
- background: #C0C4CC;
- color: #fff;
- font-size: 14px
-}
-.body-item-insState {
- margin-left: 2px;
- display: inline-block;
- height: 22px;width: 60px;
- border-radius: 10px;
- line-height: 22px;
- text-align: center;
- color: #fff;
- font-size: 14px
+>>>.el-tag--dark{
+ border: 0;
}
</style>
--
Gitblit v1.9.3