| | |
| | | <template> |
| | | <div class="bg-1"> |
| | | <div class="bg-1" style="padding: 15px 5px"> |
| | | <el-row :gutter="25"> |
| | | <el-col :lg="14" :md="14" :sm="24" :xl="14" :xs="24"> |
| | | <div class="left-1"> |
| | | <div class="say"> |
| | | <div style="display: flex;align-items: center;flex-wrap: wrap;"> |
| | | <div class="say-1">{{ user.name }} 您好!祝您开心每一天</div> |
| | | <div style="display: flex; align-items: center; flex-wrap: wrap"> |
| | | <div class="say-1">{{ nickName }} 您好!祝您开心每一天</div> |
| | | <div class="say-2">当前时间: {{ now }}</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 |
| | | 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> |
| | | <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 |
| | | 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> |
| | | <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=" |
| | | 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 |
| | | 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 class="right-1 card"> |
| | | <div class="right-1-item"> |
| | | <div class="img"> |
| | | <img alt="" src="@/assets/index_image/index-0.svg"> |
| | | <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> |
| | | <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"> |
| | | <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> |
| | | <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"> |
| | | <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> |
| | | <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"> |
| | | <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> |
| | | <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> |
| | | <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="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> |
| | | <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> |
| | | <el-calendar v-model="calendarValue"> |
| | | <template slot="dateCell" slot-scope="{date, data}"> |
| | | <el-calendar v-model="calendarValue" class="calendar"> |
| | | <template slot="dateCell" slot-scope="{ date, data }"> |
| | | <span> |
| | | {{ data.day.split('-').slice(2) + '' }} |
| | | {{ 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"> |
| | | <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;"> |
| | | <el-tooltip |
| | | :content="m.text" |
| | | effect="dark" |
| | | placement="top" |
| | | style="margin-left: 10px" |
| | | > |
| | | <p class="ellipsis-multiline">{{ m.text }}</p> |
| | | </el-tooltip> |
| | | </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> |
| | | <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> |
| | | </div> |
| | | <div class="right-3 card" style="overflow: hidden;"> |
| | | <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="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 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="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 alt="" src="../../../static/img/index-tip.svg">--> |
| | | <p style="color: #FF7756">{{ m.theme }}</p> |
| | | <img src="../assets/index_image/index-tip.svg" alt="" /> |
| | | <p>{{ 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)"> |
| | | <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> |
| | |
| | | </div> |
| | | </div> |
| | | </scroll-pagination> |
| | | <div v-if="list.length < 1 && !listLoading" |
| | | style="color:#909399;font-size:14px;text-align: center;margin-top:80px">暂无数据 |
| | | <div |
| | | v-if="list.length < 1 && !listLoading" |
| | | style=" |
| | | color: #909399; |
| | | font-size: 14px; |
| | | text-align: center; |
| | | margin-top: 80px; |
| | | " |
| | | > |
| | | 暂无数据 |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | <el-dialog :visible.sync="dialogVisible" title="日程添加" width="400px"> |
| | | <div class="body" style="max-height: 60vh;"> |
| | | <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_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 |
| | | 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_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> |
| | | <el-input |
| | | v-model="query.text" |
| | | :rows="2" |
| | | placeholder="请输入内容" |
| | | size="small" |
| | | type="textarea" |
| | | ></el-input> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | <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-button :loading="loading" type="primary" @click="submit" |
| | | >确 定</el-button |
| | | > |
| | | </el-row> |
| | | </span> |
| | | </el-dialog> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { getYearAndMonthAndDays } from '@/utils/date.js' |
| | | import ScrollPagination from '@/components/index/scroll-paging.vue' |
| | | import { |
| | | pageNotice, |
| | | triggerModificationStatusToRead, |
| | | getNumberFourTypesMessagesHomePage, |
| | | } from "@/api/system/notice"; |
| | | import { |
| | | addSchedule, |
| | | calendarWorkByWeek, |
| | | ScheduleByMe, |
| | | } from "@/api/chart/dailyBusinessStatistical.js"; |
| | | import { getYearAndMonthAndDays } from "@/utils/date.js"; |
| | | import ScrollPagination from "@/components/index/scroll-paging.vue"; |
| | | import { mapGetters } from "vuex"; |
| | | export default { |
| | | components: { |
| | | ScrollPagination |
| | | ScrollPagination, |
| | | }, |
| | | computed: { |
| | | ...mapGetters(["nickName"]), |
| | | }, |
| | | data() { |
| | | return { |
| | | user: {}, |
| | | now: null, |
| | | calendarValue: new Date(), |
| | | currentIndex: 5, |
| | | dialogVisible: false, |
| | | query: { |
| | | time: '', |
| | | text: '' |
| | | time: "", |
| | | text: "", |
| | | }, |
| | | loading: false, |
| | | workLoading: false, |
| | |
| | | timer: null, |
| | | keyMap: {}, |
| | | getNumberFourTypes: {}, |
| | | } |
| | | }; |
| | | }, |
| | | watch: { |
| | | calendarValue(val) { |
| | | this.getScheduleByMe() |
| | | this.getScheduleByMe(); |
| | | }, |
| | | currentIndex() { |
| | | this.keyMap = {} |
| | | this.keyMap = {}; |
| | | this.currentPage = 1; |
| | | this.list = []; |
| | | this.getList(); |
| | | } |
| | | }, |
| | | }, |
| | | mounted() { |
| | | this.user = JSON.parse(localStorage.getItem('user')) |
| | | this.nowTime() |
| | | this.nowTime(); |
| | | setInterval(() => { |
| | | this.nowTime() |
| | | }, 1000) |
| | | this.weekdays = this.getWeekdaysForNextWeek() |
| | | this.nowTime(); |
| | | }, 1000); |
| | | this.weekdays = this.getWeekdaysForNextWeek(); |
| | | this.init(); |
| | | this.currentPage = 1; |
| | | this.keyMap = {} |
| | | this.keyMap = {}; |
| | | this.list = []; |
| | | this.getList(); |
| | | this.getScheduleByMe() |
| | | this.timer && clearInterval(this.timer) |
| | | this.getScheduleByMe(); |
| | | this.timer && clearInterval(this.timer); |
| | | this.timer = setInterval(() => { |
| | | this.init(); |
| | | this.currentPage = 1; |
| | | this.keyMap = {} |
| | | this.keyMap = {}; |
| | | this.list = []; |
| | | this.getList(); |
| | | this.getScheduleByMe() |
| | | }, 1000 * 60 * 10) |
| | | this.getNumberFourTypesFun() |
| | | this.getScheduleByMe(); |
| | | }, 1000 * 60 * 10); |
| | | this.getNumberFourTypesFun(); |
| | | }, |
| | | methods: { |
| | | changeState(val) { |
| | | if (val == 0) { |
| | | return '待检验' |
| | | return "待检验"; |
| | | } |
| | | }, |
| | | currentIndexChange() { |
| | | this.keyMap = {} |
| | | this.keyMap = {}; |
| | | this.currentPage = 1; |
| | | this.list = []; |
| | | this.getList(); |
| | | }, |
| | | getNumberFourTypesFun() { |
| | | this.$axios.get(this.$api.informationNotification.getNumberFourTypesMessagesHomePage).then(res => { |
| | | this.getNumberFourTypes = res.data |
| | | }) |
| | | getNumberFourTypesMessagesHomePage() |
| | | .then((res) => { |
| | | if (res.code === 200) { |
| | | this.getNumberFourTypes = res.data; |
| | | } |
| | | }) |
| | | .catch((error) => { |
| | | console.error(error); |
| | | }); |
| | | }, |
| | | getList() { |
| | | const key = `_${this.currentPage}` |
| | | const value = this.keyMap[key] |
| | | const key = `_${this.currentPage}`; |
| | | const value = this.keyMap[key]; |
| | | // 如果value存在,表示缓存有值,那么阻止请求 |
| | | if (value) { |
| | | return |
| | | return; |
| | | } |
| | | // value不存在,表示第一次请求,设置占位 |
| | | this.keyMap[key] = 'temp' |
| | | this.keyMap[key] = "temp"; |
| | | if (this.currentPage == 1) { |
| | | this.listLoading = true |
| | | 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 |
| | | pageNotice({ |
| | | size: this.pageSize, |
| | | current: 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; |
| | | }) |
| | | .catch((error) => { |
| | | console.error(error); |
| | | }); |
| | | }, |
| | | nowTime() { |
| | | var date = new Date(); |
| | |
| | | var m = date.getMonth() + 1; |
| | | var d = date.getDate(); |
| | | var h = date.getHours(); |
| | | this.timeH = h |
| | | this.timeH = h; |
| | | var min = date.getMinutes(); |
| | | var s = date.getSeconds(); |
| | | if (s < 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 year = this.calendarValue.getFullYear(); // 当前年份 |
| | | let month = this.calendarValue.getMonth() + 1; // 当前月份 |
| | | let day = this.calendarValue.getDate(); // 当前天数 |
| | | let nextyear = year; |
| | | let nextmonth = parseInt(month) + 1; |
| | | // 判断下一月是否会进入下一年 |
| | |
| | | if (day > nextdays) { |
| | | day = nextdays; |
| | | if (day < 10) { |
| | | day = '0' + day; |
| | | day = "0" + day; |
| | | } |
| | | } |
| | | if (nextmonth < 10) { |
| | | nextmonth = '0' + nextmonth; |
| | | nextmonth = "0" + nextmonth; |
| | | } |
| | | let nexttime = nextyear + '-' + nextmonth + '-' + day; |
| | | 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 year = this.calendarValue.getFullYear(); // 当前年份 |
| | | let month = this.calendarValue.getMonth() + 1; // 当前月份 |
| | | let day = this.calendarValue.getDate(); // 当前天数 |
| | | let prevyear = year; |
| | | let prevmonth = parseInt(month) - 1; |
| | | // 判断上一月是否会进入上一年 |
| | |
| | | if (day > prevdays) { |
| | | day = prevdays; |
| | | if (day < 10) { |
| | | day = '0' + day; |
| | | day = "0" + day; |
| | | } |
| | | } |
| | | if (prevmonth < 10) { |
| | | prevmonth = '0' + prevmonth; |
| | | prevmonth = "0" + prevmonth; |
| | | } |
| | | let prevtime = prevyear + '-' + prevmonth + '-' + day; |
| | | let prevtime = prevyear + "-" + prevmonth + "-" + day; |
| | | |
| | | // 将得到的年月日格式转换为标准时间,与饿了么时间格式相同才能联动 |
| | | this.calendarValue = new Date(prevtime); |
| | |
| | | handleCancel() { |
| | | this.dialogVisible = false; |
| | | this.query = { |
| | | time: '', |
| | | text: '' |
| | | } |
| | | time: "", |
| | | text: "", |
| | | }; |
| | | }, |
| | | submit() { |
| | | if (!this.query.time) { |
| | | this.$message.error('时间未填写') |
| | | return |
| | | this.$message.error("时间未填写"); |
| | | return; |
| | | } |
| | | if (!this.query.text) { |
| | | this.$message.error('内容未填写') |
| | | return |
| | | 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() |
| | | }) |
| | | addSchedule(this.query) |
| | | .then((res) => { |
| | | this.loading = false; |
| | | if (res.code == 201) { |
| | | this.$message.error("操作失败"); |
| | | return; |
| | | } |
| | | this.$message.success("保存成功"); |
| | | this.handleCancel(); |
| | | this.getScheduleByMe(); |
| | | }) |
| | | .catch((error) => { |
| | | console.error(error); |
| | | }); |
| | | }, |
| | | init() { |
| | | this.workLoading = true; |
| | | this.$axios.get(this.$api.report.calendarWorkByWeek).then(res => { |
| | | if (res.code == 201) return |
| | | this.workLoading = false; |
| | | this.workList = []; |
| | | for (let i = 0; i < 7; i++) { |
| | | this.workList.push(res.data[`work${i}`]) |
| | | } |
| | | this.workDay = res.data.weekDays.map(m => { |
| | | let arr = m.split('-') |
| | | return arr[2] |
| | | calendarWorkByWeek() |
| | | .then((res) => { |
| | | if (res.code == 201) return; |
| | | this.workLoading = false; |
| | | this.workList = []; |
| | | for (let i = 0; i < 7; i++) { |
| | | this.workList.push(res.data[`work${i}`]); |
| | | } |
| | | this.workDay = res.data.weekDays.map((m) => { |
| | | let arr = m.split("-"); |
| | | return arr[2]; |
| | | }); |
| | | }) |
| | | }) |
| | | .catch((error) => { |
| | | console.error(error); |
| | | }); |
| | | }, |
| | | getWeekdaysForNextWeek() { |
| | | let weekdays = []; |
| | |
| | | let day = date.getDay(); // 0-6 代表星期日到星期六 |
| | | weekdays.push(day); |
| | | } |
| | | weekdays.reverse() |
| | | weekdays = weekdays.map(m => { |
| | | let day = '' |
| | | weekdays.reverse(); |
| | | weekdays = weekdays.map((m) => { |
| | | let day = ""; |
| | | switch (m) { |
| | | case 0: |
| | | day = '星期天' |
| | | day = "星期天"; |
| | | break; |
| | | case 1: |
| | | day = '星期一' |
| | | day = "星期一"; |
| | | break; |
| | | case 2: |
| | | day = '星期二' |
| | | day = "星期二"; |
| | | break; |
| | | case 3: |
| | | day = '星期三' |
| | | day = "星期三"; |
| | | break; |
| | | case 4: |
| | | day = '星期四' |
| | | day = "星期四"; |
| | | break; |
| | | case 5: |
| | | day = '星期五' |
| | | day = "星期五"; |
| | | break; |
| | | case 6: |
| | | day = '星期六' |
| | | day = "星期六"; |
| | | break; |
| | | } |
| | | return day |
| | | }) |
| | | return day; |
| | | }); |
| | | 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 |
| | | }) |
| | | 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; |
| | | }); |
| | | }) |
| | | .catch((error) => { |
| | | console.error(error); |
| | | }); |
| | | }, |
| | | 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); |
| | | }) |
| | | 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 |
| | | ); |
| | | }) |
| | | .catch((error) => { |
| | | console.error(error); |
| | | }); |
| | | }, |
| | | }, |
| | | deactivated() { |
| | | this.timer && clearInterval(this.timer) |
| | | } |
| | | } |
| | | this.timer && clearInterval(this.timer); |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | |
| | | } |
| | | |
| | | .card { |
| | | background: #FFFFFF; |
| | | background: #ffffff; |
| | | border-radius: 16px; |
| | | width: 100%; |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | .right-1 { |
| | | height: 118px; |
| | | padding: 10px 10px 4px; |
| | | display: flex; |
| | | align-items: center; |
| | |
| | | |
| | | .right-1-item .mun { |
| | | margin-left: 6px; |
| | | color: #0166E2; |
| | | color: #0166e2; |
| | | } |
| | | |
| | | .right-2 { |
| | | width: 100%; |
| | | padding: 13px 14px 8px; |
| | | margin-bottom: 16px; |
| | | } |
| | |
| | | justify-content: space-between; |
| | | } |
| | | |
| | | >>>.el-calendar__header { |
| | | display: none; |
| | | } |
| | | |
| | | >>>.el-calendar__body { |
| | | padding: 0; |
| | | } |
| | | |
| | | >>>.el-calendar-table:not(.is-range) td.next { |
| | | /*隐藏下个月的日期*/ |
| | | display: none; |
| | | } |
| | | |
| | | >>>.el-calendar-day { |
| | | height: 40px; |
| | | } |
| | | |
| | | >>>.el-calendar-table td { |
| | | border: 0; |
| | | font-size: 14px; |
| | | } |
| | | |
| | | >>>.el-calendar-table tr td:first-child { |
| | | border-left: 0; |
| | | } |
| | | |
| | | .control { |
| | | display: flex; |
| | | align-items: center; |
| | |
| | | width: 32px; |
| | | height: 32px; |
| | | border-radius: 8px; |
| | | border: 1px solid #E8E8E8; |
| | | border: 1px solid #e8e8e8; |
| | | background: #fff; |
| | | padding: 0; |
| | | color: #0166E2; |
| | | color: #0166e2; |
| | | font-size: 20px; |
| | | } |
| | | |
| | |
| | | .right-3-tab { |
| | | display: flex; |
| | | align-items: center; |
| | | margin-bottom: 12px; |
| | | } |
| | | |
| | | .tab-item { |
| | | width: 50%; |
| | | box-sizing: border-box; |
| | | text-align: center; |
| | | padding: 14px 0; |
| | | font-size: 20px; |
| | | background: #F5F7FB; |
| | | background: #f5f7fb; |
| | | color: #333333; |
| | | } |
| | | |
| | | .tab-item.active { |
| | | background: #fff; |
| | | color: #FF3838; |
| | | padding-left: 16px; |
| | | text-align: left; |
| | | color: #ff3838; |
| | | } |
| | | |
| | | .right-3-list { |
| | | padding: 0 12px 8px; |
| | | box-sizing: border-box; |
| | | height: 390px; |
| | | overflow-y: auto; |
| | | } |
| | | |
| | | .list3-item { |
| | | padding: 6px 4px; |
| | | margin: 8px 0; |
| | | } |
| | | |
| | | .list3-item:hover { |
| | | background: rgba(58, 123, 250, 0.05); |
| | | } |
| | | |
| | | .list3-item-title { |
| | | display: flex; |
| | | align-items: flex-start; |
| | | margin-bottom: 10px; |
| | | align-items: center; |
| | | p { |
| | | margin: 0; |
| | | } |
| | | } |
| | | |
| | | .list3-item-info { |
| | | display: flex; |
| | | align-items: center; |
| | |
| | | .left-2 { |
| | | display: grid; |
| | | grid-template-columns: repeat(7, 1fr); |
| | | height: 777px; |
| | | height: calc(100vh - 245px); |
| | | } |
| | | |
| | | .left-2-item { |
| | | border-right: 1px solid #F1F1F1; |
| | | border-right: 1px solid #f1f1f1; |
| | | overflow: hidden !important; |
| | | } |
| | | |
| | |
| | | } |
| | | |
| | | .left-2-item:hover .left-item-title span { |
| | | color: #3A7BFA !important; |
| | | color: #3a7bfa !important; |
| | | } |
| | | |
| | | .left-item-title { |
| | | border-bottom: 1px solid #F1F1F1; |
| | | border-bottom: 1px solid #f1f1f1; |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: center; |
| | |
| | | } |
| | | |
| | | .body-item { |
| | | background: #70A090; |
| | | background: #70a090; |
| | | border-radius: 16px; |
| | | overflow: hidden; |
| | | margin-bottom: 8px; |
| | | } |
| | | |
| | | .body-item.color0 { |
| | | background: #70A090; |
| | | background: #70a090; |
| | | } |
| | | |
| | | .body-item.color1 { |
| | | background: #EBD476; |
| | | background: #ebd476; |
| | | } |
| | | |
| | | .body-item.color2 { |
| | | background: #FF3838; |
| | | background: #ff3838; |
| | | } |
| | | |
| | | .body-item>div { |
| | | .body-item > div { |
| | | height: calc(100% - 16px); |
| | | margin-top: 16px; |
| | | background: rgba(255, 255, 255, 0.9); |
| | |
| | | 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; |
| | | } |
| | | |
| | | .body-item-name { |
| | | display: inline-block; |
| | | height: 22px; |
| | |
| | | border-radius: 10px; |
| | | line-height: 22px; |
| | | text-align: center; |
| | | background: #C0C4CC; |
| | | background: #c0c4cc; |
| | | color: #fff; |
| | | font-size: 14px |
| | | font-size: 14px; |
| | | } |
| | | |
| | | .body-item-insState { |
| | |
| | | line-height: 22px; |
| | | text-align: center; |
| | | color: #fff; |
| | | font-size: 14px |
| | | font-size: 14px; |
| | | } |
| | | </style> |