From 3ee153c34cd734bdb5845b60e6a207884d3b0838 Mon Sep 17 00:00:00 2001
From: zouyu <2723363702@qq.com>
Date: 星期三, 22 四月 2026 17:58:36 +0800
Subject: [PATCH] 报告编制:印章生成调整
---
src/views/performance/class/index.vue | 782 ++++++++++++++++++++++++++++++++++++++-----------------
1 files changed, 532 insertions(+), 250 deletions(-)
diff --git a/src/views/performance/class/index.vue b/src/views/performance/class/index.vue
index c48d607..df08fa7 100644
--- a/src/views/performance/class/index.vue
+++ b/src/views/performance/class/index.vue
@@ -4,131 +4,311 @@
<div class="search_thing">
<div class="search_label">閫夋嫨鏃堕棿锛�</div>
<div class="search_input">
- <el-date-picker v-model="query.year" type="year" size="small" format="yyyy" placeholder="閫夋嫨骞�"
- @change="refreshTable()" style="width: 140px" :clearable="false">
+ <el-date-picker
+ v-model="query.year"
+ type="year"
+ size="small"
+ format="yyyy"
+ placeholder="閫夋嫨骞�"
+ @change="refreshTable()"
+ style="width: 140px"
+ :clearable="false"
+ >
</el-date-picker>
- <el-select v-model="query.month" clearable placeholder="閫夋嫨鏈�" style="width: 140px; margin-left: 16px"
- size="small" @change="refreshTable()">
- <el-option v-for="item in monthOptions" :key="item.value" :label="item.label" :value="item.value">
+ <el-select
+ v-model="query.month"
+ clearable
+ placeholder="閫夋嫨鏈�"
+ style="width: 140px; margin-left: 16px"
+ size="small"
+ @change="refreshTable()"
+ >
+ <el-option
+ v-for="item in monthOptions"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ >
</el-option>
</el-select>
- <el-input v-model="query.userName" placeholder="璇疯緭鍏ヤ汉鍛樺悕绉�" size="small" style="width: 140px; margin: 0 16px"
- clearable @keyup.enter.native="refreshTable()"></el-input>
- <el-select v-model="query.laboratory" placeholder="璇烽�夋嫨瀹為獙瀹�" style="width: 140px" size="small" clearable
- @change="refreshTable()">
- <el-option v-for="item in laboratory" :key="item.value" :label="item.label" :value="item.value">
+ <el-input
+ v-model="query.userName"
+ placeholder="璇疯緭鍏ヤ汉鍛樺悕绉�"
+ size="small"
+ style="width: 140px; margin: 0 16px"
+ clearable
+ @keyup.enter.native="refreshTable()"
+ ></el-input>
+ <el-select
+ v-model="query.laboratory"
+ placeholder="璇烽�夋嫨瀹為獙瀹�"
+ style="width: 140px"
+ size="small"
+ clearable
+ @change="refreshTable()"
+ >
+ <el-option
+ v-for="item in laboratory"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ >
</el-option>
</el-select>
</div>
</div>
<div class="search_thing" style="padding-left: 30px">
- <el-button size="mini" type="primary" @click="refreshTable()">鏌� 璇�</el-button>
+ <el-button size="mini" type="primary" @click="refreshTable()"
+ >鏌� 璇�</el-button
+ >
<el-button size="mini" @click="refresh()">閲嶇疆</el-button>
</div>
<div class="search_thing btns" style="padding-left: 30px">
- <el-button size="small" type="primary" v-if="checkPermi(['performance:class:time'])"
- @click="configTime">鏃堕棿閰嶇疆</el-button>
- <el-button size="small" type="primary" v-if="checkPermi(['performance:class:down'])" @click="handleDown"
- :loading="downLoading">瀵� 鍑�</el-button>
- <el-button size="small" type="primary" @click="schedulingVisible = true"
- v-if="checkPermi(['performance:class:add'])">鎺� 鐝�</el-button>
+ <el-button
+ size="small"
+ type="primary"
+ v-if="checkPermi(['performance:class:time'])"
+ @click="configTime"
+ >鏃堕棿閰嶇疆</el-button
+ >
+ <el-button
+ size="small"
+ type="primary"
+ v-if="checkPermi(['performance:class:down'])"
+ @click="handleDown"
+ :loading="downLoading"
+ >瀵� 鍑�</el-button
+ >
+ <el-button
+ size="small"
+ type="primary"
+ @click="schedulingVisible = true"
+ v-if="checkPermi(['performance:class:add'])"
+ >鎺� 鐝�</el-button
+ >
</div>
</div>
<div class="center" v-loading="pageLoading">
<div class="clearfix" style="width: 100%" v-show="query.month">
<div class="fixed-left">
- <div class="content-title" style="padding-left: 16px; box-sizing: border-box;position: fixed;z-index: 1;background-color: #fff;width:220px">
+ <div
+ class="content-title"
+ style="
+ padding-left: 16px;
+ box-sizing: border-box;
+ position: fixed;
+ z-index: 1;
+ background-color: #fff;
+ width: 220px;
+ "
+ >
浜哄憳鍚嶇О
- <span style="color:#ff4949">(浜哄憳鏁伴噺:{{list.length}})</span>
+ <span style="color: #ff4949">(浜哄憳鏁伴噺:{{ list.length }})</span>
</div>
<div class="content-user" v-for="(item, index) in list">
<div class="user-pic">
{{ item.userName ? item.userName.charAt(0) : "" }}
</div>
<div class="user-info">
- <p style="
+ <p
+ style="
font-size: 14px;
color: #3a7bfa;
line-height: 24px;
margin: 0;
- ">
+ "
+ >
{{ item.userName }}
</p>
- <p style="color: #999999;font-size: 12px;transform: scale(0.8) translateX(-20px);white-space: nowrap;width: 150px;margin: 0;" v-text="item.monthlyAttendanceStr">
- </p>
+ <p
+ style="
+ color: #999999;
+ font-size: 12px;
+ transform: scale(0.8) translateX(-20px);
+ white-space: nowrap;
+ width: 150px;
+ margin: 0;
+ "
+ v-text="item.monthlyAttendanceStr"
+ ></p>
<p style="margin-top: 4px; margin: 0">
- <span style="
+ <span
+ style="
color: #999999;
font-size: 12px;
display: inline-block;
transform: scale(0.8) translateX(-10px);
- ">鍚堣鍑哄嫟: </span><span style="font-size: 16px; color: #ff4902">{{item.monthlyAttendance.totalCount}}澶�</span>
+ "
+ >鍚堣鍑哄嫟: </span
+ ><span style="font-size: 16px; color: #ff4902"
+ >{{ item.monthlyAttendance.totalCount }}澶�</span
+ >
</p>
</div>
</div>
</div>
<div class="scroll-right">
<div class="content">
- <div class="content-title content-title-right" style="border-bottom: 0;position: fixed;z-index: 1;background-color: #fff;">
- <div class="content-title-item" v-for="(item, index) in weeks" :key="'b' + index">
- <span class="month" style="position: absolute; top: 0px" v-if="item.week == '鍛ㄦ棩'">{{ item.weekNum
- }}鍛�</span>
+ <div
+ class="content-title content-title-right"
+ style="
+ border-bottom: 0;
+ position: fixed;
+ z-index: 1;
+ background-color: #fff;
+ "
+ >
+ <div
+ class="content-title-item"
+ v-for="(item, index) in weeks"
+ :key="'b' + index"
+ >
+ <span
+ class="month"
+ style="position: absolute; top: 0px"
+ v-if="item.week == '鍛ㄦ棩'"
+ >{{ item.weekNum }}鍛�</span
+ >
<p style="height: 26px; position: absolute; bottom: 12px">
<span class="day">{{ item.day }}</span>
<span class="week">{{ item.week.charAt(1) }}</span>
</p>
</div>
</div>
- <div class="content-body" v-for="(item, index) in list" :key="'c' + index">
- <div class="content-body-item" v-for="(m, i) in item.list" :key="'d' + i"
- :class="{ hoverType: currentUserIndex == index }">
- <el-dropdown trigger="click" placement="bottom" @command="(e) => handleCommand(e, m)"
+ <div
+ class="content-body"
+ v-for="(item, index) in list"
+ :key="'c' + index"
+ >
+ <div
+ class="content-body-item"
+ v-for="(m, i) in item.list"
+ :key="'d' + i"
+ >
+ <el-dropdown
+ v-if="m"
+ trigger="click"
+ placement="bottom"
+ @command="(e) => handleCommand(e, m)"
:disabled="!checkPermi(['performance:class:edit'])"
- style="width: 100%; height: 100%; cursor: pointer">
- <el-tooltip :disabled="!m.annotationText" :content="m.annotationText">
- <el-tag @contextmenu.prevent.native="handleContextMenu(m,$event)" class="work-box" :type="getDictTypeByShift(m.shift)">{{ getShiftByDic(m.shift) }}</el-tag>
+ style="width: 100%; height: 100%; cursor: pointer"
+ >
+ <el-tooltip
+ :disabled="m && !m.annotationText"
+ :content="m.annotationText"
+ >
+ <el-tag
+ @contextmenu.prevent.native="handleContextMenu(m, $event)"
+ class="work-box"
+ :type="getDictTypeByShift(m.shift)"
+ >{{ getShiftByDic(m.shift) }}</el-tag
+ >
</el-tooltip>
- <i v-if="m.checkinResult==='success'" class="el-icon-success" style="position: relative;top:-20px;color:#67c23a;"></i>
- <i v-else-if="m.checkinResult==='fail'" class="el-icon-warning" style="position: relative;top:-20px;color:#f56c6c;"></i>
- <svg v-if="m.annotationText" style="position: relative;top:-62px;left:31px;" t="1772437700487" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6193" width="12" height="12"><path d="M751.228537 117.332567c-1.023063 7.672974-1.470653 15.601715-1.278829 23.466514l1.278829 41.434062-32.418317 25.768406L473.466862 402.639333l-34.656268 27.494825-42.137418-13.747412a332.495559 332.495559 0 0 0-270.280524 28.965478l193.742604 194.637785 49.107037 49.362802 14.51471 14.642593 193.99837 194.829609a331.21673 331.21673 0 0 0 29.732776-271.559353l-13.747413-42.137418 27.494825-34.656268 194.509902-245.535182 25.768406-32.354375 41.434062 1.278829 4.220136 0.127883c6.522028 0 13.044057-0.44759 19.438202-1.406712l-155.377732-155.24985zM734.539817 0c9.719101 0 19.566085 3.644663 27.111177 11.189754l251.034146 250.650499a38.236989 38.236989 0 0 1-5.946555 59.081903 219.255244 219.255244 0 0 1-119.570518 35.359623c-2.301892 0-4.539843 0-6.841736-0.127882L685.752488 601.689078a413.253615 413.253615 0 0 1-71.742311 388.764038 39.451877 39.451877 0 0 1-58.378547 2.941307l-235.752139-236.775202L64.497325 1012.193211a37.277867 37.277867 0 1 1-52.623816-52.7517l255.510048-255.57399L31.631418 467.092319a39.451877 39.451877 0 0 1 3.197072-58.378548 411.399313 411.399313 0 0 1 258.771063-91.244454c43.480188 0 86.832494 6.905677 128.586263 20.461265l245.407299-194.573843A218.871596 218.871596 0 0 1 702.56909 17.264192a37.981223 37.981223 0 0 1 31.970727-17.264192z" fill="#f56c6c" p-id="6194"></path></svg>
+ <i
+ v-if="m.checkinResult === 'success'"
+ class="el-icon-success"
+ style="position: relative; top: -20px; color: #67c23a"
+ ></i>
+ <i
+ v-else-if="m.checkinResult === 'fail'"
+ class="el-icon-warning"
+ style="position: relative; top: -20px; color: #f56c6c"
+ ></i>
+ <svg
+ v-if="m.annotationText"
+ style="position: relative; top: -62px; left: 31px"
+ t="1772437700487"
+ class="icon"
+ viewBox="0 0 1024 1024"
+ version="1.1"
+ xmlns="http://www.w3.org/2000/svg"
+ p-id="6193"
+ width="12"
+ height="12"
+ >
+ <path
+ d="M751.228537 117.332567c-1.023063 7.672974-1.470653 15.601715-1.278829 23.466514l1.278829 41.434062-32.418317 25.768406L473.466862 402.639333l-34.656268 27.494825-42.137418-13.747412a332.495559 332.495559 0 0 0-270.280524 28.965478l193.742604 194.637785 49.107037 49.362802 14.51471 14.642593 193.99837 194.829609a331.21673 331.21673 0 0 0 29.732776-271.559353l-13.747413-42.137418 27.494825-34.656268 194.509902-245.535182 25.768406-32.354375 41.434062 1.278829 4.220136 0.127883c6.522028 0 13.044057-0.44759 19.438202-1.406712l-155.377732-155.24985zM734.539817 0c9.719101 0 19.566085 3.644663 27.111177 11.189754l251.034146 250.650499a38.236989 38.236989 0 0 1-5.946555 59.081903 219.255244 219.255244 0 0 1-119.570518 35.359623c-2.301892 0-4.539843 0-6.841736-0.127882L685.752488 601.689078a413.253615 413.253615 0 0 1-71.742311 388.764038 39.451877 39.451877 0 0 1-58.378547 2.941307l-235.752139-236.775202L64.497325 1012.193211a37.277867 37.277867 0 1 1-52.623816-52.7517l255.510048-255.57399L31.631418 467.092319a39.451877 39.451877 0 0 1 3.197072-58.378548 411.399313 411.399313 0 0 1 258.771063-91.244454c43.480188 0 86.832494 6.905677 128.586263 20.461265l245.407299-194.573843A218.871596 218.871596 0 0 1 702.56909 17.264192a37.981223 37.981223 0 0 1 31.970727-17.264192z"
+ fill="#f56c6c"
+ p-id="6194"
+ ></path>
+ </svg>
<el-dropdown-menu slot="dropdown">
- <el-dropdown-item v-for="(n, j) in classType" :key="'h' + j" :command="n.dictValue">{{ n.dictLabel
- }}</el-dropdown-item>
+ <el-dropdown-item
+ v-for="(n, j) in classType"
+ :key="'h' + j"
+ :command="n.dictValue"
+ >{{ n.dictLabel }}</el-dropdown-item
+ >
</el-dropdown-menu>
</el-dropdown>
+ <div></div>
</div>
</div>
</div>
</div>
</div>
- <div class="clearfix year-table" style="width: 100%" v-show="!query.month">
+ <div
+ class="clearfix year-table"
+ style="width: 100%"
+ v-show="!query.month"
+ >
<div class="fixed-left">
- <div class="content-title" style="padding-left: 16px; box-sizing: border-box;position: fixed;z-index: 1;background-color: #fff;width:220px">
+ <div
+ class="content-title"
+ style="
+ padding-left: 16px;
+ box-sizing: border-box;
+ position: fixed;
+ z-index: 1;
+ background-color: #fff;
+ width: 220px;
+ "
+ >
浜哄憳鍚嶇О
- <span style="color:#ff4949">(浜哄憳鏁伴噺:{{yearList.length}})</span>
+ <span style="color: #ff4949">(浜哄憳鏁伴噺:{{ yearList.length }})</span>
</div>
- <div class="content-user" v-for="(item, index) in yearList"
- :key="'e' + index">
+ <div
+ class="content-user"
+ v-for="(item, index) in yearList"
+ :key="'e' + index"
+ >
<div class="user-pic">
{{ item.userName ? item.userName.charAt(0) : "" }}
</div>
<div class="user-info">
- <p style="
+ <p
+ style="
font-size: 14px;
color: #3a7bfa;
line-height: 24px;
margin: 0;
- ">
+ "
+ >
{{ item.userName }}
</p>
- <p style="color: #999999;font-size: 12px;transform: scale(0.8) translateX(-20px);white-space: nowrap;width: 150px;margin: 0;" v-text="item.sidebarAnnualAttendanceStr"></p>
+ <p
+ style="
+ color: #999999;
+ font-size: 12px;
+ transform: scale(0.8) translateX(-20px);
+ white-space: nowrap;
+ width: 150px;
+ margin: 0;
+ "
+ v-text="item.sidebarAnnualAttendanceStr"
+ ></p>
<p style="margin-top: 4px; margin: 0">
- <span style="
+ <span
+ style="
color: #999999;
font-size: 12px;
display: inline-block;
transform: scale(0.8) translateX(-10px);
- ">鍚堣鍑哄嫟: </span><span style="font-size: 16px; color: #ff4902">{{item.sidebarAnnualAttendance.totalCount}}澶�</span>
+ "
+ >鍚堣鍑哄嫟: </span
+ ><span style="font-size: 16px; color: #ff4902"
+ >{{ item.sidebarAnnualAttendance.totalCount }}澶�</span
+ >
</p>
</div>
</div>
@@ -136,22 +316,47 @@
<div class="scroll-right">
<div class="content">
<div>
- <div class="content-title content-title-right" style="border-bottom: 0; height: 63px;position: fixed;z-index: 1;background-color: #fff;width: calc( 100% - 448px );" :style="`display: grid;
- grid-template-columns: repeat(${monthList.length}, 1fr);`">
- <div class="content-title-item" v-for="(item, index) in monthList" :key="'b' + index"
- style="height: 52px;">
+ <div
+ class="content-title content-title-right"
+ style="
+ border-bottom: 0;
+ height: 63px;
+ position: fixed;
+ z-index: 1;
+ background-color: #fff;
+ width: calc(100% - 448px);
+ "
+ :style="`display: grid;
+ grid-template-columns: repeat(${monthList.length}, 1fr);`"
+ >
+ <div
+ class="content-title-item"
+ v-for="(item, index) in monthList"
+ :key="'b' + index"
+ style="height: 52px"
+ >
<span class="month">{{ item }}鏈�</span>
</div>
</div>
- <div class="content-body" v-for="(item, index) in yearList" :key="'c' + index" :style="`display: grid;
- grid-template-columns: repeat(${monthList.length}, 1fr);`">
- <div class="content-body-item" v-for="(m, i) in item.monthlyAttendances" :key="'d' + i"
- :class="{ hoverType: currentUserIndex == index }">
+ <div
+ class="content-body"
+ v-for="(item, index) in yearList"
+ :key="'c' + index"
+ :style="`display: grid;
+ grid-template-columns: repeat(${monthList.length}, 1fr);`"
+ >
+ <div
+ class="content-body-item"
+ v-for="(m, i) in item.monthlyAttendances"
+ :key="'d' + i"
+ >
<p style="color: rgb(153, 153, 153); font-size: 12px">
- 鍚堣鍑哄嫟锛�<span style="font-size: 14px; color: #000">{{m.monthlyAttendance.totalCount}}</span>
+ 鍚堣鍑哄嫟锛�<span style="font-size: 14px; color: #000">{{
+ m.monthlyAttendance.totalCount
+ }}</span>
</p>
<p style="color: rgb(153, 153, 153); font-size: 12px">
- <span>{{m.monthlyAttendanceStr}}</span>
+ <span>{{ m.monthlyAttendanceStr }}</span>
</p>
</div>
</div>
@@ -161,25 +366,43 @@
</div>
</div>
- <ul v-show="showMenu"
- class="contextmenu"
- :style="{left:menuX+'px',top:menuY+'px'}"
- @click.stop>
- <li @click="updateAnnotation('edit')"><i class="el-icon-edit-outline"></i> 缂栬緫鎵规敞</li>
- <li @click="updateAnnotation('delete')"><i class="el-icon-delete"></i> 鍒犻櫎鎵规敞</li>
+ <ul
+ v-show="showMenu"
+ class="contextmenu"
+ :style="{ left: menuX + 'px', top: menuY + 'px' }"
+ @click.stop
+ >
+ <li @click="updateAnnotation('edit')">
+ <i class="el-icon-edit-outline"></i> 缂栬緫鎵规敞
+ </li>
+ <li @click="updateAnnotation('delete')">
+ <i class="el-icon-delete"></i> 鍒犻櫎鎵规敞
+ </li>
</ul>
<el-dialog title="鏃堕棿閰嶇疆" :visible.sync="configTimeVisible" width="620px">
<div v-loading="configTimeVisibleLoading" style="min-height: 200px">
<div v-for="(item, index) in timeQuery">
- <div class="form" style="display: flex; justify-content: space-between">
+ <div
+ class="form"
+ style="display: flex; justify-content: space-between"
+ >
<div style="margin-bottom: 12px; width: 200px">
<span class="form_label">鐝锛�</span>
<span v-if="!item.isEdit"> {{ item.type }} </span>
<span class="form_input" v-if="item.isEdit">
- <el-select v-model="item.shift" placeholder="璇烽�夋嫨" style="width: 70%; margin-right: 8px" clearable
- size="small">
- <el-option v-for="obj in timeTypeList" :key="obj.dictValue" :label="obj.dictLabel"
- :value="obj.dictValue">
+ <el-select
+ v-model="item.shift"
+ placeholder="璇烽�夋嫨"
+ style="width: 70%; margin-right: 8px"
+ clearable
+ size="small"
+ >
+ <el-option
+ v-for="obj in timeTypeList"
+ :key="obj.dictValue"
+ :label="obj.dictLabel"
+ :value="obj.dictValue"
+ >
</el-option>
</el-select>
</span>
@@ -194,67 +417,114 @@
}}
</span>
<span class="form_input" v-if="item.isEdit">
- <el-time-select placeholder="璧峰鏃堕棿" v-model="item.startTime" size="small" :picker-options="{
- start: '00:00',
- step: '00:15',
- end: '24:00',
- }" style="width: 120px">
- </el-time-select>
- <el-time-select style="width: 120px" placeholder="缁撴潫鏃堕棿" v-model="item.endTime" size="small"
+ <el-time-select
+ placeholder="璧峰鏃堕棿"
+ v-model="item.startTime"
+ size="small"
:picker-options="{
start: '00:00',
step: '00:15',
end: '24:00',
- }">
+ }"
+ style="width: 120px"
+ >
+ </el-time-select>
+ <el-time-select
+ style="width: 120px"
+ placeholder="缁撴潫鏃堕棿"
+ v-model="item.endTime"
+ size="small"
+ :picker-options="{
+ start: '00:00',
+ step: '00:15',
+ end: '24:00',
+ }"
+ >
</el-time-select>
</span>
</div>
<span>
- <i class="el-icon-circle-check" v-if="item.isEdit"
- style="margin-left: 10px; color: #4b79f2; cursor: pointer" @click="saveEdit(item, index)"></i>
- <i class="el-icon-edit" v-if="!item.isEdit" style="margin-left: 10px; color: #4b79f2; cursor: pointer"
- @click="item.isEdit = true"></i>
- <i class="el-icon-delete" v-if="timeQuery.length > 1"
- style="margin-left: 10px; color: #ff4902; cursor: pointer" @click="deleteTime(item, index)"></i>
+ <i
+ class="el-icon-circle-check"
+ v-if="item.isEdit"
+ style="margin-left: 10px; color: #4b79f2; cursor: pointer"
+ @click="saveEdit(item, index)"
+ ></i>
+ <i
+ class="el-icon-edit"
+ v-if="!item.isEdit"
+ style="margin-left: 10px; color: #4b79f2; cursor: pointer"
+ @click="item.isEdit = true"
+ ></i>
+ <i
+ class="el-icon-delete"
+ v-if="timeQuery.length > 1"
+ style="margin-left: 10px; color: #ff4902; cursor: pointer"
+ @click="deleteTime(item, index)"
+ ></i>
</span>
</div>
<el-divider></el-divider>
- <div @click="addTimeForm" style="color: #4b79f2; cursor: pointer" v-if="index === timeQuery.length - 1">
+ <div
+ @click="addTimeForm"
+ style="color: #4b79f2; cursor: pointer"
+ v-if="index === timeQuery.length - 1"
+ >
娣诲姞鏃堕棿閰嶇疆
</div>
</div>
- <div @click="addTimeForm" style="color: #4b79f2" v-if="timeQuery.length === 0">
+ <div
+ @click="addTimeForm"
+ style="color: #4b79f2"
+ v-if="timeQuery.length === 0"
+ >
娣诲姞鏃堕棿閰嶇疆
</div>
</div>
</el-dialog>
- <el-dialog title="鎺掔彮" :visible.sync="schedulingVisible" width="400px">
- <div class="search_thing">
- <div class="search_label" style="width: 90px">
- <span style="color: red; margin-right: 4px">*</span>鍛ㄦ锛�
- </div>
- <div class="search_input" style="width: calc(100% - 90px)">
- <el-date-picker v-model="schedulingQuery.week" type="week" format="yyyy 绗� WW 鍛�" placeholder="閫夋嫨鍛ㄦ"
- style="width: 100%">
+ <el-dialog
+ title="鎺掔彮"
+ :visible.sync="schedulingVisible"
+ width="20%"
+ @close="resetForm"
+ >
+ <el-form
+ ref="schedulingQueryRef"
+ :model="schedulingQuery"
+ :rules="schedulingQueryRules"
+ >
+ <el-form-item label="鎺掔彮鏃堕棿:" prop="dateRange">
+ <el-date-picker
+ v-model="schedulingQuery.dateRange"
+ type="datetimerange"
+ value-format="yyyy-MM-dd HH:mm:ss"
+ :default-time="['00:00:00', '23:59:59']"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ style="width: 100%"
+ >
</el-date-picker>
- </div>
- </div>
- <div class="search_thing">
- <div class="search_label" style="width: 90px">
- <span style="color: red; margin-right: 4px">*</span>浜哄憳鍚嶇О锛�
- </div>
- <div class="search_input" style="width: calc(100% - 90px)">
- <el-select v-model="schedulingQuery.userIdList" popper-class="select-with-all" placeholder="璇烽�夋嫨" style="width: 100%" multiple collapse-tags clearable>
+ </el-form-item>
+ <el-form-item label="浜哄憳鍚嶇О:" prop="userIdList">
+ <el-select
+ v-model="schedulingQuery.userIdList"
+ popper-class="select-with-all"
+ placeholder="璇烽�夋嫨"
+ style="width: 100%"
+ multiple
+ collapse-tags
+ clearable
+ >
<template slot="prefix">
<el-button
type="text"
size="mini"
@click="handleSelectAll"
- style="margin: 4px 0;"
+ style="margin: 4px 0"
>
- {{ isAllSelected ? '鍙栨秷鍏ㄩ��' : '鍏ㄩ��' }}
+ {{ isAllSelected ? "鍙栨秷鍏ㄩ��" : "鍏ㄩ��" }}
</el-button>
- <el-divider style="margin: 5px 0;" />
+ <el-divider style="margin: 5px 0" />
</template>
<el-option
v-for="item in personList"
@@ -263,32 +533,39 @@
:value="item.id"
>
<span style="float: left">{{ item.name }}</span>
- <span style="float: right; color: #8492a6; font-size: 13px">{{ item.account }}</span>
+ <span style="float: right; color: #8492a6; font-size: 13px">{{
+ item.account
+ }}</span>
</el-option>
</el-select>
- </div>
- </div>
- <div class="search_thing">
- <div class="search_label" style="width: 90px">
- <span style="color: red; margin-right: 4px">*</span>鐝锛�
- </div>
- <div class="search_input" style="width: calc(100% - 90px)">
- <el-select v-model="schedulingQuery.shift" placeholder="璇烽�夋嫨" style="width: 100%">
- <el-option v-for="item in classType" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue">
+ </el-form-item>
+ <el-form-item label="鐝:" prop="shift">
+ <el-select
+ v-model="schedulingQuery.shift"
+ placeholder="璇烽�夋嫨"
+ style="width: 100%"
+ >
+ <el-option
+ v-for="item in classType"
+ :key="item.dictValue"
+ :label="item.dictLabel"
+ :value="item.dictValue"
+ >
</el-option>
</el-select>
- </div>
- </div>
+ </el-form-item>
+ </el-form>
<span slot="footer" class="dialog-footer">
- <el-button @click="schedulingVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="confirmScheduling" :loading="loading">纭� 瀹�</el-button>
+ <el-button @click="resetForm">鍙� 娑�</el-button>
+ <el-button type="primary" @click="confirmScheduling" :loading="loading"
+ >纭� 瀹�</el-button
+ >
</span>
</el-dialog>
</div>
</template>
<script>
-import { getYearAndMonthAndDays } from "@/utils/date";
import {
page,
pageYear,
@@ -301,20 +578,20 @@
obtainItemParameterList,
update,
editAnnotationText,
- delAnnotationText
+ delAnnotationText,
} from "@/api/performance/class";
-import {selectUserListByPerformance} from '@/api/system/user'
-import {getWorkMonth} from "@/utils/date";
-import {transformExcel} from '@/utils/file'
+import { selectUserListByPerformance } from "@/api/system/user";
+import { getWorkMonth } from "@/utils/date";
+import { transformExcel } from "@/utils/file";
export default {
- name: 'Class',
+ name: "Class",
data() {
return {
query: {
userName: "",
laboratory: "",
year: new Date(),
- month: getWorkMonth().month()+1,
+ month: getWorkMonth().month() + 1,
},
monthOptions: [
{
@@ -374,9 +651,22 @@
personList: [],
loading: false,
schedulingQuery: {
- week: "",
+ dateRange: [],
userIdList: [],
shift: "",
+ },
+ schedulingQueryRules: {
+ dateRange: {
+ required: true,
+ message: "璇烽�夋嫨鎺掔彮鏃ユ湡",
+ trigger: "change",
+ },
+ userIdList: {
+ required: true,
+ message: "璇烽�夋嫨浜哄憳鍚嶇О",
+ trigger: "change",
+ },
+ shift: { required: true, message: "璇烽�夋嫨鐝", trigger: "change" },
},
list: [],
currentPage: 1, // 褰撳墠椤�
@@ -397,16 +687,17 @@
selectedTarget: null,
};
},
- computed:{
+ computed: {
isAllSelected() {
- return this.schedulingQuery.userIdList.length === this.personList.length && this.personList.length > 0;
+ return (
+ this.schedulingQuery.userIdList.length === this.personList.length &&
+ this.personList.length > 0
+ );
},
},
- watch: {
-
- },
+ watch: {},
mounted() {
- document.addEventListener('click', this.handleClickOutside)
+ document.addEventListener("click", this.handleClickOutside);
this.selectEnumByCategory();
this.obtainItemParameterList();
this.getUsers();
@@ -422,78 +713,89 @@
this.monthList.reverse();
},
destroyed() {
- document.removeEventListener('click', this.handleClickOutside)
+ document.removeEventListener("click", this.handleClickOutside);
},
methods: {
+ resetForm() {
+ this.$refs.schedulingQueryRef.resetFields();
+ this.$nextTick(() => {
+ this.schedulingVisible = false;
+ });
+ },
handleSelectAll() {
if (this.isAllSelected) {
this.schedulingQuery.userIdList = [];
} else {
// 鍙�変腑鍙敤閫夐」鐨剉alue
- this.schedulingQuery.userIdList = this.personList.map(item => item.id);
+ this.schedulingQuery.userIdList = this.personList.map(
+ (item) => item.id
+ );
}
},
- handleContextMenu(target,e) {
+ handleContextMenu(target, e) {
// 闃绘娴忚鍣ㄩ粯璁ゅ彸閿彍鍗�
- e.preventDefault()
+ e.preventDefault();
- const menuMinWidth = 105
- const offsetLeft = this.$el.getBoundingClientRect().left // container margin left
- const offsetWidth = this.$el.offsetWidth // container width
- const maxLeft = offsetWidth - menuMinWidth // left boundary
- const left = e.clientX - offsetLeft + 15 // 15: margin right
+ const menuMinWidth = 105;
+ const offsetLeft = this.$el.getBoundingClientRect().left; // container margin left
+ const offsetWidth = this.$el.offsetWidth; // container width
+ const maxLeft = offsetWidth - menuMinWidth; // left boundary
+ const left = e.clientX - offsetLeft + 15; // 15: margin right
if (left > maxLeft) {
- this.menuX = maxLeft
+ this.menuX = maxLeft;
} else {
- this.menuX = left
+ this.menuX = left;
}
- this.menuY = e.clientY - 60
+ this.menuY = e.clientY - 60;
// 鏄剧ず鑿滃崟
- this.selectedTarget = target
- this.showMenu = true
+ this.selectedTarget = target;
+ this.showMenu = true;
},
//缂栬緫鎵规敞
updateAnnotation(operation) {
// 鐐瑰嚮鑿滃崟鍚庡叧闂彍鍗�
- this.showMenu = false
- if(this.selectedTarget && !this.selectedTarget.shift){
- this.$message.warning('璇峰厛閫夋嫨鐝')
- return
+ this.showMenu = false;
+ if (this.selectedTarget && !this.selectedTarget.shift) {
+ this.$message.warning("璇峰厛閫夋嫨鐝");
+ return;
}
- if(operation && operation==='edit'){
- this.$prompt('', '缂栬緫鎵规敞', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- inputType:'textarea',
- inputPlaceholder:'濉啓鎵规敞鍐呭',
+ if (operation && operation === "edit") {
+ this.$prompt("", "缂栬緫鎵规敞", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ inputType: "textarea",
+ inputPlaceholder: "濉啓鎵规敞鍐呭",
inputPattern: /^.{0,100}$/,
- inputErrorMessage: '鏈�澶ц緭鍏�100涓瓧绗�'
- }).then(({ value }) => {
- editAnnotationText({
- id:this.selectedTarget.id,
- annotationText:value
- }).then(res=>{
- this.$message.success("鎻愪氦鎴愬姛")
- this.refreshTable()
+ inputErrorMessage: "鏈�澶ц緭鍏�100涓瓧绗�",
+ })
+ .then(({ value }) => {
+ editAnnotationText({
+ id: this.selectedTarget.id,
+ annotationText: value,
+ }).then((res) => {
+ this.$message.success("鎻愪氦鎴愬姛");
+ this.refreshTable();
+ });
})
- }).catch(() => { });
- }else if(operation && operation==='delete'){
- this.$confirm('鏄惁鍒犻櫎鎵规敞鍐呭?', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- delAnnotationText(this.selectedTarget.id).then(res=>{
- this.$message.success("鍒犻櫎鎴愬姛")
- this.refreshTable()
+ .catch(() => {});
+ } else if (operation && operation === "delete") {
+ this.$confirm("鏄惁鍒犻櫎鎵规敞鍐呭?", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ delAnnotationText(this.selectedTarget.id).then((res) => {
+ this.$message.success("鍒犻櫎鎴愬姛");
+ this.refreshTable();
+ });
})
- }).catch(() => {});
+ .catch(() => {});
}
-
},
handleClickOutside() {
- this.showMenu = false
+ this.showMenu = false;
},
getDictTypeByShift(e) {
let obj = this.classType.find((m) => m.dictValue == e);
@@ -547,22 +849,24 @@
time: year + "-" + month + "-01 00:00:00",
userName: this.query.userName,
laboratory: this.query.laboratory,
- }).then((res) => {
- this.pageLoading = false;
- this.list = res.data.page
- let headerList = res.data.headerList;
- this.weeks = [];
- headerList.forEach((item) => {
- let obj = {
- weekNum: item.weekly,
- week: item.headerTime.split(" ")[1],
- day: item.headerTime.split(" ")[0],
- };
- this.weeks.push(obj);
- });
- }).catch(() => {
- this.pageLoading = false;
})
+ .then((res) => {
+ this.pageLoading = false;
+ this.list = res.data.page;
+ let headerList = res.data.headerList;
+ this.weeks = [];
+ headerList.forEach((item) => {
+ let obj = {
+ weekNum: item.weekly,
+ week: item.headerTime.split(" ")[1],
+ day: item.headerTime.split(" ")[0],
+ };
+ this.weeks.push(obj);
+ });
+ })
+ .catch(() => {
+ this.pageLoading = false;
+ });
},
initYear() {
this.pageLoading = true;
@@ -573,53 +877,35 @@
laboratory: this.query.laboratory,
}).then((res) => {
this.pageLoading = false;
- this.yearList = res.data
+ this.yearList = res.data;
});
},
confirmScheduling() {
- if (!this.schedulingQuery.week) {
- this.$message.error("璇烽�夋嫨鍛ㄦ");
- return;
- }
- let time = this.schedulingQuery.week.getTime();
- let startWeek =
- getYearAndMonthAndDays(new Date(time - 24 * 60 * 60 * 1000)) +
- " 00:00:00";
- let endWeek =
- getYearAndMonthAndDays(new Date(time + 24 * 60 * 60 * 1000 * 5)) +
- " 00:00:00";
- if (
- !this.schedulingQuery.userIdList ||
- this.schedulingQuery.userIdList.length == 0
- ) {
- this.$message.error("璇烽�夋嫨浜哄憳");
- return;
- }
- if (!this.schedulingQuery.shift) {
- this.$message.error("璇烽�夋嫨鐝");
- return;
- }
- this.loading = true;
- add({
- startWeek,
- endWeek,
- userIdList: this.schedulingQuery.userIdList,
- shift: this.schedulingQuery.shift,
- })
- .then((res) => {
- this.loading = false;
- this.$message.success("鎿嶄綔鎴愬姛");
- this.schedulingVisible = false;
- this.schedulingQuery = {
- week: "",
- userIdList: [],
- shift: "",
- };
- this.refresh();
- })
- .catch((err) => {
- this.loading = false;
- });
+ this.$refs.schedulingQueryRef.validate((valid) => {
+ if (valid) {
+ this.loading = true;
+ add({
+ startTime: this.schedulingQuery.dateRange[0],
+ endTime: this.schedulingQuery.dateRange[1],
+ userIdList: this.schedulingQuery.userIdList,
+ shift: this.schedulingQuery.shift,
+ })
+ .then((res) => {
+ this.loading = false;
+ this.$message.success("鎿嶄綔鎴愬姛");
+ this.schedulingVisible = false;
+ this.schedulingQuery = {
+ week: "",
+ userIdList: [],
+ shift: "",
+ };
+ this.refresh();
+ })
+ .catch((err) => {
+ this.loading = false;
+ });
+ }
+ });
},
configTime() {
this.getDicts("sys_class_type").then((response) => {
@@ -829,12 +1115,12 @@
display: flex;
}
->>>.scroll-pagination {
+>>> .scroll-pagination {
overflow-y: scroll;
scrollbar-width: none;
}
->>>.scroll-pagination::-webkit-scrollbar {
+>>> .scroll-pagination::-webkit-scrollbar {
display: none;
}
@@ -918,8 +1204,8 @@
align-items: center;
}
-.content-body:nth-child(2){
- padding-top:58px;
+.content-body:nth-child(2) {
+ padding-top: 58px;
}
.content-body-item {
@@ -950,8 +1236,8 @@
display: flex;
align-items: center;
}
-.content-user:nth-child(2){
- margin-top:58px;
+.content-user:nth-child(2) {
+ margin-top: 58px;
}
.user-pic {
width: 50px;
@@ -968,10 +1254,6 @@
.user-info {
flex: 1;
margin-left: 10px;
-}
-
-.hoverType {
- background: rgba(58, 123, 250, 0.03);
}
.year-table {
@@ -1018,7 +1300,7 @@
font-size: 12px;
font-weight: 400;
color: #333;
- box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, .3);
+ box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);
li {
margin: 0;
padding: 7px 16px;
--
Gitblit v1.9.3