From 943f66294cae53cb1617b237ec992691e01f516b Mon Sep 17 00:00:00 2001 From: licp <lichunping@guanfang.com.cn> Date: 星期四, 26 十二月 2024 16:06:47 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' into master --- src/components/view/index-index.vue | 384 +++++++++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 343 insertions(+), 41 deletions(-) diff --git a/src/components/view/index-index.vue b/src/components/view/index-index.vue index c222aeb..cc46e86 100644 --- a/src/components/view/index-index.vue +++ b/src/components/view/index-index.vue @@ -64,6 +64,7 @@ display: flex; align-items: center; justify-content: center; + cursor: pointer; } .right-1-item .mun{ @@ -85,9 +86,9 @@ .right-2-body{ width: 100%; margin-top: 20px; - display: flex; + /* display: flex; align-items: start; - justify-content: space-between; + justify-content: space-between; */ } >>>.el-calendar__header { display: none; @@ -212,6 +213,7 @@ border-radius: 16px; overflow: hidden; margin-bottom: 8px; + cursor: pointer; } .body-item.color0{ background: #70A090; @@ -241,7 +243,34 @@ text-align: left; margin-bottom: 10px; } - + >>>.el-calendar-day span{ + display: inline-block; + width: 30px; + height: 30px; + line-height: 30px; + text-align: center; + border-radius: 4px; + } + >>>.is-selected{ + background: transparent !important; + } + >>>.is-selected .el-calendar-day{ + background: transparent !important; + } + >>>.is-selected .el-calendar-day span{ + background: #3A7BFA !important; + color: #fff !important; + } + >>>.el-calendar-day:hover{ + background: transparent; + } + >>>.el-calendar-day span:hover{ + background: #3A7BFA !important; + color: #fff !important; + } + >>>.el-tag--dark{ + border: 0; + } </style> <template> @@ -261,12 +290,23 @@ <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 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}"> + <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> - <span style="display: inline-block;height: 24px;width: 24px;border-radius: 50%;line-height: 24px;text-align: center;background: #C0C4CC;color: #fff;">{{ m.name.charAt(0) }}</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> @@ -275,51 +315,97 @@ </el-col> <el-col :xs="24" :sm="24" :md="10" :lg="10" :xl="10"> <div class="right-1 card"> - <div class="right-1-item"> + <div class="right-1-item" @click="openNotice"> <div class="img"> <img src="../../../static/img/index-0.svg" alt=""> </div> <div class="mun"> - <p style="font-size: 20px;">254</p> - <p style="font-size: 14px;margin-bottom: 10px;">鎴戠殑浠e姙</p> + <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="right-1-item" @click="openNotice"> <div class="img"> <img src="../../../static/img/index-1.svg" alt=""> </div> <div class="mun"> - <p style="font-size: 20px;">254</p> + <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="right-1-item" @click="openNotice"> <div class="img"> <img src="../../../static/img/index-2.svg" alt=""> </div> <div class="mun"> - <p style="font-size: 20px;">254</p> + <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="right-1-item" @click="openNotice"> <div class="img"> <img src="../../../static/img/index-3.svg" alt=""> </div> <div class="mun"> - <p style="font-size: 20px;">254</p> + <p style="font-size: 20px;">{{ getNumberFourTypes.totalNumberOfMessagesInThePastSevenDays }}</p> <p style="font-size: 14px;margin-bottom: 10px;">杩戞湡浜嬪疁</p> </div> </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> + <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 sonLaboratoryList" + :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> + <!-- <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%;"> + <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(../../../static/img/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-col> + <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12"> + <div style="height: 100%;background: url(../../../static/img/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> + </el-col> + </el-row> + <echart-module :id="'index-1'" :config="chartConfig0" :datas="chartData0" style="height: 250px;width: 100%;"></echart-module> + <!-- <div class="calendar" style="width: 49%;"> <div class="control"> <el-button class="prevm" @click="prevMonth(calendarValue)" icon="el-icon-arrow-left"></el-button> <span>{{ calendarValue.getFullYear()+'骞�'+(calendarValue.getMonth() + 1)+'鏈�' }}</span> @@ -332,38 +418,42 @@ <span> {{ data.day.split('-').slice(2)+'' }} </span> - <el-badge v-if="data.isSelected" is-dot class="item"> - </el-badge> </template> </el-calendar> - </div> - <div class="right-2-list" style="width: 49%;height: 286px;" v-loading="scheduleLoading"> + </div> --> + <!-- <div class="right-2-list" style="width: 49%;height: 286px;" v-loading="scheduleLoading"> <div class="list2-item" v-for="(m,i) in listScheduleByMe" :key="i"> <span>{{ m.scheduleTimes }}</span> <el-tooltip style="margin-left: 10px;" effect="dark" :content="m.text" placement="top"> <p class="ellipsis-multiline" >{{ m.text }}</p> </el-tooltip> </div> - <span style="color:rgb(153, 153, 153);font-size: 12px;text-align: center;margin: 120px 0;display: inline-block;width: 100%;" v-if="listScheduleByMe.length==0">鏆傛棤</span> - </div> + <span style="color:rgb(144, 147, 153);font-size: 14px;text-align: center;margin: 120px 0;display: inline-block;width: 100%;" v-if="listScheduleByMe.length==0">鏆傛棤鏁版嵁</span> + </div> --> </div> </div> <div class="right-3 card" style="overflow: hidden;"> <div class="right-3-tab"> - <div class="tab-item" style="cursor: pointer;" :class="{active:currentIndex==0}" @click="currentIndex=0">棰勮鎻愰啋 10</div> - <div class="tab-item" style="cursor: pointer;" :class="{active:currentIndex==1}" @click="currentIndex=1">閫氱煡閫氬憡 12</div> + <div class="tab-item" style="cursor: pointer;" :class="{active:currentIndex==4}" @click="currentIndex=4">棰勮鎻愰啋</div> + <div class="tab-item" style="cursor: pointer;" :class="{active:currentIndex==5}" @click="currentIndex=5">閫氱煡閫氬憡</div> </div> - <div class="right-3-list"> - <div class="list3-item" v-for="(m,i) in 5" :key="i"> + <div class="right-3-list" v-loading="listLoading"> + <scroll-pagination @load="getList" :finishLoding="finishLoding" :list="list" v-if="list.length>0||listLoading"> + <div class="list3-item" v-for="(m,i) in list" :key="i"> <div class="list3-item-title"> <img src="../../../static/img/index-tip.svg" alt=""> - <p>璁惧鍒版湡鎻愰啋</p> + <p>{{ m.theme }}</p> </div> <div class="list3-item-info"> - <p style="width: 73%;-webkit-line-clamp: 1;" class="ellipsis-multiline">缂栧彿<span style="color:#3A7BFA;"> SB20240101-001 </span>鐨勮澶囧皢浜�2023-09-09 11:11:11杩囨湡</p> - <p>2023-09-09 09:09:09</p> + <p style="width: 73%;-webkit-line-clamp: 1;cursor: pointer;" class="ellipsis-multiline" @click="goNoticeDetail(m)"> + <!-- 缂栧彿<span style="color:#3A7BFA;"> SB20240101-001 </span>鐨勮澶囧皢浜�2023-09-09 11:11:11杩囨湡 --> + {{ m.content }} + </p> + <p>{{ m.createTime }}</p> </div> </div> + </scroll-pagination> + <div v-if="list.length<1&&!listLoading" style="color:#909399;font-size:14px;text-align: center;margin-top:80px" >鏆傛棤鏁版嵁</div> </div> </div> </el-col> @@ -372,7 +462,7 @@ <div class="body" style="max-height: 60vh;"> <el-row> <el-col class="search_thing" :span="22"> - <div class="search_label">鏃堕棿锛�</div> + <div class="search_label"><span style="color: red;margin-right: 4px;">*</span>鏃堕棿锛�</div> <div class="search_input"> <el-date-picker v-model="query.time" @@ -384,9 +474,10 @@ </div> </el-col> <el-col class="search_thing" :span="22"> - <div class="search_label">鍐呭锛�</div> + <div class="search_label"><span style="color: red;margin-right: 4px;">*</span>鍐呭锛�</div> <div class="search_input"> - <el-input v-model="query.text" size="small" placeholder="璇疯緭鍏ュ唴瀹�"></el-input> + <el-input v-model="query.text" type="textarea" + :rows="2" size="small" placeholder="璇疯緭鍏ュ唴瀹�"></el-input> </div> </el-col> </el-row> @@ -405,13 +496,20 @@ import { getYearAndMonthAndDays } from '../../util/date' + import ScrollPagination from '../tool/scroll-paging.vue' + import EchartModule from '../tool/echart.vue' +import { name } from 'file-loader'; export default { + components: { + ScrollPagination, + EchartModule + }, data() { return { user: {}, now: null, calendarValue: new Date(), - currentIndex:0, + currentIndex:4, dialogVisible:false, query:{ time:'', @@ -424,11 +522,62 @@ weekdays:[], listScheduleByMe:[], scheduleLoading:false, + list:[], + currentPage:1, + pageSize: 8, // 涓�椤�7鏉� + total: null, + listLoading: true, // 缁勪欢loading鐨勫睍绀�,榛樿涓簍rue + finishLoding: false, // 鍔犺浇瀹屾垚锛屾樉绀哄凡缁忔病鏈夋洿澶氫簡 + timer:null, + keyMap:{}, + getNumberFourTypes: {}, + type:'鏈�', + time:{ + week:'', + month:'', + year:'', + }, + startTime:'', + endTime:'', + sonLaboratory:null, + sonLaboratoryList:[], + chartData0:{ + total:0, + personNum:0, + data:[] + }, + chartConfig0:{ + height: '', + isLoading:false, + type:'pie0' + } } }, watch:{ calendarValue(val){ this.getScheduleByMe() + }, + currentIndex(){ + this.keyMap = {} + this.currentPage = 1; + this.list = []; + this.getList(); + }, + type(val){ + switch(val){ + case '鍛�': + this.time.week = new Date() + this.changeTime(val,this.time.week) + break; + case '鏈�': + this.time.month = new Date() + this.changeTime(val,this.time.month) + break; + case '骞�': + this.time.year = new Date() + this.changeTime(val,this.time.year) + break; + } } }, mounted() { @@ -437,11 +586,67 @@ setInterval(() => { this.nowTime() }, 1000) - this.init(); this.weekdays = this.getWeekdaysForNextWeek() - this.getScheduleByMe() + this.init(); + this.currentPage = 1; + this.keyMap = {} + this.list = []; + this.getList(); + this.getLaboratoryDicts() + // this.getScheduleByMe() + this.timer&&clearInterval(this.timer) + this.timer = setInterval(() => { + this.init(); + this.currentPage = 1; + this.keyMap = {} + this.list = []; + this.getList(); + // this.getScheduleByMe() + },1000*60*10) + this.getNumberFourTypesFun() }, methods: { + getNumberFourTypesFun() { + this.$axios.get(this.$api.informationNotification.getNumberFourTypesMessagesHomePage).then(res => { + this.getNumberFourTypes = res.data + }) + }, + getList(){ + const key = `_${this.currentPage}` + const value = this.keyMap[key] + // 濡傛灉value瀛樺湪锛岃〃绀虹紦瀛樻湁鍊硷紝閭d箞闃绘璇锋眰 + if(value) { + return + } + // value涓嶅瓨鍦紝琛ㄧず绗竴娆¤姹�,璁剧疆鍗犱綅 + this.keyMap[key] = 'temp' + if(this.currentPage==1){ + this.listLoading = true + } + 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 + }) + }, nowTime() { var date = new Date(); var y = date.getFullYear(); @@ -562,18 +767,42 @@ this.workList.push(res.data[`work${i}`]) } this.workDay = res.data.weekDays.map(m=>{ - return m[2] + let arr = m.split('-') + return arr[2] }) }) + }, + async initEchart(){ + this.chartConfig0.isLoading = false + let res0 = await this.$axios.post(this.$api.report.manHourByStation+'?startTime='+this.startTime+'&endTime='+this.endTime+'&sonLaboratory='+this.sonLaboratory) + if (res0.code == 201) return + this.chartData0.total = res0.message + let res1 = await this.$axios.post(this.$api.report.manHourByPerson+'?startTime='+this.startTime+'&endTime='+this.endTime+'&sonLaboratory='+this.sonLaboratory) + if (res1.code == 201) 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 }, getWeekdaysForNextWeek() { let weekdays = []; for (let i = 0; i < 7; i++) { let date = new Date(); - date.setDate(date.getDate() + i); // 浠婂ぉ涔嬪悗鐨勬棩瀛� + date.setDate(date.getDate() - i); // 浠婂ぉ涔嬪悗鐨勬棩瀛� let day = date.getDay(); // 0-6 浠h〃鏄熸湡鏃ュ埌鏄熸湡鍏� weekdays.push(day); } + weekdays.reverse() weekdays = weekdays.map(m=>{ let day ='' switch (m) { @@ -624,6 +853,79 @@ }) }) }, - } + goNoticeDetail(row){ + this.$axios.put(this.$api.informationNotification.triggerModificationStatusToRead+'/'+row.id).then(res => { + row.num = Math.random(100); + this.$bus.$emit("change", JSON.stringify(row)); + this.$parent.addTab({ + v: "娑堟伅璇︽儏", + i: "el-icon-s-tools", + u: "notice-detail", + k:35, + p: "abcd" + },29); + }) + }, + goAddList(row){ + this.$bus.$emit("change", JSON.stringify(row)); + this.$parent.addTab({ + v: "妫�楠屼笅鍗�", + i: "font icon-erjidaohang", + u: "b1-inspection-order", + k:3, + p: "selectInsOrderParameter", + param:{ + text:row.text + } + },1); + }, + 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() + }, + getLaboratoryDicts() { + this.$axios.post(this.$api.enums.selectEnumByCategory, { + category: "瀛愬疄楠屽" + }).then(res => { + this.sonLaboratoryList = res.data + this.sonLaboratory = '杩滃満' + this.changeTime(this.type) + }) + }, + openNotice(){ + this.$parent.openNotice() + } + }, + deactivated(){ + this.timer&&clearInterval(this.timer) + } } </script> -- Gitblit v1.9.3